hyperframes 0.8.145 → 0.8.147

package/dist/studio/chunk-NZPJUZKT.js

@@ -1,1538 +0,0 @@
-import {
-  HyperframesLoader
-} from "./chunk-Y2OHHNM2.js";
-import {
-  buildProjectApiPath,
-  splitTimelineElementKey,
-  studioApiFetch
-} from "./chunk-6JY3MTIX.js";
-
-// src/player/lib/time.ts
-var STUDIO_PREVIEW_FPS = 30;
-var clampToDuration = (time, duration) => Math.max(0, duration > 0 ? Math.min(duration, time) : time);
-function formatTime(time) {
-  if (!Number.isFinite(time) || time < 0) return "00:00";
-  const mins = Math.floor(time / 60);
-  const secs = Math.floor(time % 60);
-  return `${mins.toString().padStart(2, "0")}:${secs.toString().padStart(2, "0")}`;
-}
-function secondsToFrame(time, fps = STUDIO_PREVIEW_FPS) {
-  if (!Number.isFinite(time) || time <= 0) return 0;
-  if (!Number.isFinite(fps) || fps <= 0) return 0;
-  return Math.round(time * fps);
-}
-function frameToSeconds(frame, fps = STUDIO_PREVIEW_FPS) {
-  if (!Number.isFinite(frame) || frame <= 0) return 0;
-  if (!Number.isFinite(fps) || fps <= 0) return 0;
-  return frame / fps;
-}
-function stepFrameTime(time, deltaFrames, fps = STUDIO_PREVIEW_FPS) {
-  const currentFrame = secondsToFrame(time, fps);
-  const nextFrame = Math.max(0, currentFrame + deltaFrames);
-  return frameToSeconds(nextFrame, fps);
-}
-function formatFrameTime(time, duration, fps = STUDIO_PREVIEW_FPS) {
-  const currentFrame = secondsToFrame(time, fps);
-  const totalFrames = secondsToFrame(duration, fps);
-  return `${currentFrame}f / ${totalFrames}f`;
-}
-
-// src/player/store/liveTime.ts
-var timeListeners = /* @__PURE__ */ new Set();
-var latestTime = 0;
-var seekCount = 0;
-var liveTime = {
-  notify: (time) => {
-    latestTime = time;
-    timeListeners.forEach((listener) => listener(time));
-  },
-  notifySeek: (time) => {
-    seekCount += 1;
-    liveTime.notify(time);
-  },
-  seekCount: () => seekCount,
-  latest: () => latestTime,
-  subscribe: (listener) => {
-    timeListeners.add(listener);
-    return () => timeListeners.delete(listener);
-  }
-};
-
-// src/player/store/playerStore.ts
-import { create } from "zustand";
-
-// src/player/store/playerStoreDevHandle.ts
-function isDevBuild() {
-  try {
-    return import.meta.env.DEV === true;
-  } catch {
-    return false;
-  }
-}
-function attachPlayerStoreDevHandle(store) {
-  if (!isDevBuild() || typeof window === "undefined") return;
-  window.__playerStore = store;
-}
-
-// src/player/store/playerStoreSelection.ts
-function nextSelectionSet(current, id, preserveSet) {
-  if (preserveSet) return id && current.has(id) ? new Set(current) : /* @__PURE__ */ new Set();
-  return id ? /* @__PURE__ */ new Set([id]) : /* @__PURE__ */ new Set();
-}
-function revealTargetsSelection(request, id) {
-  if (!request || id === null) return false;
-  return request.elementKey === splitTimelineElementKey(id).domId;
-}
-
-// src/components/dock/panelRegistry.ts
-var PANEL_IDS = [
-  "preview",
-  "timeline",
-  "compositions",
-  "assets",
-  "code",
-  "catalog",
-  "design",
-  "layers",
-  "renders",
-  "variables",
-  "slideshow"
-];
-var PANEL_DEFINITIONS = {
-  preview: {
-    title: "Preview",
-    zone: "center",
-    reopen: { near: "timeline", direction: "above" },
-    keepMounted: true
-  },
-  timeline: {
-    title: "Timeline",
-    zone: "center",
-    reopen: { near: "preview", direction: "below" },
-    keepMounted: true
-  },
-  compositions: {
-    title: "Compositions",
-    zone: "left",
-    reopen: { near: "preview", direction: "left" }
-  },
-  assets: { title: "Assets", zone: "left", reopen: { near: "compositions", direction: "within" } },
-  code: { title: "Code", zone: "left", reopen: { near: "compositions", direction: "within" } },
-  catalog: {
-    title: "Catalog",
-    zone: "left",
-    reopen: { near: "compositions", direction: "within" }
-  },
-  design: { title: "Design", zone: "right", reopen: { near: "preview", direction: "right" } },
-  layers: { title: "Layers", zone: "right", reopen: { near: "design", direction: "within" } },
-  renders: { title: "Renders", zone: "right", reopen: { near: "design", direction: "within" } },
-  variables: { title: "Variables", zone: "right", reopen: { near: "design", direction: "within" } },
-  slideshow: { title: "Slideshow", zone: "right", reopen: { near: "design", direction: "within" } }
-};
-function isPanelId(value) {
-  return typeof value === "string" && PANEL_IDS.includes(value);
-}
-function panelsInZone(zone) {
-  return PANEL_IDS.filter((id) => PANEL_DEFINITIONS[id].zone === zone);
-}
-
-// src/components/dock/dockLayoutSchema.ts
-var DOCK_PANEL_COMPONENT = "panel";
-function isRecord(value) {
-  return typeof value === "object" && value !== null && !Array.isArray(value);
-}
-function collectLeafViews(node, into) {
-  if (!isRecord(node)) return false;
-  if (node.type === "leaf") {
-    if (!isRecord(node.data) || !Array.isArray(node.data.views)) return false;
-    into.push(...node.data.views);
-    return true;
-  }
-  if (node.type === "branch") {
-    return Array.isArray(node.data) && node.data.every((child) => collectLeafViews(child, into));
-  }
-  return false;
-}
-function hasGridShape(grid) {
-  const oriented = grid.orientation === "HORIZONTAL" || grid.orientation === "VERTICAL";
-  return oriented && typeof grid.width === "number" && typeof grid.height === "number";
-}
-function panelsAreRegistered(panels, allowed) {
-  const ids = Object.keys(panels);
-  return ids.length > 0 && ids.every((id) => {
-    const state = panels[id];
-    return isPanelId(id) && allowed.includes(id) && isRecord(state) && state.id === id && state.contentComponent === DOCK_PANEL_COMPONENT;
-  });
-}
-function collectFloatingViews(floating, into) {
-  if (floating === void 0) return true;
-  if (!Array.isArray(floating)) return false;
-  return floating.every((group) => {
-    if (!isRecord(group) || !isRecord(group.data) || !Array.isArray(group.data.views)) return false;
-    into.push(...group.data.views);
-    return true;
-  });
-}
-function parseDockLayout(value, allowed = PANEL_IDS) {
-  if (!isRecord(value) || !isRecord(value.grid) || !isRecord(value.panels)) return null;
-  const { grid, panels } = value;
-  if (!hasGridShape(grid) || !panelsAreRegistered(panels, allowed)) return null;
-  const views = [];
-  if (!collectLeafViews(grid.root, views)) return null;
-  if (!collectFloatingViews(value.floatingGroups, views)) return null;
-  const everyViewIsAPanel = views.every((id) => typeof id === "string" && id in panels);
-  const everyPanelIsPlaced = Object.keys(panels).every((id) => views.includes(id));
-  return everyViewIsAPanel && everyPanelIsPlaced ? value : null;
-}
-
-// src/utils/studioUiPreferences.ts
-var STUDIO_UI_PREFERENCES_KEY = "hf-studio-ui-preferences";
-function isRecord2(value) {
-  return typeof value === "object" && value !== null;
-}
-function getBrowserStorage() {
-  if (typeof window === "undefined") return null;
-  try {
-    return window.localStorage;
-  } catch {
-    return null;
-  }
-}
-function storageKeyFor(projectId, key) {
-  return projectId ? `${key}:${projectId}` : key;
-}
-function readStorage(storage, key) {
-  if (!storage) return {};
-  try {
-    const raw = storage.getItem(key);
-    if (!raw) return {};
-    const parsed = JSON.parse(raw);
-    if (!isRecord2(parsed)) return {};
-    const preferences = {};
-    if (typeof parsed.timelineVisible === "boolean") {
-      preferences.timelineVisible = parsed.timelineVisible;
-    }
-    if (typeof parsed.playbackRate === "number" && Number.isFinite(parsed.playbackRate)) {
-      preferences.playbackRate = parsed.playbackRate;
-    }
-    if (typeof parsed.audioMuted === "boolean") {
-      preferences.audioMuted = parsed.audioMuted;
-    }
-    if (typeof parsed.audioVolume === "number" && Number.isFinite(parsed.audioVolume) && parsed.audioVolume >= 0 && parsed.audioVolume <= 1) {
-      preferences.audioVolume = parsed.audioVolume;
-    }
-    if (parsed.thumbnailMode === "adaptive" || parsed.thumbnailMode === "hidden") {
-      preferences.thumbnailMode = parsed.thumbnailMode;
-    } else if (typeof parsed.thumbnailsEnabled === "boolean") {
-      preferences.thumbnailMode = parsed.thumbnailsEnabled ? "adaptive" : "hidden";
-    }
-    if (Array.isArray(parsed.recentBlocks)) {
-      preferences.recentBlocks = parsed.recentBlocks.filter(
-        (v) => typeof v === "string"
-      );
-    }
-    if (typeof parsed.snapEnabled === "boolean") {
-      preferences.snapEnabled = parsed.snapEnabled;
-    }
-    if (typeof parsed.gridVisible === "boolean") {
-      preferences.gridVisible = parsed.gridVisible;
-    }
-    if (typeof parsed.rulerVisible === "boolean") {
-      preferences.rulerVisible = parsed.rulerVisible;
-    }
-    if (typeof parsed.safeMarginsVisible === "boolean") {
-      preferences.safeMarginsVisible = parsed.safeMarginsVisible;
-    }
-    if (typeof parsed.gridSpacing === "number" && Number.isFinite(parsed.gridSpacing)) {
-      preferences.gridSpacing = parsed.gridSpacing;
-    }
-    if (typeof parsed.snapToGrid === "boolean") {
-      preferences.snapToGrid = parsed.snapToGrid;
-    }
-    if (typeof parsed.timelineSnapEnabled === "boolean") {
-      preferences.timelineSnapEnabled = parsed.timelineSnapEnabled;
-    }
-    if (typeof parsed.audioMetersVisible === "boolean") {
-      preferences.audioMetersVisible = parsed.audioMetersVisible;
-    }
-    if (typeof parsed.rippleEditEnabled === "boolean") {
-      preferences.rippleEditEnabled = parsed.rippleEditEnabled;
-    }
-    if (parsed.theme === "light" || parsed.theme === "dark") preferences.theme = parsed.theme;
-    if (parsed.timeDisplayMode === "time" || parsed.timeDisplayMode === "frame") {
-      preferences.timeDisplayMode = parsed.timeDisplayMode;
-    }
-    if (parsed.timelineZoomMode === "fit" || parsed.timelineZoomMode === "manual") {
-      preferences.timelineZoomMode = parsed.timelineZoomMode;
-    }
-    if (typeof parsed.timelineManualZoomPercent === "number" && Number.isFinite(parsed.timelineManualZoomPercent)) {
-      preferences.timelineManualZoomPercent = parsed.timelineManualZoomPercent;
-    }
-    if (typeof parsed.agentToolsEnabled === "boolean") {
-      preferences.agentToolsEnabled = parsed.agentToolsEnabled;
-    }
-    if (typeof parsed.linkedSelectionEnabled === "boolean") {
-      preferences.linkedSelectionEnabled = parsed.linkedSelectionEnabled;
-    }
-    if (typeof parsed.syncIndicatorsVisible === "boolean") {
-      preferences.syncIndicatorsVisible = parsed.syncIndicatorsVisible;
-    }
-    const dockLayout = parseDockLayout(parsed.dockLayout);
-    if (dockLayout) preferences.dockLayout = dockLayout;
-    return preferences;
-  } catch {
-    return {};
-  }
-}
-function readStudioUiPreferences(storage = getBrowserStorage(), projectId = null, key = STUDIO_UI_PREFERENCES_KEY) {
-  const scoped = readStorage(storage, storageKeyFor(projectId, key));
-  if (!projectId || Object.keys(scoped).length > 0) return scoped;
-  return readStorage(storage, key);
-}
-function writeStudioUiPreferences(patch, storage = getBrowserStorage(), projectId = null, key = STUDIO_UI_PREFERENCES_KEY) {
-  if (!storage) return;
-  try {
-    const next = {
-      ...readStudioUiPreferences(storage, projectId, key),
-      ...patch
-    };
-    storage.setItem(storageKeyFor(projectId, key), JSON.stringify(next));
-  } catch {
-  }
-}
-
-// src/player/components/timelineZoom.ts
-var MIN_TIMELINE_ZOOM_PERCENT = 10;
-var MAX_TIMELINE_FRAME_WIDTH_PX = 48;
-var ZOOM_OUT_FACTOR = 0.5;
-var ZOOM_IN_FACTOR = 2;
-var PINCH_ZOOM_SENSITIVITY = 0.014;
-function getMaxTimelineZoomPercent(fitPixelsPerSecond) {
-  if (!Number.isFinite(fitPixelsPerSecond) || fitPixelsPerSecond <= 0) return 100;
-  const frameLevelPixelsPerSecond = STUDIO_PREVIEW_FPS * MAX_TIMELINE_FRAME_WIDTH_PX;
-  return Math.max(100, Math.round(frameLevelPixelsPerSecond / fitPixelsPerSecond * 100));
-}
-function clampTimelineZoomPercent(percent, fitPixelsPerSecond) {
-  if (!Number.isFinite(percent)) return 100;
-  const maxZoomPercent = getMaxTimelineZoomPercent(fitPixelsPerSecond);
-  return Math.max(MIN_TIMELINE_ZOOM_PERCENT, Math.min(maxZoomPercent, Math.round(percent)));
-}
-function getTimelineZoomPercent(zoomMode, manualZoomPercent, fitPixelsPerSecond) {
-  return zoomMode === "fit" ? 100 : clampTimelineZoomPercent(manualZoomPercent, fitPixelsPerSecond);
-}
-function computePinnedZoomPercent(currentPixelsPerSecond, fitPixelsPerSecond) {
-  if (!Number.isFinite(currentPixelsPerSecond) || currentPixelsPerSecond <= 0 || !Number.isFinite(fitPixelsPerSecond) || fitPixelsPerSecond <= 0) {
-    return 100;
-  }
-  return clampTimelineZoomPercent(
-    currentPixelsPerSecond / fitPixelsPerSecond * 100,
-    fitPixelsPerSecond
-  );
-}
-function getTimelinePixelsPerSecond(fitPixelsPerSecond, zoomMode, manualZoomPercent) {
-  if (!Number.isFinite(fitPixelsPerSecond) || fitPixelsPerSecond <= 0) return 100;
-  const zoomPercent = getTimelineZoomPercent(zoomMode, manualZoomPercent, fitPixelsPerSecond);
-  return zoomMode === "fit" ? fitPixelsPerSecond : fitPixelsPerSecond * (zoomPercent / 100);
-}
-function getNextTimelineZoomPercent(direction, zoomMode, manualZoomPercent, fitPixelsPerSecond) {
-  const current = getTimelineZoomPercent(zoomMode, manualZoomPercent, fitPixelsPerSecond);
-  const next = direction === "in" ? current * ZOOM_IN_FACTOR : current * ZOOM_OUT_FACTOR;
-  return clampTimelineZoomPercent(next, fitPixelsPerSecond);
-}
-function getPinchTimelineZoomPercent(deltaY, zoomMode, manualZoomPercent, fitPixelsPerSecond) {
-  const current = getTimelineZoomPercent(zoomMode, manualZoomPercent, fitPixelsPerSecond);
-  if (!Number.isFinite(deltaY) || deltaY === 0) return current;
-  return clampTimelineZoomPercent(
-    current * Math.exp(-deltaY * PINCH_ZOOM_SENSITIVITY),
-    fitPixelsPerSecond
-  );
-}
-var LOG_MIN = Math.log(MIN_TIMELINE_ZOOM_PERCENT);
-function timelineZoomPercentToSlider(percent, fitPixelsPerSecond) {
-  const clamped = clampTimelineZoomPercent(percent, fitPixelsPerSecond);
-  const logMax = Math.log(getMaxTimelineZoomPercent(fitPixelsPerSecond));
-  return (Math.log(clamped) - LOG_MIN) / (logMax - LOG_MIN) * 100;
-}
-function timelineSliderToZoomPercent(slider, fitPixelsPerSecond) {
-  const clampedSlider = Math.max(0, Math.min(100, slider));
-  const logMax = Math.log(getMaxTimelineZoomPercent(fitPixelsPerSecond));
-  const logValue = LOG_MIN + clampedSlider / 100 * (logMax - LOG_MIN);
-  return clampTimelineZoomPercent(Math.exp(logValue), fitPixelsPerSecond);
-}
-
-// src/player/store/keyframeSlice.ts
-function isRevealedAudioFxRequestCurrent(request, state) {
-  return request.projectId === state.timelineProjectId && request.sessionEpoch === state.timelineSessionEpoch;
-}
-function isFocusedEaseRequestCurrent(request, state) {
-  return request.projectId === state.timelineProjectId && request.sessionEpoch === state.timelineSessionEpoch && request.elementId === state.selectedElementId;
-}
-function createKeyframeSlice(set, getTimelineSessionIdentity) {
-  return {
-    selectedKeyframes: /* @__PURE__ */ new Set(),
-    toggleSelectedKeyframe: (key) => set((state) => {
-      const next = new Set(state.selectedKeyframes);
-      if (next.has(key)) next.delete(key);
-      else next.add(key);
-      return { selectedKeyframes: next };
-    }),
-    clearSelectedKeyframes: () => set({ selectedKeyframes: /* @__PURE__ */ new Set() }),
-    expandedClipIds: /* @__PURE__ */ new Set(),
-    toggleClipExpanded: (id) => set((state) => {
-      const next = new Set(state.expandedClipIds);
-      if (next.has(id)) next.delete(id);
-      else next.add(id);
-      return { expandedClipIds: next };
-    }),
-    setClipExpanded: (id, expanded) => set((state) => {
-      if (state.expandedClipIds.has(id) === expanded) return state;
-      const next = new Set(state.expandedClipIds);
-      if (expanded) next.add(id);
-      else next.delete(id);
-      return { expandedClipIds: next };
-    }),
-    expandClips: (ids) => set((state) => {
-      if (ids.every((id) => state.expandedClipIds.has(id))) return state;
-      const next = new Set(state.expandedClipIds);
-      for (const id of ids) next.add(id);
-      return { expandedClipIds: next };
-    }),
-    collapsedGroupIds: /* @__PURE__ */ new Set(),
-    toggleGroupExpanded: (id) => set((state) => {
-      const next = new Set(state.collapsedGroupIds);
-      if (next.has(id)) next.delete(id);
-      else next.add(id);
-      return { collapsedGroupIds: next };
-    }),
-    expandedLaneOwnerIds: /* @__PURE__ */ new Set(),
-    toggleLaneOwnerExpanded: (id) => set((state) => {
-      const next = new Set(state.expandedLaneOwnerIds);
-      if (next.has(id)) next.delete(id);
-      else next.add(id);
-      return { expandedLaneOwnerIds: next };
-    }),
-    focusedEaseSegment: null,
-    focusedEaseRequestNonce: 0,
-    setFocusedEaseSegment: (target) => set((state) => {
-      const nonce = state.focusedEaseRequestNonce + 1;
-      const { timelineProjectId, timelineSessionEpoch } = getTimelineSessionIdentity();
-      return {
-        focusedEaseRequestNonce: nonce,
-        focusedEaseSegment: {
-          ...target,
-          projectId: timelineProjectId,
-          sessionEpoch: timelineSessionEpoch,
-          nonce
-        }
-      };
-    }),
-    clearFocusedEaseSegment: (nonce) => set(
-      (state) => state.focusedEaseSegment?.nonce === nonce ? { focusedEaseSegment: null } : state
-    ),
-    revealedAudioFxTarget: null,
-    revealedAudioFxNonce: 0,
-    setRevealedAudioFxTarget: (target) => set((state) => {
-      const nonce = state.revealedAudioFxNonce + 1;
-      const { timelineProjectId, timelineSessionEpoch } = getTimelineSessionIdentity();
-      return {
-        revealedAudioFxNonce: nonce,
-        revealedAudioFxTarget: {
-          ...target,
-          projectId: timelineProjectId,
-          sessionEpoch: timelineSessionEpoch,
-          nonce
-        }
-      };
-    }),
-    clearRevealedAudioFxTarget: (nonce) => set(
-      (state) => state.revealedAudioFxTarget?.nonce === nonce ? { revealedAudioFxTarget: null } : state
-    ),
-    keyframeCache: /* @__PURE__ */ new Map(),
-    setKeyframeCache: (elementId, data) => set((state) => {
-      if (data ? state.keyframeCache.get(elementId) === data : !state.keyframeCache.has(elementId))
-        return state;
-      const next = new Map(state.keyframeCache);
-      if (data) next.set(elementId, data);
-      else next.delete(elementId);
-      return { keyframeCache: next };
-    }),
-    gsapAnimations: /* @__PURE__ */ new Map(),
-    setGsapAnimations: (elementId, animations) => set((state) => {
-      if (animations ? state.gsapAnimations.get(elementId) === animations : !state.gsapAnimations.has(elementId))
-        return state;
-      const next = new Map(state.gsapAnimations);
-      if (animations) next.set(elementId, animations);
-      else next.delete(elementId);
-      return { gsapAnimations: next };
-    })
-  };
-}
-
-// src/player/store/automationSelectionSlice.ts
-function createAutomationSelectionSlice(set) {
-  return {
-    automationSelection: null,
-    setAutomationSelection: (sel) => set({
-      automationSelection: {
-        ...sel,
-        t0: Math.min(sel.t0, sel.t1),
-        t1: Math.max(sel.t0, sel.t1),
-        v0: Math.min(sel.v0, sel.v1),
-        v1: Math.max(sel.v0, sel.v1)
-      }
-    }),
-    clearAutomationSelection: () => set({ automationSelection: null })
-  };
-}
-
-// src/player/store/editingModeSlice.ts
-function createEditingModeSlice(set) {
-  return {
-    motionPathArmed: false,
-    setMotionPathArmed: (armed) => set({ motionPathArmed: armed }),
-    motionPathCreateAvailable: false,
-    setMotionPathCreateAvailable: (available) => set({ motionPathCreateAvailable: available }),
-    autoKeyframeEnabled: true,
-    setAutoKeyframeEnabled: (enabled) => set({ autoKeyframeEnabled: enabled })
-  };
-}
-
-// src/player/store/timelineFocusState.ts
-function createTimelineFocusRequest(id, projectId, sessionEpoch, nonce) {
-  return { id, projectId, sessionEpoch, nonce };
-}
-
-// src/player/lib/thumbnailPolicy.ts
-var rawPolicy = import.meta.env?.VITE_STUDIO_TIMELINE_THUMBNAIL_POLICY;
-var studioThumbnailRuntimePolicy = rawPolicy === "force-hidden" || rawPolicy === "legacy-default" ? rawPolicy : "follow-preference";
-function defaultThumbnailMode(storedMode, policy = studioThumbnailRuntimePolicy) {
-  return storedMode ?? (policy === "legacy-default" ? "hidden" : "adaptive");
-}
-function effectiveThumbnailMode(preferredMode, policy = studioThumbnailRuntimePolicy) {
-  return policy === "force-hidden" ? "hidden" : preferredMode;
-}
-
-// src/player/store/thumbnailSlice.ts
-var EVERY_COMPOSITION = "*";
-function revisionKey(path) {
-  return (path.split(/[?#]/)[0] ?? "").replace(/\\/g, "/").replace(/^\.?\//, "");
-}
-function thumbnailRevisionOf(revisions, compositionPath) {
-  return (revisions[EVERY_COMPOSITION] ?? 0) + (revisions[revisionKey(compositionPath)] ?? 0);
-}
-function createThumbnailSlice(set) {
-  return {
-    thumbnailMode: defaultThumbnailMode(readStudioUiPreferences().thumbnailMode),
-    thumbnailRevisions: {},
-    setThumbnailMode: (mode) => {
-      writeStudioUiPreferences({ thumbnailMode: mode });
-      set({ thumbnailMode: mode });
-    },
-    bumpThumbnailRevisions: (compositions) => set(({ thumbnailRevisions }) => {
-      const next = { ...thumbnailRevisions };
-      for (const path of compositions?.map(revisionKey) ?? [EVERY_COMPOSITION]) {
-        next[path] = (next[path] ?? 0) + 1;
-      }
-      return { thumbnailRevisions: next };
-    })
-  };
-}
-
-// src/player/store/readinessSlice.ts
-import { settleCompositionReadiness } from "@hyperframes/core/composition-readiness";
-var timelineReadyGeneration = 0;
-var loadStepDocs = /* @__PURE__ */ new WeakSet();
-var awaitingLoadStep = null;
-function resetPlaybackReadinessState() {
-  timelineReadyGeneration++;
-  return { timelineReady: false, previewBooted: false };
-}
-function createPlaybackReadinessSlice(set) {
-  const settle = (doc, generation) => settleCompositionReadiness(doc, () => {
-    if (generation === timelineReadyGeneration) set({ timelineReady: true });
-  });
-  return {
-    timelineReady: false,
-    previewBooted: false,
-    markPreviewBooted: () => set({ previewBooted: true }),
-    playLocked: false,
-    setPlayLocked: (locked) => set({ playLocked: locked }),
-    setTimelineReady: (ready) => {
-      timelineReadyGeneration++;
-      set({ timelineReady: ready });
-    },
-    requestTimelineReady: (doc) => {
-      const generation = ++timelineReadyGeneration;
-      if (!doc) return set({ timelineReady: true });
-      if (!loadStepDocs.has(doc)) {
-        awaitingLoadStep = { doc, generation };
-        return;
-      }
-      settle(doc, generation);
-    },
-    markPreviewLoadStep: (doc) => {
-      loadStepDocs.add(doc);
-      if (awaitingLoadStep?.doc !== doc) return;
-      const { generation } = awaitingLoadStep;
-      awaitingLoadStep = null;
-      settle(doc, generation);
-    }
-  };
-}
-
-// src/player/store/rangeSelectionSlice.ts
-function createRangeSelectionSlice() {
-  return { rangeSelection: null };
-}
-
-// src/player/store/timelineResetState.ts
-function createTimelineResetState() {
-  return {
-    isPlaying: false,
-    currentTime: 0,
-    duration: 0,
-    ...resetPlaybackReadinessState(),
-    beatDragging: false,
-    elements: [],
-    selectedElementId: null,
-    zEditVersion: 0,
-    inPoint: null,
-    outPoint: null,
-    rangeSelection: null,
-    activeTool: "select",
-    activeKeyframePct: null,
-    motionPathArmed: false,
-    motionPathCreateAvailable: false,
-    selectedKeyframes: /* @__PURE__ */ new Set(),
-    // Ephemeral like every other selection here. A range surviving a project
-    // switch can match a same-keyed clip in the new project and redirect a
-    // paste through `sel.elementKey === paste.elementKey` to a stale t0.
-    automationSelection: null,
-    expandedClipIds: /* @__PURE__ */ new Set(),
-    // Per-composition: ids from comp A match nothing in B, silencing all of it.
-    collapsedGroupIds: /* @__PURE__ */ new Set(),
-    expandedLaneOwnerIds: /* @__PURE__ */ new Set(),
-    focusedEaseSegment: null,
-    revealedAudioFxTarget: null,
-    selectedElementIds: /* @__PURE__ */ new Set(),
-    requestedSeekTime: null,
-    lintFindingsByElement: /* @__PURE__ */ new Map(),
-    timelineFocus: null,
-    keyframeCache: /* @__PURE__ */ new Map(),
-    gsapAnimations: /* @__PURE__ */ new Map(),
-    beatAnalysis: null,
-    beatEdits: null,
-    beatUndo: [],
-    beatRedo: [],
-    beatPersist: null,
-    clipManifest: null,
-    clipParentMap: /* @__PURE__ */ new Map(),
-    domClipChildren: [],
-    subCompositionHostState: /* @__PURE__ */ new Map()
-  };
-}
-
-// src/player/store/elementPatchQueue.ts
-var queued = null;
-function queueElementPatch(key, updates) {
-  if (!queued) return false;
-  queued.set(key, { ...queued.get(key), ...updates });
-  return true;
-}
-function collectElementPatches(run) {
-  if (queued) {
-    run();
-    return null;
-  }
-  const patches = queued = /* @__PURE__ */ new Map();
-  try {
-    run();
-  } finally {
-    queued = null;
-  }
-  return patches;
-}
-function patchElements(elements, patches) {
-  return elements.map((el) => {
-    const patch = patches.get(el.key ?? el.id);
-    return patch ? { ...el, ...patch } : el;
-  });
-}
-
-// src/player/store/playerStore.ts
-function resolveElementSelection(ids, anchor) {
-  const selectedElementIds = new Set(ids);
-  if (selectedElementIds.size === 0) {
-    return { selectedElementIds, selectedElementId: null };
-  }
-  if (anchor && selectedElementIds.has(anchor)) {
-    return { selectedElementIds, selectedElementId: anchor };
-  }
-  return {
-    selectedElementIds,
-    selectedElementId: selectedElementIds.values().next().value ?? null
-  };
-}
-function selectAroundPlayhead(state, keep) {
-  const playhead = state.isPlaying ? liveTime.latest() : state.currentTime;
-  const ids = state.elements.filter((el) => keep(el, playhead)).map((el) => el.key ?? el.id);
-  state.setSelectedElementId(ids[0] ?? null);
-  state.setSelectedElementIds(new Set(ids));
-}
-var usePlayerStore = create((set, get) => ({
-  isPlaying: false,
-  currentTime: 0,
-  duration: 0,
-  timelineSessionEpoch: 0,
-  timelineProjectId: null,
-  beatDragging: false,
-  elements: [],
-  selectedElementId: null,
-  playbackRate: readStudioUiPreferences().playbackRate ?? 1,
-  audioMuted: readStudioUiPreferences().audioMuted ?? false,
-  audioVolume: readStudioUiPreferences().audioVolume ?? 1,
-  loopEnabled: false,
-  zoomMode: "fit",
-  manualZoomPercent: 100,
-  userZoomCount: 0,
-  zEditVersion: 0,
-  timelinePps: 100,
-  timelineFitPps: 100,
-  inPoint: null,
-  outPoint: null,
-  activeTool: "select",
-  setActiveTool: (tool) => set({ activeTool: tool }),
-  selectLeftward: () => selectAroundPlayhead(get(), (el, t) => el.start < t),
-  selectRightward: () => selectAroundPlayhead(get(), (el, t) => el.start + el.duration > t),
-  ...createKeyframeSlice(set, () => ({
-    timelineProjectId: get().timelineProjectId,
-    timelineSessionEpoch: get().timelineSessionEpoch
-  })),
-  ...createThumbnailSlice(set),
-  ...createAutomationSelectionSlice(set),
-  ...createEditingModeSlice(set),
-  ...createRangeSelectionSlice(),
-  ...createPlaybackReadinessSlice(set),
-  activeKeyframePct: null,
-  setActiveKeyframePct: (pct) => set({ activeKeyframePct: pct }),
-  selectedElementIds: /* @__PURE__ */ new Set(),
-  setSelection: (ids, anchor) => set(resolveElementSelection(ids, anchor)),
-  addSelectedElementId: (id) => set((s) => {
-    const next = new Set(s.selectedElementIds);
-    next.add(id);
-    return resolveElementSelection(next, s.selectedElementId);
-  }),
-  toggleSelectedElementId: (id) => set((s) => {
-    const next = new Set(s.selectedElementIds);
-    if (next.has(id)) next.delete(id);
-    else next.add(id);
-    return resolveElementSelection(next, s.selectedElementId);
-  }),
-  clearSelection: () => set({ selectedElementId: null, selectedElementIds: /* @__PURE__ */ new Set() }),
-  requestedSeekTime: null,
-  requestSeek: (time) => set({ requestedSeekTime: time }),
-  clearSeekRequest: () => set({ requestedSeekTime: null }),
-  playbackRequest: null,
-  requestPlayback: (playing, returnTo = null) => set((s) => ({
-    playbackRequest: { playing, returnTo, nonce: (s.playbackRequest?.nonce ?? 0) + 1 }
-  })),
-  clearPlaybackRequest: () => set({ playbackRequest: null }),
-  clipRevealRequest: null,
-  requestClipReveal: (elementId) => set((s) => ({
-    clipRevealRequest: { elementId, nonce: (s.clipRevealRequest?.nonce ?? 0) + 1 }
-  })),
-  clearClipRevealRequest: () => set({ clipRevealRequest: null }),
-  timelineFocus: null,
-  timelineFocusNonce: 0,
-  requestTimelineFocus: (id) => set((s) => {
-    const nonce = s.timelineFocusNonce + 1;
-    return {
-      timelineFocusNonce: nonce,
-      timelineFocus: createTimelineFocusRequest(
-        id,
-        s.timelineProjectId,
-        s.timelineSessionEpoch,
-        nonce
-      )
-    };
-  }),
-  clearTimelineFocus: (nonce) => set((s) => s.timelineFocus?.nonce === nonce ? { timelineFocus: null } : s),
-  lintFindingsByElement: /* @__PURE__ */ new Map(),
-  setLintFindingsByElement: (map) => set({ lintFindingsByElement: map }),
-  beatAnalysis: null,
-  setBeatAnalysis: (analysis) => set({ beatAnalysis: analysis }),
-  beatEdits: null,
-  setBeatEdits: (edits) => set({ beatEdits: edits }),
-  beatUndo: [],
-  beatRedo: [],
-  beatPersist: null,
-  setBeatPersist: (fn) => set({ beatPersist: fn }),
-  commitBeatEdits: (next, label) => {
-    set((s) => ({
-      beatEdits: next,
-      beatUndo: [...s.beatUndo, { restore: s.beatEdits, at: Date.now(), label }],
-      beatRedo: []
-    }));
-    get().beatPersist?.();
-  },
-  undoBeatEdits: () => {
-    const s = get();
-    const entry = s.beatUndo[s.beatUndo.length - 1];
-    if (!entry) return null;
-    set({
-      beatEdits: entry.restore,
-      beatUndo: s.beatUndo.slice(0, -1),
-      beatRedo: [...s.beatRedo, { restore: s.beatEdits, at: entry.at, label: entry.label }]
-    });
-    get().beatPersist?.();
-    return entry.label;
-  },
-  resetBeatHistory: () => set({ beatUndo: [], beatRedo: [] }),
-  redoBeatEdits: () => {
-    const s = get();
-    const entry = s.beatRedo[s.beatRedo.length - 1];
-    if (!entry) return null;
-    set({
-      beatEdits: entry.restore,
-      beatRedo: s.beatRedo.slice(0, -1),
-      beatUndo: [...s.beatUndo, { restore: s.beatEdits, at: entry.at, label: entry.label }]
-    });
-    get().beatPersist?.();
-    return entry.label;
-  },
-  clipManifest: null,
-  setClipManifest: (clips) => set({ clipManifest: clips }),
-  clipParentMap: /* @__PURE__ */ new Map(),
-  setClipParentMap: (map) => set({ clipParentMap: map }),
-  domClipChildren: [],
-  setDomClipChildren: (children) => set({ domClipChildren: children }),
-  subCompositionHostState: /* @__PURE__ */ new Map(),
-  setSubCompositionHostState: (state) => set({ subCompositionHostState: state }),
-  setIsPlaying: (playing) => {
-    if (get().isPlaying === playing) return;
-    set({ isPlaying: playing });
-  },
-  setPlaybackRate: (rate) => {
-    writeStudioUiPreferences({ playbackRate: rate });
-    set({ playbackRate: rate });
-  },
-  setAudioMuted: (muted) => {
-    writeStudioUiPreferences({ audioMuted: muted });
-    set({ audioMuted: muted });
-  },
-  setAudioVolume: (volume) => {
-    const nextVolume = Number.isFinite(volume) ? Math.max(0, Math.min(1, volume)) : 1;
-    writeStudioUiPreferences({ audioVolume: nextVolume });
-    set({ audioVolume: nextVolume });
-  },
-  setLoopEnabled: (enabled) => set({ loopEnabled: enabled }),
-  setZoomMode: (mode) => set({ zoomMode: mode }),
-  clearSelectedElementIds: () => set({ selectedElementIds: /* @__PURE__ */ new Set() }),
-  setSelectedElementIds: (ids) => set({ selectedElementIds: new Set(ids) }),
-  timelineSnapEnabled: readStudioUiPreferences().timelineSnapEnabled ?? true,
-  setTimelineSnapEnabled: (enabled) => {
-    writeStudioUiPreferences({ timelineSnapEnabled: enabled });
-    set({ timelineSnapEnabled: enabled });
-  },
-  rippleEditEnabled: readStudioUiPreferences().rippleEditEnabled ?? true,
-  // default on
-  setRippleEditEnabled: (enabled) => {
-    writeStudioUiPreferences({ rippleEditEnabled: enabled });
-    set({ rippleEditEnabled: enabled });
-  },
-  timeDisplayMode: readStudioUiPreferences().timeDisplayMode ?? "time",
-  setTimeDisplayMode: (mode) => {
-    writeStudioUiPreferences({ timeDisplayMode: mode });
-    set({ timeDisplayMode: mode });
-  },
-  pinTimelineZoom: (currentPixelsPerSecond, fitPixelsPerSecond) => set((s) => {
-    if (s.zoomMode === "manual") return {};
-    const percent = computePinnedZoomPercent(currentPixelsPerSecond, fitPixelsPerSecond);
-    writeStudioUiPreferences({
-      timelineZoomMode: "manual",
-      timelineManualZoomPercent: percent
-    });
-    return { zoomMode: "manual", manualZoomPercent: percent };
-  }),
-  setTimelineScale: (pps, fitPps) => {
-    const state = get();
-    if (state.timelinePps === pps && state.timelineFitPps === fitPps) return;
-    set({ timelinePps: pps, timelineFitPps: fitPps });
-  },
-  setInPoint: (time) => set((state) => {
-    const t = time !== null && Number.isFinite(time) ? time : null;
-    return {
-      inPoint: t,
-      outPoint: t !== null && state.outPoint !== null && t >= state.outPoint ? null : state.outPoint,
-      // Setting a work-area marker implies the user wants playback bounded by it.
-      // Auto-enable loop so the playhead respects the marker instead of running past.
-      loopEnabled: t !== null ? true : state.loopEnabled
-    };
-  }),
-  setOutPoint: (time) => set((state) => {
-    const t = time !== null && Number.isFinite(time) ? time : null;
-    return {
-      outPoint: t,
-      inPoint: t !== null && state.inPoint !== null && t <= state.inPoint ? null : state.inPoint,
-      loopEnabled: t !== null ? true : state.loopEnabled
-    };
-  }),
-  setManualZoomPercent: (percent) => set((state) => ({
-    manualZoomPercent: clampTimelineZoomPercent(percent, state.timelineFitPps)
-  })),
-  bumpZEditVersion: () => set((state) => ({ zEditVersion: state.zEditVersion + 1 })),
-  setCurrentTime: (time) => set({ currentTime: Number.isFinite(time) ? time : 0 }),
-  setDuration: (duration) => set({ duration: Number.isFinite(duration) ? duration : 0 }),
-  setBeatDragging: (dragging) => set({ beatDragging: dragging }),
-  setElements: (elements) => set({ elements }),
-  // A genuine single selection: always collapse the set to just this element. User
-  // intent (timeline click, preview click via applyDomSelection) flows here; DOM sync
-  // echoes that must preserve a group go through setSelectionAnchor instead.
-  setSelectedElementId: (id, options) => set((s) => {
-    const selectedElementIds = nextSelectionSet(s.selectedElementIds, id, options?.preserveSet);
-    const revealSurvives = revealTargetsSelection(s.revealedAudioFxTarget, id);
-    return id !== s.selectedElementId ? {
-      selectedElementId: id,
-      selectedElementIds,
-      activeKeyframePct: null,
-      motionPathArmed: false,
-      focusedEaseSegment: null,
-      ...revealSurvives ? {} : { revealedAudioFxTarget: null }
-    } : { selectedElementId: id, selectedElementIds };
-  }),
-  // Move the anchor within an active multi-selection WITHOUT collapsing it — used by
-  // DOM->store sync echoes while a group gesture re-patches the preview. A non-member
-  // id is treated as a genuine new single selection.
-  setSelectionAnchor: (id) => set((s) => {
-    if (id != null && s.selectedElementIds.size > 1 && s.selectedElementIds.has(id)) {
-      return {
-        selectedElementId: id,
-        focusedEaseSegment: id === s.selectedElementId ? s.focusedEaseSegment : null
-      };
-    }
-    return {
-      selectedElementId: id,
-      selectedElementIds: id ? /* @__PURE__ */ new Set([id]) : /* @__PURE__ */ new Set(),
-      focusedEaseSegment: id === s.selectedElementId ? s.focusedEaseSegment : null
-    };
-  }),
-  updateElement: (elementId, updates) => {
-    if (queueElementPatch(elementId, updates)) return;
-    set((state) => ({ elements: patchElements(state.elements, /* @__PURE__ */ new Map([[elementId, updates]])) }));
-  },
-  // UI preferences intentionally survive reset. So do timelineSessionEpoch and
-  // focusedEaseRequestNonce: the epoch advances only when project identity
-  // changes, while a monotonic nonce prevents collisions with stale consumers.
-  beginTimelineSession: (projectId) => set((state) => {
-    if (state.timelineProjectId === projectId) return state;
-    return {
-      ...createTimelineResetState(),
-      timelineSessionEpoch: state.timelineSessionEpoch + 1,
-      timelineProjectId: projectId
-    };
-  }),
-  reset: () => set(createTimelineResetState())
-}));
-attachPlayerStoreDevHandle(usePlayerStore);
-function isPreviewBooted(projectId) {
-  const { previewBooted, timelineProjectId } = usePlayerStore.getState();
-  return previewBooted && timelineProjectId === projectId;
-}
-function whenPreviewBooted(projectId) {
-  const openedFrom = usePlayerStore.getState().timelineProjectId;
-  let seen = false;
-  const settle = (state) => {
-    if (state.timelineProjectId === projectId) {
-      seen = true;
-      return state.previewBooted ? true : null;
-    }
-    return seen || state.timelineProjectId !== openedFrom ? false : null;
-  };
-  return new Promise((resolve) => {
-    const now = settle(usePlayerStore.getState());
-    if (now !== null) return resolve(now);
-    const stop = usePlayerStore.subscribe((state) => {
-      const result = settle(state);
-      if (result === null) return;
-      stop();
-      resolve(result);
-    });
-  });
-}
-
-// src/player/sceneSwap.ts
-var SCENES_SWAPPED = "hf-scenes-swapped";
-var SCENE_SWAP_MS = 5e3;
-var PREVIEW_DOCUMENT_LOADED = "hf-preview-document-loaded";
-function announcePreviewDocumentLoaded(iframe) {
-  iframe.dispatchEvent(new Event(PREVIEW_DOCUMENT_LOADED));
-}
-function onPreviewDocumentLoaded(iframe, onLoaded) {
-  iframe.addEventListener(PREVIEW_DOCUMENT_LOADED, onLoaded);
-  return () => iframe.removeEventListener(PREVIEW_DOCUMENT_LOADED, onLoaded);
-}
-function onPreviewContentReplaced(iframe, onReplaced) {
-  const stopLoaded = onPreviewDocumentLoaded(iframe, onReplaced);
-  iframe.addEventListener(SCENES_SWAPPED, onReplaced);
-  return () => {
-    stopLoaded();
-    iframe.removeEventListener(SCENES_SWAPPED, onReplaced);
-  };
-}
-var PREVIEW_PROMOTED = "hf-preview-promoted";
-function announcePreviewPromoted(promotion) {
-  promotion.live.ownerDocument.dispatchEvent(
-    new CustomEvent(PREVIEW_PROMOTED, { detail: promotion })
-  );
-}
-function onPreviewPromoted(doc, listener) {
-  const handle = (event) => listener(event.detail);
-  doc.addEventListener(PREVIEW_PROMOTED, handle);
-  return () => doc.removeEventListener(PREVIEW_PROMOTED, handle);
-}
-function markScenesStale(iframe, files) {
-  const doc = iframe?.contentDocument;
-  const meta = doc?.querySelector('meta[name="hf-scene-parts"]');
-  if (!doc || !meta) return;
-  let parts;
-  try {
-    parts = JSON.parse(meta.content);
-  } catch {
-    return;
-  }
-  for (const file of files) {
-    const hosts = doc.querySelectorAll(`[data-composition-file="${CSS.escape(file)}"]`);
-    if (hosts.length === 0 && file.endsWith(".html")) parts.shared = "";
-    for (const host of hosts) {
-      const scene = host.closest("[data-hf-scene]")?.getAttribute("data-hf-scene");
-      if (scene && scene in parts.scenes) parts.scenes[scene] = "";
-    }
-  }
-  meta.content = JSON.stringify(parts);
-}
-function sceneSwapFor(iframe) {
-  const win = iframe.contentWindow;
-  const swap = win?.__hfSwapScenes;
-  if (typeof swap !== "function") return null;
-  return async (url, isCurrent, cancel) => {
-    if (cancel?.aborted) throw cancel.reason;
-    const deadline = new AbortController();
-    const timer = setTimeout(
-      () => deadline.abort(new Error("the preview took too long to swap")),
-      SCENE_SWAP_MS
-    );
-    cancel?.addEventListener("abort", () => deadline.abort(cancel.reason), { once: true });
-    const swapping = (async () => {
-      const response = await studioApiFetch(url, { signal: deadline.signal });
-      if (!response.ok) throw new Error(`preview request failed with ${response.status}`);
-      const html = await response.text();
-      if (!isCurrent()) throw new Error("superseded by a newer reload");
-      await swap.call(win, html, deadline.signal);
-    })();
-    const expired = new Promise(
-      (_resolve, reject) => deadline.signal.addEventListener("abort", () => reject(deadline.signal.reason))
-    );
-    try {
-      await Promise.race([swapping, expired]);
-    } finally {
-      clearTimeout(timer);
-    }
-    iframe.dispatchEvent(new Event(SCENES_SWAPPED));
-  };
-}
-
-// src/player/components/Player.tsx
-import { forwardRef, useEffect as useEffect2, useRef, useState } from "react";
-import { isLottieAnimationLoaded } from "@hyperframes/core/runtime/lottie-readiness";
-
-// src/hooks/useMountEffect.ts
-import { useEffect } from "react";
-function useMountEffect(effect) {
-  useEffect(effect, []);
-}
-
-// src/hooks/previewVariablesStore.ts
-import { create as create2 } from "zustand";
-var usePreviewVariablesStore = create2((set) => ({
-  values: null,
-  setValues: (values) => set({ values: values && Object.keys(values).length > 0 ? values : null })
-}));
-function applyPreviewVariablesToUrl(url) {
-  const values = usePreviewVariablesStore.getState().values;
-  if (values) {
-    url.searchParams.set("variables", JSON.stringify(values));
-  } else {
-    url.searchParams.delete("variables");
-  }
-}
-
-// src/player/components/Player.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-var playerModule = null;
-function loadPlayerModule() {
-  playerModule ??= import("@hyperframes/player").catch((err) => {
-    playerModule = null;
-    throw err;
-  });
-  return playerModule;
-}
-if (typeof window !== "undefined") void loadPlayerModule().catch(() => {
-});
-var MEDIA_HAVE_FUTURE_DATA = 3;
-var MEDIA_NETWORK_NO_SOURCE = 3;
-function isRecord3(value) {
-  return typeof value === "object" && value !== null;
-}
-function getShaderTransitionLoading(event) {
-  if (!(event instanceof CustomEvent)) return null;
-  const detail = event.detail;
-  if (!isRecord3(detail)) return null;
-  const state = detail.state;
-  if (!isRecord3(state)) return null;
-  return state.loading === true && state.ready !== true;
-}
-var COMPOSITION_LOADING_OVERLAY_DELAY_MS = 400;
-var PREVIEW_BOOT_DEADLINE_MS = 5e3;
-var DEFAULT_PREVIEW_ERROR = "The composition preview did not become ready.";
-function shouldShowCompositionLoadingOverlay(compositionLoading) {
-  return compositionLoading;
-}
-function readPreviewErrorMessage(event) {
-  if (!(event instanceof CustomEvent) || !isRecord3(event.detail)) return DEFAULT_PREVIEW_ERROR;
-  return typeof event.detail.message === "string" && event.detail.message.trim() ? event.detail.message : DEFAULT_PREVIEW_ERROR;
-}
-function enableInteractiveIframe(player) {
-  const root = player.shadowRoot;
-  if (!root) return;
-  const container = root.querySelector(".hfp-container");
-  const iframe = root.querySelector(".hfp-iframe");
-  container?.style.setProperty("pointer-events", "auto");
-  iframe?.style.setProperty("pointer-events", "auto");
-}
-function isPreviewMediaElement(el) {
-  const tagName = el.tagName.toLowerCase();
-  return tagName === "video" || tagName === "audio";
-}
-function hasUnloadedAssets(iframe, lastResult) {
-  try {
-    const win = iframe.contentWindow;
-    const doc = iframe.contentDocument;
-    if (!win || !doc) return lastResult;
-    for (const el of doc.querySelectorAll("video, audio")) {
-      if (isPreviewMediaElement(el) && !el.error && el.networkState !== MEDIA_NETWORK_NO_SOURCE && el.readyState < MEDIA_HAVE_FUTURE_DATA) {
-        return true;
-      }
-    }
-    const lotties = win.__hfLottie;
-    if (lotties?.length) {
-      for (const anim of lotties) {
-        if (!isLottieAnimationLoaded(anim)) return true;
-      }
-    }
-    return false;
-  } catch {
-    return lastResult;
-  }
-}
-var runtimeBootedIn = (iframe) => iframe.contentWindow?.__playerReady === true;
-var Player = forwardRef(
-  ({
-    projectId,
-    directUrl,
-    onLoad,
-    onReadyToShowChange,
-    onPreviewError,
-    onCompositionLoadingChange,
-    onPainted,
-    portrait,
-    style,
-    suppressLoadingOverlay
-  }, ref) => {
-    const containerRef = useRef(null);
-    const loadCountRef = useRef(0);
-    const assetPollRef = useRef(null);
-    const assetFadeRef = useRef(null);
-    const retryPreviewRef = useRef(null);
-    const loadStartedAtRef = useRef(0);
-    const loadIdRef = useRef(0);
-    const retryCountRef = useRef(0);
-    const onLoadRef = useRef(onLoad);
-    onLoadRef.current = onLoad;
-    const onReadyToShowChangeRef = useRef(onReadyToShowChange);
-    onReadyToShowChangeRef.current = onReadyToShowChange;
-    const onPreviewErrorRef = useRef(onPreviewError);
-    onPreviewErrorRef.current = onPreviewError;
-    const [loaded, setLoaded] = useState(false);
-    const [assetsLoading, setAssetsLoading] = useState(false);
-    const [assetOverlayVisible, setAssetOverlayVisible] = useState(false);
-    const [assetOverlayFading, setAssetOverlayFading] = useState(false);
-    const [assetWaitLong, setAssetWaitLong] = useState(false);
-    const [shaderTransitionLoading, setShaderTransitionLoading] = useState(false);
-    const [compositionLoading, setCompositionLoading] = useState(true);
-    const [painted, setPainted] = useState(false);
-    const [compositionOverlayDeferred, setCompositionOverlayDeferred] = useState(true);
-    const [previewError, setPreviewError] = useState(null);
-    useEffect2(() => {
-      if (!compositionLoading) {
-        setCompositionOverlayDeferred(true);
-        return;
-      }
-      const timer = setTimeout(
-        () => setCompositionOverlayDeferred(false),
-        COMPOSITION_LOADING_OVERLAY_DELAY_MS
-      );
-      return () => clearTimeout(timer);
-    }, [compositionLoading]);
-    useMountEffect(() => {
-      const container = containerRef.current;
-      if (!container) return;
-      const previewSource = directUrl || (projectId ? buildProjectApiPath(projectId, "/preview") : null);
-      if (!previewSource) return;
-      let canceled = false;
-      let cleanup;
-      void loadPlayerModule().then(() => {
-        if (canceled) return;
-        const player = document.createElement("hyperframes-player");
-        const srcUrl = new URL(previewSource, window.location.origin);
-        applyPreviewVariablesToUrl(srcUrl);
-        const src = srcUrl.pathname + srcUrl.search;
-        const retryPreview = () => {
-          retryCountRef.current += 1;
-          const retryUrl = new URL(src, window.location.origin);
-          retryUrl.searchParams.set("_hfStudioRetry", String(retryCountRef.current));
-          setPreviewError(null);
-          setCompositionLoading(true);
-          loadStartedAtRef.current = performance.now();
-          loadIdRef.current += 1;
-          player.setAttribute("src", retryUrl.pathname + retryUrl.search);
-        };
-        retryPreviewRef.current = retryPreview;
-        const iframe = player.iframeElement;
-        const preventToggle = (e) => e.stopImmediatePropagation();
-        const handleShaderTransitionState = (event) => {
-          const loading = getShaderTransitionLoading(event);
-          if (loading !== null) setShaderTransitionLoading(loading);
-        };
-        let loadedDocument = null;
-        const handleReady = () => {
-          setPreviewError(null);
-          setCompositionLoading(false);
-          if (iframe.contentDocument && runtimeBootedIn(iframe)) handleLoad();
-        };
-        const handlePainted = () => {
-          setPainted(true);
-          onPainted?.({ iframe, startedAt: loadStartedAtRef.current, loadId: loadIdRef.current });
-        };
-        const handleError = (event) => {
-          const message = readPreviewErrorMessage(event);
-          onPreviewErrorRef.current?.(message);
-          setPreviewError(message);
-          setCompositionLoading(false);
-        };
-        const handleLoad = () => {
-          const doc = iframe.contentDocument;
-          if (doc && doc === loadedDocument) return;
-          loadedDocument = doc;
-          loadCountRef.current++;
-          setLoaded(true);
-          setPreviewError(null);
-          setShaderTransitionLoading(false);
-          setCompositionLoading(!player.ready);
-          setPainted(Boolean(player.painted));
-          if (loadCountRef.current > 1) {
-            container.classList.remove("preview-revealing");
-            void container.offsetWidth;
-            container.classList.add("preview-revealing");
-            const onEnd = () => container.classList.remove("preview-revealing");
-            container.addEventListener("animationend", onEnd, { once: true });
-          }
-          onLoadRef.current();
-          announcePreviewDocumentLoaded(iframe);
-          if (assetPollRef.current) clearInterval(assetPollRef.current);
-          const isContentRefresh = loadCountRef.current > 1;
-          let lastUnloaded = isContentRefresh ? false : hasUnloadedAssets(iframe, false);
-          if (lastUnloaded) {
-            setAssetsLoading(true);
-            let attempts = 0;
-            assetPollRef.current = setInterval(() => {
-              attempts += 1;
-              lastUnloaded = hasUnloadedAssets(iframe, lastUnloaded);
-              if (!lastUnloaded || attempts > 100) {
-                if (lastUnloaded && attempts > 100) {
-                  console.debug(
-                    "[studio] asset readiness poll hit the 10s cap \u2014 continuing with unloaded assets"
-                  );
-                }
-                if (assetPollRef.current) clearInterval(assetPollRef.current);
-                assetPollRef.current = null;
-                setAssetsLoading(false);
-              }
-            }, 100);
-          } else {
-            setAssetsLoading(false);
-          }
-        };
-        iframe.addEventListener("load", handleLoad);
-        player.addEventListener("click", preventToggle, { capture: true });
-        player.addEventListener("shadertransitionstate", handleShaderTransitionState);
-        player.addEventListener("ready", handleReady);
-        player.addEventListener("painted", handlePainted);
-        player.addEventListener("error", handleError);
-        if (typeof ref === "function") {
-          ref(iframe);
-        } else if (ref) {
-          ref.current = iframe;
-        }
-        player.setAttribute("shader-capture-scale", "1");
-        player.setAttribute("shader-loading", "player");
-        player.setAttribute("low-power-idle", "");
-        player.setAttribute("width", String(portrait ? 1080 : 1920));
-        player.setAttribute("height", String(portrait ? 1920 : 1080));
-        player.style.width = "100%";
-        player.style.height = "100%";
-        player.style.display = "block";
-        player.style.background = "transparent";
-        loadStartedAtRef.current = performance.now();
-        loadIdRef.current += 1;
-        player.setAttribute("src", src);
-        container.appendChild(player);
-        if (player.shadowRoot) {
-          const pasteboardStyle = document.createElement("style");
-          pasteboardStyle.textContent = ".hfp-container{overflow:visible}.hfp-iframe{box-shadow:0 0 0 1px rgba(255,255,255,0.08),0 4px 32px rgba(0,0,0,.7)}";
-          player.shadowRoot.appendChild(pasteboardStyle);
-        }
-        enableInteractiveIframe(player);
-        cleanup = () => {
-          iframe.removeEventListener("load", handleLoad);
-          player.removeEventListener("click", preventToggle, { capture: true });
-          player.removeEventListener("shadertransitionstate", handleShaderTransitionState);
-          player.removeEventListener("ready", handleReady);
-          player.removeEventListener("painted", handlePainted);
-          player.removeEventListener("error", handleError);
-          if (assetPollRef.current) clearInterval(assetPollRef.current);
-          assetPollRef.current = null;
-          player.remove();
-          if (retryPreviewRef.current === retryPreview) retryPreviewRef.current = null;
-          if (typeof ref === "function") {
-          } else if (ref) {
-            const mutableRef = ref;
-            if (mutableRef.current === iframe) {
-              mutableRef.current = null;
-            }
-          }
-        };
-      });
-      return () => {
-        canceled = true;
-        cleanup?.();
-      };
-    });
-    useEffect2(() => {
-      if (!assetsLoading) {
-        setAssetWaitLong(false);
-        return;
-      }
-      const timer = setTimeout(() => setAssetWaitLong(true), 3e3);
-      return () => clearTimeout(timer);
-    }, [assetsLoading]);
-    useEffect2(() => {
-      if (assetFadeRef.current) {
-        clearTimeout(assetFadeRef.current);
-        assetFadeRef.current = null;
-      }
-      if (assetsLoading) {
-        setAssetOverlayVisible(true);
-        setAssetOverlayFading(false);
-        return;
-      }
-      setAssetOverlayFading(true);
-      assetFadeRef.current = setTimeout(() => {
-        setAssetOverlayVisible(false);
-        setAssetOverlayFading(false);
-        assetFadeRef.current = null;
-      }, 240);
-      return () => {
-        if (assetFadeRef.current) {
-          clearTimeout(assetFadeRef.current);
-          assetFadeRef.current = null;
-        }
-      };
-    }, [assetsLoading]);
-    const handleContinueAnyway = () => {
-      if (assetPollRef.current) {
-        clearInterval(assetPollRef.current);
-        assetPollRef.current = null;
-      }
-      setAssetsLoading(false);
-    };
-    const firstFrameShown = loaded && painted && !compositionLoading && !shaderTransitionLoading && !previewError;
-    const readyToShow = firstFrameShown && !assetsLoading;
-    useEffect2(() => {
-      if (firstFrameShown) usePlayerStore.getState().markPreviewBooted();
-    }, [firstFrameShown]);
-    useEffect2(() => {
-      if (!readyToShow) {
-        onReadyToShowChangeRef.current?.(false);
-        return;
-      }
-      let second = 0;
-      const first = requestAnimationFrame(() => {
-        second = requestAnimationFrame(() => onReadyToShowChangeRef.current?.(true));
-      });
-      return () => {
-        cancelAnimationFrame(first);
-        cancelAnimationFrame(second);
-      };
-    }, [readyToShow]);
-    useEffect2(() => {
-      if (previewError) usePlayerStore.getState().markPreviewBooted();
-    }, [previewError]);
-    useEffect2(() => {
-      const timer = setTimeout(
-        () => usePlayerStore.getState().markPreviewBooted(),
-        PREVIEW_BOOT_DEADLINE_MS
-      );
-      return () => clearTimeout(timer);
-    }, [projectId]);
-    const showCompositionOverlay = !suppressLoadingOverlay && !compositionOverlayDeferred && shouldShowCompositionLoadingOverlay(compositionLoading);
-    const showAssetOverlay = assetOverlayVisible && !shaderTransitionLoading && !showCompositionOverlay && !previewError;
-    useEffect2(() => {
-      onCompositionLoadingChange?.(showCompositionOverlay || showAssetOverlay);
-    }, [onCompositionLoadingChange, showCompositionOverlay, showAssetOverlay]);
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: "relative w-full h-full max-w-full max-h-full overflow-hidden flex items-center justify-center",
-        style,
-        children: [
-          /* @__PURE__ */ jsx("div", { ref: containerRef, className: "w-full h-full" }),
-          showCompositionOverlay && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "absolute inset-0 bg-black flex items-center justify-center z-30 select-none",
-              "data-hyperframes-ignore": "",
-              "data-testid": "composition-loading-overlay",
-              draggable: false,
-              onDragStart: (event) => event.preventDefault(),
-              onMouseDown: (event) => event.preventDefault(),
-              onPointerDown: (event) => event.preventDefault(),
-              children: /* @__PURE__ */ jsx(
-                HyperframesLoader,
-                {
-                  title: "Loading composition",
-                  detail: "Preparing the Studio preview.",
-                  size: 56
-                }
-              )
-            }
-          ),
-          showAssetOverlay && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "absolute inset-0 bg-black flex items-center justify-center z-20 select-none",
-              "data-hyperframes-ignore": "",
-              draggable: false,
-              style: {
-                opacity: assetOverlayFading ? 0 : 1,
-                pointerEvents: assetOverlayFading ? "none" : "auto",
-                transition: "opacity 180ms ease-in"
-              },
-              onDragStart: (event) => event.preventDefault(),
-              onMouseDown: (event) => event.preventDefault(),
-              children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-3", children: [
-                /* @__PURE__ */ jsx(
-                  HyperframesLoader,
-                  {
-                    title: "Preparing preview assets",
-                    detail: "Waiting for media and motion assets before playback starts.",
-                    size: 56
-                  }
-                ),
-                assetWaitLong && /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: handleContinueAnyway,
-                    className: "px-3 py-1.5 text-[11px] rounded-md border border-neutral-700 text-neutral-300 hover:border-neutral-500 hover:bg-neutral-800 transition-colors",
-                    children: "Continue anyway"
-                  }
-                )
-              ] })
-            }
-          ),
-          previewError && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "absolute inset-0 z-40 flex items-center justify-center bg-black/90 px-6 text-center",
-              "data-hyperframes-ignore": "",
-              "data-testid": "composition-preview-error",
-              children: /* @__PURE__ */ jsxs("div", { className: "max-w-sm", children: [
-                /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold text-white", children: "Preview failed to load" }),
-                /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-neutral-400", children: previewError }),
-                /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    className: "mt-4 rounded-md bg-white px-3 py-1.5 text-xs font-semibold text-black transition-colors hover:bg-neutral-200",
-                    onClick: () => retryPreviewRef.current?.(),
-                    children: "Retry preview"
-                  }
-                )
-              ] })
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-Player.displayName = "Player";
-
-export {
-  useMountEffect,
-  usePreviewVariablesStore,
-  applyPreviewVariablesToUrl,
-  PANEL_IDS,
-  PANEL_DEFINITIONS,
-  isPanelId,
-  panelsInZone,
-  DOCK_PANEL_COMPONENT,
-  parseDockLayout,
-  readStudioUiPreferences,
-  writeStudioUiPreferences,
-  STUDIO_PREVIEW_FPS,
-  clampToDuration,
-  formatTime,
-  secondsToFrame,
-  frameToSeconds,
-  stepFrameTime,
-  formatFrameTime,
-  clampTimelineZoomPercent,
-  getTimelineZoomPercent,
-  computePinnedZoomPercent,
-  getTimelinePixelsPerSecond,
-  getNextTimelineZoomPercent,
-  getPinchTimelineZoomPercent,
-  timelineZoomPercentToSlider,
-  timelineSliderToZoomPercent,
-  isRevealedAudioFxRequestCurrent,
-  isFocusedEaseRequestCurrent,
-  effectiveThumbnailMode,
-  thumbnailRevisionOf,
-  createTimelineResetState,
-  collectElementPatches,
-  patchElements,
-  liveTime,
-  usePlayerStore,
-  isPreviewBooted,
-  whenPreviewBooted,
-  announcePreviewDocumentLoaded,
-  onPreviewDocumentLoaded,
-  onPreviewContentReplaced,
-  announcePreviewPromoted,
-  onPreviewPromoted,
-  markScenesStale,
-  sceneSwapFor,
-  Player
-};
-//# sourceMappingURL=chunk-NZPJUZKT.js.map