@hyperframes/studio 0.8.141 → 0.8.142
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/assets/{hyperframes-player-5Vx2AiUz.js → hyperframes-player-sAsRuV73.js} +1 -1
- package/dist/assets/{index-C0thd4eM.js → index-B-wffzRH.js} +126 -126
- package/dist/assets/{index-BAnh7cSQ.js → index-D3Vij9t1.js} +1 -1
- package/dist/assets/{index-P8fgj_Xa.js → index-D5q2_7Gw.js} +1 -1
- package/dist/index.html +1 -1
- package/dist/index.js +26 -15
- package/dist/index.js.map +1 -1
- package/package.json +8 -8
- package/src/components/TimelineToolbar.test.tsx +1 -1
- package/src/player/components/timelineLayout.test.ts +3 -3
- package/src/player/components/timelineZoomInput.test.ts +27 -6
- package/src/player/components/timelineZoomInput.ts +5 -1
- package/src/player/components/useTimelinePlayhead.test.tsx +90 -4
- package/src/player/components/useTimelinePlayhead.ts +18 -3
- package/src/player/components/useTimelineProviderState.tsx +1 -0
- package/src/player/lib/timelineViewportBudgets.test.ts +1 -1
- package/src/player/lib/timelineViewportBudgets.ts +1 -1
- package/src/utils/timelineAssetDrop.ts +1 -15
|
@@ -1 +1 @@
|
|
|
1
|
-
import{m as P}from"./index-
|
|
1
|
+
import{m as P}from"./index-B-wffzRH.js";function j(c,d){for(var s=0;s<d.length;s++){const a=d[s];if(typeof a!="string"&&!Array.isArray(a)){for(const i in a)if(i!=="default"&&!(i in c)){const l=Object.getOwnPropertyDescriptor(a,i);l&&Object.defineProperty(c,i,l.get?l:{enumerable:!0,get:()=>a[i]})}}}return Object.freeze(Object.defineProperty(c,Symbol.toStringTag,{value:"Module"}))}var v={},m;function k(){if(m)return v;m=1,Object.defineProperty(v,"__esModule",{value:!0}),v.default=d;var c=window.OfflineAudioContext||window.webkitOfflineAudioContext;function d(e){var r=a(e);return r.start(0),[i,y,O(e.sampleRate),s].reduce(function(t,o){return o(t)},r.buffer.getChannelData(0))}function s(e){return e.sort(function(r,t){return t.count-r.count}).splice(0,5)[0].tempo}function a(e){var r=e.length,t=e.numberOfChannels,o=e.sampleRate,n=new c(t,r,o),u=n.createBufferSource();u.buffer=e;var f=n.createBiquadFilter();return f.type="lowpass",u.connect(f),f.connect(n.destination),u}function i(e){for(var r=[],t=.9,o=.3,n=15;r.length<n&&t>=o;)r=l(e,t),t-=.05;if(r.length<n)throw new Error("Could not find enough samples for a reliable detection.");return r}function l(e,r){for(var t=[],o=0,n=e.length;o<n;o+=1)e[o]>r&&(t.push(o),o+=1e4);return t}function y(e){var r=[];return e.forEach(function(t,o){for(var n=function(x){var h=e[o+x]-t,_=r.some(function(g){if(g.interval===h)return g.count+=1});_||r.push({interval:h,count:1})},u=0;u<10;u+=1)n(u)}),r}function O(e){return function(r){var t=[];return r.forEach(function(o){if(o.interval!==0){for(var n=60/(o.interval/e);n<90;)n*=2;for(;n>180;)n/=2;n=Math.round(n);var u=t.some(function(f){if(f.tempo===n)return f.count+=o.count});u||t.push({tempo:n,count:o.count})}}),t}}return v}var p,w;function q(){return w||(w=1,p=k().default),p}var b=q();const A=P(b),D=j({__proto__:null,default:A},[b]);export{D as i};
|
package/dist/index.html
CHANGED
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
document.documentElement.dataset.theme = "paper";
|
|
15
15
|
}
|
|
16
16
|
</script>
|
|
17
|
-
<script type="module" crossorigin src="/assets/index-
|
|
17
|
+
<script type="module" crossorigin src="/assets/index-B-wffzRH.js"></script>
|
|
18
18
|
<link rel="stylesheet" crossorigin href="/assets/index-CVd4O6eH.css">
|
|
19
19
|
</head>
|
|
20
20
|
<body>
|
package/dist/index.js
CHANGED
|
@@ -2272,7 +2272,7 @@ var MAX_VISIBLE_THUMBNAIL_FRAMES = Math.ceil(3840 / (66 * (16 / 9)));
|
|
|
2272
2272
|
var TIMELINE_VIEWPORT_BUDGETS = Object.freeze({
|
|
2273
2273
|
directScrollSafetyPx: 8e6,
|
|
2274
2274
|
rowOverscanPerSide: 2,
|
|
2275
|
-
timeOverscanViewportRatio: 0.
|
|
2275
|
+
timeOverscanViewportRatio: 0.25,
|
|
2276
2276
|
maxMountedRows: 64,
|
|
2277
2277
|
maxMountedClipRoots: 512,
|
|
2278
2278
|
maxMountedClipRootsPerRow: 128,
|
|
@@ -2486,7 +2486,10 @@ function commitPreview() {
|
|
|
2486
2486
|
);
|
|
2487
2487
|
}
|
|
2488
2488
|
preview = null;
|
|
2489
|
-
if (Math.abs(view.scroll.scrollLeft - left) >= 0.5)
|
|
2489
|
+
if (Math.abs(view.scroll.scrollLeft - left) >= 0.5) {
|
|
2490
|
+
view.scroll.scrollLeft = left;
|
|
2491
|
+
flushSync(() => view.publishScroll(view.scroll));
|
|
2492
|
+
}
|
|
2490
2493
|
clearScaled(view.scroll);
|
|
2491
2494
|
emitPreview();
|
|
2492
2495
|
}
|
|
@@ -3359,6 +3362,7 @@ function revealPlayheadScrollLeft(scroll, playheadX, contentOrigin, from = scrol
|
|
|
3359
3362
|
function useTimelinePlayhead({
|
|
3360
3363
|
playheadRef,
|
|
3361
3364
|
scrollRef,
|
|
3365
|
+
syncScrollViewport,
|
|
3362
3366
|
ppsRef,
|
|
3363
3367
|
durationRef,
|
|
3364
3368
|
isDragging,
|
|
@@ -3395,6 +3399,7 @@ function useTimelinePlayhead({
|
|
|
3395
3399
|
const maxScrollLeft2 = Math.max(0, scroll.scrollWidth - scroll.clientWidth);
|
|
3396
3400
|
const left = anchor2.time * pps + contentOrigin - anchor2.x;
|
|
3397
3401
|
scroll.scrollLeft = Math.max(0, Math.min(maxScrollLeft2, left));
|
|
3402
|
+
syncScrollViewport(scroll);
|
|
3398
3403
|
return;
|
|
3399
3404
|
}
|
|
3400
3405
|
const zoomed = userZoomCount !== prevZoomCount;
|
|
@@ -3413,7 +3418,8 @@ function useTimelinePlayhead({
|
|
|
3413
3418
|
const maxScrollLeft = Math.max(0, scroll.scrollWidth - scroll.clientWidth);
|
|
3414
3419
|
const anchored = Math.max(0, Math.min(maxScrollLeft, nextScrollLeft));
|
|
3415
3420
|
scroll.scrollLeft = zoomed ? revealPlayheadScrollLeft(scroll, contentOrigin + time * pps, contentOrigin, anchored) : anchored;
|
|
3416
|
-
|
|
3421
|
+
syncScrollViewport(scroll);
|
|
3422
|
+
}, [pps, userZoomCount, scrollRef, durationRef, contentOrigin, syncScrollViewport]);
|
|
3417
3423
|
const syncPlayheadPosition = useCallback4(
|
|
3418
3424
|
(time) => {
|
|
3419
3425
|
if (!playheadRef.current || durationRef.current <= 0) return;
|
|
@@ -3553,14 +3559,25 @@ function useTimelinePlayhead({
|
|
|
3553
3559
|
scroll.addEventListener("wheel", handlePinchWheel, { passive: false, capture: true });
|
|
3554
3560
|
scroll.addEventListener("pointerdown", settleTimelineZoom, { capture: true });
|
|
3555
3561
|
scroll.addEventListener("scroll", redrawTimelineZoomPreview, { passive: true });
|
|
3556
|
-
const unregisterZoomViewport = registerTimelineZoomViewport({
|
|
3562
|
+
const unregisterZoomViewport = registerTimelineZoomViewport({
|
|
3563
|
+
scroll,
|
|
3564
|
+
contentOrigin,
|
|
3565
|
+
publishScroll: syncScrollViewport
|
|
3566
|
+
});
|
|
3557
3567
|
return () => {
|
|
3558
3568
|
scroll.removeEventListener("wheel", handlePinchWheel, { capture: true });
|
|
3559
3569
|
scroll.removeEventListener("pointerdown", settleTimelineZoom, { capture: true });
|
|
3560
3570
|
scroll.removeEventListener("scroll", redrawTimelineZoomPreview);
|
|
3561
3571
|
unregisterZoomViewport();
|
|
3562
3572
|
};
|
|
3563
|
-
}, [
|
|
3573
|
+
}, [
|
|
3574
|
+
handlePinchWheel,
|
|
3575
|
+
scrollRef,
|
|
3576
|
+
timelineReady,
|
|
3577
|
+
elementsLength,
|
|
3578
|
+
contentOrigin,
|
|
3579
|
+
syncScrollViewport
|
|
3580
|
+
]);
|
|
3564
3581
|
return { seekFromX, autoScrollDuringDrag, dragScrollRaf };
|
|
3565
3582
|
}
|
|
3566
3583
|
|
|
@@ -3579,6 +3596,9 @@ function useTimelineZoom() {
|
|
|
3579
3596
|
// src/player/components/timelineDragDrop.ts
|
|
3580
3597
|
import { useCallback as useCallback5, useEffect as useEffect6, useRef as useRef6, useState as useState4 } from "react";
|
|
3581
3598
|
|
|
3599
|
+
// src/utils/timelineAssetDrop.ts
|
|
3600
|
+
import { buildTimelineAssetId } from "@hyperframes/core/timeline-asset-id";
|
|
3601
|
+
|
|
3582
3602
|
// src/utils/mediaTypes.ts
|
|
3583
3603
|
var IMAGE_EXTS = ["jpg", "jpeg", "png", "gif", "webp", "avif", "svg", "ico"];
|
|
3584
3604
|
var VIDEO_EXTS = ["mp4", "webm", "mov", "m4v"];
|
|
@@ -3636,16 +3656,6 @@ function getTimelineAssetKind(assetPath) {
|
|
|
3636
3656
|
if (AUDIO_EXT.test(assetPath)) return "audio";
|
|
3637
3657
|
return null;
|
|
3638
3658
|
}
|
|
3639
|
-
function buildTimelineAssetId(assetPath, existingIds) {
|
|
3640
|
-
const baseName = assetPath.split("/").pop() ?? "asset";
|
|
3641
|
-
const normalized = baseName.replace(/\.[^.]+$/, "").replace(/[^a-zA-Z0-9_-]+/g, "_").replace(/^_+|_+$/g, "").toLowerCase();
|
|
3642
|
-
const baseId = normalized || "asset";
|
|
3643
|
-
const ids = new Set(existingIds);
|
|
3644
|
-
if (!ids.has(baseId)) return baseId;
|
|
3645
|
-
let suffix = 2;
|
|
3646
|
-
while (ids.has(`${baseId}_${suffix}`)) suffix += 1;
|
|
3647
|
-
return `${baseId}_${suffix}`;
|
|
3648
|
-
}
|
|
3649
3659
|
function resolveTimelineAssetSrc(targetPath, assetPath) {
|
|
3650
3660
|
const targetDir = targetPath.includes("/") ? targetPath.slice(0, targetPath.lastIndexOf("/")) : "";
|
|
3651
3661
|
if (!targetDir) return assetPath;
|
|
@@ -14852,6 +14862,7 @@ function useTimelineProviderState({
|
|
|
14852
14862
|
const { seekFromX, autoScrollDuringDrag, dragScrollRaf } = useTimelinePlayhead({
|
|
14853
14863
|
playheadRef,
|
|
14854
14864
|
scrollRef,
|
|
14865
|
+
syncScrollViewport,
|
|
14855
14866
|
ppsRef,
|
|
14856
14867
|
durationRef,
|
|
14857
14868
|
isDragging,
|