greenlight-motion 0.3.1 → 0.3.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/README.md +9 -9
- package/dist/greenlight-motion-script.mjs +260 -190
- package/dist/greenlight-motion.js +570 -570
- package/dist/greenlight-motion.mjs +29205 -29174
- package/package.json +1 -1
- package/schema/capabilities.json +1 -1
- package/skill/SKILL.md +11 -11
- package/skill/references/scene-script.md +2 -2
- package/skill/references/video-design.md +5 -2
- package/skill/references/video-grid.md +2 -2
- package/skill/references/video-keyframes.md +4 -3
- package/skill/references/video-text-kinetic.md +4 -4
- package/skill/references/video-text-presets.md +16 -16
- package/skill/references/video-text.md +8 -8
|
@@ -6724,30 +6724,17 @@ var TXA = (function() {
|
|
|
6724
6724
|
"Smooth",
|
|
6725
6725
|
"Smooth Glide",
|
|
6726
6726
|
"Glide Easing Stop",
|
|
6727
|
-
"Power1 In",
|
|
6728
|
-
"Power1 Out",
|
|
6729
|
-
"Power1 Smooth",
|
|
6730
|
-
"Power2 In",
|
|
6731
|
-
"Power2 Out",
|
|
6732
|
-
"Power2 Smooth",
|
|
6733
|
-
"Power3 In",
|
|
6734
|
-
"Power3 Out",
|
|
6735
|
-
"Power3 Smooth",
|
|
6736
|
-
"Power4 In",
|
|
6737
|
-
"Power4 Out",
|
|
6738
|
-
"Power4 Smooth",
|
|
6739
6727
|
"Sine In",
|
|
6740
6728
|
"Sine Out",
|
|
6741
6729
|
"Sine Smooth",
|
|
6742
6730
|
"Cubic In",
|
|
6743
6731
|
"Cubic Out",
|
|
6744
|
-
"Cubic Smooth",
|
|
6745
6732
|
"Expo In",
|
|
6746
6733
|
"Expo Out",
|
|
6747
6734
|
"Expo Smooth",
|
|
6748
|
-
"
|
|
6749
|
-
"
|
|
6750
|
-
"
|
|
6735
|
+
"Power",
|
|
6736
|
+
"Punch",
|
|
6737
|
+
"Apple Out",
|
|
6751
6738
|
"Back In",
|
|
6752
6739
|
"Back Out",
|
|
6753
6740
|
"Back Smooth",
|
|
@@ -6760,10 +6747,30 @@ var TXA = (function() {
|
|
|
6760
6747
|
"Anticipate",
|
|
6761
6748
|
"Natural",
|
|
6762
6749
|
"Slow Down",
|
|
6763
|
-
"AE In",
|
|
6750
|
+
"AE In (arrive)",
|
|
6764
6751
|
"AE Smooth",
|
|
6765
|
-
"AE Out"
|
|
6752
|
+
"AE Out (leave)"
|
|
6766
6753
|
];
|
|
6754
|
+
const RETIRED_CURVES2 = {
|
|
6755
|
+
"Power1 In": "Sine In",
|
|
6756
|
+
"Power1 Out": "Sine Out",
|
|
6757
|
+
"Power1 Smooth": "Sine Smooth",
|
|
6758
|
+
"Power2 In": "Ease In",
|
|
6759
|
+
"Power2 Out": "Ease Out",
|
|
6760
|
+
"Power2 Smooth": "Smooth",
|
|
6761
|
+
"Power3 In": "Cubic In",
|
|
6762
|
+
"Power3 Out": "Cubic Out",
|
|
6763
|
+
"Power3 Smooth": "Natural",
|
|
6764
|
+
"Power4 In": "Cubic In",
|
|
6765
|
+
"Power4 Out": "Power",
|
|
6766
|
+
"Power4 Smooth": "Natural",
|
|
6767
|
+
"Cubic Smooth": "Natural",
|
|
6768
|
+
"Circ In": "Cubic In",
|
|
6769
|
+
"Circ Out": "Slow Down",
|
|
6770
|
+
"Circ Smooth": "Natural",
|
|
6771
|
+
"AE In": "AE In (arrive)",
|
|
6772
|
+
"AE Out": "AE Out (leave)"
|
|
6773
|
+
};
|
|
6767
6774
|
const RANGE_FIELDS2 = {
|
|
6768
6775
|
// What moves the selection. Range: Start / End / Offset (keyframes, Flow). Time
|
|
6769
6776
|
// and Voice give every unit its own clock instead (see driveAmounts).
|
|
@@ -7079,7 +7086,8 @@ var TXA = (function() {
|
|
|
7079
7086
|
if (!raw || typeof raw !== "object" || !ID_RE.test(String(raw.aid || ""))) return null;
|
|
7080
7087
|
const seen = /* @__PURE__ */ new Set();
|
|
7081
7088
|
const effects = (Array.isArray(raw.effects) ? raw.effects : []).map(sanitizeEffect).filter((e2) => e2 && !seen.has(e2.pid) && seen.add(e2.pid)).slice(0, MAX_EFFECTS2);
|
|
7082
|
-
const
|
|
7089
|
+
const rawRange = raw.range && typeof raw.range === "object" && RETIRED_CURVES2[raw.range.curve] ? { ...raw.range, curve: RETIRED_CURVES2[raw.range.curve] } : raw.range;
|
|
7090
|
+
const range = sanitizeGroup(RANGE_FIELDS2, rawRange);
|
|
7083
7091
|
if (range.curve !== "Custom") range.bezier = null;
|
|
7084
7092
|
else if (!range.bezier) range.curve = RANGE_FIELDS2.curve.default;
|
|
7085
7093
|
return {
|
|
@@ -7398,7 +7406,6 @@ var TXA = (function() {
|
|
|
7398
7406
|
const inOutOf = (fin) => (p) => p < 0.5 ? fin(p * 2) / 2 : 1 - fin((1 - p) * 2) / 2;
|
|
7399
7407
|
const expoIn = (p) => Math.pow(2, 10 * (p - 1)) * p + Math.pow(p, 6) * (1 - p);
|
|
7400
7408
|
const sineIn = (p) => p === 1 ? 1 : 1 - Math.cos(p * Math.PI / 2);
|
|
7401
|
-
const circIn = (p) => -(Math.sqrt(1 - p * p) - 1);
|
|
7402
7409
|
const backIn = (p) => p ? p * p * (2.70158 * p - 1.70158) : 0;
|
|
7403
7410
|
function bounceOut2(p) {
|
|
7404
7411
|
const n1 = 7.5625, c = 2.75;
|
|
@@ -7446,15 +7453,13 @@ var TXA = (function() {
|
|
|
7446
7453
|
"Ease In": powIn(3),
|
|
7447
7454
|
"Ease Out": outOf(powIn(3)),
|
|
7448
7455
|
Smooth: inOutOf(powIn(3)),
|
|
7449
|
-
|
|
7450
|
-
|
|
7451
|
-
|
|
7452
|
-
|
|
7453
|
-
|
|
7454
|
-
...fam(powIn(4), "Cubic"),
|
|
7456
|
+
// The app plays "Cubic" as GSAP power3 (a quartic), so this does too; Power is
|
|
7457
|
+
// GSAP power4.out.
|
|
7458
|
+
"Cubic In": powIn(4),
|
|
7459
|
+
"Cubic Out": outOf(powIn(4)),
|
|
7460
|
+
Power: outOf(powIn(5)),
|
|
7455
7461
|
...fam(sineIn, "Sine"),
|
|
7456
7462
|
...fam(expoIn, "Expo"),
|
|
7457
|
-
...fam(circIn, "Circ"),
|
|
7458
7463
|
...fam(backIn, "Back"),
|
|
7459
7464
|
"Bounce Out": bounceOut2,
|
|
7460
7465
|
Elastic: elasticOut,
|
|
@@ -7465,9 +7470,11 @@ var TXA = (function() {
|
|
|
7465
7470
|
Anticipate: sampled(SAMPLED.Anticipate),
|
|
7466
7471
|
Natural: bezier(0.8, 0, 0.2, 1),
|
|
7467
7472
|
"Slow Down": bezier(0, 0, 0, 1),
|
|
7468
|
-
"AE In": bezier(0.3141666673, 0, 0.0875000209, 1),
|
|
7473
|
+
"AE In (arrive)": bezier(0.3141666673, 0, 0.0875000209, 1),
|
|
7469
7474
|
"AE Smooth": bezier(0.882083327, 0, 0.2445833683, 1),
|
|
7470
|
-
"AE Out": bezier(0.8699999754, 0, 0.6433336333, 1),
|
|
7475
|
+
"AE Out (leave)": bezier(0.8699999754, 0, 0.6433336333, 1),
|
|
7476
|
+
Punch: bezier(0.7, 0, 0.1, 1),
|
|
7477
|
+
"Apple Out": bezier(0.32, 0.72, 0, 1),
|
|
7471
7478
|
"Smooth Glide": bezier(0.2111, 0.7721, 0.8541, 0.112),
|
|
7472
7479
|
"Glide Easing Stop": bezier(0, 0.9125, 1, -0.0338)
|
|
7473
7480
|
};
|
|
@@ -8662,6 +8669,7 @@ var TXA = (function() {
|
|
|
8662
8669
|
easeShape: easeShape2,
|
|
8663
8670
|
shapeAt: shapeAt2,
|
|
8664
8671
|
CURVE_NAMES: CURVE_NAMES2,
|
|
8672
|
+
RETIRED_CURVES: RETIRED_CURVES2,
|
|
8665
8673
|
RANGE_ONLY: RANGE_ONLY2,
|
|
8666
8674
|
DRIVE_ONLY: DRIVE_ONLY2,
|
|
8667
8675
|
rangeShows: rangeShows2,
|
|
@@ -8735,6 +8743,7 @@ var {
|
|
|
8735
8743
|
easeShape,
|
|
8736
8744
|
shapeAt,
|
|
8737
8745
|
CURVE_NAMES,
|
|
8746
|
+
RETIRED_CURVES,
|
|
8738
8747
|
RANGE_ONLY,
|
|
8739
8748
|
DRIVE_ONLY,
|
|
8740
8749
|
rangeShows,
|
|
@@ -8790,23 +8799,23 @@ var factory = function(T) {
|
|
|
8790
8799
|
name: "Type",
|
|
8791
8800
|
range: { smooth: 0 },
|
|
8792
8801
|
effects: [["opacity", { opacity: 0 }]],
|
|
8793
|
-
keys: { start: [[0, 0, "AE In"], [1, 100]] }
|
|
8802
|
+
keys: { start: [[0, 0, "AE In (arrive)"], [1, 100]] }
|
|
8794
8803
|
},
|
|
8795
8804
|
{
|
|
8796
8805
|
name: "Blue band",
|
|
8797
8806
|
range: { start: 0, end: 100, shape: "smooth", easeHigh: 40 },
|
|
8798
8807
|
effects: [["fill", { color: "#3e59ad" }]],
|
|
8799
|
-
keys: { offset: [[0.3, -58, "
|
|
8808
|
+
keys: { offset: [[0.3, -58, "Sine Out"], [1.3, 101]] }
|
|
8800
8809
|
},
|
|
8801
8810
|
{
|
|
8802
8811
|
name: "Glide in",
|
|
8803
8812
|
range: { around: "all" },
|
|
8804
8813
|
effects: [["position", { x: em(2.5), y: 0 }]],
|
|
8805
|
-
keys: { amount: [[0, 100, "AE In"], [1, 0]] }
|
|
8814
|
+
keys: { amount: [[0, 100, "AE In (arrive)"], [1, 0]] }
|
|
8806
8815
|
},
|
|
8807
8816
|
{
|
|
8808
8817
|
name: "Glide out",
|
|
8809
|
-
range: { drive: "time", animate: "out", around: "all", stagger: 0, duration: 0.5, curve: "
|
|
8818
|
+
range: { drive: "time", animate: "out", around: "all", stagger: 0, duration: 0.5, curve: "Ease In" },
|
|
8810
8819
|
effects: [["position", { x: em(-1.5), y: 0 }], ["opacity", { opacity: 0 }]]
|
|
8811
8820
|
}
|
|
8812
8821
|
]
|
|
@@ -8825,13 +8834,13 @@ var factory = function(T) {
|
|
|
8825
8834
|
name: "Type",
|
|
8826
8835
|
range: { smooth: 0 },
|
|
8827
8836
|
effects: [["opacity", { opacity: 0 }]],
|
|
8828
|
-
keys: { start: [[0, 0, "AE In"], [0.93, 100]] }
|
|
8837
|
+
keys: { start: [[0, 0, "AE In (arrive)"], [0.93, 100]] }
|
|
8829
8838
|
},
|
|
8830
8839
|
{
|
|
8831
8840
|
name: "Blue band",
|
|
8832
8841
|
range: { start: 0, end: 100, shape: "smooth", easeHigh: 40 },
|
|
8833
8842
|
effects: [["fill", { color: "#3e59ad" }]],
|
|
8834
|
-
keys: { offset: [[0.14, -58, "
|
|
8843
|
+
keys: { offset: [[0.14, -58, "Sine Out"], [1.13, 101]] }
|
|
8835
8844
|
},
|
|
8836
8845
|
{
|
|
8837
8846
|
name: "Glide in",
|
|
@@ -8842,7 +8851,7 @@ var factory = function(T) {
|
|
|
8842
8851
|
},
|
|
8843
8852
|
{
|
|
8844
8853
|
name: "Glide out",
|
|
8845
|
-
range: { drive: "time", animate: "out", around: "all", stagger: 0, duration: 0.5, curve: "
|
|
8854
|
+
range: { drive: "time", animate: "out", around: "all", stagger: 0, duration: 0.5, curve: "Ease In" },
|
|
8846
8855
|
effects: [["position", { x: em(-1.5), y: 0 }], ["opacity", { opacity: 0 }]]
|
|
8847
8856
|
}
|
|
8848
8857
|
]
|
|
@@ -8879,7 +8888,7 @@ var factory = function(T) {
|
|
|
8879
8888
|
animators: [
|
|
8880
8889
|
{
|
|
8881
8890
|
name: "Recenter",
|
|
8882
|
-
range: kIn("words", "all", { stagger: 0, duration: 1.8, curve: "
|
|
8891
|
+
range: kIn("words", "all", { stagger: 0, duration: 1.8, curve: "Cubic Out" }),
|
|
8883
8892
|
effects: [["position", { x: em(4.6296), y: 0 }]]
|
|
8884
8893
|
},
|
|
8885
8894
|
{
|
|
@@ -8889,7 +8898,7 @@ var factory = function(T) {
|
|
|
8889
8898
|
},
|
|
8890
8899
|
{
|
|
8891
8900
|
name: "Focus in",
|
|
8892
|
-
range: kIn("words", "auto", { stagger: 0.15, duration: 0.38, curve: "
|
|
8901
|
+
range: kIn("words", "auto", { stagger: 0.15, duration: 0.38, curve: "Ease Out" }),
|
|
8893
8902
|
effects: [["opacity", { opacity: 0 }], ["blur", { amount: em(0.2593) }]]
|
|
8894
8903
|
},
|
|
8895
8904
|
{
|
|
@@ -9330,7 +9339,7 @@ var factory = function(T) {
|
|
|
9330
9339
|
},
|
|
9331
9340
|
{
|
|
9332
9341
|
name: "Fall out",
|
|
9333
|
-
range: kOut("words", "word", { stagger: 0.08, duration: 0.6, curve: "
|
|
9342
|
+
range: kOut("words", "word", { stagger: 0.08, duration: 0.6, curve: "Ease In" }),
|
|
9334
9343
|
effects: [["rotation", { angle: 90 }], ["opacity", { opacity: 0 }]]
|
|
9335
9344
|
}
|
|
9336
9345
|
]
|
|
@@ -9534,7 +9543,7 @@ var factory = function(T) {
|
|
|
9534
9543
|
},
|
|
9535
9544
|
{
|
|
9536
9545
|
name: "Fall out",
|
|
9537
|
-
range: kOut("words", "word", { stagger: 0.04, duration: 0.5, curve: "
|
|
9546
|
+
range: kOut("words", "word", { stagger: 0.04, duration: 0.5, curve: "Ease In" }),
|
|
9538
9547
|
effects: [["position", { x: 0, y: em(1.2) }], ["rotation", { angle: -25 }], ["opacity", { opacity: 0 }]]
|
|
9539
9548
|
}
|
|
9540
9549
|
]
|
|
@@ -10081,7 +10090,7 @@ var factory = function(T) {
|
|
|
10081
10090
|
description: "A box sits under each word while it is spoken, dark text on top",
|
|
10082
10091
|
animators: [{
|
|
10083
10092
|
name: "Spoken box",
|
|
10084
|
-
range: voice({ animate: "active", duration: 0.08, curve: "
|
|
10093
|
+
range: voice({ animate: "active", duration: 0.08, curve: "Ease Out", fadeOut: 0.08 }),
|
|
10085
10094
|
effects: [["box", { color: ACCENT, padX: em(0.12), padY: em(0.04), radius: em(0.14), grow: false }], ["fill", { color: "#0b0d0c" }]]
|
|
10086
10095
|
}]
|
|
10087
10096
|
},
|
|
@@ -10151,7 +10160,7 @@ var factory = function(T) {
|
|
|
10151
10160
|
description: "Words wait dimmed and light up as they are said",
|
|
10152
10161
|
animators: [{
|
|
10153
10162
|
name: "Not spoken yet",
|
|
10154
|
-
range: voice({ animate: "in", duration: 0.2, curve: "
|
|
10163
|
+
range: voice({ animate: "in", duration: 0.2, curve: "Ease Out" }),
|
|
10155
10164
|
effects: [["opacity", { opacity: 30 }]]
|
|
10156
10165
|
}]
|
|
10157
10166
|
},
|
|
@@ -10179,7 +10188,7 @@ var factory = function(T) {
|
|
|
10179
10188
|
description: "Words rise softly out of a blur as they are spoken",
|
|
10180
10189
|
animators: [{
|
|
10181
10190
|
name: "Rise",
|
|
10182
|
-
range: voice({ animate: "in", duration: 0.45, curve: "
|
|
10191
|
+
range: voice({ animate: "in", duration: 0.45, curve: "Cubic Out" }),
|
|
10183
10192
|
effects: [["position", { x: 0, y: em(0.45) }], ["blur", { amount: em(0.08) }], ["opacity", { opacity: 0 }]]
|
|
10184
10193
|
}]
|
|
10185
10194
|
},
|
|
@@ -10315,7 +10324,7 @@ var factory = function(T) {
|
|
|
10315
10324
|
sides: "inOut",
|
|
10316
10325
|
animators: [...p.animators, {
|
|
10317
10326
|
name: "Out",
|
|
10318
|
-
range: { drive: "time", animate: "out", basedOn, stagger, duration: 0.3, curve: "
|
|
10327
|
+
range: { drive: "time", animate: "out", basedOn, stagger, duration: 0.3, curve: "Ease In" },
|
|
10319
10328
|
effects: [["opacity", { opacity: 0 }]]
|
|
10320
10329
|
}]
|
|
10321
10330
|
};
|
|
@@ -10360,7 +10369,7 @@ var CLASSIC_PRESETS = [
|
|
|
10360
10369
|
"drive": "time",
|
|
10361
10370
|
"animate": "in",
|
|
10362
10371
|
"duration": 0.6,
|
|
10363
|
-
"curve": "
|
|
10372
|
+
"curve": "Smooth"
|
|
10364
10373
|
},
|
|
10365
10374
|
"effects": [
|
|
10366
10375
|
[
|
|
@@ -10389,7 +10398,7 @@ var CLASSIC_PRESETS = [
|
|
|
10389
10398
|
"drive": "time",
|
|
10390
10399
|
"animate": "out",
|
|
10391
10400
|
"duration": 0.5,
|
|
10392
|
-
"curve": "
|
|
10401
|
+
"curve": "Smooth"
|
|
10393
10402
|
},
|
|
10394
10403
|
"effects": [
|
|
10395
10404
|
[
|
|
@@ -10429,7 +10438,7 @@ var CLASSIC_PRESETS = [
|
|
|
10429
10438
|
"drive": "time",
|
|
10430
10439
|
"animate": "in",
|
|
10431
10440
|
"duration": 0.6,
|
|
10432
|
-
"curve": "
|
|
10441
|
+
"curve": "Smooth"
|
|
10433
10442
|
},
|
|
10434
10443
|
"effects": [
|
|
10435
10444
|
[
|
|
@@ -10458,7 +10467,7 @@ var CLASSIC_PRESETS = [
|
|
|
10458
10467
|
"drive": "time",
|
|
10459
10468
|
"animate": "out",
|
|
10460
10469
|
"duration": 0.5,
|
|
10461
|
-
"curve": "
|
|
10470
|
+
"curve": "Smooth"
|
|
10462
10471
|
},
|
|
10463
10472
|
"effects": [
|
|
10464
10473
|
[
|
|
@@ -10498,7 +10507,7 @@ var CLASSIC_PRESETS = [
|
|
|
10498
10507
|
"drive": "time",
|
|
10499
10508
|
"animate": "in",
|
|
10500
10509
|
"duration": 0.7,
|
|
10501
|
-
"curve": "
|
|
10510
|
+
"curve": "Smooth"
|
|
10502
10511
|
},
|
|
10503
10512
|
"effects": [
|
|
10504
10513
|
[
|
|
@@ -10524,7 +10533,7 @@ var CLASSIC_PRESETS = [
|
|
|
10524
10533
|
"drive": "time",
|
|
10525
10534
|
"animate": "out",
|
|
10526
10535
|
"duration": 0.5,
|
|
10527
|
-
"curve": "
|
|
10536
|
+
"curve": "Smooth"
|
|
10528
10537
|
},
|
|
10529
10538
|
"effects": [
|
|
10530
10539
|
[
|
|
@@ -10561,7 +10570,7 @@ var CLASSIC_PRESETS = [
|
|
|
10561
10570
|
"drive": "time",
|
|
10562
10571
|
"animate": "in",
|
|
10563
10572
|
"duration": 0.6,
|
|
10564
|
-
"curve": "
|
|
10573
|
+
"curve": "Smooth"
|
|
10565
10574
|
},
|
|
10566
10575
|
"effects": [
|
|
10567
10576
|
[
|
|
@@ -10596,7 +10605,7 @@ var CLASSIC_PRESETS = [
|
|
|
10596
10605
|
"drive": "time",
|
|
10597
10606
|
"animate": "out",
|
|
10598
10607
|
"duration": 0.45,
|
|
10599
|
-
"curve": "
|
|
10608
|
+
"curve": "Smooth"
|
|
10600
10609
|
},
|
|
10601
10610
|
"effects": [
|
|
10602
10611
|
[
|
|
@@ -10635,7 +10644,7 @@ var CLASSIC_PRESETS = [
|
|
|
10635
10644
|
"drive": "time",
|
|
10636
10645
|
"animate": "in",
|
|
10637
10646
|
"duration": 0.6,
|
|
10638
|
-
"curve": "
|
|
10647
|
+
"curve": "Smooth"
|
|
10639
10648
|
},
|
|
10640
10649
|
"effects": [
|
|
10641
10650
|
[
|
|
@@ -10664,7 +10673,7 @@ var CLASSIC_PRESETS = [
|
|
|
10664
10673
|
"drive": "time",
|
|
10665
10674
|
"animate": "out",
|
|
10666
10675
|
"duration": 0.5,
|
|
10667
|
-
"curve": "
|
|
10676
|
+
"curve": "Smooth"
|
|
10668
10677
|
},
|
|
10669
10678
|
"effects": [
|
|
10670
10679
|
[
|
|
@@ -10802,7 +10811,7 @@ var CLASSIC_PRESETS = [
|
|
|
10802
10811
|
"drive": "time",
|
|
10803
10812
|
"animate": "out",
|
|
10804
10813
|
"duration": 0.4,
|
|
10805
|
-
"curve": "
|
|
10814
|
+
"curve": "Ease In"
|
|
10806
10815
|
},
|
|
10807
10816
|
"effects": [
|
|
10808
10817
|
[
|
|
@@ -10848,7 +10857,7 @@ var CLASSIC_PRESETS = [
|
|
|
10848
10857
|
"drive": "time",
|
|
10849
10858
|
"animate": "in",
|
|
10850
10859
|
"duration": 0.5,
|
|
10851
|
-
"curve": "
|
|
10860
|
+
"curve": "Smooth"
|
|
10852
10861
|
},
|
|
10853
10862
|
"effects": [
|
|
10854
10863
|
[
|
|
@@ -10884,7 +10893,7 @@ var CLASSIC_PRESETS = [
|
|
|
10884
10893
|
"drive": "time",
|
|
10885
10894
|
"animate": "out",
|
|
10886
10895
|
"duration": 0.4,
|
|
10887
|
-
"curve": "
|
|
10896
|
+
"curve": "Smooth"
|
|
10888
10897
|
},
|
|
10889
10898
|
"effects": [
|
|
10890
10899
|
[
|
|
@@ -10924,7 +10933,7 @@ var CLASSIC_PRESETS = [
|
|
|
10924
10933
|
"drive": "time",
|
|
10925
10934
|
"animate": "in",
|
|
10926
10935
|
"duration": 0.12,
|
|
10927
|
-
"curve": "
|
|
10936
|
+
"curve": "Smooth"
|
|
10928
10937
|
},
|
|
10929
10938
|
"effects": [
|
|
10930
10939
|
[
|
|
@@ -10997,7 +11006,7 @@ var CLASSIC_PRESETS = [
|
|
|
10997
11006
|
"drive": "time",
|
|
10998
11007
|
"animate": "out",
|
|
10999
11008
|
"duration": 0.4,
|
|
11000
|
-
"curve": "
|
|
11009
|
+
"curve": "Ease In"
|
|
11001
11010
|
},
|
|
11002
11011
|
"effects": [
|
|
11003
11012
|
[
|
|
@@ -11066,7 +11075,7 @@ var CLASSIC_PRESETS = [
|
|
|
11066
11075
|
"drive": "time",
|
|
11067
11076
|
"animate": "out",
|
|
11068
11077
|
"duration": 0.3,
|
|
11069
|
-
"curve": "
|
|
11078
|
+
"curve": "Ease In"
|
|
11070
11079
|
},
|
|
11071
11080
|
"effects": [
|
|
11072
11081
|
[
|
|
@@ -11106,7 +11115,7 @@ var CLASSIC_PRESETS = [
|
|
|
11106
11115
|
"drive": "time",
|
|
11107
11116
|
"animate": "in",
|
|
11108
11117
|
"duration": 0.7,
|
|
11109
|
-
"curve": "
|
|
11118
|
+
"curve": "Cubic Out"
|
|
11110
11119
|
},
|
|
11111
11120
|
"effects": [
|
|
11112
11121
|
[
|
|
@@ -11140,7 +11149,7 @@ var CLASSIC_PRESETS = [
|
|
|
11140
11149
|
"drive": "time",
|
|
11141
11150
|
"animate": "out",
|
|
11142
11151
|
"duration": 0.4,
|
|
11143
|
-
"curve": "
|
|
11152
|
+
"curve": "Ease In"
|
|
11144
11153
|
},
|
|
11145
11154
|
"effects": [
|
|
11146
11155
|
[
|
|
@@ -11205,7 +11214,7 @@ var CLASSIC_PRESETS = [
|
|
|
11205
11214
|
"drive": "time",
|
|
11206
11215
|
"animate": "in",
|
|
11207
11216
|
"duration": 0.35,
|
|
11208
|
-
"curve": "
|
|
11217
|
+
"curve": "Smooth"
|
|
11209
11218
|
},
|
|
11210
11219
|
"effects": [
|
|
11211
11220
|
[
|
|
@@ -11270,7 +11279,7 @@ var CLASSIC_PRESETS = [
|
|
|
11270
11279
|
"drive": "time",
|
|
11271
11280
|
"animate": "in",
|
|
11272
11281
|
"duration": 0.35,
|
|
11273
|
-
"curve": "
|
|
11282
|
+
"curve": "Smooth"
|
|
11274
11283
|
},
|
|
11275
11284
|
"effects": [
|
|
11276
11285
|
[
|
|
@@ -11334,7 +11343,7 @@ var CLASSIC_PRESETS = [
|
|
|
11334
11343
|
"drive": "time",
|
|
11335
11344
|
"animate": "in",
|
|
11336
11345
|
"duration": 0.15,
|
|
11337
|
-
"curve": "
|
|
11346
|
+
"curve": "Smooth"
|
|
11338
11347
|
},
|
|
11339
11348
|
"effects": [
|
|
11340
11349
|
[
|
|
@@ -11391,7 +11400,7 @@ var CLASSIC_PRESETS = [
|
|
|
11391
11400
|
"drive": "time",
|
|
11392
11401
|
"animate": "in",
|
|
11393
11402
|
"duration": 0.25,
|
|
11394
|
-
"curve": "
|
|
11403
|
+
"curve": "Smooth"
|
|
11395
11404
|
},
|
|
11396
11405
|
"effects": [
|
|
11397
11406
|
[
|
|
@@ -11460,7 +11469,7 @@ var CLASSIC_PRESETS = [
|
|
|
11460
11469
|
"drive": "time",
|
|
11461
11470
|
"animate": "in",
|
|
11462
11471
|
"duration": 0.3,
|
|
11463
|
-
"curve": "
|
|
11472
|
+
"curve": "Smooth"
|
|
11464
11473
|
},
|
|
11465
11474
|
"effects": [
|
|
11466
11475
|
[
|
|
@@ -11482,7 +11491,7 @@ var CLASSIC_PRESETS = [
|
|
|
11482
11491
|
"drive": "time",
|
|
11483
11492
|
"animate": "out",
|
|
11484
11493
|
"duration": 0.3,
|
|
11485
|
-
"curve": "
|
|
11494
|
+
"curve": "Smooth"
|
|
11486
11495
|
},
|
|
11487
11496
|
"effects": [
|
|
11488
11497
|
[
|
|
@@ -11540,7 +11549,7 @@ var CLASSIC_PRESETS = [
|
|
|
11540
11549
|
"drive": "time",
|
|
11541
11550
|
"animate": "in",
|
|
11542
11551
|
"duration": 0.35,
|
|
11543
|
-
"curve": "
|
|
11552
|
+
"curve": "Smooth"
|
|
11544
11553
|
},
|
|
11545
11554
|
"effects": [
|
|
11546
11555
|
[
|
|
@@ -11569,7 +11578,7 @@ var CLASSIC_PRESETS = [
|
|
|
11569
11578
|
"drive": "time",
|
|
11570
11579
|
"animate": "out",
|
|
11571
11580
|
"duration": 0.3,
|
|
11572
|
-
"curve": "
|
|
11581
|
+
"curve": "Smooth"
|
|
11573
11582
|
},
|
|
11574
11583
|
"effects": [
|
|
11575
11584
|
[
|
|
@@ -11700,7 +11709,7 @@ var CLASSIC_PRESETS = [
|
|
|
11700
11709
|
"drive": "time",
|
|
11701
11710
|
"animate": "in",
|
|
11702
11711
|
"duration": 0.5,
|
|
11703
|
-
"curve": "
|
|
11712
|
+
"curve": "Cubic Out"
|
|
11704
11713
|
},
|
|
11705
11714
|
"effects": [
|
|
11706
11715
|
[
|
|
@@ -11729,7 +11738,7 @@ var CLASSIC_PRESETS = [
|
|
|
11729
11738
|
"drive": "time",
|
|
11730
11739
|
"animate": "out",
|
|
11731
11740
|
"duration": 0.25,
|
|
11732
|
-
"curve": "
|
|
11741
|
+
"curve": "Ease In"
|
|
11733
11742
|
},
|
|
11734
11743
|
"effects": [
|
|
11735
11744
|
[
|
|
@@ -11768,7 +11777,7 @@ var CLASSIC_PRESETS = [
|
|
|
11768
11777
|
"textBgOutType": "mask-right",
|
|
11769
11778
|
"textBgOutStyle": "grow",
|
|
11770
11779
|
"textBgOutDuration": 0.3,
|
|
11771
|
-
"textBgOutEasing": "
|
|
11780
|
+
"textBgOutEasing": "Ease In",
|
|
11772
11781
|
"textBgOutGrowStart": 0,
|
|
11773
11782
|
"textBgOutGrowAppear": "scale-in",
|
|
11774
11783
|
"textBgOutGrowAppearDuration": 0.15,
|
|
@@ -11954,7 +11963,7 @@ var CLASSIC_PRESETS = [
|
|
|
11954
11963
|
"drive": "time",
|
|
11955
11964
|
"animate": "in",
|
|
11956
11965
|
"duration": 0.3,
|
|
11957
|
-
"curve": "
|
|
11966
|
+
"curve": "Ease Out"
|
|
11958
11967
|
},
|
|
11959
11968
|
"effects": [
|
|
11960
11969
|
[
|
|
@@ -11983,7 +11992,7 @@ var CLASSIC_PRESETS = [
|
|
|
11983
11992
|
"drive": "time",
|
|
11984
11993
|
"animate": "out",
|
|
11985
11994
|
"duration": 0.2,
|
|
11986
|
-
"curve": "
|
|
11995
|
+
"curve": "Ease In"
|
|
11987
11996
|
},
|
|
11988
11997
|
"effects": [
|
|
11989
11998
|
[
|
|
@@ -12009,7 +12018,7 @@ var CLASSIC_PRESETS = [
|
|
|
12009
12018
|
"textBgInType": "mask-right",
|
|
12010
12019
|
"textBgInStyle": "grow",
|
|
12011
12020
|
"textBgInDuration": 0.6,
|
|
12012
|
-
"textBgInEasing": "
|
|
12021
|
+
"textBgInEasing": "Cubic Out",
|
|
12013
12022
|
"textBgInDelay": 0,
|
|
12014
12023
|
"textBgInGrowStart": 0,
|
|
12015
12024
|
"textBgInGrowAppear": "fade",
|
|
@@ -12018,7 +12027,7 @@ var CLASSIC_PRESETS = [
|
|
|
12018
12027
|
"textBgOutType": "mask-right",
|
|
12019
12028
|
"textBgOutStyle": "grow",
|
|
12020
12029
|
"textBgOutDuration": 0.4,
|
|
12021
|
-
"textBgOutEasing": "
|
|
12030
|
+
"textBgOutEasing": "Ease In",
|
|
12022
12031
|
"textBgOutGrowStart": 0,
|
|
12023
12032
|
"textBgOutGrowAppear": "none",
|
|
12024
12033
|
"textBgOutGrowAppearDuration": 0.4,
|
|
@@ -12077,7 +12086,7 @@ var CLASSIC_PRESETS = [
|
|
|
12077
12086
|
"drive": "time",
|
|
12078
12087
|
"animate": "out",
|
|
12079
12088
|
"duration": 0.2,
|
|
12080
|
-
"curve": "
|
|
12089
|
+
"curve": "Ease In"
|
|
12081
12090
|
},
|
|
12082
12091
|
"effects": [
|
|
12083
12092
|
[
|
|
@@ -12158,7 +12167,7 @@ var CLASSIC_PRESETS = [
|
|
|
12158
12167
|
"drive": "time",
|
|
12159
12168
|
"animate": "out",
|
|
12160
12169
|
"duration": 0.4,
|
|
12161
|
-
"curve": "
|
|
12170
|
+
"curve": "Smooth"
|
|
12162
12171
|
},
|
|
12163
12172
|
"effects": [
|
|
12164
12173
|
[
|
|
@@ -12220,7 +12229,7 @@ var CLASSIC_PRESETS = [
|
|
|
12220
12229
|
"drive": "time",
|
|
12221
12230
|
"animate": "in",
|
|
12222
12231
|
"duration": 0.5,
|
|
12223
|
-
"curve": "
|
|
12232
|
+
"curve": "Smooth"
|
|
12224
12233
|
},
|
|
12225
12234
|
"effects": [
|
|
12226
12235
|
[
|
|
@@ -12256,7 +12265,7 @@ var CLASSIC_PRESETS = [
|
|
|
12256
12265
|
"drive": "time",
|
|
12257
12266
|
"animate": "out",
|
|
12258
12267
|
"duration": 0.4,
|
|
12259
|
-
"curve": "
|
|
12268
|
+
"curve": "Smooth"
|
|
12260
12269
|
},
|
|
12261
12270
|
"effects": [
|
|
12262
12271
|
[
|
|
@@ -12317,7 +12326,7 @@ var CLASSIC_PRESETS = [
|
|
|
12317
12326
|
"drive": "time",
|
|
12318
12327
|
"animate": "in",
|
|
12319
12328
|
"duration": 0.7,
|
|
12320
|
-
"curve": "
|
|
12329
|
+
"curve": "Smooth"
|
|
12321
12330
|
},
|
|
12322
12331
|
"effects": [
|
|
12323
12332
|
[
|
|
@@ -12343,7 +12352,7 @@ var CLASSIC_PRESETS = [
|
|
|
12343
12352
|
"drive": "time",
|
|
12344
12353
|
"animate": "out",
|
|
12345
12354
|
"duration": 0.5,
|
|
12346
|
-
"curve": "
|
|
12355
|
+
"curve": "Smooth"
|
|
12347
12356
|
},
|
|
12348
12357
|
"effects": [
|
|
12349
12358
|
[
|
|
@@ -12404,7 +12413,7 @@ var CLASSIC_PRESETS = [
|
|
|
12404
12413
|
"drive": "time",
|
|
12405
12414
|
"animate": "in",
|
|
12406
12415
|
"duration": 0.4,
|
|
12407
|
-
"curve": "
|
|
12416
|
+
"curve": "Smooth"
|
|
12408
12417
|
},
|
|
12409
12418
|
"effects": [
|
|
12410
12419
|
[
|
|
@@ -12475,7 +12484,7 @@ var CLASSIC_PRESETS = [
|
|
|
12475
12484
|
"drive": "time",
|
|
12476
12485
|
"animate": "in",
|
|
12477
12486
|
"duration": 0.14,
|
|
12478
|
-
"curve": "
|
|
12487
|
+
"curve": "Ease Out"
|
|
12479
12488
|
},
|
|
12480
12489
|
"effects": [
|
|
12481
12490
|
[
|
|
@@ -12515,7 +12524,7 @@ var CLASSIC_PRESETS = [
|
|
|
12515
12524
|
"drive": "time",
|
|
12516
12525
|
"animate": "out",
|
|
12517
12526
|
"duration": 0.25,
|
|
12518
|
-
"curve": "
|
|
12527
|
+
"curve": "Ease In"
|
|
12519
12528
|
},
|
|
12520
12529
|
"effects": [
|
|
12521
12530
|
[
|
|
@@ -12736,21 +12745,29 @@ var TransitionEasing = {
|
|
|
12736
12745
|
SMOOTH_GLIDE: "Smooth Glide",
|
|
12737
12746
|
GLIDE_STOP: "Glide Easing Stop",
|
|
12738
12747
|
// After Effects-style bezier curves — same curves as MotionFast's aeIn/aeSmooth/aeOut.
|
|
12739
|
-
|
|
12748
|
+
// AE names a curve by the side of the key its influence sits on, so the shapes read
|
|
12749
|
+
// backwards to the CSS names: AE In starts fast and brakes into the key (an arrival),
|
|
12750
|
+
// AE Out starts slow and speeds away (a departure). The label says which.
|
|
12751
|
+
AE_IN: "AE In (arrive)",
|
|
12740
12752
|
AE_SMOOTH: "AE Smooth",
|
|
12741
|
-
AE_OUT: "AE Out",
|
|
12753
|
+
AE_OUT: "AE Out (leave)",
|
|
12742
12754
|
SINE_IN: "Sine In",
|
|
12743
12755
|
SINE_OUT: "Sine Out",
|
|
12744
12756
|
SINE_IN_OUT: "Sine Smooth",
|
|
12745
|
-
CUBIC_IN_OUT: "Cubic Smooth",
|
|
12746
12757
|
CUBIC_IN: "Cubic In",
|
|
12747
12758
|
CUBIC_OUT: "Cubic Out",
|
|
12748
12759
|
EXPO_IN: "Expo In",
|
|
12749
12760
|
EXPO_OUT: "Expo Out",
|
|
12750
12761
|
EXPO_IN_OUT: "Expo Smooth",
|
|
12751
|
-
|
|
12752
|
-
|
|
12753
|
-
|
|
12762
|
+
// A hard, decisive stop (GSAP power4.out; drawn as cubic-bezier(0.23, 1, 0.32, 1)).
|
|
12763
|
+
POWER: "Power",
|
|
12764
|
+
// From the "Easing Lab" board (2026-11-01), both plain cubic beziers. Punch winds up
|
|
12765
|
+
// slowly, hits hard and trails a long tail (scene changes on the beat, a logo hit, a
|
|
12766
|
+
// screen swipe); nothing else in the list is within 0.23 of it. Apple Out starts at
|
|
12767
|
+
// full speed and spends most of the move in a soft stop (UI panels, drawers, a
|
|
12768
|
+
// camera landing).
|
|
12769
|
+
PUNCH: "Punch",
|
|
12770
|
+
APPLE_OUT: "Apple Out",
|
|
12754
12771
|
BACK_IN: "Back In",
|
|
12755
12772
|
BACK_OUT: "Back Out",
|
|
12756
12773
|
BACK_IN_OUT: "Back Smooth",
|
|
@@ -12770,18 +12787,6 @@ var TransitionEasing = {
|
|
|
12770
12787
|
SMOOTH_OVERSHOOT: "Smooth Overshoot",
|
|
12771
12788
|
// Winds back first, then snaps through to the end: an exit. Sampled.
|
|
12772
12789
|
ANTICIPATE: "Anticipate",
|
|
12773
|
-
POWER1_IN: "Power1 In",
|
|
12774
|
-
POWER1_OUT: "Power1 Out",
|
|
12775
|
-
POWER1_IN_OUT: "Power1 Smooth",
|
|
12776
|
-
POWER2_IN: "Power2 In",
|
|
12777
|
-
POWER2_OUT: "Power2 Out",
|
|
12778
|
-
POWER2_IN_OUT: "Power2 Smooth",
|
|
12779
|
-
POWER3_IN: "Power3 In",
|
|
12780
|
-
POWER3_OUT: "Power3 Out",
|
|
12781
|
-
POWER3_IN_OUT: "Power3 Smooth",
|
|
12782
|
-
POWER4_IN: "Power4 In",
|
|
12783
|
-
POWER4_OUT: "Power4 Out",
|
|
12784
|
-
POWER4_IN_OUT: "Power4 Smooth",
|
|
12785
12790
|
// ── Keyframe-only easings ──
|
|
12786
12791
|
// CUSTOM reads the key's own `bezier: [x1, y1, x2, y2]` (the graph editor writes
|
|
12787
12792
|
// it by dragging handles); HOLD steps to the next key instead of interpolating.
|
|
@@ -12791,6 +12796,54 @@ var TransitionEasing = {
|
|
|
12791
12796
|
CUSTOM: "Custom",
|
|
12792
12797
|
HOLD: "Hold"
|
|
12793
12798
|
};
|
|
12799
|
+
var RETIRED_EASINGS = {
|
|
12800
|
+
"Power1 In": TransitionEasing.SINE_IN,
|
|
12801
|
+
"Power1 Out": TransitionEasing.SINE_OUT,
|
|
12802
|
+
"Power1 Smooth": TransitionEasing.SINE_IN_OUT,
|
|
12803
|
+
"Power2 In": TransitionEasing.EASE_IN,
|
|
12804
|
+
"Power2 Out": TransitionEasing.EASE_OUT,
|
|
12805
|
+
"Power2 Smooth": TransitionEasing.EASE_IN_OUT,
|
|
12806
|
+
"Power3 In": TransitionEasing.CUBIC_IN,
|
|
12807
|
+
"Power3 Out": TransitionEasing.CUBIC_OUT,
|
|
12808
|
+
"Power3 Smooth": TransitionEasing.NATURAL,
|
|
12809
|
+
"Power4 In": TransitionEasing.CUBIC_IN,
|
|
12810
|
+
"Power4 Out": TransitionEasing.POWER,
|
|
12811
|
+
"Power4 Smooth": TransitionEasing.NATURAL,
|
|
12812
|
+
"Cubic Smooth": TransitionEasing.NATURAL,
|
|
12813
|
+
"Circ In": TransitionEasing.CUBIC_IN,
|
|
12814
|
+
"Circ Out": TransitionEasing.SLOW_DOWN,
|
|
12815
|
+
"Circ Smooth": TransitionEasing.NATURAL,
|
|
12816
|
+
"AE In": TransitionEasing.AE_IN,
|
|
12817
|
+
"AE Out": TransitionEasing.AE_OUT
|
|
12818
|
+
};
|
|
12819
|
+
var RETIRED_EASING_KEYS = {
|
|
12820
|
+
POWER1_IN: "SINE_IN",
|
|
12821
|
+
POWER1_OUT: "SINE_OUT",
|
|
12822
|
+
POWER1_IN_OUT: "SINE_IN_OUT",
|
|
12823
|
+
POWER2_IN: "EASE_IN",
|
|
12824
|
+
POWER2_OUT: "EASE_OUT",
|
|
12825
|
+
POWER2_IN_OUT: "EASE_IN_OUT",
|
|
12826
|
+
POWER3_IN: "CUBIC_IN",
|
|
12827
|
+
POWER3_OUT: "CUBIC_OUT",
|
|
12828
|
+
POWER3_IN_OUT: "NATURAL",
|
|
12829
|
+
POWER4_IN: "CUBIC_IN",
|
|
12830
|
+
POWER4_OUT: "POWER",
|
|
12831
|
+
POWER4_IN_OUT: "NATURAL",
|
|
12832
|
+
CUBIC_IN_OUT: "NATURAL",
|
|
12833
|
+
CIRC_IN: "CUBIC_IN",
|
|
12834
|
+
CIRC_OUT: "SLOW_DOWN",
|
|
12835
|
+
CIRC_IN_OUT: "NATURAL"
|
|
12836
|
+
};
|
|
12837
|
+
var EASING_VALUE_SET = new Set(Object.values(TransitionEasing));
|
|
12838
|
+
function currentEasing(value, fallback = void 0) {
|
|
12839
|
+
if (EASING_VALUE_SET.has(value)) return value;
|
|
12840
|
+
return Object.hasOwn(RETIRED_EASINGS, value) ? RETIRED_EASINGS[value] : fallback;
|
|
12841
|
+
}
|
|
12842
|
+
function currentEasingKey(key, fallback = void 0) {
|
|
12843
|
+
if (typeof key !== "string") return fallback;
|
|
12844
|
+
if (Object.hasOwn(TransitionEasing, key)) return key;
|
|
12845
|
+
return Object.hasOwn(RETIRED_EASING_KEYS, key) ? RETIRED_EASING_KEYS[key] : fallback;
|
|
12846
|
+
}
|
|
12794
12847
|
var KEYFRAME_ONLY_EASINGS = [TransitionEasing.CUSTOM, TransitionEasing.HOLD];
|
|
12795
12848
|
var TRANSITION_EASING_OPTIONS = Object.values(TransitionEasing).filter((e2) => !KEYFRAME_ONLY_EASINGS.includes(e2));
|
|
12796
12849
|
|
|
@@ -14097,28 +14150,16 @@ var EASING_BEZIER = {
|
|
|
14097
14150
|
[TransitionEasing.SINE_IN_OUT]: [0.445, 0.05, 0.55, 0.95],
|
|
14098
14151
|
[TransitionEasing.CUBIC_IN]: [0.895, 0.03, 0.685, 0.22],
|
|
14099
14152
|
[TransitionEasing.CUBIC_OUT]: [0.165, 0.84, 0.44, 1],
|
|
14100
|
-
[TransitionEasing.CUBIC_IN_OUT]: [0.77, 0, 0.175, 1],
|
|
14101
14153
|
[TransitionEasing.EXPO_IN]: [0.95, 0.05, 0.795, 0.035],
|
|
14102
14154
|
[TransitionEasing.EXPO_OUT]: [0.19, 1, 0.22, 1],
|
|
14103
14155
|
[TransitionEasing.EXPO_IN_OUT]: [1, 0, 0, 1],
|
|
14104
|
-
[TransitionEasing.
|
|
14105
|
-
|
|
14106
|
-
[TransitionEasing.
|
|
14156
|
+
[TransitionEasing.POWER]: [0.23, 1, 0.32, 1],
|
|
14157
|
+
// The "Easing Lab" board's two new curves — these handles ARE the curve.
|
|
14158
|
+
[TransitionEasing.PUNCH]: [0.7, 0, 0.1, 1],
|
|
14159
|
+
[TransitionEasing.APPLE_OUT]: [0.32, 0.72, 0, 1],
|
|
14107
14160
|
[TransitionEasing.BACK_IN]: [0.6, -0.28, 0.735, 0.045],
|
|
14108
14161
|
[TransitionEasing.BACK_OUT]: [0.175, 0.885, 0.32, 1.275],
|
|
14109
14162
|
[TransitionEasing.BACK_IN_OUT]: [0.68, -0.55, 0.265, 1.55],
|
|
14110
|
-
[TransitionEasing.POWER1_IN]: [0.55, 0.085, 0.68, 0.53],
|
|
14111
|
-
[TransitionEasing.POWER1_OUT]: [0.25, 0.46, 0.45, 0.94],
|
|
14112
|
-
[TransitionEasing.POWER1_IN_OUT]: [0.455, 0.03, 0.515, 0.955],
|
|
14113
|
-
[TransitionEasing.POWER2_IN]: [0.55, 0.055, 0.675, 0.19],
|
|
14114
|
-
[TransitionEasing.POWER2_OUT]: [0.215, 0.61, 0.355, 1],
|
|
14115
|
-
[TransitionEasing.POWER2_IN_OUT]: [0.645, 0.045, 0.355, 1],
|
|
14116
|
-
[TransitionEasing.POWER3_IN]: [0.895, 0.03, 0.685, 0.22],
|
|
14117
|
-
[TransitionEasing.POWER3_OUT]: [0.165, 0.84, 0.44, 1],
|
|
14118
|
-
[TransitionEasing.POWER3_IN_OUT]: [0.77, 0, 0.175, 1],
|
|
14119
|
-
[TransitionEasing.POWER4_IN]: [0.755, 0.05, 0.855, 0.06],
|
|
14120
|
-
[TransitionEasing.POWER4_OUT]: [0.23, 1, 0.32, 1],
|
|
14121
|
-
[TransitionEasing.POWER4_IN_OUT]: [0.86, 0, 0.07, 1],
|
|
14122
14163
|
// Legacy MotionFast template curves (templates/common/easings.ts).
|
|
14123
14164
|
[TransitionEasing.NATURAL]: [0.8, 0, 0.2, 1],
|
|
14124
14165
|
[TransitionEasing.SLOW_DOWN]: [0, 0, 0, 1]
|
|
@@ -14136,15 +14177,14 @@ var GSAP_EASE_NAMES = {
|
|
|
14136
14177
|
[TransitionEasing.SINE_IN]: "sine.in",
|
|
14137
14178
|
[TransitionEasing.SINE_OUT]: "sine.out",
|
|
14138
14179
|
[TransitionEasing.SINE_IN_OUT]: "sine.inOut",
|
|
14139
|
-
[TransitionEasing.CUBIC_IN_OUT]: "power3.inOut",
|
|
14140
14180
|
[TransitionEasing.CUBIC_IN]: "power3.in",
|
|
14141
14181
|
[TransitionEasing.CUBIC_OUT]: "power3.out",
|
|
14142
14182
|
[TransitionEasing.EXPO_IN]: "expo.in",
|
|
14143
14183
|
[TransitionEasing.EXPO_OUT]: "expo.out",
|
|
14144
14184
|
[TransitionEasing.EXPO_IN_OUT]: "expo.inOut",
|
|
14145
|
-
[TransitionEasing.
|
|
14146
|
-
[TransitionEasing.
|
|
14147
|
-
[TransitionEasing.
|
|
14185
|
+
[TransitionEasing.POWER]: "power4.out",
|
|
14186
|
+
[TransitionEasing.PUNCH]: "punch",
|
|
14187
|
+
[TransitionEasing.APPLE_OUT]: "appleOut",
|
|
14148
14188
|
[TransitionEasing.BACK_IN]: "back.in",
|
|
14149
14189
|
[TransitionEasing.BACK_OUT]: "back.out",
|
|
14150
14190
|
[TransitionEasing.BACK_IN_OUT]: "back.inOut",
|
|
@@ -14156,19 +14196,7 @@ var GSAP_EASE_NAMES = {
|
|
|
14156
14196
|
[TransitionEasing.IMPULSE]: "mfImpulse",
|
|
14157
14197
|
[TransitionEasing.SWING]: "mfSwing",
|
|
14158
14198
|
[TransitionEasing.SMOOTH_OVERSHOOT]: "mfSmoothOvershoot",
|
|
14159
|
-
[TransitionEasing.ANTICIPATE]: "mfAnticipate"
|
|
14160
|
-
[TransitionEasing.POWER1_IN]: "power1.in",
|
|
14161
|
-
[TransitionEasing.POWER1_OUT]: "power1.out",
|
|
14162
|
-
[TransitionEasing.POWER1_IN_OUT]: "power1.inOut",
|
|
14163
|
-
[TransitionEasing.POWER2_IN]: "power2.in",
|
|
14164
|
-
[TransitionEasing.POWER2_OUT]: "power2.out",
|
|
14165
|
-
[TransitionEasing.POWER2_IN_OUT]: "power2.inOut",
|
|
14166
|
-
[TransitionEasing.POWER3_IN]: "power3.in",
|
|
14167
|
-
[TransitionEasing.POWER3_OUT]: "power3.out",
|
|
14168
|
-
[TransitionEasing.POWER3_IN_OUT]: "power3.inOut",
|
|
14169
|
-
[TransitionEasing.POWER4_IN]: "power4.in",
|
|
14170
|
-
[TransitionEasing.POWER4_OUT]: "power4.out",
|
|
14171
|
-
[TransitionEasing.POWER4_IN_OUT]: "power4.inOut"
|
|
14199
|
+
[TransitionEasing.ANTICIPATE]: "mfAnticipate"
|
|
14172
14200
|
};
|
|
14173
14201
|
var SAMPLED_EASING_VALUES = {
|
|
14174
14202
|
[TransitionEasing.OVERSHOOT]: [
|
|
@@ -15589,7 +15617,7 @@ var COUNTER_DEFAULTS = Object.freeze({
|
|
|
15589
15617
|
textCounterStyle: "odometer",
|
|
15590
15618
|
textCounterDelay: 0,
|
|
15591
15619
|
textCounterDuration: 1.8,
|
|
15592
|
-
textCounterEasing: "
|
|
15620
|
+
textCounterEasing: "CUBIC_OUT",
|
|
15593
15621
|
textCounterStagger: 0.15,
|
|
15594
15622
|
textCounterWidth: "fixed",
|
|
15595
15623
|
textCounterTabular: true,
|
|
@@ -15765,7 +15793,7 @@ var CYCLE_DEFAULTS = Object.freeze({
|
|
|
15765
15793
|
textCycleDelay: 0,
|
|
15766
15794
|
textCycleHold: 1.2,
|
|
15767
15795
|
textCycleDuration: 0.45,
|
|
15768
|
-
textCycleEasing: "
|
|
15796
|
+
textCycleEasing: "CUBIC_OUT",
|
|
15769
15797
|
textCycleLoop: true,
|
|
15770
15798
|
textCycleWidth: "fit",
|
|
15771
15799
|
textCycleDirection: "up",
|
|
@@ -15976,6 +16004,27 @@ var KEYFRAME_FX_TYPES = [
|
|
|
15976
16004
|
{ key: "decay", label: "Decay", min: 0.5, max: 15, step: 0.1, def: 5 }
|
|
15977
16005
|
]
|
|
15978
16006
|
},
|
|
16007
|
+
{
|
|
16008
|
+
id: "spring",
|
|
16009
|
+
label: "Spring",
|
|
16010
|
+
hint: "Each move is a real spring: it leaves the key before at rest, overshoots as far as its damping lets it and settles. It runs in seconds, so a short move and a long one ring alike.",
|
|
16011
|
+
// The "Easing Lab" board's two springs. They set the spring only, so a
|
|
16012
|
+
// tuned Strength survives a switch; the first equals the param defaults.
|
|
16013
|
+
presets: [
|
|
16014
|
+
{ id: "snappy", label: "Snappy", hint: "1.6 Hz, damping 0.55: about 12 % overshoot. Buttons, icons, pop-ins", params: { freq: 1.6, damping: 0.55 } },
|
|
16015
|
+
{ id: "gentle", label: "Gentle", hint: "1 Hz, damping 0.8: a 1.5 % overshoot. Mascots, big cards, the camera", params: { freq: 1, damping: 0.8 } }
|
|
16016
|
+
],
|
|
16017
|
+
params: [
|
|
16018
|
+
{ key: "amp", label: "Strength", min: 0, max: 300, step: 1, def: 100, suffix: "%" },
|
|
16019
|
+
// The spring's natural frequency: higher is quicker. A move settles (within
|
|
16020
|
+
// 2 %) in about 4 / (2π · freq · damping) s — Snappy 0.7 s, Gentle 0.8 s —
|
|
16021
|
+
// whatever the gap to the next key.
|
|
16022
|
+
{ key: "freq", label: "Frequency", min: 0.1, max: 10, step: 0.05, def: 1.6, suffix: "Hz" },
|
|
16023
|
+
// Damping ratio ζ: lower rings longer and overshoots further; 1 is
|
|
16024
|
+
// critically damped (no overshoot at all).
|
|
16025
|
+
{ key: "damping", label: "Damping", min: 0.05, max: 1, step: 0.01, def: 0.55 }
|
|
16026
|
+
]
|
|
16027
|
+
},
|
|
15979
16028
|
{
|
|
15980
16029
|
id: "bounce",
|
|
15981
16030
|
label: "Bounce",
|
|
@@ -16107,6 +16156,15 @@ function bounceProfile(u, e2, nMax) {
|
|
|
16107
16156
|
if (nb > nMax) return 1;
|
|
16108
16157
|
return 1 - (vk * tb - g * tb * tb / 2);
|
|
16109
16158
|
}
|
|
16159
|
+
function springProfile(tSec, freq, damping) {
|
|
16160
|
+
if (tSec <= 0) return 0;
|
|
16161
|
+
const w = 2 * Math.PI * freq;
|
|
16162
|
+
const zw = damping * w;
|
|
16163
|
+
if (zw * tSec > 14) return 1;
|
|
16164
|
+
if (damping >= 0.999) return 1 - Math.exp(-w * tSec) * (1 + w * tSec);
|
|
16165
|
+
const wd = w * Math.sqrt(1 - damping * damping);
|
|
16166
|
+
return 1 - Math.exp(-zw * tSec) * (Math.cos(wd * tSec) + zw / wd * Math.sin(wd * tSec));
|
|
16167
|
+
}
|
|
16110
16168
|
function profiledValue(track, pct, base, durationSec, strength, profile) {
|
|
16111
16169
|
if (track.length < 2 || !(strength > 0)) return base;
|
|
16112
16170
|
const t = pct / 100 * durationSec;
|
|
@@ -16121,7 +16179,7 @@ function profiledValue(track, pct, base, durationSec, strength, profile) {
|
|
|
16121
16179
|
const tPrev = Number(track[i - 1].position) / 100 * durationSec;
|
|
16122
16180
|
const segSec = Number(track[i].position) / 100 * durationSec - tPrev;
|
|
16123
16181
|
if (!(segSec > 0)) continue;
|
|
16124
|
-
value += step * profile((t - tPrev) / segSec);
|
|
16182
|
+
value += step * profile((t - tPrev) / segSec, segSec);
|
|
16125
16183
|
}
|
|
16126
16184
|
return base + strength * (value - base);
|
|
16127
16185
|
}
|
|
@@ -16129,6 +16187,10 @@ function elasticValue(cfg, track, pct, base, durationSec) {
|
|
|
16129
16187
|
const { amp, freq, decay } = cfg.params;
|
|
16130
16188
|
return profiledValue(track, pct, base, durationSec, amp / 100, (u) => elasticProfile(u, freq, decay));
|
|
16131
16189
|
}
|
|
16190
|
+
function springValue(cfg, track, pct, base, durationSec) {
|
|
16191
|
+
const { amp, freq, damping } = cfg.params;
|
|
16192
|
+
return profiledValue(track, pct, base, durationSec, amp / 100, (u, segSec) => springProfile(u * segSec, freq, damping));
|
|
16193
|
+
}
|
|
16132
16194
|
function bounceValue(cfg, track, pct, base, durationSec) {
|
|
16133
16195
|
const { amp, elasticity, bounces } = cfg.params;
|
|
16134
16196
|
const e2 = Math.min(0.95, Math.max(0.01, elasticity / 100));
|
|
@@ -16338,6 +16400,8 @@ function evaluateKeyframeFx(cfg, track, pct, base, durationSec, seedKey = "", it
|
|
|
16338
16400
|
return elasticValue(cfg, track, pct, base, durationSec);
|
|
16339
16401
|
case "bounce":
|
|
16340
16402
|
return bounceValue(cfg, track, pct, base, durationSec);
|
|
16403
|
+
case "spring":
|
|
16404
|
+
return springValue(cfg, track, pct, base, durationSec);
|
|
16341
16405
|
case "wiggle":
|
|
16342
16406
|
return base + wiggleOffset(cfg, pct / 100 * durationSec, stringSeed(seedKey));
|
|
16343
16407
|
case "glide":
|
|
@@ -16381,6 +16445,8 @@ registerEase("aeSmooth", bezierEase(...EASING_BEZIER[TransitionEasing.AE_SMOOTH]
|
|
|
16381
16445
|
registerEase("aeOut", bezierEase(...EASING_BEZIER[TransitionEasing.AE_OUT]));
|
|
16382
16446
|
registerEase("smoothGlide", bezierEase(...EASING_BEZIER[TransitionEasing.SMOOTH_GLIDE]));
|
|
16383
16447
|
registerEase("glideStop", bezierEase(...EASING_BEZIER[TransitionEasing.GLIDE_STOP]));
|
|
16448
|
+
registerEase("punch", bezierEase(...EASING_BEZIER[TransitionEasing.PUNCH]));
|
|
16449
|
+
registerEase("appleOut", bezierEase(...EASING_BEZIER[TransitionEasing.APPLE_OUT]));
|
|
16384
16450
|
registerEase("mfNatural", bezierEase(...EASING_BEZIER[TransitionEasing.NATURAL]));
|
|
16385
16451
|
registerEase("mfSlowDown", bezierEase(...EASING_BEZIER[TransitionEasing.SLOW_DOWN]));
|
|
16386
16452
|
registerEase("mfOvershoot", (t) => sampleLinearEase(SAMPLED_EASING_VALUES[TransitionEasing.OVERSHOOT], t));
|
|
@@ -16388,8 +16454,12 @@ registerEase("mfImpulse", (t) => sampleLinearEase(SAMPLED_EASING_VALUES[Transiti
|
|
|
16388
16454
|
registerEase("mfSwing", (t) => sampleLinearEase(SAMPLED_EASING_VALUES[TransitionEasing.SWING], t));
|
|
16389
16455
|
registerEase("mfSmoothOvershoot", (t) => sampleLinearEase(SAMPLED_EASING_VALUES[TransitionEasing.SMOOTH_OVERSHOOT], t));
|
|
16390
16456
|
registerEase("mfAnticipate", (t) => sampleLinearEase(SAMPLED_EASING_VALUES[TransitionEasing.ANTICIPATE], t));
|
|
16457
|
+
function easeNameOf(easingType) {
|
|
16458
|
+
const value = currentEasing(easingType) || TransitionEasing[currentEasingKey(easingType)];
|
|
16459
|
+
return GSAP_EASE_NAMES[value];
|
|
16460
|
+
}
|
|
16391
16461
|
function getGsapEase(easingType) {
|
|
16392
|
-
return
|
|
16462
|
+
return easeNameOf(easingType) || "power2.inOut";
|
|
16393
16463
|
}
|
|
16394
16464
|
function playedEase(easingType) {
|
|
16395
16465
|
return parseEase(getGsapEase(easingType));
|
|
@@ -17235,7 +17305,7 @@ var KEYFRAME_PRESETS = [
|
|
|
17235
17305
|
name: "Button Press",
|
|
17236
17306
|
description: "Presses in, then springs back with an elastic settle",
|
|
17237
17307
|
keyframes: [
|
|
17238
|
-
{ position: 0, easing: TransitionEasing.
|
|
17308
|
+
{ position: 0, easing: TransitionEasing.EASE_IN, properties: { scale: "1", yPercent: "0" } },
|
|
17239
17309
|
{ position: 7, easing: TransitionEasing.ELASTIC_OUT, properties: { scale: "0.9", yPercent: "1.5" } },
|
|
17240
17310
|
{ position: 62, easing: TransitionEasing.LINEAR, properties: { scale: "1", yPercent: "0" } },
|
|
17241
17311
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { scale: "1", yPercent: "0" } }
|
|
@@ -17247,9 +17317,9 @@ var KEYFRAME_PRESETS = [
|
|
|
17247
17317
|
name: "Tap Flash",
|
|
17248
17318
|
description: "Click dip with a brightness pop on release",
|
|
17249
17319
|
keyframes: [
|
|
17250
|
-
{ position: 0, easing: TransitionEasing.
|
|
17320
|
+
{ position: 0, easing: TransitionEasing.EASE_IN, properties: { scale: "1", brightness: "100" } },
|
|
17251
17321
|
{ position: 6, easing: TransitionEasing.BACK_OUT, properties: { scale: "0.93", brightness: "155" } },
|
|
17252
|
-
{ position: 34, easing: TransitionEasing.
|
|
17322
|
+
{ position: 34, easing: TransitionEasing.EASE_OUT, properties: { scale: "1.05", brightness: "100" } },
|
|
17253
17323
|
{ position: 54, easing: TransitionEasing.LINEAR, properties: { scale: "1", brightness: "100" } },
|
|
17254
17324
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { scale: "1", brightness: "100" } }
|
|
17255
17325
|
]
|
|
@@ -17261,9 +17331,9 @@ var KEYFRAME_PRESETS = [
|
|
|
17261
17331
|
name: "Pop Overshoot",
|
|
17262
17332
|
description: "Scales in past its size, dips, then settles",
|
|
17263
17333
|
keyframes: [
|
|
17264
|
-
{ position: 0, easing: TransitionEasing.
|
|
17265
|
-
{ position: 26, easing: TransitionEasing.
|
|
17266
|
-
{ position: 46, easing: TransitionEasing.
|
|
17334
|
+
{ position: 0, easing: TransitionEasing.EASE_OUT, properties: { scale: "0.5", opacity: "0" } },
|
|
17335
|
+
{ position: 26, easing: TransitionEasing.EASE_IN_OUT, properties: { scale: "1.14", opacity: "1" } },
|
|
17336
|
+
{ position: 46, easing: TransitionEasing.EASE_IN_OUT, properties: { scale: "0.97" } },
|
|
17267
17337
|
{ position: 64, easing: TransitionEasing.LINEAR, properties: { scale: "1" } },
|
|
17268
17338
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { scale: "1" } }
|
|
17269
17339
|
]
|
|
@@ -17275,7 +17345,7 @@ var KEYFRAME_PRESETS = [
|
|
|
17275
17345
|
name: "Spring In",
|
|
17276
17346
|
description: "Elastic scale-up entrance with a ringing tail",
|
|
17277
17347
|
keyframes: [
|
|
17278
|
-
{ position: 0, easing: TransitionEasing.
|
|
17348
|
+
{ position: 0, easing: TransitionEasing.EASE_OUT, properties: { scale: "0.35", opacity: "0" } },
|
|
17279
17349
|
{ position: 8, easing: TransitionEasing.ELASTIC_OUT, properties: { scale: "0.62", opacity: "1" } },
|
|
17280
17350
|
{ position: 60, easing: TransitionEasing.LINEAR, properties: { scale: "1" } },
|
|
17281
17351
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { scale: "1" } }
|
|
@@ -17287,12 +17357,12 @@ var KEYFRAME_PRESETS = [
|
|
|
17287
17357
|
name: "Rubber Wobble",
|
|
17288
17358
|
description: "Damped rotation wobble, like a nudged switch",
|
|
17289
17359
|
keyframes: [
|
|
17290
|
-
{ position: 0, easing: TransitionEasing.
|
|
17291
|
-
{ position: 8, easing: TransitionEasing.
|
|
17292
|
-
{ position: 22, easing: TransitionEasing.
|
|
17293
|
-
{ position: 36, easing: TransitionEasing.
|
|
17294
|
-
{ position: 50, easing: TransitionEasing.
|
|
17295
|
-
{ position: 64, easing: TransitionEasing.
|
|
17360
|
+
{ position: 0, easing: TransitionEasing.EASE_OUT, properties: { rotate: "0", scale: "1" } },
|
|
17361
|
+
{ position: 8, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "-9", scale: "1.04" } },
|
|
17362
|
+
{ position: 22, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "6.5", scale: "0.985" } },
|
|
17363
|
+
{ position: 36, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "-4", scale: "1.015" } },
|
|
17364
|
+
{ position: 50, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "2", scale: "0.995" } },
|
|
17365
|
+
{ position: 64, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "-0.8", scale: "1" } },
|
|
17296
17366
|
{ position: 78, easing: TransitionEasing.LINEAR, properties: { rotate: "0", scale: "1" } },
|
|
17297
17367
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { rotate: "0", scale: "1" } }
|
|
17298
17368
|
]
|
|
@@ -17303,9 +17373,9 @@ var KEYFRAME_PRESETS = [
|
|
|
17303
17373
|
name: "Tap Nudge",
|
|
17304
17374
|
description: "Pushed down, lifts on release, drops back",
|
|
17305
17375
|
keyframes: [
|
|
17306
|
-
{ position: 0, easing: TransitionEasing.
|
|
17376
|
+
{ position: 0, easing: TransitionEasing.EASE_IN, properties: { yPercent: "0", scale: "1" } },
|
|
17307
17377
|
{ position: 8, easing: TransitionEasing.BACK_OUT, properties: { yPercent: "2.6", scale: "0.96" } },
|
|
17308
|
-
{ position: 42, easing: TransitionEasing.
|
|
17378
|
+
{ position: 42, easing: TransitionEasing.EASE_IN_OUT, properties: { yPercent: "-1.8", scale: "1.02" } },
|
|
17309
17379
|
{ position: 68, easing: TransitionEasing.LINEAR, properties: { yPercent: "0", scale: "1" } },
|
|
17310
17380
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { yPercent: "0", scale: "1" } }
|
|
17311
17381
|
]
|
|
@@ -17317,11 +17387,11 @@ var KEYFRAME_PRESETS = [
|
|
|
17317
17387
|
name: "Whip Swing",
|
|
17318
17388
|
description: "Flies in on a whip, overshoots and rocks to a stop",
|
|
17319
17389
|
keyframes: [
|
|
17320
|
-
{ position: 0, easing: TransitionEasing.
|
|
17321
|
-
{ position: 26, easing: TransitionEasing.
|
|
17322
|
-
{ position: 44, easing: TransitionEasing.
|
|
17323
|
-
{ position: 60, easing: TransitionEasing.
|
|
17324
|
-
{ position: 74, easing: TransitionEasing.
|
|
17390
|
+
{ position: 0, easing: TransitionEasing.CUBIC_OUT, properties: { xPercent: "-85", rotate: "-24", scale: "0.9", opacity: "0" } },
|
|
17391
|
+
{ position: 26, easing: TransitionEasing.EASE_IN_OUT, properties: { xPercent: "7", rotate: "11", scale: "1.04", opacity: "1" } },
|
|
17392
|
+
{ position: 44, easing: TransitionEasing.EASE_IN_OUT, properties: { xPercent: "-2.5", rotate: "-6", scale: "0.99" } },
|
|
17393
|
+
{ position: 60, easing: TransitionEasing.EASE_IN_OUT, properties: { xPercent: "0.8", rotate: "3", scale: "1" } },
|
|
17394
|
+
{ position: 74, easing: TransitionEasing.EASE_IN_OUT, properties: { xPercent: "0", rotate: "-1.2" } },
|
|
17325
17395
|
{ position: 88, easing: TransitionEasing.LINEAR, properties: { xPercent: "0", rotate: "0" } },
|
|
17326
17396
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { xPercent: "0", rotate: "0" } }
|
|
17327
17397
|
]
|
|
@@ -17344,12 +17414,12 @@ var KEYFRAME_PRESETS = [
|
|
|
17344
17414
|
name: "Jelly Shake",
|
|
17345
17415
|
description: 'Sharp horizontal shake that decays \u2014 reads as "no"',
|
|
17346
17416
|
keyframes: [
|
|
17347
|
-
{ position: 0, easing: TransitionEasing.
|
|
17348
|
-
{ position: 8, easing: TransitionEasing.
|
|
17349
|
-
{ position: 18, easing: TransitionEasing.
|
|
17350
|
-
{ position: 28, easing: TransitionEasing.
|
|
17351
|
-
{ position: 38, easing: TransitionEasing.
|
|
17352
|
-
{ position: 48, easing: TransitionEasing.
|
|
17417
|
+
{ position: 0, easing: TransitionEasing.SINE_IN_OUT, properties: { xPercent: "0", rotate: "0" } },
|
|
17418
|
+
{ position: 8, easing: TransitionEasing.SINE_IN_OUT, properties: { xPercent: "3.2", rotate: "2.5" } },
|
|
17419
|
+
{ position: 18, easing: TransitionEasing.SINE_IN_OUT, properties: { xPercent: "-2.5", rotate: "-2" } },
|
|
17420
|
+
{ position: 28, easing: TransitionEasing.SINE_IN_OUT, properties: { xPercent: "1.7", rotate: "1.3" } },
|
|
17421
|
+
{ position: 38, easing: TransitionEasing.SINE_IN_OUT, properties: { xPercent: "-1.1", rotate: "-0.8" } },
|
|
17422
|
+
{ position: 48, easing: TransitionEasing.SINE_IN_OUT, properties: { xPercent: "0.6", rotate: "0.4" } },
|
|
17353
17423
|
{ position: 58, easing: TransitionEasing.LINEAR, properties: { xPercent: "0", rotate: "0" } },
|
|
17354
17424
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { xPercent: "0", rotate: "0" } }
|
|
17355
17425
|
]
|
|
@@ -17360,15 +17430,15 @@ var KEYFRAME_PRESETS = [
|
|
|
17360
17430
|
name: "Heartbeat",
|
|
17361
17431
|
description: "Double pulse, twice across the clip",
|
|
17362
17432
|
keyframes: [
|
|
17363
|
-
{ position: 0, easing: TransitionEasing.
|
|
17364
|
-
{ position: 10, easing: TransitionEasing.
|
|
17365
|
-
{ position: 20, easing: TransitionEasing.
|
|
17366
|
-
{ position: 28, easing: TransitionEasing.
|
|
17433
|
+
{ position: 0, easing: TransitionEasing.EASE_OUT, properties: { scale: "1" } },
|
|
17434
|
+
{ position: 10, easing: TransitionEasing.EASE_IN, properties: { scale: "1.09" } },
|
|
17435
|
+
{ position: 20, easing: TransitionEasing.EASE_OUT, properties: { scale: "1" } },
|
|
17436
|
+
{ position: 28, easing: TransitionEasing.EASE_IN, properties: { scale: "1.06" } },
|
|
17367
17437
|
{ position: 40, easing: TransitionEasing.LINEAR, properties: { scale: "1" } },
|
|
17368
|
-
{ position: 60, easing: TransitionEasing.
|
|
17369
|
-
{ position: 70, easing: TransitionEasing.
|
|
17370
|
-
{ position: 80, easing: TransitionEasing.
|
|
17371
|
-
{ position: 88, easing: TransitionEasing.
|
|
17438
|
+
{ position: 60, easing: TransitionEasing.EASE_OUT, properties: { scale: "1" } },
|
|
17439
|
+
{ position: 70, easing: TransitionEasing.EASE_IN, properties: { scale: "1.09" } },
|
|
17440
|
+
{ position: 80, easing: TransitionEasing.EASE_OUT, properties: { scale: "1" } },
|
|
17441
|
+
{ position: 88, easing: TransitionEasing.EASE_IN, properties: { scale: "1.06" } },
|
|
17372
17442
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { scale: "1" } }
|
|
17373
17443
|
]
|
|
17374
17444
|
},
|
|
@@ -17379,7 +17449,7 @@ var KEYFRAME_PRESETS = [
|
|
|
17379
17449
|
name: "Impact Punch",
|
|
17380
17450
|
description: "Slams in oversized and blurred, then locks in",
|
|
17381
17451
|
keyframes: [
|
|
17382
|
-
{ position: 0, easing: TransitionEasing.
|
|
17452
|
+
{ position: 0, easing: TransitionEasing.CUBIC_OUT, properties: { scale: "1.65", opacity: "0", blur: "16" } },
|
|
17383
17453
|
{ position: 26, easing: TransitionEasing.BACK_OUT, properties: { scale: "0.97", opacity: "1", blur: "0" } },
|
|
17384
17454
|
{ position: 54, easing: TransitionEasing.LINEAR, properties: { scale: "1" } },
|
|
17385
17455
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { scale: "1" } }
|
|
@@ -17391,11 +17461,11 @@ var KEYFRAME_PRESETS = [
|
|
|
17391
17461
|
name: "Pendulum Swing",
|
|
17392
17462
|
description: "Swings from its top edge and rocks to a stop",
|
|
17393
17463
|
keyframes: [
|
|
17394
|
-
{ position: 0, transformOrigin: "top", easing: TransitionEasing.
|
|
17395
|
-
{ position: 22, easing: TransitionEasing.
|
|
17396
|
-
{ position: 40, easing: TransitionEasing.
|
|
17397
|
-
{ position: 56, easing: TransitionEasing.
|
|
17398
|
-
{ position: 70, easing: TransitionEasing.
|
|
17464
|
+
{ position: 0, transformOrigin: "top", easing: TransitionEasing.EASE_OUT, properties: { rotate: "-22" } },
|
|
17465
|
+
{ position: 22, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "15" } },
|
|
17466
|
+
{ position: 40, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "-9" } },
|
|
17467
|
+
{ position: 56, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "5" } },
|
|
17468
|
+
{ position: 70, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "-2.5" } },
|
|
17399
17469
|
{ position: 84, easing: TransitionEasing.LINEAR, properties: { rotate: "0" } },
|
|
17400
17470
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { rotate: "0" } }
|
|
17401
17471
|
]
|
|
@@ -17543,8 +17613,8 @@ var KEYFRAME_PRESETS = [
|
|
|
17543
17613
|
description: "Keyframed: fired in from the left, overshoots right, one counter-swing, stops",
|
|
17544
17614
|
keyframes: [
|
|
17545
17615
|
{ position: 0, easing: TransitionEasing.EXPO_OUT, properties: { xPercent: "-120" } },
|
|
17546
|
-
{ position: 28, easing: TransitionEasing.
|
|
17547
|
-
{ position: 46, easing: TransitionEasing.
|
|
17616
|
+
{ position: 28, easing: TransitionEasing.EASE_IN_OUT, properties: { xPercent: "10" } },
|
|
17617
|
+
{ position: 46, easing: TransitionEasing.EASE_IN_OUT, properties: { xPercent: "-3" } },
|
|
17548
17618
|
{ position: 60, easing: TransitionEasing.LINEAR, properties: { xPercent: "0" } },
|
|
17549
17619
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { xPercent: "0" } }
|
|
17550
17620
|
]
|
|
@@ -17610,8 +17680,8 @@ var KEYFRAME_PRESETS = [
|
|
|
17610
17680
|
name: "Roll In",
|
|
17611
17681
|
description: "Rolls in from the left like a wheel \u2014 one full rotation matched to the travel",
|
|
17612
17682
|
keyframes: [
|
|
17613
|
-
{ position: 0, easing: TransitionEasing.
|
|
17614
|
-
{ position: 50, easing: TransitionEasing.
|
|
17683
|
+
{ position: 0, easing: TransitionEasing.EASE_OUT, properties: { xPercent: "-120", rotate: "-360" } },
|
|
17684
|
+
{ position: 50, easing: TransitionEasing.EASE_OUT, properties: { xPercent: "0", rotate: "0" } },
|
|
17615
17685
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { xPercent: "0", rotate: "0" } }
|
|
17616
17686
|
]
|
|
17617
17687
|
},
|
|
@@ -17639,9 +17709,9 @@ var KEYFRAME_PRESETS = [
|
|
|
17639
17709
|
name: "Wind-Up Spin",
|
|
17640
17710
|
description: "Anticipation: winds back a little and shrinks, then whips a full turn the other way",
|
|
17641
17711
|
keyframes: [
|
|
17642
|
-
{ position: 0, easing: TransitionEasing.
|
|
17712
|
+
{ position: 0, easing: TransitionEasing.EASE_IN, properties: { rotate: "0", scale: "1" } },
|
|
17643
17713
|
{ position: 18, easing: TransitionEasing.EXPO_OUT, properties: { rotate: "45", scale: "0.82" } },
|
|
17644
|
-
{ position: 60, easing: TransitionEasing.
|
|
17714
|
+
{ position: 60, easing: TransitionEasing.EASE_IN_OUT, properties: { rotate: "-360", scale: "1.06" } },
|
|
17645
17715
|
{ position: 72, easing: TransitionEasing.LINEAR, properties: { rotate: "-360", scale: "1" } },
|
|
17646
17716
|
{ position: 100, easing: TransitionEasing.LINEAR, properties: { rotate: "-360", scale: "1" } }
|
|
17647
17717
|
]
|
|
@@ -21348,7 +21418,7 @@ function compileScript(script, caps, files = /* @__PURE__ */ new Map()) {
|
|
|
21348
21418
|
});
|
|
21349
21419
|
const kf = {};
|
|
21350
21420
|
const drawn = el?.draw !== false ? r3(Math.min(100, 0.9 / (end - start) * 100)) : 0;
|
|
21351
|
-
if (drawn) kf.lineTrimEnd = [{ position: 0, value: "0", easing: "AE Out" }, { position: drawn, value: String(full), easing: "Linear" }];
|
|
21421
|
+
if (drawn) kf.lineTrimEnd = [{ position: 0, value: "0", easing: "AE Out (leave)" }, { position: drawn, value: String(full), easing: "Linear" }];
|
|
21352
21422
|
if (el?.drain) {
|
|
21353
21423
|
const len2 = Math.max(1e-3, end - start);
|
|
21354
21424
|
const [d0, d1] = Array.isArray(el.drain) && el.drain.length === 2 && el.drain.every((v) => Number.isFinite(Number(v))) ? el.drain.map((v) => clamp5(Number(v) / len2 * 100, 0, 100)) : [drawn, 100];
|
|
@@ -21546,7 +21616,7 @@ function compileScript(script, caps, files = /* @__PURE__ */ new Map()) {
|
|
|
21546
21616
|
init_define_import_meta_env();
|
|
21547
21617
|
|
|
21548
21618
|
// ../skills/greenlight-dash/references/video-design.md
|
|
21549
|
-
var video_design_default = "# Motion design that looks made, not generated\n\nWhat makes a video read as designed rather than generated. The rules hold however the video is built \u2014 a project\nthrough the app's API, `project.json` with the engine's CLI, or a scene script \u2014 so read them before the first version\nand check every version against them.\n\n## Story and words\n\n- **One idea per scene**: 3\u20136 scenes of 2\u20133 s for a short video. A scene that says two things says neither.\n- **At most ~8 words on screen at once, held at least 1 s.** People read about 3 words a second; text that leaves\n before it is read is noise.\n- **9:16**: bigger text, stacked vertically, everything in the middle 80 %.\n\n## Hierarchy\n\n- One headline per scene; supporting text much smaller. Hierarchy comes from size and weight, not colour alone.\n- One accent colour and strong contrast.\n- **No text shadows unless the user asks for one.** A shadow under type reads as a stock default and softens the\n letter edges. When text has to read over footage or a busy picture, get the contrast from the design instead: a\n calmer or darker part of the frame, a caption bar (`textBgEnabled`), or a shape behind the text. So no\n `textShadowX` / `textShadowY` / `textShadowBlur` / `textShadowSpread` on a text layer, no `shadow` property in a\n Text Animator and no `longShadow` effect on text. A shadow already in the user's project stays.\n- Keep text inside the middle 80 % of the frame (in a project: |panX| and |panY| \u2264 40): players and feeds crop the\n edges.\n\n## Timing\n\n- Stagger related elements by 0.06\u20130.12 s.\n- **One focal move at a time.** If everything moves, nothing reads: supporting elements move less and later.\n- Shapes and pictures enter in 0.4\u20130.8 s; exits are faster than entrances.\n- A text animation takes at least 0.8\u20131 s over the whole line, first unit in to last unit settled, unless the video\n needs snap (a beat hit, a glitch flick): faster text flashes past before it is read. The arithmetic per kind of\n animation: video-projects.md, Text animation pace.\n\n## Easing by intent\n\n- Entrances: `AE
|
|
21619
|
+
var video_design_default = "# Motion design that looks made, not generated\n\nWhat makes a video read as designed rather than generated. The rules hold however the video is built \u2014 a project\nthrough the app's API, `project.json` with the engine's CLI, or a scene script \u2014 so read them before the first version\nand check every version against them.\n\n## Story and words\n\n- **One idea per scene**: 3\u20136 scenes of 2\u20133 s for a short video. A scene that says two things says neither.\n- **At most ~8 words on screen at once, held at least 1 s.** People read about 3 words a second; text that leaves\n before it is read is noise.\n- **9:16**: bigger text, stacked vertically, everything in the middle 80 %.\n\n## Hierarchy\n\n- One headline per scene; supporting text much smaller. Hierarchy comes from size and weight, not colour alone.\n- One accent colour and strong contrast.\n- **No text shadows unless the user asks for one.** A shadow under type reads as a stock default and softens the\n letter edges. When text has to read over footage or a busy picture, get the contrast from the design instead: a\n calmer or darker part of the frame, a caption bar (`textBgEnabled`), or a shape behind the text. So no\n `textShadowX` / `textShadowY` / `textShadowBlur` / `textShadowSpread` on a text layer, no `shadow` property in a\n Text Animator and no `longShadow` effect on text. A shadow already in the user's project stays.\n- Keep text inside the middle 80 % of the frame (in a project: |panX| and |panY| \u2264 40): players and feeds crop the\n edges.\n\n## Timing\n\n- Stagger related elements by 0.06\u20130.12 s.\n- **One focal move at a time.** If everything moves, nothing reads: supporting elements move less and later.\n- Shapes and pictures enter in 0.4\u20130.8 s; exits are faster than entrances.\n- A text animation takes at least 0.8\u20131 s over the whole line, first unit in to last unit settled, unless the video\n needs snap (a beat hit, a glitch flick): faster text flashes past before it is read. The arithmetic per kind of\n animation: video-projects.md, Text animation pace.\n\n## Easing by intent\n\n- Entrances: `AE In (arrive)`, `Expo Out` or `Power` (fast start, soft landing); UI panels and drawers: `Apple Out`.\n Camera and big moves: `AE Smooth`.\n- Scene changes on the beat, a logo hit, a screen swipe: `Punch` (slow wind-up, hard hit, long tail).\n- A layer that passes through (in, glide, out): `Smooth Glide` with the `glide` expression \u2014 the Glide keyframe\n presets build it (video-keyframes.md).\n- Playful arrivals: `Back Out` or `Overshoot`; a real spring: the `spring` expression (Snappy for buttons, icons and\n pop-ins, Gentle for mascots, big cards and the camera). Exits: `Ease In` or `AE Out (leave)`.\n- `Linear` only for constant motion: tickers, rotation, progress along a path.\n\n## Text animation\n\n- Animate words or letters, never a whole line at once \u2014 the text presets do this.\n- One family per video. Calm presets for lines and captions: Glide Text (`glide-text`), Classic Fade Up\n (`classic-fade-up`), Classic Rise (Mask) (`classic-rise-mask`); Focus Type (`focus-type`) for a title.\n- Punchy presets that tilt or overshoot \u2014 Swing Pop (`swing-pop`), Whip (`whip`), Letter Vortex (`letter-vortex`) \u2014\n only on 1\u20133 words when the video wants energy. On a longer caption they read cheap.\n- Glide Continuous (`glide-continuous`) and Glide Soft Stop (`glide-soft-stop`) never let the text rest: use them\n only when the user asks for drifting text.\n- On a coloured card, pick a preset without a colour band (Classic Rise (Mask), Classic Fade Up): a band's colour can\n clash with the card.\n\n## Transitions and camera\n\n- Vary two or three kinds of transition across a video: one kind everywhere looks like a template, a new one at\n every cut looks random.\n- Camera moves are slow and small unless they are the point. Fast motion looks best at 60 fps with motion blur.\n- A real 3D camera earns its place on one or two moments, not every scene: a zoom onto the one thing a scene is about\n (a number, the button a screen recording clicks; 1.3\u20132\xD7, then back out), or a slow orbit or push that shows depth.\n- Depth needs layers at different distances: a soft shape or picture far behind, the words at the front. Depth of\n field reads only then; keep the words sharp.\n- Keep an orbit in front of flat layers (within about \xB170\xB0): text turned further goes edge-on, then mirrored.\n\n## Sound\n\n- A soft whoosh on each transition and on the first headline is a good base. `data-1` or `selection-data-click` for\n UI-like pops, `cinematic-transition-13` for one big reveal.\n\n## What to check in every version\n\nLook at real frames across the video (a contact sheet) before the user sees it \u2014 the JSON doesn't show these:\nblank or empty frames, overlapping or cut-off text, text too small or gone too fast, nothing moving or everything\nmoving at once, weak hierarchy, clashing colours. Fix them and look again; two rounds are usually enough.\n";
|
|
21550
21620
|
|
|
21551
21621
|
// src/motionEngine/sceneScriptGuide.js
|
|
21552
21622
|
var PREFERRED = {
|
|
@@ -21615,7 +21685,7 @@ matte, masks, particles, 3D) goes on from \`project.json\`: SKILL.md, "Beyond th
|
|
|
21615
21685
|
\`startAt\` (s into the file) and \`volume\` (0\u2013100, default muted). No entrance unless you set \`enter\`.
|
|
21616
21686
|
- **Keyframes on any element** \u2014 your own motion: \`"keyframes": { "x": [[0, -400], [0.8, 0, "Smooth Glide"]], "scale": [[0, 0.9], [2, 1.05]] }\`
|
|
21617
21687
|
\u2014 tracks x, y (px offsets from \`at\`), scale, rotate (deg), opacity (0\u20131); each key [seconds into the element, value, easing of the
|
|
21618
|
-
segment after it \u2014 Smooth Glide, AE Smooth, Expo Out, Back Out, Elastic, Linear \u2026]. They replace an entrance's keys on the same track;
|
|
21688
|
+
segment after it \u2014 Smooth Glide, AE Smooth, Expo Out, Power, Punch, Apple Out, Back Out, Elastic, Linear \u2026]. They replace an entrance's keys on the same track;
|
|
21619
21689
|
one key holds that value for the whole element.
|
|
21620
21690
|
- **Every element**: \`start\` / \`end\` (s within its scene; default: staggered 0.12 s, to the scene's end), \`enter\` / \`exit\` (keyframe presets, \`direction\` up | down | left | right
|
|
21621
21691
|
for directional ones), \`effects\`: [{ "id", "params"? }], \`sound\` (played at its start), \`id\`, \`label\` (its name in the page's options), \`opacity\` (0\u20131),
|