@remotion/studio 4.0.527 → 4.0.529

package/dist/esm/index-3qb54r5j.mjs

@@ -0,0 +1,157 @@
+// src/helpers/colors.ts
+var BLACK = "var(--remotion-studio-black)";
+var WHITE = "var(--remotion-studio-white)";
+var RED = "var(--remotion-studio-red)";
+var TRANSPARENT = "var(--remotion-studio-transparent)";
+var CURRENT_COLOR = "var(--remotion-studio-current-color)";
+var CURRENT_COLOR_LOWERCASE = "var(--remotion-studio-current-color)";
+var WHITE_HEX = "var(--remotion-studio-white)";
+var BLACK_HEX = "var(--remotion-studio-black)";
+var BACKGROUND = "var(--remotion-studio-background)";
+var BACKGROUND_HEX = "var(--remotion-studio-background)";
+var BACKGROUND__TRANSPARENT = "var(--remotion-studio-background-transparent)";
+var INPUT_BACKGROUND = "var(--remotion-studio-input-background)";
+var LIGHT_COLOR = "var(--remotion-studio-light-color)";
+var SELECTED_BACKGROUND = "var(--remotion-studio-white-alpha-15)";
+var LIGHT_TEXT = "var(--remotion-studio-light-text)";
+var RULER_COLOR = "var(--remotion-studio-ruler-color)";
+var WHITE_ALPHA_05 = "var(--remotion-studio-white-alpha-05)";
+var WHITE_ALPHA_06 = "var(--remotion-studio-white-alpha-06)";
+var WHITE_ALPHA_08 = "var(--remotion-studio-white-alpha-08)";
+var WHITE_ALPHA_10 = "var(--remotion-studio-white-alpha-10)";
+var WHITE_ALPHA_12 = "var(--remotion-studio-white-alpha-12)";
+var WHITE_ALPHA_15 = "var(--remotion-studio-white-alpha-15)";
+var WHITE_ALPHA_20 = "var(--remotion-studio-white-alpha-20)";
+var WHITE_ALPHA_25 = "var(--remotion-studio-white-alpha-25)";
+var WHITE_ALPHA_30 = "var(--remotion-studio-white-alpha-30)";
+var WHITE_ALPHA_35 = "var(--remotion-studio-white-alpha-35)";
+var WHITE_ALPHA_40 = "var(--remotion-studio-white-alpha-40)";
+var WHITE_ALPHA_45 = "var(--remotion-studio-white-alpha-45)";
+var WHITE_ALPHA_50 = "var(--remotion-studio-white-alpha-50)";
+var WHITE_ALPHA_60 = "var(--remotion-studio-white-alpha-60)";
+var WHITE_ALPHA_70 = "var(--remotion-studio-white-alpha-70)";
+var WHITE_ALPHA_72 = "var(--remotion-studio-white-alpha-72)";
+var WHITE_ALPHA_80 = "var(--remotion-studio-white-alpha-80)";
+var WHITE_ALPHA_90 = "var(--remotion-studio-white-alpha-90)";
+var BLACK_ALPHA_28 = "var(--remotion-studio-black-alpha-28)";
+var BLACK_ALPHA_30 = "var(--remotion-studio-black-alpha-30)";
+var BLACK_ALPHA_40 = "var(--remotion-studio-black-alpha-40)";
+var BLACK_ALPHA_50 = "var(--remotion-studio-black-alpha-50)";
+var BLACK_ALPHA_60 = "var(--remotion-studio-black-alpha-60)";
+var BLACK_ALPHA_80 = "var(--remotion-studio-black-alpha-80)";
+var BLACK_ALPHA_85 = "var(--remotion-studio-black-alpha-85)";
+var BLACK_ALPHA_90 = "var(--remotion-studio-black-alpha-90)";
+var BLACK_OPAQUE = "var(--remotion-studio-black)";
+var SELECTED_HOVER_BACKGROUND = "var(--remotion-studio-white-alpha-25)";
+var FAIL_COLOR = "var(--remotion-studio-fail-color)";
+var WARNING_COLOR = "var(--remotion-studio-warning-color)";
+var BLUE = "var(--remotion-studio-blue)";
+var BLUE_HOVERED = "var(--remotion-studio-blue-hovered)";
+var BLUE_DISABLED = "var(--remotion-studio-blue-disabled)";
+var UNSELECTED_GUIDE = "var(--remotion-studio-unselected-guide)";
+var SELECTED_GUIDE = "var(--remotion-studio-selected-guide)";
+var LINE_COLOR = "var(--remotion-studio-line-color)";
+var TIMELINE_TRACK_SEPARATOR = "var(--remotion-studio-timeline-track-separator)";
+var LIGHT_GRAY = "var(--remotion-studio-light-gray)";
+var NOTIFICATION_BACKGROUND = "var(--remotion-studio-notification-background)";
+var RENDER_STATUS_BACKGROUND = "var(--remotion-studio-render-status-background)";
+var ERROR_CODE_FRAME_BACKGROUND = "var(--remotion-studio-error-code-frame-background)";
+var ERROR_CODE_FRAME_LINE_BACKGROUND = "var(--remotion-studio-error-code-frame-line-background)";
+var ERROR_LINK_COLOR = "var(--remotion-studio-error-link-color)";
+var INFO_BLUE = "var(--remotion-studio-info-blue)";
+var SERVER_DISCONNECTED_BACKGROUND = "var(--remotion-studio-server-disconnected-background)";
+var TIMELINE_BACKGROUND_COLOR = "var(--remotion-studio-timeline-background-color)";
+var TIMELINE_NEGATIVE_START_BACKGROUND_COLOR = "var(--remotion-studio-timeline-negative-start-background-color)";
+var TIMELINE_NEGATIVE_START_BORDER_COLOR = "var(--remotion-studio-timeline-negative-start-border-color)";
+var TIMELINE_SELECTED_BACKGROUND_COLOR = "var(--remotion-studio-timeline-selected-background-color)";
+var TIMELINE_SELECTED_LABEL_BACKGROUND_COLOR = "var(--remotion-studio-timeline-selected-label-background-color)";
+var TIMELINE_BLUE = "var(--remotion-studio-timeline-blue)";
+var TIMELINE_PLAYHEAD_COLOR = "var(--remotion-studio-timeline-playhead-color)";
+var TIMELINE_DROP_BLUE_ALPHA_12 = "var(--remotion-studio-timeline-drop-blue-alpha-12)";
+var TIMELINE_DROP_BLUE_ALPHA_16 = "var(--remotion-studio-timeline-drop-blue-alpha-16)";
+var TIMELINE_DROP_BLUE_ALPHA_75 = "var(--remotion-studio-timeline-drop-blue-alpha-75)";
+var TIMELINE_MARQUEE_BLUE_ALPHA_16 = "var(--remotion-studio-timeline-marquee-blue-alpha-16)";
+var TIMELINE_MARQUEE_BLUE_ALPHA_75 = "var(--remotion-studio-timeline-marquee-blue-alpha-75)";
+var INFO_BLUE_BACKGROUND = "var(--remotion-studio-info-blue-background)";
+var FOCUS_COLOR = "var(--remotion-studio-focus-color)";
+var COLOR_PICKER_CHECKER_COLOR = "var(--remotion-studio-color-picker-checker-color)";
+var INFO_BLUE_BORDER_COLOR = "var(--remotion-studio-info-blue-border-color)";
+var BLACK_ALPHA_22 = "var(--remotion-studio-black-alpha-22)";
+var FONT_FAMILY_ERROR_COLOR = "var(--remotion-studio-font-family-error-color)";
+var SELECTED_OUTLINE_SNAP_COLOR = "var(--remotion-studio-selected-outline-snap-color)";
+var PRISM_TEXT_COLOR = "var(--remotion-studio-prism-text-color)";
+var PRISM_SELECTION_BACKGROUND = "var(--remotion-studio-prism-selection-background)";
+var PRISM_BACKGROUND = "var(--remotion-studio-prism-background)";
+var PRISM_INLINE_COLOR = "var(--remotion-studio-prism-inline-color)";
+var PRISM_KEYWORD_COLOR = "var(--remotion-studio-prism-keyword-color)";
+var PRISM_VARIABLE_COLOR = "var(--remotion-studio-prism-variable-color)";
+var PRISM_COMMENT_COLOR = "var(--remotion-studio-prism-comment-color)";
+var PRISM_NUMBER_COLOR = "var(--remotion-studio-prism-number-color)";
+var PRISM_STRING_COLOR = "var(--remotion-studio-prism-string-color)";
+var PRISM_CONTROL_FLOW_COLOR = "var(--remotion-studio-prism-control-flow-color)";
+var PRISM_FUNCTION_COLOR = "var(--remotion-studio-prism-function-color)";
+var PRISM_REGEX_COLOR = "var(--remotion-studio-prism-regex-color)";
+var PRISM_CLASS_NAME_COLOR = "var(--remotion-studio-prism-class-name-color)";
+var PRISM_SELECTOR_COLOR = "var(--remotion-studio-prism-selector-color)";
+var PRISM_LINE_HIGHLIGHT_BACKGROUND = "var(--remotion-studio-prism-line-highlight-background)";
+var PRISM_LINE_HIGHLIGHT_BORDER_COLOR = "var(--remotion-studio-prism-line-highlight-border-color)";
+var BORDER_BLACK = `1px solid ${BLACK_HEX}`;
+var BORDER_WHITE = `1px solid ${WHITE_HEX}`;
+var BORDER_WHITE_2PX = `2px solid ${WHITE_HEX}`;
+var BORDER_CURRENT_COLOR = `1px solid ${CURRENT_COLOR}`;
+var BORDER_TRANSPARENT_2PX = `2px solid ${TRANSPARENT}`;
+var BORDER_BLACK_ALPHA_50 = `1px solid ${BLACK_ALPHA_50}`;
+var BORDER_BLACK_ALPHA_60 = `1px solid ${BLACK_ALPHA_60}`;
+var BORDER_WHITE_ALPHA_12 = `1px solid ${WHITE_ALPHA_12}`;
+var BORDER_WHITE_ALPHA_20 = `1px solid ${WHITE_ALPHA_20}`;
+var BORDER_INFO_BLUE = `1px solid ${INFO_BLUE_BORDER_COLOR}`;
+var BORDER_TIMELINE_DROP_BLUE = `1px solid ${TIMELINE_DROP_BLUE_ALPHA_75}`;
+var BORDER_TIMELINE_MARQUEE_BLUE = `1px solid ${TIMELINE_MARQUEE_BLUE_ALPHA_75}`;
+var SHADOW_BLACK = `0 0 4px ${BLACK}`;
+var SHADOW_BLACK_ALPHA_50_TOWARDS_BOTTOM = `0 2px 8px ${BLACK_ALPHA_50}`;
+var SHADOW_BLACK_ALPHA_50_TOWARDS_TOP = `0 -2px 8px ${BLACK_ALPHA_50}`;
+var NOTIFICATION_SHADOW = `0 2px 3px ${BLACK_OPAQUE}`;
+var SERVER_DISCONNECTED_SHADOW = `0 2px 4px ${BLACK_ALPHA_40}`;
+var COLOR_PICKER_POPUP_SHADOW = `0 4px 16px ${BLACK_ALPHA_50}`;
+var COLOR_PICKER_HANDLE_SHADOW = `0 0 0 1px ${BLACK_ALPHA_60}`;
+var NOTIFICATION_BORDER = `0.25px solid ${WHITE_ALPHA_10}`;
+var FOCUS_BOX_SHADOW = `inset 1px 1px ${FOCUS_COLOR}, inset -1px -1px ${FOCUS_COLOR}, ` + `inset 1px -1px ${FOCUS_COLOR}, inset -1px 1px ${FOCUS_COLOR}`;
+var CHECKERBOARD_BACKGROUND_IMAGE = `
+     linear-gradient(
+        45deg,
+        ${WHITE_ALPHA_15} 25%,
+        ${TRANSPARENT} 25%
+      ),
+      linear-gradient(135deg, ${WHITE_ALPHA_15} 25%, ${TRANSPARENT} 25%),
+      linear-gradient(45deg, ${TRANSPARENT} 75%, ${WHITE_ALPHA_15} 75%),
+      linear-gradient(135deg, ${TRANSPARENT} 75%, ${WHITE_ALPHA_15} 75%)
+    `;
+var COLOR_PICKER_CHECKER_BACKGROUND_IMAGE = `linear-gradient(45deg, ${COLOR_PICKER_CHECKER_COLOR} 25%, ${TRANSPARENT} 25%), ` + `linear-gradient(-45deg, ${COLOR_PICKER_CHECKER_COLOR} 25%, ${TRANSPARENT} 25%), ` + `linear-gradient(45deg, ${TRANSPARENT} 75%, ${COLOR_PICKER_CHECKER_COLOR} 75%), ` + `linear-gradient(-45deg, ${TRANSPARENT} 75%, ${COLOR_PICKER_CHECKER_COLOR} 75%)`;
+var COLOR_PICKER_CHECKER_BACKGROUND_COLOR = "var(--remotion-studio-color-picker-checker-background-color)";
+var COLOR_PICKER_SATURATION_VALUE_GRADIENT = `linear-gradient(to right, ${WHITE_HEX}, ${TRANSPARENT})`;
+var COLOR_PICKER_SATURATION_BLACK_GRADIENT = `linear-gradient(to top, ${BLACK_HEX}, ${TRANSPARENT})`;
+var COLOR_PICKER_ALPHA_TRANSPARENT = "var(--remotion-studio-transparent)";
+var COLOR_PICKER_HUE_GRADIENT = "var(--remotion-studio-color-picker-hue-gradient)";
+var ERROR_MESSAGE_MASK_IMAGE = `linear-gradient(to bottom, ${WHITE} 60%, ${TRANSPARENT})`;
+var SELECTED_OUTLINE_DROP_SHADOW = `drop-shadow(0 0 1px ${WHITE_ALPHA_20})`;
+var SELECTED_OUTLINE_UV_DROP_SHADOW = `drop-shadow(0 1px 2px ${BLACK_ALPHA_28})`;
+var LOOPED_INDICATOR_DROP_SHADOW = `drop-shadow(0 0 2px ${BLACK_ALPHA_90}) ` + `drop-shadow(0 1px 2px ${BLACK_ALPHA_80})`;
+var TIMELINE_AUDIO_GRADIENT = "var(--remotion-studio-timeline-audio-gradient)";
+var TIMELINE_VIDEO_GRADIENT = "var(--remotion-studio-timeline-video-gradient)";
+var getBackgroundFromHoverState = ({
+  selected,
+  hovered
+}) => {
+  if (selected) {
+    if (hovered) {
+      return SELECTED_HOVER_BACKGROUND;
+    }
+    return SELECTED_BACKGROUND;
+  }
+  if (hovered) {
+    return WHITE_ALPHA_06;
+  }
+  return TRANSPARENT;
+};
+
+export { BLACK, WHITE, RED, TRANSPARENT, CURRENT_COLOR, CURRENT_COLOR_LOWERCASE, WHITE_HEX, BLACK_HEX, BACKGROUND, BACKGROUND_HEX, BACKGROUND__TRANSPARENT, INPUT_BACKGROUND, LIGHT_COLOR, SELECTED_BACKGROUND, LIGHT_TEXT, RULER_COLOR, WHITE_ALPHA_05, WHITE_ALPHA_06, WHITE_ALPHA_08, WHITE_ALPHA_10, WHITE_ALPHA_12, WHITE_ALPHA_15, WHITE_ALPHA_20, WHITE_ALPHA_25, WHITE_ALPHA_30, WHITE_ALPHA_35, WHITE_ALPHA_40, WHITE_ALPHA_45, WHITE_ALPHA_50, WHITE_ALPHA_60, WHITE_ALPHA_70, WHITE_ALPHA_72, WHITE_ALPHA_80, WHITE_ALPHA_90, BLACK_ALPHA_30, BLACK_ALPHA_40, BLACK_ALPHA_50, BLACK_ALPHA_60, BLACK_ALPHA_85, FAIL_COLOR, WARNING_COLOR, BLUE, BLUE_HOVERED, BLUE_DISABLED, UNSELECTED_GUIDE, SELECTED_GUIDE, LINE_COLOR, TIMELINE_TRACK_SEPARATOR, LIGHT_GRAY, NOTIFICATION_BACKGROUND, RENDER_STATUS_BACKGROUND, ERROR_CODE_FRAME_BACKGROUND, ERROR_CODE_FRAME_LINE_BACKGROUND, ERROR_LINK_COLOR, INFO_BLUE, SERVER_DISCONNECTED_BACKGROUND, TIMELINE_BACKGROUND_COLOR, TIMELINE_NEGATIVE_START_BACKGROUND_COLOR, TIMELINE_NEGATIVE_START_BORDER_COLOR, TIMELINE_SELECTED_BACKGROUND_COLOR, TIMELINE_SELECTED_LABEL_BACKGROUND_COLOR, TIMELINE_BLUE, TIMELINE_PLAYHEAD_COLOR, TIMELINE_DROP_BLUE_ALPHA_12, TIMELINE_DROP_BLUE_ALPHA_16, TIMELINE_MARQUEE_BLUE_ALPHA_16, INFO_BLUE_BACKGROUND, BLACK_ALPHA_22, FONT_FAMILY_ERROR_COLOR, SELECTED_OUTLINE_SNAP_COLOR, PRISM_TEXT_COLOR, PRISM_SELECTION_BACKGROUND, PRISM_BACKGROUND, PRISM_INLINE_COLOR, PRISM_KEYWORD_COLOR, PRISM_VARIABLE_COLOR, PRISM_COMMENT_COLOR, PRISM_NUMBER_COLOR, PRISM_STRING_COLOR, PRISM_CONTROL_FLOW_COLOR, PRISM_FUNCTION_COLOR, PRISM_REGEX_COLOR, PRISM_CLASS_NAME_COLOR, PRISM_SELECTOR_COLOR, PRISM_LINE_HIGHLIGHT_BACKGROUND, PRISM_LINE_HIGHLIGHT_BORDER_COLOR, BORDER_BLACK, BORDER_WHITE, BORDER_WHITE_2PX, BORDER_CURRENT_COLOR, BORDER_TRANSPARENT_2PX, BORDER_BLACK_ALPHA_50, BORDER_BLACK_ALPHA_60, BORDER_WHITE_ALPHA_12, BORDER_WHITE_ALPHA_20, BORDER_INFO_BLUE, BORDER_TIMELINE_DROP_BLUE, BORDER_TIMELINE_MARQUEE_BLUE, SHADOW_BLACK, SHADOW_BLACK_ALPHA_50_TOWARDS_BOTTOM, SHADOW_BLACK_ALPHA_50_TOWARDS_TOP, NOTIFICATION_SHADOW, SERVER_DISCONNECTED_SHADOW, COLOR_PICKER_POPUP_SHADOW, COLOR_PICKER_HANDLE_SHADOW, NOTIFICATION_BORDER, FOCUS_BOX_SHADOW, CHECKERBOARD_BACKGROUND_IMAGE, COLOR_PICKER_CHECKER_BACKGROUND_IMAGE, COLOR_PICKER_CHECKER_BACKGROUND_COLOR, COLOR_PICKER_SATURATION_VALUE_GRADIENT, COLOR_PICKER_SATURATION_BLACK_GRADIENT, COLOR_PICKER_ALPHA_TRANSPARENT, COLOR_PICKER_HUE_GRADIENT, ERROR_MESSAGE_MASK_IMAGE, SELECTED_OUTLINE_DROP_SHADOW, SELECTED_OUTLINE_UV_DROP_SHADOW, LOOPED_INDICATOR_DROP_SHADOW, TIMELINE_AUDIO_GRADIENT, TIMELINE_VIDEO_GRADIENT, getBackgroundFromHoverState };

package/dist/esm/{index-n5gmcvhz.mjs → index-5ycb9e9q.mjs}

@@ -1,9 +1,7 @@
 import {
-  callApi
-} from "./index-r1gr3j3a.mjs";
-import {
+  callApi,
   getBrowserStudioOperations
-} from "./index-cw0pnpg5.mjs";
+} from "./index-dfy1t576.mjs";
 
 // src/api/pause.ts
 import { Internals } from "remotion";

package/dist/esm/{index-s7qa3xbw.mjs → index-cakcjjy2.mjs}

@@ -5,25 +5,25 @@ import {
   label,
   optionRow,
   rightRow
-} from "./index-ppspzgn9.mjs";
+} from "./index-m2a95v3p.mjs";
 import {
   showNotification
-} from "./index-21hxsfaa.mjs";
+} from "./index-vtr5qzam.mjs";
 import {
   openInFileExplorer
-} from "./index-e855w59j.mjs";
+} from "./index-19d05w9e.mjs";
 import {
   getBrowserStudioOperations
-} from "./index-cw0pnpg5.mjs";
+} from "./index-dfy1t576.mjs";
 import {
   Column,
   InlineAction,
   Spacing,
   ValidationMessage
-} from "./index-5t2dwxsk.mjs";
+} from "./index-m01zjph7.mjs";
 import {
   WHITE
-} from "./index-k426ye99.mjs";
+} from "./index-3qb54r5j.mjs";
 
 // src/components/RenderModal/RenderModalOutputName.tsx
 import { useCallback } from "react";
@@ -125,7 +125,7 @@ var RenderModalOutputName = ({
                         variant: null,
                         onClick: openExistingOutput,
                         renderAction: renderOpenIcon,
-                        title: `Open in ${fileManagerName}`
+                        "aria-label": `Open in ${fileManagerName}`
                       }),
                       "Exists, will be overwritten"
                     ]

package/dist/esm/{index-r1gr3j3a.mjs → index-dfy1t576.mjs}

@@ -77,4 +77,53 @@ var callApi = (endpoint, body, signal) => {
   });
 };
 
-export { requestInsertedElementSelection, clearInsertedElementSelection, subscribeToInsertedElementSelection, getInsertedElementSelection, queueSequenceNodePathMutation, takePendingSequenceNodePathMutations, callApi };
+// src/helpers/browser-studio-operations.ts
+var BROWSER_STUDIO_OPERATIONS_READY_EVENT = "remotion-browser-studio-operations-ready";
+var getBrowserStudioOperations = () => {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  return window.remotion_browserStudio ?? null;
+};
+var getBrowserStudioKeyframeOperations = () => getBrowserStudioOperations()?.keyframes ?? null;
+var getBrowserStudioEffectOperations = () => getBrowserStudioOperations()?.effects ?? null;
+var canUseKeyframeOperations = () => !window.remotion_isReadOnlyStudio || getBrowserStudioKeyframeOperations() !== null;
+var canUseEffectOperations = () => !window.remotion_isReadOnlyStudio || getBrowserStudioEffectOperations() !== null;
+var canInstallPackages = () => {
+  const browserStudioOperations = getBrowserStudioOperations();
+  if (browserStudioOperations !== null) {
+    return true;
+  }
+  return !window.remotion_isReadOnlyStudio;
+};
+
+// src/api/write-static-file.ts
+var writeStaticFile = async ({
+  contents,
+  filePath
+}) => {
+  if (filePath.includes("\\")) {
+    return Promise.reject(new Error("File path cannot contain backslashes"));
+  }
+  const browserStudioOperations = getBrowserStudioOperations();
+  if (browserStudioOperations) {
+    return browserStudioOperations.writeStaticFile({ contents, filePath });
+  }
+  if (window.remotion_isReadOnlyStudio) {
+    throw new Error("writeStaticFile() is not available in read-only Studio");
+  }
+  const url = new URL(`${window.remotion_staticBase}/api/add-asset`, window.location.origin);
+  url.search = new URLSearchParams({
+    filePath
+  }).toString();
+  const response = await fetch(url, {
+    method: "POST",
+    body: contents
+  });
+  if (!response.ok) {
+    const jsonResponse = await response.json();
+    throw new Error(jsonResponse.error);
+  }
+};
+
+export { requestInsertedElementSelection, clearInsertedElementSelection, subscribeToInsertedElementSelection, getInsertedElementSelection, queueSequenceNodePathMutation, takePendingSequenceNodePathMutations, callApi, BROWSER_STUDIO_OPERATIONS_READY_EVENT, getBrowserStudioOperations, getBrowserStudioEffectOperations, canUseKeyframeOperations, canUseEffectOperations, canInstallPackages, writeStaticFile };

package/dist/esm/{index-614tdz2q.mjs → index-f9hxt5yh.mjs}

@@ -1,13 +1,13 @@
 import {
   ModelManager
-} from "./index-r0ejh5sy.mjs";
+} from "./index-vnc2wdfd.mjs";
 
 // src/components/Transcription/Models.tsx
 import {
   clearStaleModels,
+  downloadWhisperModel,
   getAvailableModels,
   isWhisperModelCached,
-  loadWhisperModel,
   removeWhisperModel
 } from "@remotion/whisper-webgpu";
 import { useCallback } from "react";
@@ -15,7 +15,7 @@ import { jsx } from "react/jsx-runtime";
 var AVAILABLE_MODELS = getAvailableModels();
 var Models = ({ description, indent, visible }) => {
   const isModelCached = useCallback((model) => isWhisperModelCached({ model }), []);
-  const loadModel = useCallback((model, onProgress) => loadWhisperModel({
+  const loadModel = useCallback((model, onProgress) => downloadWhisperModel({
     model,
     onProgress: (progress) => onProgress(progress.progress)
   }), []);

package/dist/esm/{index-9x6e1dq0.mjs → index-hqxc6tzp.mjs}

@@ -75,12 +75,16 @@ var RenderQueueContext = React.createContext({
   updateCaptionJobProgress: noop,
   markCaptionJobDone: noop,
   markCaptionJobFailed: noop,
+  markCaptionJobCancelled: noop,
+  markCaptionJobSaving: noop,
   removeCaptionJob: noop,
   setProcessCaptionJobCallback: noop,
   addVideoMattingJob: noopString,
   updateVideoMattingJobProgress: noop,
   markVideoMattingJobDone: noop,
   markVideoMattingJobFailed: noop,
+  markVideoMattingJobCancelled: noop,
+  markVideoMattingJobSaving: noop,
   removeVideoMattingJob: noop,
   setProcessVideoMattingJobCallback: noop,
   getAbortController: () => new AbortController,
@@ -94,7 +98,7 @@ var RenderQueueContextProvider = ({ children }) => {
   const [clientJobs, setClientJobs] = useState(restorePersistedClientRenders);
   const [captionJobs, setCaptionJobs] = useState([]);
   const [videoMattingJobs, setVideoMattingJobs] = useState([]);
-  const hasActiveLocalJob = clientJobs.some((job) => job.status === "idle" || job.status === "running" || job.status === "saving") || captionJobs.some((job) => job.status === "idle" || job.status === "running") || videoMattingJobs.some((job) => job.status === "idle" || job.status === "running");
+  const hasActiveLocalJob = clientJobs.some((job) => job.status === "idle" || job.status === "running" || job.status === "saving") || captionJobs.some((job) => job.status === "idle" || job.status === "running" || job.status === "saving") || videoMattingJobs.some((job) => job.status === "idle" || job.status === "running" || job.status === "saving");
   const [currentlyProcessing, setCurrentlyProcessing] = useState(null);
   const lastLocalJobStartedAt = useRef(clientJobs.reduce((latest, job) => Math.max(latest, job.startedAt), 0));
   const processJobCallbackRef = useRef(null);
@@ -151,7 +155,7 @@ var RenderQueueContextProvider = ({ children }) => {
         status: "running",
         progress: {
           detail: null,
-          message: "Starting video matting...",
+          message: "outName" in job ? "Starting background removal..." : "Starting video matting...",
           value: 0
         }
       } : job));
@@ -267,13 +271,15 @@ var RenderQueueContextProvider = ({ children }) => {
     return id;
   }, [getLocalJobStartedAt]);
   const updateCaptionJobProgress = useCallback((jobId, progress) => {
-    setCaptionJobs((prev) => prev.map((job) => job.id === jobId ? { ...job, status: "running", progress } : job));
+    setCaptionJobs((prev) => prev.map((job) => job.id === jobId && (job.status === "running" || job.status === "saving") ? { ...job, progress } : job));
   }, []);
   const markCaptionJobDone = useCallback((jobId, captionCount) => {
+    deleteAbortController(jobId);
     setCaptionJobs((prev) => prev.map((job) => job.id === jobId ? { ...job, status: "done", captionCount } : job));
     setCurrentlyProcessing((current) => current === jobId ? null : current);
   }, []);
   const markCaptionJobFailed = useCallback((jobId, error) => {
+    deleteAbortController(jobId);
     setCaptionJobs((prev) => prev.map((job) => job.id === jobId ? {
       ...job,
       status: "failed",
@@ -281,12 +287,21 @@ var RenderQueueContextProvider = ({ children }) => {
     } : job));
     setCurrentlyProcessing((current) => current === jobId ? null : current);
   }, []);
+  const markCaptionJobCancelled = useCallback((jobId) => {
+    deleteAbortController(jobId);
+    setCaptionJobs((prev) => prev.map((job) => job.id === jobId ? { ...job, status: "cancelled" } : job));
+    setCurrentlyProcessing((current) => current === jobId ? null : current);
+  }, []);
+  const markCaptionJobSaving = useCallback((jobId) => {
+    setCaptionJobs((prev) => prev.map((job) => job.id === jobId && job.status === "running" ? { ...job, status: "saving" } : job));
+  }, []);
   const removeCaptionJob = useCallback((jobId) => {
     setCaptionJobs((prev) => {
       const jobToRemove = prev.find((job) => job.id === jobId);
-      if (jobToRemove?.status === "running") {
+      if (jobToRemove?.status === "running" || jobToRemove?.status === "saving") {
         return prev;
       }
+      deleteAbortController(jobId);
       return prev.filter((job) => job.id !== jobId);
     });
   }, []);
@@ -309,13 +324,15 @@ var RenderQueueContextProvider = ({ children }) => {
     return id;
   }, [getLocalJobStartedAt]);
   const updateVideoMattingJobProgress = useCallback((jobId, progress) => {
-    setVideoMattingJobs((prev) => prev.map((job) => job.id === jobId ? { ...job, status: "running", progress } : job));
+    setVideoMattingJobs((prev) => prev.map((job) => job.id === jobId && (job.status === "running" || job.status === "saving") ? { ...job, progress } : job));
   }, []);
   const markVideoMattingJobDone = useCallback((jobId) => {
+    deleteAbortController(jobId);
     setVideoMattingJobs((prev) => prev.map((job) => job.id === jobId ? { ...job, status: "done" } : job));
     setCurrentlyProcessing((current) => current === jobId ? null : current);
   }, []);
   const markVideoMattingJobFailed = useCallback((jobId, error) => {
+    deleteAbortController(jobId);
     setVideoMattingJobs((prev) => prev.map((job) => job.id === jobId ? {
       ...job,
       status: "failed",
@@ -323,12 +340,21 @@ var RenderQueueContextProvider = ({ children }) => {
     } : job));
     setCurrentlyProcessing((current) => current === jobId ? null : current);
   }, []);
+  const markVideoMattingJobCancelled = useCallback((jobId) => {
+    deleteAbortController(jobId);
+    setVideoMattingJobs((prev) => prev.map((job) => job.id === jobId ? { ...job, status: "cancelled" } : job));
+    setCurrentlyProcessing((current) => current === jobId ? null : current);
+  }, []);
+  const markVideoMattingJobSaving = useCallback((jobId) => {
+    setVideoMattingJobs((prev) => prev.map((job) => job.id === jobId && job.status === "running" ? { ...job, status: "saving" } : job));
+  }, []);
   const removeVideoMattingJob = useCallback((jobId) => {
     setVideoMattingJobs((prev) => {
       const jobToRemove = prev.find((job) => job.id === jobId);
-      if (jobToRemove?.status === "running") {
+      if (jobToRemove?.status === "running" || jobToRemove?.status === "saving") {
         return prev;
       }
+      deleteAbortController(jobId);
       return prev.filter((job) => job.id !== jobId);
     });
   }, []);
@@ -380,12 +406,16 @@ var RenderQueueContextProvider = ({ children }) => {
       updateCaptionJobProgress,
       markCaptionJobDone,
       markCaptionJobFailed,
+      markCaptionJobCancelled,
+      markCaptionJobSaving,
       removeCaptionJob,
       setProcessCaptionJobCallback,
       addVideoMattingJob,
       updateVideoMattingJobProgress,
       markVideoMattingJobDone,
       markVideoMattingJobFailed,
+      markVideoMattingJobCancelled,
+      markVideoMattingJobSaving,
       removeVideoMattingJob,
       setProcessVideoMattingJobCallback,
       getAbortController,
@@ -410,12 +440,16 @@ var RenderQueueContextProvider = ({ children }) => {
     updateCaptionJobProgress,
     markCaptionJobDone,
     markCaptionJobFailed,
+    markCaptionJobCancelled,
+    markCaptionJobSaving,
     removeCaptionJob,
     setProcessCaptionJobCallback,
     addVideoMattingJob,
     updateVideoMattingJobProgress,
     markVideoMattingJobDone,
     markVideoMattingJobFailed,
+    markVideoMattingJobCancelled,
+    markVideoMattingJobSaving,
     removeVideoMattingJob,
     setProcessVideoMattingJobCallback
   ]);

package/dist/esm/{index-ac5550e7.mjs → index-jc22b2wb.mjs}

@@ -1,12 +1,12 @@
 import {
   ModelManager
-} from "./index-r0ejh5sy.mjs";
+} from "./index-vnc2wdfd.mjs";
 
 // src/components/VideoMatting/Models.tsx
 import {
+  downloadVideoMattingModel,
   getAvailableModels,
   isVideoMattingModelCached,
-  loadVideoMattingModel,
   removeVideoMattingModel
 } from "@remotion/video-matting";
 import { useCallback } from "react";
@@ -14,7 +14,7 @@ import { jsx } from "react/jsx-runtime";
 var AVAILABLE_MODELS = getAvailableModels();
 var Models = ({ description, indent, visible }) => {
   const isModelCached = useCallback((model) => isVideoMattingModelCached({ model }), []);
-  const loadModel = useCallback((model, onProgress) => loadVideoMattingModel({
+  const loadModel = useCallback((model, onProgress) => downloadVideoMattingModel({
     model,
     onProgress: (progress) => onProgress(progress.progress)
   }), []);