@hyperframes/parsers 0.7.71 → 0.7.73

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.
@@ -87,14 +87,18 @@ var SUPPORTED_EASES = [
87
87
  "bounce.in",
88
88
  "bounce.out",
89
89
  "bounce.inOut",
90
+ "circ.inOut",
90
91
  "expo.in",
91
92
  "expo.out",
92
93
  "expo.inOut",
94
+ "elastic.out(1,0.3)",
95
+ "elastic.inOut(1,0.3)",
93
96
  "spring-gentle",
94
97
  "spring-bouncy",
95
98
  "spring-stiff",
96
99
  "spring-wobbly",
97
100
  "spring-heavy",
101
+ "hold",
98
102
  "steps(1)"
99
103
  ];
100
104
 
@@ -322,6 +326,34 @@ function gsapAnimationsToKeyframes(animations, elementStartTime, options) {
322
326
  import * as recast from "recast";
323
327
  import { parse as babelParse } from "@babel/parser";
324
328
 
329
+ // src/gsapObjectArrayTiming.ts
330
+ var roundPercentage = (percentage) => Math.round(percentage * 10) / 10;
331
+ function getObjectArrayKeyframeTiming(durations) {
332
+ const hasAuthoredDuration = durations.some((duration) => duration !== void 0);
333
+ if (hasAuthoredDuration) {
334
+ if (!durations.every(
335
+ (duration) => typeof duration === "number" && Number.isFinite(duration) && duration > 0
336
+ )) {
337
+ return null;
338
+ }
339
+ const totalDuration = durations.reduce((sum, duration) => sum + duration, 0);
340
+ let cumulative = 0;
341
+ return {
342
+ percentages: durations.map((duration) => {
343
+ cumulative += duration;
344
+ return roundPercentage(cumulative / totalDuration * 100);
345
+ }),
346
+ totalDuration
347
+ };
348
+ }
349
+ const lastIndex = durations.length - 1;
350
+ return {
351
+ percentages: durations.map(
352
+ (_, index) => lastIndex > 0 ? roundPercentage(index / lastIndex * 100) : 0
353
+ )
354
+ };
355
+ }
356
+
325
357
  // src/springEase.ts
326
358
  var SPRING_PRESETS = [
327
359
  { name: "spring-gentle", label: "Gentle", mass: 1, stiffness: 100, damping: 15 },
@@ -1362,6 +1394,8 @@ function parsePercentageKeyframes(node, scope, source) {
1362
1394
  for (const [k, v] of Object.entries(record)) {
1363
1395
  if (k === "ease" && typeof v === "string") {
1364
1396
  kfEase = v;
1397
+ } else if (k === "duration") {
1398
+ continue;
1365
1399
  } else if (typeof v === "number" || typeof v === "string") {
1366
1400
  properties[k] = v;
1367
1401
  }
@@ -1386,13 +1420,13 @@ function computeKeyframesTotalDuration(varsNode, scope, source) {
1386
1420
  (p) => (p.key?.name ?? p.key?.value) === "keyframes"
1387
1421
  )?.value;
1388
1422
  if (!kfNode || kfNode.type !== "ArrayExpression") return void 0;
1389
- let total = 0;
1423
+ const durations = [];
1390
1424
  for (const el of kfNode.elements ?? []) {
1391
1425
  if (!el || el.type !== "ObjectExpression") continue;
1392
1426
  const r = objectExpressionToRecord(el, scope, source);
1393
- if (typeof r.duration === "number") total += r.duration;
1427
+ durations.push(r.duration);
1394
1428
  }
1395
- return total > 0 ? total : void 0;
1429
+ return getObjectArrayKeyframeTiming(durations)?.totalDuration;
1396
1430
  }
1397
1431
  function parseObjectArrayKeyframes(node, scope, source) {
1398
1432
  const elements = node.elements ?? [];
@@ -1404,7 +1438,7 @@ function parseObjectArrayKeyframes(node, scope, source) {
1404
1438
  let duration;
1405
1439
  let ease;
1406
1440
  for (const [k, v] of Object.entries(record)) {
1407
- if (k === "duration" && typeof v === "number") {
1441
+ if (k === "duration") {
1408
1442
  duration = v;
1409
1443
  } else if (k === "ease" && typeof v === "string") {
1410
1444
  ease = v;
@@ -1414,31 +1448,13 @@ function parseObjectArrayKeyframes(node, scope, source) {
1414
1448
  }
1415
1449
  raw.push({ properties, duration, ease });
1416
1450
  }
1417
- const totalDuration = raw.reduce((sum, r) => sum + (r.duration ?? 0), 0);
1418
- const keyframes = [];
1419
- if (totalDuration > 0) {
1420
- let cumulative = 0;
1421
- for (const entry of raw) {
1422
- cumulative += entry.duration ?? 0;
1423
- const percentage = Math.round(cumulative / totalDuration * 100);
1424
- keyframes.push({
1425
- percentage,
1426
- properties: entry.properties,
1427
- ...entry.ease ? { ease: entry.ease } : {}
1428
- });
1429
- }
1430
- } else {
1431
- for (let i = 0; i < raw.length; i++) {
1432
- const entry = raw[i];
1433
- if (!entry) continue;
1434
- const percentage = raw.length > 1 ? Math.round(i / (raw.length - 1) * 100) : 0;
1435
- keyframes.push({
1436
- percentage,
1437
- properties: entry.properties,
1438
- ...entry.ease ? { ease: entry.ease } : {}
1439
- });
1440
- }
1441
- }
1451
+ const timing = getObjectArrayKeyframeTiming(raw.map((entry) => entry.duration));
1452
+ if (!timing) return void 0;
1453
+ const keyframes = raw.map((entry, index) => ({
1454
+ percentage: timing.percentages[index],
1455
+ properties: entry.properties,
1456
+ ...entry.ease ? { ease: entry.ease } : {}
1457
+ }));
1442
1458
  return { format: "object-array", keyframes };
1443
1459
  }
1444
1460
  function parseSimpleArrayKeyframes(node, scope) {