@hyperframes/studio 0.8.14 → 0.8.16
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-iAIHATIw.js +459 -0
- package/dist/assets/{index-BtYWYq1P.js → index-Cf-mbMRL.js} +1 -1
- package/dist/assets/{index-6x3VcnTA.js → index-D8o3ZIo2.js} +163 -163
- package/dist/assets/{index-Bem14CzG.js → index-YmetcS6L.js} +1 -1
- package/dist/index.d.ts +8 -12
- package/dist/index.html +1 -1
- package/dist/index.js +24 -6
- package/dist/index.js.map +1 -1
- package/package.json +7 -7
- package/src/components/sidebar/AudioRow.tsx +13 -2
- package/src/hooks/useDomSelection.test.ts +48 -0
- package/src/hooks/useDomSelection.ts +26 -82
- package/src/hooks/useDomSelectionTypes.ts +82 -0
- package/src/hooks/usePanelLayout.test.ts +38 -0
- package/src/hooks/usePanelLayout.ts +21 -6
- package/src/player/lib/playbackTypes.ts +3 -12
- package/src/player/lib/runtimeProtocol.test.ts +1 -0
- package/dist/assets/hyperframes-player-OIfv_7Ae.js +0 -459
|
@@ -1 +1 @@
|
|
|
1
|
-
import{g as P}from"./index-
|
|
1
|
+
import{g as P}from"./index-D8o3ZIo2.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={},w;function k(){if(w)return v;w=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 g=e[o+x]-t,_=r.some(function(h){if(h.interval===g)return h.count+=1});_||r.push({interval:g,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,b;function q(){return b||(b=1,p=k().default),p}var m=q();const A=P(m),D=j({__proto__:null,default:A},[m]);export{D as i};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as react from 'react';
|
|
3
3
|
import { ReactNode, RefObject } from 'react';
|
|
4
|
+
import { RuntimeTimelineClipIdentity } from '@hyperframes/core';
|
|
4
5
|
import { GsapAnimation, PropertyGroupName } from '@hyperframes/core/gsap-parser';
|
|
5
6
|
import * as zustand from 'zustand';
|
|
6
7
|
import { MusicBeatAnalysis } from '@hyperframes/core/beats';
|
|
@@ -47,23 +48,18 @@ interface BeatEditState {
|
|
|
47
48
|
removed: number[];
|
|
48
49
|
}
|
|
49
50
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
51
|
+
/**
|
|
52
|
+
* Shared type definitions for the timeline playback subsystem.
|
|
53
|
+
* Kept in a separate module so adapter, DOM, and hook modules can all import
|
|
54
|
+
* from here without creating circular dependencies.
|
|
55
|
+
*/
|
|
56
|
+
|
|
57
|
+
interface ClipManifestClip extends RuntimeTimelineClipIdentity {
|
|
56
58
|
zIndex?: number;
|
|
57
59
|
stackingContextId?: string | null;
|
|
58
|
-
kind: "video" | "audio" | "image" | "element" | "composition";
|
|
59
|
-
tagName: string | null;
|
|
60
|
-
compositionId: string | null;
|
|
61
60
|
compositionAncestors?: string[];
|
|
62
|
-
parentCompositionId: string | null;
|
|
63
|
-
compositionSrc: string | null;
|
|
64
61
|
playbackStart?: number;
|
|
65
62
|
playbackRate?: number;
|
|
66
|
-
assetUrl: string | null;
|
|
67
63
|
}
|
|
68
64
|
|
|
69
65
|
type TimelineTimeDisplayMode = "time" | "frame";
|
package/dist/index.html
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
|
|
6
6
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
7
7
|
<title>HyperFrames Studio</title>
|
|
8
|
-
<script type="module" crossorigin src="/assets/index-
|
|
8
|
+
<script type="module" crossorigin src="/assets/index-D8o3ZIo2.js"></script>
|
|
9
9
|
<link rel="stylesheet" crossorigin href="/assets/index-yGhfxxoL.css">
|
|
10
10
|
</head>
|
|
11
11
|
<body>
|
package/dist/index.js
CHANGED
|
@@ -62300,9 +62300,13 @@ function usePanelLayout(initialState2) {
|
|
|
62300
62300
|
const [rightPanelTab, setRightPanelTab] = useState100(
|
|
62301
62301
|
initialState2?.rightPanelTab ?? "design"
|
|
62302
62302
|
);
|
|
62303
|
+
const rightPanelTabRef = useRef110(rightPanelTab);
|
|
62304
|
+
rightPanelTabRef.current = rightPanelTab;
|
|
62303
62305
|
const [rightInspectorPanes, setRightInspectorPanes] = useState100(
|
|
62304
62306
|
() => getInitialRightInspectorPanes(initialState2?.rightPanelTab)
|
|
62305
62307
|
);
|
|
62308
|
+
const rightInspectorPanesRef = useRef110(rightInspectorPanes);
|
|
62309
|
+
rightInspectorPanesRef.current = rightInspectorPanes;
|
|
62306
62310
|
const [autoCollapseOverride, setAutoCollapseOverride] = useState100(NO_OVERRIDE);
|
|
62307
62311
|
useEffect90(() => {
|
|
62308
62312
|
if (typeof window === "undefined") return;
|
|
@@ -62361,7 +62365,9 @@ function usePanelLayout(initialState2) {
|
|
|
62361
62365
|
}, []);
|
|
62362
62366
|
const setRightCollapsedWithOverride = useCallback84((collapsed) => {
|
|
62363
62367
|
setRightCollapsed(collapsed);
|
|
62364
|
-
if (!collapsed)
|
|
62368
|
+
if (!collapsed) {
|
|
62369
|
+
setAutoCollapseOverride((prev) => prev.right ? prev : { ...prev, right: true });
|
|
62370
|
+
}
|
|
62365
62371
|
}, []);
|
|
62366
62372
|
const handlePanelResizeStart = useCallback84((side, e) => {
|
|
62367
62373
|
e.preventDefault();
|
|
@@ -62388,10 +62394,13 @@ function usePanelLayout(initialState2) {
|
|
|
62388
62394
|
}, [commitPanelWidth]);
|
|
62389
62395
|
const trackedSetRightPanelTab = useCallback84(
|
|
62390
62396
|
(tab) => {
|
|
62397
|
+
const paneAlreadySelected = tab !== "design" && tab !== "layers" ? true : STUDIO_FLAT_INSPECTOR_ENABLED ? rightInspectorPanesRef.current[tab] && !rightInspectorPanesRef.current[tab === "design" ? "layers" : "design"] : rightInspectorPanesRef.current[tab];
|
|
62398
|
+
if (rightPanelTabRef.current === tab && paneAlreadySelected) return;
|
|
62399
|
+
rightPanelTabRef.current = tab;
|
|
62391
62400
|
if (tab === "design" || tab === "layers") {
|
|
62392
|
-
|
|
62393
|
-
|
|
62394
|
-
);
|
|
62401
|
+
const nextPanes = STUDIO_FLAT_INSPECTOR_ENABLED ? { design: tab === "design", layers: tab === "layers" } : { ...rightInspectorPanesRef.current, [tab]: true };
|
|
62402
|
+
rightInspectorPanesRef.current = nextPanes;
|
|
62403
|
+
setRightInspectorPanes(nextPanes);
|
|
62395
62404
|
}
|
|
62396
62405
|
setRightPanelTab(tab);
|
|
62397
62406
|
trackStudioEvent("tab_switch", { panel: "right_panel", tab });
|
|
@@ -65960,6 +65969,14 @@ function useDomSelection({
|
|
|
65960
65969
|
const isAdditiveSelection = Boolean(options?.additive);
|
|
65961
65970
|
const currentSelection = domEditSelectionRef.current;
|
|
65962
65971
|
const previousGroup = domEditGroupSelectionsRef.current;
|
|
65972
|
+
const isRepeatedSingleSelection = !isAdditiveSelection && !options?.preserveGroup && previousGroup.length === 1 && domEditSelectionsTargetSame(currentSelection, selection) && domEditSelectionsTargetSame(previousGroup[0], selection);
|
|
65973
|
+
if (isRepeatedSingleSelection) {
|
|
65974
|
+
if (options?.revealPanel !== false) {
|
|
65975
|
+
setRightCollapsed(false);
|
|
65976
|
+
if (rightPanelTabRef.current !== "variables") setRightPanelTab("design");
|
|
65977
|
+
}
|
|
65978
|
+
return;
|
|
65979
|
+
}
|
|
65963
65980
|
const currentGroup = isAdditiveSelection ? seedDomEditGroupWithSelection(previousGroup, currentSelection) : previousGroup;
|
|
65964
65981
|
const wasInGroup = domEditSelectionInGroup(currentGroup, selection);
|
|
65965
65982
|
const nextGroup = options?.preserveGroup ? replaceDomEditGroupSelection(currentGroup, selection) : isAdditiveSelection ? toggleDomEditGroupSelection(currentGroup, selection) : [selection];
|
|
@@ -77037,6 +77054,7 @@ var FILTER_ORDER = ["audio", "images", "video", "fonts"];
|
|
|
77037
77054
|
|
|
77038
77055
|
// src/components/sidebar/AudioRow.tsx
|
|
77039
77056
|
import { useState as useState122, useRef as useRef150, useEffect as useEffect114, useCallback as useCallback144 } from "react";
|
|
77057
|
+
import { classifyWebAudioMediaRoute } from "@hyperframes/core/runtime/web-audio-route";
|
|
77040
77058
|
|
|
77041
77059
|
// src/components/sidebar/AssetContextMenu.tsx
|
|
77042
77060
|
import { useCallback as useCallback143, useEffect as useEffect113, useLayoutEffect as useLayoutEffect8, useRef as useRef149, useState as useState121 } from "react";
|
|
@@ -77417,14 +77435,14 @@ function AudioRow({
|
|
|
77417
77435
|
setPlaying(false);
|
|
77418
77436
|
cancelAnimationFrame(animRef.current);
|
|
77419
77437
|
};
|
|
77438
|
+
el.src = serveUrl;
|
|
77420
77439
|
audioRef.current = el;
|
|
77421
77440
|
const analyser = analyserRef.current;
|
|
77422
|
-
if (analyser) {
|
|
77441
|
+
if (analyser && classifyWebAudioMediaRoute(el).kind === "web-audio") {
|
|
77423
77442
|
sourceRef.current = actxRef.current.createMediaElementSource(el);
|
|
77424
77443
|
sourceRef.current.connect(analyser);
|
|
77425
77444
|
analyser.connect(actxRef.current.destination);
|
|
77426
77445
|
}
|
|
77427
|
-
el.src = serveUrl;
|
|
77428
77446
|
}
|
|
77429
77447
|
if (actxRef.current.state === "suspended") await actxRef.current.resume();
|
|
77430
77448
|
audioRef.current.currentTime = 0;
|