@remotion/studio 4.0.154 → 4.0.157

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @remotion/studio@4.0.153 build /Users/jonathanburger/remotion/packages/studio
+> @remotion/studio@4.0.156 build /Users/jonathanburger/remotion/packages/studio
 > bun --env-file=../.env.bundle bundle.ts
 
 warn: Remotion currently uses a fork of Bun to bundle.

package/dist/api/update-default-props.d.ts

@@ -1,5 +1,4 @@
 import type { UpdateDefaultPropsFunction } from './helpers/calc-new-props';
-export declare const PROPS_UPDATED_EXTERNALLY = "remotion.propsUpdatedExternally";
 export declare const updateDefaultProps: ({ compositionId, defaultProps, }: {
     compositionId: string;
     defaultProps: UpdateDefaultPropsFunction;

package/dist/api/update-default-props.js

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.updateDefaultProps = exports.PROPS_UPDATED_EXTERNALLY = void 0;
+exports.updateDefaultProps = void 0;
 const remotion_1 = require("remotion");
 const calc_new_props_1 = require("./helpers/calc-new-props");
-exports.PROPS_UPDATED_EXTERNALLY = 'remotion.propsUpdatedExternally';
 const updateDefaultProps = ({ compositionId, defaultProps, }) => {
     const { generatedDefaultProps, composition } = (0, calc_new_props_1.calcNewProps)(compositionId, defaultProps);
     const propsStore = remotion_1.Internals.editorPropsProviderRef.current;
@@ -16,6 +15,6 @@ const updateDefaultProps = ({ compositionId, defaultProps, }) => {
             [composition.id]: generatedDefaultProps,
         };
     });
-    window.dispatchEvent(new CustomEvent(exports.PROPS_UPDATED_EXTERNALLY));
+    window.dispatchEvent(new CustomEvent(remotion_1.Internals.PROPS_UPDATED_EXTERNALLY));
 };
 exports.updateDefaultProps = updateDefaultProps;

package/dist/components/OptionsPanel.js

@@ -37,7 +37,7 @@ const persistSelectedOptionsSidebarPanel = (panel) => {
 exports.persistSelectedOptionsSidebarPanel = persistSelectedOptionsSidebarPanel;
 exports.optionsSidebarTabs = (0, react_1.createRef)();
 const OptionsPanel = ({ readOnlyStudio }) => {
-    const { props, updateProps } = (0, react_1.useContext)(remotion_1.Internals.EditorPropsContext);
+    const { props, updateProps, resetUnsaved } = (0, react_1.useContext)(remotion_1.Internals.EditorPropsContext);
     const [saving, setSaving] = (0, react_1.useState)(false);
     const isMobileLayout = (0, mobile_layout_1.useMobileLayout)();
     const container = (0, react_1.useMemo)(() => ({
@@ -113,6 +113,15 @@ const OptionsPanel = ({ readOnlyStudio }) => {
         }
         return !(0, deep_equal_1.deepEqual)(composition.defaultProps, currentDefaultProps);
     }, [currentDefaultProps, composition]);
+    const reset = (0, react_1.useCallback)(() => {
+        resetUnsaved();
+    }, [resetUnsaved]);
+    (0, react_1.useEffect)(() => {
+        window.addEventListener(remotion_1.Internals.PROPS_UPDATED_EXTERNALLY, reset);
+        return () => {
+            window.removeEventListener(remotion_1.Internals.PROPS_UPDATED_EXTERNALLY, reset);
+        };
+    }, [reset]);
     return ((0, jsx_runtime_1.jsxs)("div", { style: container, className: "css-reset", children: [(0, jsx_runtime_1.jsx)("div", { style: tabsContainer, children: (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { children: [composition ? ((0, jsx_runtime_1.jsxs)(Tabs_1.Tab, { selected: panel === 'input-props', onClick: onPropsSelected, style: { justifyContent: 'space-between' }, children: ["Props", unsavedChangesExist ? ((0, jsx_runtime_1.jsx)("div", { title: saveToolTip, style: circleStyle })) : null] })) : null, readOnlyStudio ? null : ((0, jsx_runtime_1.jsx)(RendersTab_1.RendersTab, { onClick: onRendersSelected, selected: panel === 'renders' }))] }) }), panel === `input-props` && composition ? ((0, jsx_runtime_1.jsx)(DataEditor_1.DataEditor, { unresolvedComposition: composition, defaultProps: currentDefaultProps, setDefaultProps: setDefaultProps, mayShowSaveButton: true, propsEditType: "default-props", saving: saving, setSaving: setSaving, readOnlyStudio: readOnlyStudio }, composition.id)) : readOnlyStudio ? null : ((0, jsx_runtime_1.jsx)(RenderQueue_1.RenderQueue, {}))] }));
 };
 exports.OptionsPanel = OptionsPanel;

package/dist/components/RenderModal/DataEditor.js

@@ -90,6 +90,7 @@ const setPersistedShowWarningState = (val) => {
 const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayShowSaveButton, propsEditType, saving, setSaving, readOnlyStudio, }) => {
     const [mode, setMode] = (0, react_1.useState)('schema');
     const [showWarning, setShowWarningWithoutPersistance] = (0, react_1.useState)(() => getPersistedShowWarningState());
+    const { updateCompositionDefaultProps } = (0, react_1.useContext)(remotion_1.Internals.CompositionManager);
     const inJSONEditor = mode === 'json';
     const serializedJSON = (0, react_1.useMemo)(() => {
         if (!inJSONEditor) {
@@ -219,34 +220,38 @@ const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayS
             }
         });
     }, [unresolvedComposition.id, defaultProps, schema, z]);
-    (0, react_1.useEffect)(() => {
-        setSaving(false);
-    }, [fastRefreshes, setSaving]);
     const onSave = (0, react_1.useCallback)((updater) => {
         var _a;
         if (schema === 'no-zod' || schema === 'no-schema' || z === null) {
             (0, NotificationCenter_1.showNotification)('Cannot update default props: No Zod schema', 2000);
             return;
         }
+        window.remotion_ignoreFastRefreshUpdate = fastRefreshes + 1;
         setSaving(true);
-        (0, actions_1.callUpdateDefaultPropsApi)(unresolvedComposition.id, updater((_a = unresolvedComposition.defaultProps) !== null && _a !== void 0 ? _a : {}), (0, extract_enum_json_paths_1.extractEnumJsonPaths)(schema, z, []))
+        const newDefaultProps = updater((_a = unresolvedComposition.defaultProps) !== null && _a !== void 0 ? _a : {});
+        (0, actions_1.callUpdateDefaultPropsApi)(unresolvedComposition.id, newDefaultProps, (0, extract_enum_json_paths_1.extractEnumJsonPaths)(schema, z, []))
             .then((response) => {
             if (!response.success) {
                 // eslint-disable-next-line no-console
                 console.log(response.stack);
                 (0, NotificationCenter_1.showNotification)(`Cannot update default props: ${response.reason}. See console for more information.`, 2000);
             }
+            updateCompositionDefaultProps(unresolvedComposition.id, newDefaultProps);
         })
             .catch((err) => {
             (0, NotificationCenter_1.showNotification)(`Cannot update default props: ${err.message}`, 2000);
+        })
+            .finally(() => {
             setSaving(false);
         });
     }, [
         schema,
         z,
+        fastRefreshes,
         setSaving,
-        unresolvedComposition.id,
         unresolvedComposition.defaultProps,
+        unresolvedComposition.id,
+        updateCompositionDefaultProps,
     ]);
     const connectionStatus = previewServerState.type;
     const warnings = (0, react_1.useMemo)(() => {

package/dist/components/RenderModal/SchemaEditor/SchemaEditor.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.SchemaEditor = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const update_default_props_1 = require("../../../api/update-default-props");
+const remotion_1 = require("remotion");
 const document_title_1 = require("../../../helpers/document-title");
 const use_keybinding_1 = require("../../../helpers/use-keybinding");
 const is_menu_item_1 = require("../../Menu/is-menu-item");
@@ -29,9 +29,9 @@ const SchemaEditor = ({ schema, unsavedDefaultProps, setValue, zodValidationResu
         const bumpRevision = () => {
             setRevision((old) => old + 1);
         };
-        window.addEventListener(update_default_props_1.PROPS_UPDATED_EXTERNALLY, bumpRevision);
+        window.addEventListener(remotion_1.Internals.PROPS_UPDATED_EXTERNALLY, bumpRevision);
         return () => {
-            window.removeEventListener(update_default_props_1.PROPS_UPDATED_EXTERNALLY, bumpRevision);
+            window.removeEventListener(remotion_1.Internals.PROPS_UPDATED_EXTERNALLY, bumpRevision);
         };
     }, []);
     const z = (0, get_zod_if_possible_1.useZodIfPossible)();

package/dist/components/RenderModal/SchemaEditor/local-state.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLocalState = exports.RevisionContext = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const update_default_props_1 = require("../../../api/update-default-props");
+const remotion_1 = require("remotion");
 const deep_equal_1 = require("./deep-equal");
 exports.RevisionContext = (0, react_1.createContext)({
     childResetRevision: 0,
@@ -20,36 +20,33 @@ const useLocalState = ({ unsavedValue, schema, setValue, savedValue, }) => {
             },
         };
     });
-    const localValue = (0, react_1.useMemo)(() => {
-        if (localValueOrNull === null) {
+    const localUnsavedValue = (0, react_1.useMemo)(() => {
+        if (localValueOrNull[parentRevision] === null) {
             return {
-                [parentRevision]: {
-                    value: unsavedValue,
-                    keyStabilityRevision: 0,
-                    zodValidation: schema.safeParse(unsavedValue),
-                },
+                value: unsavedValue,
+                keyStabilityRevision: 0,
+                zodValidation: schema.safeParse(unsavedValue),
             };
         }
-        return localValueOrNull;
+        return localValueOrNull[parentRevision];
     }, [localValueOrNull, parentRevision, schema, unsavedValue]);
     (0, react_1.useEffect)(() => {
         const checkFile = () => {
             setResetRevision((old) => old + 1);
-            setLocalValue(null);
+            setLocalValue({});
         };
-        window.addEventListener(update_default_props_1.PROPS_UPDATED_EXTERNALLY, checkFile);
+        window.addEventListener(remotion_1.Internals.PROPS_UPDATED_EXTERNALLY, checkFile);
         return () => {
-            window.removeEventListener(update_default_props_1.PROPS_UPDATED_EXTERNALLY, checkFile);
+            window.removeEventListener(remotion_1.Internals.PROPS_UPDATED_EXTERNALLY, checkFile);
         };
     }, []);
     const currentLocalValue = (0, react_1.useMemo)(() => {
-        var _a;
-        return ((_a = localValue[parentRevision]) !== null && _a !== void 0 ? _a : {
+        return (localUnsavedValue !== null && localUnsavedValue !== void 0 ? localUnsavedValue : {
             value: savedValue,
             keyStabilityRevision: 0,
             zodValidation: schema.safeParse(savedValue),
         });
-    }, [savedValue, localValue, parentRevision, schema]);
+    }, [localUnsavedValue, savedValue, schema]);
     const stateRef = (0, react_1.useRef)(currentLocalValue);
     stateRef.current = currentLocalValue;
     const onChange = (0, react_1.useCallback)(
@@ -73,13 +70,13 @@ const useLocalState = ({ unsavedValue, schema, setValue, savedValue, }) => {
             };
             stateRef.current = newState;
             return {
-                ...localValue,
+                ...localUnsavedValue,
                 [parentRevision]: newState,
             };
         });
     }, [
         currentLocalValue.keyStabilityRevision,
-        localValue,
+        localUnsavedValue,
         parentRevision,
         schema,
         setValue,

package/dist/esm/index.mjs

@@ -4461,7 +4461,6 @@ var saveDefaultProps = async ({
 
 // src/api/update-default-props.ts
 import {Internals as Internals2} from "remotion";
-var PROPS_UPDATED_EXTERNALLY = "remotion.propsUpdatedExternally";
 var updateDefaultProps = ({
   compositionId,
   defaultProps
@@ -4477,7 +4476,7 @@ var updateDefaultProps = ({
       [composition.id]: generatedDefaultProps
     };
   });
-  window.dispatchEvent(new CustomEvent(PROPS_UPDATED_EXTERNALLY));
+  window.dispatchEvent(new CustomEvent(Internals2.PROPS_UPDATED_EXTERNALLY));
 };
 
 // src/api/watch-public-folder.ts