@hyperframes/studio 0.8.75 → 0.8.77
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-BSDTJ9EF.js +464 -0
- package/dist/assets/{index-BlUYw1MB.js → index-2GgHjQq-.js} +163 -163
- package/dist/assets/{index-0w6iIlwZ.css → index-BWJqxeaH.css} +1 -1
- package/dist/assets/{index-BiFKcNjs.js → index-CsFCRdMo.js} +1 -1
- package/dist/assets/{index-HjexPsny.js → index-DcxWQ7Za.js} +1 -1
- package/dist/{chunk-7BP32G62.js → chunk-5VANA2TG.js} +12 -1
- package/dist/chunk-5VANA2TG.js.map +1 -0
- package/dist/{domEditingLayers-UKMVYXT6.js → domEditingLayers-IGPLTI5E.js} +4 -2
- package/dist/index.d.ts +34 -69
- package/dist/index.html +2 -2
- package/dist/index.js +5287 -5277
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +7 -7
- package/src/components/StudioRightPanels.types.ts +0 -2
- package/src/components/editor/DomEditOverlay.test.ts +5 -0
- package/src/components/editor/LayersPanel.tsx +3 -14
- package/src/components/editor/PreviewOverlayProvider.test.tsx +6 -1
- package/src/components/editor/domEditing.ts +1 -0
- package/src/components/editor/domEditingElement.ts +13 -0
- package/src/components/editor/domEditingLayers.test.ts +27 -0
- package/src/components/editor/domEditingLayers.ts +9 -0
- package/src/components/editor/gsapLivePreview.test.ts +63 -0
- package/src/components/editor/gsapLivePreview.ts +2 -14
- package/src/components/editor/offCanvasIndicatorRefresh.test.tsx +57 -35
- package/src/components/editor/overlayFrameLoop.test.ts +16 -0
- package/src/components/editor/overlayFrameLoop.ts +11 -0
- package/src/components/editor/propertyPanelHelpers.ts +4 -6
- package/src/components/editor/usePreviewCompositionRect.test.tsx +6 -1
- package/src/components/nle/NLEPreview.test.ts +202 -22
- package/src/components/nle/NLEPreview.tsx +65 -46
- package/src/components/nle/PreviewPoster.tsx +99 -0
- package/src/components/nle/PreviewZoomOverlay.tsx +111 -0
- package/src/components/nle/previewZoom.test.ts +42 -0
- package/src/components/nle/previewZoom.ts +33 -0
- package/src/components/nle/useCanvasZOrderTimelineMirror.test.tsx +30 -49
- package/src/components/panels/VariablesPanel.tsx +0 -2
- package/src/components/sidebar/CompositionsTab.drag.test.tsx +5 -1
- package/src/components/sidebar/CompositionsTab.rootBadge.test.tsx +14 -0
- package/src/components/sidebar/CompositionsTab.test.ts +4 -6
- package/src/components/sidebar/CompositionsTab.tsx +28 -21
- package/src/components/studioColorGradingScope.ts +0 -3
- package/src/hooks/domEditDeleteMembers.ts +0 -2
- package/src/hooks/gsapScriptCommitTypes.ts +0 -2
- package/src/hooks/keyframeCacheAstLoad.test.ts +31 -1
- package/src/hooks/keyframeCacheAstLoad.ts +2 -1
- package/src/hooks/timelineAudioGroupCreate.ts +0 -1
- package/src/hooks/timelineEditingHelpers.ts +0 -3
- package/src/hooks/timelineTimingSync.ts +0 -1
- package/src/hooks/timelineTrackVisibility.ts +0 -1
- package/src/hooks/useBlockHandlers.ts +0 -2
- package/src/hooks/useClipboard.test.ts +69 -10
- package/src/hooks/useClipboard.ts +28 -19
- package/src/hooks/useDomEditCommits.test.tsx +0 -1
- package/src/hooks/useDomEditCommits.ts +0 -4
- package/src/hooks/useDomEditWiring.ts +1 -3
- package/src/hooks/useEditHistoryActions.test.tsx +31 -14
- package/src/hooks/useEditHistoryActions.ts +12 -7
- package/src/hooks/useEditorSave.ts +0 -3
- package/src/hooks/useElementLifecycleOps.ts +0 -1
- package/src/hooks/useEnableKeyframes.test.ts +9 -1
- package/src/hooks/useFileManager.ts +0 -2
- package/src/hooks/useGestureRecording.test.tsx +1 -1
- package/src/hooks/useGestureRecording.ts +6 -10
- package/src/hooks/useGroupCommits.ts +0 -1
- package/src/hooks/useGsapScriptCommits.ts +0 -1
- package/src/hooks/useGsapTweenCache.element.test.tsx +39 -0
- package/src/hooks/useGsapTweenCache.ts +5 -13
- package/src/hooks/useLintModal.test.tsx +34 -1
- package/src/hooks/useLintModal.ts +32 -30
- package/src/hooks/usePersistentEditHistory.test.ts +221 -315
- package/src/hooks/usePersistentEditHistory.ts +155 -342
- package/src/hooks/usePopulateKeyframeCacheForFile.test.tsx +2 -0
- package/src/hooks/usePreviewPersistence.ts +0 -2
- package/src/hooks/useProjectCompositionVariables.ts +1 -3
- package/src/hooks/useRazorSplit.history.test.tsx +46 -67
- package/src/hooks/useRazorSplit.test.ts +17 -47
- package/src/hooks/useRenderClipContent.test.ts +29 -0
- package/src/hooks/useRenderClipContent.ts +6 -3
- package/src/hooks/useSdkSession.lifecycle.test.tsx +34 -4
- package/src/hooks/useSdkSession.ts +8 -2
- package/src/hooks/useSlideshowPersist.ts +0 -2
- package/src/hooks/useStudioContextValue.ts +6 -1
- package/src/hooks/useTimelineAssetDropOps.ts +0 -1
- package/src/hooks/useTimelineDeleteOps.ts +0 -1
- package/src/hooks/useTimelineEditing.test.tsx +0 -1
- package/src/hooks/useTimelineEditingTypes.ts +0 -2
- package/src/hostMount.test.tsx +53 -22
- package/src/main.tsx +3 -0
- package/src/player/components/CompositionThumbnail.tsx +14 -0
- package/src/player/components/Player.test.ts +49 -0
- package/src/player/components/Player.tsx +21 -7
- package/src/player/components/timelineClipDragCommit.test.ts +7 -39
- package/src/player/hooks/timelineDomBinding.test.ts +50 -0
- package/src/player/hooks/timelineSyncHydration.test.ts +25 -1
- package/src/player/hooks/timelineSyncHydration.ts +3 -3
- package/src/player/hooks/useShadowPreviewReload.ts +1 -0
- package/src/player/hooks/useTimelinePlayer.play.test.ts +120 -0
- package/src/player/hooks/useTimelinePlayer.ts +1 -0
- package/src/player/hooks/useTimelineSyncCallbacks.ts +2 -0
- package/src/player/lib/automationStoreSync.test.ts +24 -0
- package/src/player/lib/automationStoreSync.ts +3 -9
- package/src/player/lib/playbackScrub.ts +1 -1
- package/src/player/lib/timelineDOM.test.ts +28 -0
- package/src/player/lib/timelineDOM.ts +4 -2
- package/src/player/lib/timelineElementHelpers.ts +78 -9
- package/src/player/lib/timelineIframeHelpers.test.ts +49 -5
- package/src/player/lib/timelineIframeHelpers.ts +13 -12
- package/src/player/store/playerStore.test.ts +35 -1
- package/src/player/store/playerStore.ts +29 -0
- package/src/player/store/readinessSlice.ts +34 -6
- package/src/utils/blockInstaller.ts +0 -3
- package/src/utils/previewPrefetch.test.ts +22 -0
- package/src/utils/previewPrefetch.ts +14 -0
- package/src/utils/razorSplitTransaction.test.ts +0 -1
- package/src/utils/razorSplitTransaction.ts +1 -1
- package/src/utils/sdkEditTransaction.ts +0 -3
- package/src/utils/studioFileHistory.test.ts +0 -9
- package/src/utils/studioFileHistory.ts +1 -5
- package/src/utils/studioUiPreferences.test.ts +9 -3
- package/src/utils/studioUiPreferences.ts +0 -20
- package/src/utils/timelineCompositionInsert.ts +0 -1
- package/dist/assets/hyperframes-player-WbBVbWuO.js +0 -464
- package/dist/chunk-7BP32G62.js.map +0 -1
- package/src/hooks/usePersistentEditHistory.projectOwnership.test.tsx +0 -60
- package/src/utils/editHistory.test.ts +0 -534
- package/src/utils/editHistory.ts +0 -236
- package/src/utils/editHistoryStorage.test.ts +0 -37
- package/src/utils/editHistoryStorage.ts +0 -99
- /package/dist/{domEditingLayers-UKMVYXT6.js.map → domEditingLayers-IGPLTI5E.js.map} +0 -0
|
@@ -11,7 +11,6 @@ describe("saveProjectFilesWithHistory", () => {
|
|
|
11
11
|
await saveProjectFilesWithHistory({
|
|
12
12
|
projectId: "project-1",
|
|
13
13
|
label: "Move layer",
|
|
14
|
-
kind: "manual",
|
|
15
14
|
files: { "index.html": "after" },
|
|
16
15
|
readFile: async (path) => reads[path],
|
|
17
16
|
writeFile: async (path, content) => {
|
|
@@ -23,7 +22,6 @@ describe("saveProjectFilesWithHistory", () => {
|
|
|
23
22
|
expect(writes).toEqual({ "index.html": "after" });
|
|
24
23
|
expect(recordEdit).toHaveBeenCalledWith({
|
|
25
24
|
label: "Move layer",
|
|
26
|
-
kind: "manual",
|
|
27
25
|
coalesceKey: undefined,
|
|
28
26
|
files: { "index.html": { before: "before", after: "after" } },
|
|
29
27
|
});
|
|
@@ -42,7 +40,6 @@ describe("saveProjectFilesWithHistory", () => {
|
|
|
42
40
|
await saveProjectFilesWithHistory({
|
|
43
41
|
projectId: "project-1",
|
|
44
42
|
label: "Delete timeline clip",
|
|
45
|
-
kind: "timeline",
|
|
46
43
|
files: { "index.html": "removed+shrunk" },
|
|
47
44
|
readFile: async () => "original",
|
|
48
45
|
diskContent: { "index.html": "removed" },
|
|
@@ -67,7 +64,6 @@ describe("saveProjectFilesWithHistory", () => {
|
|
|
67
64
|
await saveProjectFilesWithHistory({
|
|
68
65
|
projectId: "project-1",
|
|
69
66
|
label: "Move layer",
|
|
70
|
-
kind: "manual",
|
|
71
67
|
files: { "index.html": "after" },
|
|
72
68
|
readFile: async () => "before",
|
|
73
69
|
writeFile: async (path, _content, expectedContent) => {
|
|
@@ -85,7 +81,6 @@ describe("saveProjectFilesWithHistory", () => {
|
|
|
85
81
|
const changedPaths = await saveProjectFilesWithHistory({
|
|
86
82
|
projectId: "project-1",
|
|
87
83
|
label: "Edit layer",
|
|
88
|
-
kind: "manual",
|
|
89
84
|
files: { "index.html": "same" },
|
|
90
85
|
readFile: async () => "same",
|
|
91
86
|
writeFile,
|
|
@@ -109,7 +104,6 @@ describe("saveProjectFilesWithHistory", () => {
|
|
|
109
104
|
saveProjectFilesWithHistory({
|
|
110
105
|
projectId: "project-1",
|
|
111
106
|
label: "Move layer",
|
|
112
|
-
kind: "manual",
|
|
113
107
|
files: {
|
|
114
108
|
"index.html": "index-after",
|
|
115
109
|
"scene.html": "scene-after",
|
|
@@ -144,7 +138,6 @@ describe("saveProjectFilesWithHistory", () => {
|
|
|
144
138
|
saveProjectFilesWithHistory({
|
|
145
139
|
projectId: "project-1",
|
|
146
140
|
label: "Move layer",
|
|
147
|
-
kind: "manual",
|
|
148
141
|
files: {
|
|
149
142
|
"index.html": "index-after",
|
|
150
143
|
"scene.html": "scene-after",
|
|
@@ -178,7 +171,6 @@ describe("saveProjectFilesWithHistory", () => {
|
|
|
178
171
|
saveProjectFilesWithHistory({
|
|
179
172
|
projectId: "project-1",
|
|
180
173
|
label: "Move layer",
|
|
181
|
-
kind: "manual",
|
|
182
174
|
files: {
|
|
183
175
|
"index.html": "index-after",
|
|
184
176
|
"scene.html": "scene-after",
|
|
@@ -223,7 +215,6 @@ describe("saveProjectFilesWithHistory", () => {
|
|
|
223
215
|
const save = saveProjectFilesWithHistory({
|
|
224
216
|
projectId: "project-1",
|
|
225
217
|
label: "Edit source",
|
|
226
|
-
kind: "source",
|
|
227
218
|
files: { "index.html": "editor-after" },
|
|
228
219
|
readFile,
|
|
229
220
|
writeFile,
|
|
@@ -1,12 +1,10 @@
|
|
|
1
1
|
import { buildProjectApiPath } from "./projectRouting";
|
|
2
2
|
import type { MutableRefObject } from "react";
|
|
3
|
-
import type { EditHistoryKind } from "./editHistory";
|
|
4
3
|
import { serializeStudioFileMutations } from "./studioFileMutationCoordinator";
|
|
5
4
|
import { createStudioSaveHttpError } from "./studioSaveDiagnostics";
|
|
6
5
|
|
|
7
6
|
export interface RecordEditInput {
|
|
8
7
|
label: string;
|
|
9
|
-
kind: EditHistoryKind;
|
|
10
8
|
coalesceKey?: string;
|
|
11
9
|
coalesceMs?: number;
|
|
12
10
|
files: Record<string, { before: string; after: string }>;
|
|
@@ -27,7 +25,6 @@ type ProjectFileWriter = (path: string, content: string, expectedContent?: strin
|
|
|
27
25
|
interface SaveProjectFilesWithHistoryInput {
|
|
28
26
|
projectId: string;
|
|
29
27
|
label: string;
|
|
30
|
-
kind: EditHistoryKind;
|
|
31
28
|
coalesceKey?: string;
|
|
32
29
|
coalesceMs?: number;
|
|
33
30
|
files: Record<string, string>;
|
|
@@ -65,7 +62,6 @@ export async function readProjectFileContent(pid: string, path: string): Promise
|
|
|
65
62
|
|
|
66
63
|
export async function saveProjectFilesWithHistory({
|
|
67
64
|
label,
|
|
68
|
-
kind,
|
|
69
65
|
coalesceKey,
|
|
70
66
|
coalesceMs,
|
|
71
67
|
files,
|
|
@@ -93,7 +89,7 @@ export async function saveProjectFilesWithHistory({
|
|
|
93
89
|
writtenPaths.push(path);
|
|
94
90
|
}
|
|
95
91
|
|
|
96
|
-
await recordEdit({ label,
|
|
92
|
+
await recordEdit({ label, coalesceKey, coalesceMs, files: snapshots });
|
|
97
93
|
} catch (error) {
|
|
98
94
|
try {
|
|
99
95
|
for (const path of writtenPaths.reverse()) {
|
|
@@ -23,14 +23,12 @@ describe("studio UI preferences", () => {
|
|
|
23
23
|
writeStudioUiPreferences({ playbackRate: 1.5 }, storage);
|
|
24
24
|
writeStudioUiPreferences({ audioMuted: true }, storage);
|
|
25
25
|
writeStudioUiPreferences({ audioVolume: 0.4 }, storage);
|
|
26
|
-
writeStudioUiPreferences({ previewZoom: { zoomPercent: 160, panX: -20, panY: 12 } }, storage);
|
|
27
26
|
|
|
28
27
|
expect(readStudioUiPreferences(storage)).toEqual({
|
|
29
28
|
timelineVisible: false,
|
|
30
29
|
playbackRate: 1.5,
|
|
31
30
|
audioMuted: true,
|
|
32
31
|
audioVolume: 0.4,
|
|
33
|
-
previewZoom: { zoomPercent: 160, panX: -20, panY: 12 },
|
|
34
32
|
});
|
|
35
33
|
});
|
|
36
34
|
|
|
@@ -49,6 +47,15 @@ describe("studio UI preferences", () => {
|
|
|
49
47
|
expect(readStudioUiPreferences(storage)).toEqual({});
|
|
50
48
|
});
|
|
51
49
|
|
|
50
|
+
it("keeps no preview zoom, so every project opens at Fit", () => {
|
|
51
|
+
const storage = createStorage();
|
|
52
|
+
storage.setItem(
|
|
53
|
+
"hf-studio-ui-preferences",
|
|
54
|
+
JSON.stringify({ previewZoom: { zoomPercent: 245, panX: 0, panY: 0 } }),
|
|
55
|
+
);
|
|
56
|
+
expect(readStudioUiPreferences(storage)).toEqual({});
|
|
57
|
+
});
|
|
58
|
+
|
|
52
59
|
it("ignores malformed stored values", () => {
|
|
53
60
|
const storage = createStorage();
|
|
54
61
|
storage.setItem(
|
|
@@ -58,7 +65,6 @@ describe("studio UI preferences", () => {
|
|
|
58
65
|
playbackRate: Number.NaN,
|
|
59
66
|
audioMuted: "false",
|
|
60
67
|
audioVolume: 2,
|
|
61
|
-
previewZoom: { zoomPercent: 150, panX: 0, panY: "bad" },
|
|
62
68
|
}),
|
|
63
69
|
);
|
|
64
70
|
|
|
@@ -1,12 +1,6 @@
|
|
|
1
1
|
import type { SerializedDockview } from "dockview-react";
|
|
2
2
|
import { parseDockLayout } from "../components/dock/dockLayoutSchema";
|
|
3
3
|
|
|
4
|
-
export interface StoredPreviewZoomState {
|
|
5
|
-
zoomPercent: number;
|
|
6
|
-
panX: number;
|
|
7
|
-
panY: number;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
4
|
export type TimelineTimeDisplayMode = "time" | "frame";
|
|
11
5
|
|
|
12
6
|
export interface StudioUiPreferences {
|
|
@@ -15,7 +9,6 @@ export interface StudioUiPreferences {
|
|
|
15
9
|
audioMuted?: boolean;
|
|
16
10
|
audioVolume?: number;
|
|
17
11
|
thumbnailMode?: "adaptive" | "hidden";
|
|
18
|
-
previewZoom?: StoredPreviewZoomState;
|
|
19
12
|
recentBlocks?: string[];
|
|
20
13
|
snapEnabled?: boolean;
|
|
21
14
|
gridVisible?: boolean;
|
|
@@ -103,19 +96,6 @@ function readStorage(storage: Storage | null, key: string): StudioUiPreferences
|
|
|
103
96
|
} else if (typeof parsed.thumbnailsEnabled === "boolean") {
|
|
104
97
|
preferences.thumbnailMode = parsed.thumbnailsEnabled ? "adaptive" : "hidden";
|
|
105
98
|
}
|
|
106
|
-
if (isRecord(parsed.previewZoom)) {
|
|
107
|
-
const { zoomPercent, panX, panY } = parsed.previewZoom;
|
|
108
|
-
if (
|
|
109
|
-
typeof zoomPercent === "number" &&
|
|
110
|
-
Number.isFinite(zoomPercent) &&
|
|
111
|
-
typeof panX === "number" &&
|
|
112
|
-
Number.isFinite(panX) &&
|
|
113
|
-
typeof panY === "number" &&
|
|
114
|
-
Number.isFinite(panY)
|
|
115
|
-
) {
|
|
116
|
-
preferences.previewZoom = { zoomPercent, panX, panY };
|
|
117
|
-
}
|
|
118
|
-
}
|
|
119
99
|
if (Array.isArray(parsed.recentBlocks)) {
|
|
120
100
|
preferences.recentBlocks = parsed.recentBlocks.filter(
|
|
121
101
|
(v: unknown): v is string => typeof v === "string",
|
|
@@ -70,7 +70,6 @@ export async function commitTimelineCompositionInsertion(input: {
|
|
|
70
70
|
try {
|
|
71
71
|
await input.recordEdit({
|
|
72
72
|
label: "Add composition to timeline",
|
|
73
|
-
kind: "timeline",
|
|
74
73
|
files: { [input.targetPath]: { before: result.before, after: result.after } },
|
|
75
74
|
});
|
|
76
75
|
} catch (error) {
|