@remotion/studio 4.0.438 → 4.0.439

package/dist/components/RenderModal/DataEditor.js

@@ -38,18 +38,14 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const remotion_1 = require("remotion");
 const no_react_1 = require("remotion/no-react");
-const fast_refresh_context_1 = require("../../fast-refresh-context");
 const client_id_1 = require("../../helpers/client-id");
 const colors_1 = require("../../helpers/colors");
 const get_zod_if_possible_1 = require("../get-zod-if-possible");
 const layout_1 = require("../layout");
 const ValidationMessage_1 = require("../NewComposition/ValidationMessage");
-const NotificationCenter_1 = require("../Notifications/NotificationCenter");
-const actions_1 = require("../RenderQueue/actions");
 const SegmentedControl_1 = require("../SegmentedControl");
 const get_render_modal_warnings_1 = require("./get-render-modal-warnings");
 const RenderModalJSONPropsEditor_1 = require("./RenderModalJSONPropsEditor");
-const extract_enum_json_paths_1 = require("./SchemaEditor/extract-enum-json-paths");
 const SchemaEditor_1 = require("./SchemaEditor/SchemaEditor");
 const SchemaErrorMessages_1 = require("./SchemaEditor/SchemaErrorMessages");
 const zod_schema_type_1 = require("./SchemaEditor/zod-schema-type");
@@ -99,10 +95,15 @@ const getPersistedShowWarningState = () => {
 const setPersistedShowWarningState = (val) => {
     localStorage.setItem(persistanceKey, String(Boolean(val)));
 };
-const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayShowSaveButton, propsEditType, saving, setSaving, readOnlyStudio, }) => {
+const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, propsEditType, canSaveDefaultProps, }) => {
     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.CompositionSetters);
+    const jsonEditorSetValue = (0, react_1.useCallback)((newProps) => {
+        setDefaultProps(typeof newProps === 'function' ? newProps : () => newProps, { shouldSave: false });
+    }, [setDefaultProps]);
+    const onSave = (0, react_1.useCallback)(() => {
+        setDefaultProps((p) => p, { shouldSave: true });
+    }, [setDefaultProps]);
     const inJSONEditor = mode === 'json';
     const serializedJSON = (0, react_1.useMemo)(() => {
         if (!inJSONEditor) {
@@ -116,11 +117,7 @@ const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayS
         });
     }, [inJSONEditor, defaultProps]);
     const cliProps = (0, remotion_1.getInputProps)();
-    const [canSaveDefaultPropsObjectState, setCanSaveDefaultProps] = (0, react_1.useState)({
-        [unresolvedComposition.id]: get_render_modal_warnings_1.defaultTypeCanSaveState,
-    });
     const z = (0, get_zod_if_possible_1.useZodIfPossible)();
-    const zodTypes = (0, get_zod_if_possible_1.useZodTypesIfPossible)();
     const schema = (0, react_1.useMemo)(() => {
         if (!z) {
             return 'no-zod';
@@ -153,56 +150,7 @@ const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayS
             return val(prevVal);
         });
     }, []);
-    const canSaveDefaultProps = (0, react_1.useMemo)(() => {
-        return canSaveDefaultPropsObjectState[unresolvedComposition.id]
-            ? canSaveDefaultPropsObjectState[unresolvedComposition.id]
-            : get_render_modal_warnings_1.defaultTypeCanSaveState;
-    }, [canSaveDefaultPropsObjectState, unresolvedComposition.id]);
-    const showSaveButton = mayShowSaveButton && canSaveDefaultProps.canUpdate;
-    const { fastRefreshes } = (0, react_1.useContext)(fast_refresh_context_1.FastRefreshContext);
-    const checkIfCanSaveDefaultProps = (0, react_1.useCallback)(async () => {
-        try {
-            const can = await (0, actions_1.canUpdateDefaultProps)(unresolvedComposition.id, readOnlyStudio);
-            if (can.canUpdate) {
-                setCanSaveDefaultProps((prevState) => ({
-                    ...prevState,
-                    [unresolvedComposition.id]: {
-                        canUpdate: true,
-                    },
-                }));
-            }
-            else {
-                setCanSaveDefaultProps((prevState) => ({
-                    ...prevState,
-                    [unresolvedComposition.id]: {
-                        canUpdate: false,
-                        reason: can.reason,
-                        determined: true,
-                    },
-                }));
-            }
-        }
-        catch (err) {
-            setCanSaveDefaultProps((prevState) => ({
-                ...prevState,
-                [unresolvedComposition.id]: {
-                    canUpdate: false,
-                    reason: err.message,
-                    determined: true,
-                },
-            }));
-        }
-    }, [readOnlyStudio, unresolvedComposition.id]);
-    (0, react_1.useEffect)(() => {
-        checkIfCanSaveDefaultProps();
-    }, [checkIfCanSaveDefaultProps]);
-    const { previewServerState, subscribeToEvent } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
-    (0, react_1.useEffect)(() => {
-        const unsub = subscribeToEvent('root-file-changed', checkIfCanSaveDefaultProps);
-        return () => {
-            unsub();
-        };
-    }, [checkIfCanSaveDefaultProps, subscribeToEvent]);
+    const { previewServerState } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
     const modeItems = (0, react_1.useMemo)(() => {
         return [
             {
@@ -223,56 +171,6 @@ const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayS
             },
         ];
     }, [mode]);
-    const onUpdate = (0, react_1.useCallback)(() => {
-        if (schema === 'no-zod' || schema === 'no-schema' || z === null) {
-            (0, NotificationCenter_1.showNotification)('Cannot update default props: No Zod schema', 2000);
-            return;
-        }
-        (0, actions_1.callUpdateDefaultPropsApi)(unresolvedComposition.id, defaultProps, (0, extract_enum_json_paths_1.extractEnumJsonPaths)({ schema, zodRuntime: z, currentPath: [], zodTypes })).then((response) => {
-            if (!response.success) {
-                (0, NotificationCenter_1.showNotification)(`Cannot update default props: ${response.reason}`, 2000);
-            }
-        });
-    }, [schema, z, unresolvedComposition.id, defaultProps, zodTypes]);
-    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);
-        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,
-            zodRuntime: z,
-            currentPath: [],
-            zodTypes,
-        }))
-            .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,
-        zodTypes,
-        fastRefreshes,
-        setSaving,
-        unresolvedComposition.defaultProps,
-        unresolvedComposition.id,
-        updateCompositionDefaultProps,
-    ]);
     const connectionStatus = previewServerState.type;
     const warnings = (0, react_1.useMemo)(() => {
         return (0, get_render_modal_warnings_1.getRenderModalWarnings)({
@@ -326,6 +224,6 @@ const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayS
                         ? warnings.map((warning) => (jsx_runtime_1.jsxs(react_1.default.Fragment, { children: [
                                 jsx_runtime_1.jsx(layout_1.Spacing, { y: 1 }), jsx_runtime_1.jsx(ValidationMessage_1.ValidationMessage, { message: warning, align: "flex-start", type: "warning" })
                             ] }, warning)))
-                        : null] }), mode === 'schema' ? (jsx_runtime_1.jsx(SchemaEditor_1.SchemaEditor, { unsavedDefaultProps: defaultProps, setValue: setDefaultProps, schema: schema, zodValidationResult: zodValidationResult, savedDefaultProps: unresolvedComposition.defaultProps, onSave: onSave, showSaveButton: showSaveButton, saving: saving, saveDisabledByParent: !zodValidationResult.success })) : (jsx_runtime_1.jsx(RenderModalJSONPropsEditor_1.RenderModalJSONPropsEditor, { value: defaultProps !== null && defaultProps !== void 0 ? defaultProps : {}, setValue: setDefaultProps, onSave: onUpdate, showSaveButton: showSaveButton, serializedJSON: serializedJSON, defaultProps: unresolvedComposition.defaultProps, schema: schema }))] }));
+                        : null] }), mode === 'schema' ? (jsx_runtime_1.jsx(SchemaEditor_1.SchemaEditor, { value: defaultProps, setValue: setDefaultProps, schema: schema })) : (jsx_runtime_1.jsx(RenderModalJSONPropsEditor_1.RenderModalJSONPropsEditor, { value: defaultProps !== null && defaultProps !== void 0 ? defaultProps : {}, setValue: jsonEditorSetValue, onSave: onSave, serializedJSON: serializedJSON, defaultProps: unresolvedComposition.defaultProps, schema: schema, compositionId: unresolvedComposition.id }))] }));
 };
 exports.DataEditor = DataEditor;

package/dist/components/RenderModal/RenderModalJSONPropsEditor.d.ts

@@ -5,8 +5,8 @@ export declare const RenderModalJSONPropsEditor: React.FC<{
     readonly value: unknown;
     readonly setValue: React.Dispatch<React.SetStateAction<Record<string, unknown>>>;
     readonly onSave: () => void;
-    readonly showSaveButton: boolean;
     readonly serializedJSON: SerializedJSONWithCustomFields | null;
     readonly defaultProps: Record<string, unknown>;
     readonly schema: AnyZodSchema;
+    readonly compositionId: string;
 }>;

package/dist/components/RenderModal/RenderModalJSONPropsEditor.js

@@ -36,10 +36,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.RenderModalJSONPropsEditor = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
+const react_2 = require("react");
 const no_react_1 = require("remotion/no-react");
+const client_id_1 = require("../../helpers/client-id");
 const colors_1 = require("../../helpers/colors");
-const document_title_1 = require("../../helpers/document-title");
-const use_keybinding_1 = require("../../helpers/use-keybinding");
 const Button_1 = require("../Button");
 const layout_1 = require("../layout");
 const RemTextarea_1 = require("../NewComposition/RemTextarea");
@@ -57,6 +57,24 @@ const scrollable = {
     flexDirection: 'column',
     flex: 1,
 };
+const parseJS = (value, schema) => {
+    try {
+        const zodValidation = (0, zod_schema_type_1.zodSafeParse)(schema, value);
+        return {
+            str: JSON.stringify(value, null, 2),
+            value,
+            validJSON: true,
+            zodValidation,
+        };
+    }
+    catch (e) {
+        return {
+            str: JSON.stringify(value, null, 2),
+            validJSON: false,
+            error: e.message,
+        };
+    }
+};
 const parseJSON = (str, schema) => {
     try {
         const value = no_react_1.NoReactInternals.deserializeJSONWithSpecialTypes(str);
@@ -67,14 +85,31 @@ const parseJSON = (str, schema) => {
         return { str, validJSON: false, error: e.message };
     }
 };
-const RenderModalJSONPropsEditor = ({ setValue, value, defaultProps, onSave, showSaveButton, serializedJSON, schema, }) => {
+const RenderModalJSONPropsEditor = ({ setValue, value, defaultProps, onSave, serializedJSON, schema, compositionId, }) => {
     if (serializedJSON === null) {
         throw new Error('expecting serializedJSON to be defined');
     }
-    const keybindings = (0, use_keybinding_1.useKeybinding)();
+    const { subscribeToEvent } = (0, react_2.useContext)(client_id_1.StudioServerConnectionCtx);
     const [localValue, setLocalValue] = react_1.default.useState(() => {
         return parseJSON(serializedJSON.serializedString, schema);
     });
+    (0, react_1.useEffect)(() => {
+        const unsub = subscribeToEvent('default-props-updatable-changed', (e) => {
+            if (e.type !== 'default-props-updatable-changed') {
+                return;
+            }
+            if (e.compositionId !== compositionId) {
+                return;
+            }
+            const { result } = e;
+            if (result.canUpdate) {
+                setLocalValue(parseJS(result.currentDefaultProps, schema));
+            }
+        });
+        return () => {
+            unsub();
+        };
+    }, [subscribeToEvent, compositionId, schema]);
     const onPretty = (0, react_1.useCallback)(() => {
         if (!localValue.validJSON) {
             return;
@@ -84,74 +119,43 @@ const RenderModalJSONPropsEditor = ({ setValue, value, defaultProps, onSave, sho
     }, [localValue, setLocalValue]);
     const onChange = (0, react_1.useCallback)((e) => {
         const parsed = parseJSON(e.target.value, schema);
-        if (parsed.validJSON) {
-            const validationResult = (0, zod_schema_type_1.zodSafeParse)(schema, parsed.value);
-            setLocalValue({
-                str: e.target.value,
-                value: parsed.value,
-                validJSON: parsed.validJSON,
-                zodValidation: validationResult,
-            });
-            if (validationResult.success) {
-                setValue(parsed.value);
-            }
-        }
-        else {
-            setLocalValue({
-                str: e.target.value,
-                validJSON: parsed.validJSON,
-                error: parsed.error,
-            });
+        setLocalValue(parsed);
+        if (parsed.validJSON && parsed.zodValidation.success) {
+            setValue(parsed.value);
         }
     }, [schema, setValue]);
+    const hasError = (0, react_1.useMemo)(() => {
+        return !localValue.validJSON || !localValue.zodValidation.success;
+    }, [localValue]);
     const hasChanged = (0, react_1.useMemo)(() => {
         return !(0, deep_equal_1.deepEqual)(value, defaultProps);
     }, [defaultProps, value]);
-    (0, react_1.useEffect)(() => {
-        (0, document_title_1.setUnsavedProps)(hasChanged);
-    }, [hasChanged]);
     const onQuickSave = (0, react_1.useCallback)(() => {
-        if (hasChanged) {
+        if (hasChanged && !hasError) {
             onSave();
         }
-    }, [hasChanged, onSave]);
+    }, [hasChanged, hasError, onSave]);
     // If schema is changed in code
     (0, react_1.useEffect)(() => {
         setLocalValue(parseJSON(localValue.str, schema));
     }, [localValue.str, schema]);
-    (0, react_1.useEffect)(() => {
-        const save = keybindings.registerKeybinding({
-            event: 'keydown',
-            key: 's',
-            commandCtrlKey: true,
-            callback: onQuickSave,
-            preventDefault: true,
-            triggerIfInputFieldFocused: true,
-            keepRegisteredWhenNotHighestContext: false,
-        });
-        return () => {
-            save.unregister();
-        };
-    }, [keybindings, onQuickSave, onSave]);
     const reset = (0, react_1.useCallback)(() => {
         setValue(defaultProps);
         setLocalValue(parseJSON(JSON.stringify(defaultProps, null, 2), schema));
     }, [defaultProps, schema, setValue]);
     const textAreaStyle = (0, react_1.useMemo)(() => {
-        const fail = !localValue.validJSON || !localValue.zodValidation.success;
-        if (!fail) {
+        if (!hasError) {
             return style;
         }
         return {
             ...style,
             borderColor: colors_1.FAIL_COLOR,
         };
-    }, [localValue]);
+    }, [hasError]);
     return (jsx_runtime_1.jsxs("div", { style: scrollable, children: [
-            jsx_runtime_1.jsx(RemTextarea_1.RemTextarea, { onChange: onChange, value: localValue.str, status: localValue.validJSON ? 'ok' : 'error', style: textAreaStyle }), jsx_runtime_1.jsx(layout_1.Spacing, { y: 1 }), localValue.validJSON === false ? (jsx_runtime_1.jsx(ValidationMessage_1.ValidationMessage, { align: "flex-start", message: localValue.error, type: "error" })) : localValue.zodValidation.success === false ? (jsx_runtime_1.jsx(ZodErrorMessages_1.ZodErrorMessages, { zodValidationResult: localValue.zodValidation, viewTab: "json" })) : null, jsx_runtime_1.jsx(layout_1.Spacing, { y: 1 }), jsx_runtime_1.jsxs(layout_1.Row, { children: [
-                    jsx_runtime_1.jsx(Button_1.Button, { disabled: !(hasChanged || !localValue.validJSON), onClick: reset, children: "Reset" }), jsx_runtime_1.jsx(layout_1.Flex, {}), jsx_runtime_1.jsx(Button_1.Button, { disabled: !localValue.validJSON, onClick: onPretty, children: "Format" }), jsx_runtime_1.jsx(layout_1.Spacing, { x: 1 }), showSaveButton ? (jsx_runtime_1.jsx(Button_1.Button, { onClick: onSave, disabled: !(localValue.validJSON && localValue.zodValidation.success) ||
-                            !localValue.validJSON ||
-                            !hasChanged, children: "Save" })) : null] })
+            jsx_runtime_1.jsx(RemTextarea_1.RemTextarea, { onChange: onChange, onBlur: onQuickSave, value: localValue.str, status: localValue.validJSON ? 'ok' : 'error', style: textAreaStyle }), jsx_runtime_1.jsx(layout_1.Spacing, { y: 1 }), jsx_runtime_1.jsx("div", { "data-testid": "json-props-error", children: localValue.validJSON === false ? (jsx_runtime_1.jsx(ValidationMessage_1.ValidationMessage, { align: "flex-start", message: localValue.error, type: "error" })) : localValue.zodValidation.success === false ? (jsx_runtime_1.jsx(ZodErrorMessages_1.ZodErrorMessages, { zodValidationResult: localValue.zodValidation, viewTab: "json" })) : null }), jsx_runtime_1.jsx(layout_1.Spacing, { y: 1 }), jsx_runtime_1.jsxs(layout_1.Row, { children: [
+                    jsx_runtime_1.jsx(Button_1.Button, { disabled: !(hasChanged || !localValue.validJSON), onClick: reset, children: "Reset" }), jsx_runtime_1.jsx(layout_1.Flex, {}), jsx_runtime_1.jsx(Button_1.Button, { disabled: !localValue.validJSON, onClick: onPretty, children: "Format" }), jsx_runtime_1.jsx(layout_1.Spacing, { x: 1 })
+                ] })
         ] }));
 };
 exports.RenderModalJSONPropsEditor = RenderModalJSONPropsEditor;

package/dist/components/RenderModal/SchemaEditor/Fieldset.d.ts

@@ -2,6 +2,5 @@ import React from 'react';
 export declare const SCHEMA_EDITOR_FIELDSET_PADDING = 10;
 export declare const Fieldset: React.FC<{
     readonly children: React.ReactNode;
-    readonly success: boolean;
     readonly shouldPad: boolean;
 }>;

package/dist/components/RenderModal/SchemaEditor/SchemaEditor.d.ts

@@ -1,13 +1,8 @@
 import React from 'react';
-import type { AnyZodSchema, ZodSafeParseResult } from './zod-schema-type';
+import type { AnyZodSchema } from './zod-schema-type';
+import type { UpdaterFunction } from './ZodSwitch';
 export declare const SchemaEditor: React.FC<{
     readonly schema: AnyZodSchema;
-    readonly unsavedDefaultProps: Record<string, unknown>;
-    readonly setValue: React.Dispatch<React.SetStateAction<Record<string, unknown>>>;
-    readonly zodValidationResult: ZodSafeParseResult;
-    readonly savedDefaultProps: Record<string, unknown>;
-    readonly onSave: (updater: (oldState: Record<string, unknown>) => Record<string, unknown>) => void;
-    readonly showSaveButton: boolean;
-    readonly saving: boolean;
-    readonly saveDisabledByParent: boolean;
+    readonly value: Record<string, unknown>;
+    readonly setValue: UpdaterFunction<Record<string, unknown>>;
 }>;

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

@@ -2,14 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SchemaEditor = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const remotion_1 = require("remotion");
-const document_title_1 = require("../../../helpers/document-title");
-const use_keybinding_1 = require("../../../helpers/use-keybinding");
 const get_zod_if_possible_1 = require("../../get-zod-if-possible");
 const is_menu_item_1 = require("../../Menu/is-menu-item");
-const deep_equal_1 = require("./deep-equal");
-const local_state_1 = require("./local-state");
 const SchemaErrorMessages_1 = require("./SchemaErrorMessages");
 const scroll_to_default_props_path_1 = require("./scroll-to-default-props-path");
 const zod_schema_type_1 = require("./zod-schema-type");
@@ -19,68 +13,15 @@ const scrollable = {
     flexDirection: 'column',
     overflowY: 'auto',
 };
-const SchemaEditor = ({ schema, unsavedDefaultProps, setValue, zodValidationResult, savedDefaultProps, onSave, showSaveButton, saving, saveDisabledByParent, }) => {
-    const keybindings = (0, use_keybinding_1.useKeybinding)();
-    const [revision, setRevision] = (0, react_1.useState)(0);
-    const revisionState = (0, react_1.useMemo)(() => {
-        return {
-            childResetRevision: revision,
-        };
-    }, [revision]);
-    (0, react_1.useEffect)(() => {
-        const bumpRevision = () => {
-            setRevision((old) => old + 1);
-        };
-        window.addEventListener(remotion_1.Internals.PROPS_UPDATED_EXTERNALLY, bumpRevision);
-        return () => {
-            window.removeEventListener(remotion_1.Internals.PROPS_UPDATED_EXTERNALLY, bumpRevision);
-        };
-    }, []);
+const SchemaEditor = ({ schema, value, setValue }) => {
     const z = (0, get_zod_if_possible_1.useZodIfPossible)();
     if (!z) {
         throw new Error('expected zod');
     }
-    const hasChanged = (0, react_1.useMemo)(() => {
-        return !(0, deep_equal_1.deepEqual)(savedDefaultProps, unsavedDefaultProps);
-    }, [savedDefaultProps, unsavedDefaultProps]);
-    (0, react_1.useEffect)(() => {
-        (0, document_title_1.setUnsavedProps)(hasChanged);
-    }, [hasChanged]);
-    const onQuickSave = (0, react_1.useCallback)(() => {
-        if (hasChanged && showSaveButton) {
-            onSave(() => {
-                return unsavedDefaultProps;
-            });
-        }
-    }, [hasChanged, onSave, showSaveButton, unsavedDefaultProps]);
-    (0, react_1.useEffect)(() => {
-        const save = keybindings.registerKeybinding({
-            event: 'keydown',
-            key: 's',
-            commandCtrlKey: true,
-            callback: onQuickSave,
-            preventDefault: true,
-            triggerIfInputFieldFocused: true,
-            keepRegisteredWhenNotHighestContext: true,
-        });
-        return () => {
-            save.unregister();
-        };
-    }, [keybindings, onQuickSave, onSave]);
     const typeName = (0, zod_schema_type_1.getZodSchemaType)(schema);
-    const reset = (0, react_1.useCallback)(() => {
-        setValue(savedDefaultProps);
-    }, [savedDefaultProps, setValue]);
-    if (!zodValidationResult.success) {
-        const defaultPropsValid = (0, zod_schema_type_1.zodSafeParse)(schema, savedDefaultProps);
-        if (!defaultPropsValid.success) {
-            return jsx_runtime_1.jsx(SchemaErrorMessages_1.InvalidDefaultProps, { zodValidationResult: zodValidationResult });
-        }
-        return (jsx_runtime_1.jsx(SchemaErrorMessages_1.InvalidSchema, { reset: reset, zodValidationResult: zodValidationResult }));
-    }
     if (typeName !== 'object') {
         return jsx_runtime_1.jsx(SchemaErrorMessages_1.TopLevelZodValue, { typeReceived: typeName });
     }
-    return (jsx_runtime_1.jsx("div", { ref: scroll_to_default_props_path_1.defaultPropsEditorScrollableAreaRef, style: scrollable, className: is_menu_item_1.VERTICAL_SCROLLBAR_CLASSNAME, children: jsx_runtime_1.jsx(local_state_1.RevisionContext.Provider, { value: revisionState, children: jsx_runtime_1.jsx(ZodObjectEditor_1.ZodObjectEditor, { discriminatedUnionReplacement: null, unsavedValue: unsavedDefaultProps, setValue: setValue, jsonPath: [], schema: schema, savedValue: savedDefaultProps, onSave: onSave, showSaveButton: showSaveButton, onRemove: null, saving: saving, saveDisabledByParent: saveDisabledByParent, mayPad: true }) }) }));
+    return (jsx_runtime_1.jsx("div", { ref: scroll_to_default_props_path_1.defaultPropsEditorScrollableAreaRef, style: scrollable, className: is_menu_item_1.VERTICAL_SCROLLBAR_CLASSNAME, children: jsx_runtime_1.jsx(ZodObjectEditor_1.ZodObjectEditor, { discriminatedUnionReplacement: null, value: value, setValue: setValue, jsonPath: [], schema: schema, onRemove: null, mayPad: true }) }));
 };
 exports.SchemaEditor = SchemaEditor;

package/dist/components/RenderModal/SchemaEditor/SchemaErrorMessages.d.ts

@@ -7,7 +7,6 @@ export declare const InvalidDefaultProps: React.FC<{
 }>;
 export declare const InvalidSchema: React.FC<{
     zodValidationResult: ZodSafeParseResult;
-    reset: () => void;
 }>;
 export declare const TopLevelZodValue: React.FC<{
     typeReceived: string;

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

@@ -70,10 +70,9 @@ const InvalidDefaultProps = ({ zodValidationResult }) => {
         ] }));
 };
 exports.InvalidDefaultProps = InvalidDefaultProps;
-const InvalidSchema = ({ zodValidationResult, reset }) => {
+const InvalidSchema = ({ zodValidationResult }) => {
     return (jsx_runtime_1.jsxs("div", { style: errorContainer, children: [
-            jsx_runtime_1.jsx("div", { style: errorExplanation, children: "The data does not satisfy the schema:" }), jsx_runtime_1.jsx(layout_1.Spacing, { y: 1, block: true }), jsx_runtime_1.jsx(ZodErrorMessages_1.ZodErrorMessages, { zodValidationResult: zodValidationResult, viewTab: "schema" }), jsx_runtime_1.jsx(layout_1.Spacing, { y: 1, block: true }), jsx_runtime_1.jsx("div", { style: errorExplanation, children: "Fix the schema using the JSON editor." }), jsx_runtime_1.jsx(layout_1.Spacing, { y: 1, block: true }), jsx_runtime_1.jsxs("div", { style: errorExplanation, children: ["Alternatively, reset the data to the", ' ', jsx_runtime_1.jsx("code", { style: styles_1.inlineCodeSnippet, children: "defaultProps" }),
-                    " that you have defined."] }), jsx_runtime_1.jsx(layout_1.Spacing, { y: 1, block: true }), jsx_runtime_1.jsx(Button_1.Button, { onClick: reset, children: "Reset props" })
+            jsx_runtime_1.jsx("div", { style: errorExplanation, children: "The data does not satisfy the schema:" }), jsx_runtime_1.jsx(layout_1.Spacing, { y: 1, block: true }), jsx_runtime_1.jsx(ZodErrorMessages_1.ZodErrorMessages, { zodValidationResult: zodValidationResult, viewTab: "schema" }), jsx_runtime_1.jsx(layout_1.Spacing, { y: 1, block: true }), jsx_runtime_1.jsx("div", { style: errorExplanation, children: "Fix the schema using the JSON editor." })
         ] }));
 };
 exports.InvalidSchema = InvalidSchema;

package/dist/components/RenderModal/SchemaEditor/SchemaLabel.d.ts

@@ -2,14 +2,8 @@ import React from 'react';
 import type { JSONPath } from './zod-types';
 export declare const SchemaLabel: React.FC<{
     readonly jsonPath: JSONPath;
-    readonly isDefaultValue: boolean;
-    readonly onReset: () => void;
-    readonly onSave: () => void;
     readonly onRemove: null | (() => void);
-    readonly showSaveButton: boolean;
-    readonly saving: boolean;
     readonly valid: boolean;
-    readonly saveDisabledByParent: boolean;
     readonly suffix: string | null;
     readonly handleClick: null | (() => void);
 }>;

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

@@ -7,8 +7,6 @@ const colors_1 = require("../../../helpers/colors");
 const layout_1 = require("../../layout");
 const InlineRemoveButton_1 = require("../InlineRemoveButton");
 const get_schema_label_1 = require("./get-schema-label");
-const SchemaResetButton_1 = require("./SchemaResetButton");
-const SchemaSaveButton_1 = require("./SchemaSaveButton");
 const scroll_to_default_props_path_1 = require("./scroll-to-default-props-path");
 const compactStyles = {
     fontSize: 15,
@@ -19,9 +17,8 @@ const compactStyles = {
     alignItems: 'center',
     flex: 1,
 };
-const SchemaLabel = ({ jsonPath, isDefaultValue, onReset, onSave, showSaveButton, onRemove, saving, valid, saveDisabledByParent, suffix, handleClick, }) => {
+const SchemaLabel = ({ jsonPath, onRemove, valid, suffix, handleClick }) => {
     const [clickableButtonHovered, setClickableButtonHovered] = (0, react_1.useState)(false);
-    const disableSave = saving || !valid || saveDisabledByParent;
     const labelStyle = (0, react_1.useMemo)(() => {
         return {
             fontFamily: 'monospace',
@@ -43,6 +40,6 @@ const SchemaLabel = ({ jsonPath, isDefaultValue, onReset, onSave, showSaveButton
     const labelContent = (jsx_runtime_1.jsxs("span", { style: labelStyle, children: [(0, get_schema_label_1.getSchemaLabel)(jsonPath), " ", suffix ? suffix : null] }));
     return (jsx_runtime_1.jsxs("div", { style: compactStyles, className: scroll_to_default_props_path_1.DEFAULT_PROPS_PATH_CLASSNAME, "data-json-path": jsonPath.join('.'), children: [handleClick ? (
             // Minus the padding that a button has (user agent padding-line-start)
-            jsx_runtime_1.jsx("button", { onPointerEnter: onClickablePointerEnter, onPointerLeave: onClickablePointerLeave, type: "button", onClick: handleClick, style: { border: 'none', padding: 0 }, children: labelContent })) : (labelContent), jsx_runtime_1.jsx(layout_1.Flex, {}), isDefaultValue ? null : jsx_runtime_1.jsx(SchemaResetButton_1.SchemaResetButton, { onClick: onReset }), isDefaultValue ? null : showSaveButton ? (jsx_runtime_1.jsx(SchemaSaveButton_1.SchemaSaveButton, { onClick: onSave, disabled: disableSave })) : null, onRemove ? jsx_runtime_1.jsx(InlineRemoveButton_1.InlineRemoveButton, { onClick: onRemove }) : null] }));
+            jsx_runtime_1.jsx("button", { onPointerEnter: onClickablePointerEnter, onPointerLeave: onClickablePointerLeave, type: "button", onClick: handleClick, style: { border: 'none', padding: 0 }, children: labelContent })) : (labelContent), jsx_runtime_1.jsx(layout_1.Flex, {}), onRemove ? jsx_runtime_1.jsx(InlineRemoveButton_1.InlineRemoveButton, { onClick: onRemove }) : null] }));
 };
 exports.SchemaLabel = SchemaLabel;

package/dist/components/RenderModal/SchemaEditor/SchemaSeparationLine.d.ts

@@ -3,7 +3,9 @@ import type { AnyZodSchema } from './zod-schema-type';
 export declare const VERTICAL_GUIDE_HEIGHT = 24;
 export declare const SchemaSeparationLine: React.FC;
 export declare const SchemaArrayItemSeparationLine: React.FC<{
-    readonly onChange: (updater: (oldV: unknown[]) => unknown[], forceApply: boolean, increment: boolean) => void;
+    readonly onChange: (updater: (oldV: unknown[]) => unknown[], options: {
+        shouldSave: boolean;
+    }) => void;
     readonly index: number;
     readonly schema: AnyZodSchema;
     readonly showAddButton: boolean;

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

@@ -41,7 +41,7 @@ const SchemaArrayItemSeparationLine = ({ onChange, index, schema, isLast, showAd
                 (0, create_zod_values_1.createZodValues)(arrayElement, z, zodTypes),
                 ...oldV.slice(index + 1),
             ];
-        }, false, true);
+        }, { shouldSave: true });
     }, [arrayElement, index, onChange, z, zodTypes]);
     const dynamicAddButtonStyle = (0, react_1.useMemo)(() => {
         return {

package/dist/components/RenderModal/SchemaEditor/ZodArrayEditor.d.ts

@@ -1,17 +1,12 @@
 import React from 'react';
-import type { AnyZodSchema } from './zod-schema-type';
+import { type AnyZodSchema } from './zod-schema-type';
 import type { JSONPath } from './zod-types';
 import type { UpdaterFunction } from './ZodSwitch';
 export declare const ZodArrayEditor: React.FC<{
     readonly schema: AnyZodSchema;
     readonly jsonPath: JSONPath;
     readonly value: unknown[];
-    readonly defaultValue: unknown[];
     readonly setValue: UpdaterFunction<unknown[]>;
-    readonly onSave: UpdaterFunction<unknown[]>;
-    readonly showSaveButton: boolean;
     readonly onRemove: null | (() => void);
-    readonly saving: boolean;
-    readonly saveDisabledByParent: boolean;
     readonly mayPad: boolean;
 }>;

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

@@ -37,25 +37,20 @@ exports.ZodArrayEditor = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const get_zod_if_possible_1 = require("../../get-zod-if-possible");
-const create_zod_values_1 = require("./create-zod-values");
-const deep_equal_1 = require("./deep-equal");
 const Fieldset_1 = require("./Fieldset");
-const local_state_1 = require("./local-state");
 const SchemaLabel_1 = require("./SchemaLabel");
 const SchemaSeparationLine_1 = require("./SchemaSeparationLine");
 const SchemaVerticalGuide_1 = require("./SchemaVerticalGuide");
 const zod_schema_type_1 = require("./zod-schema-type");
+const zod_schema_type_2 = require("./zod-schema-type");
 const ZodArrayItemEditor_1 = require("./ZodArrayItemEditor");
 const ZodFieldValidation_1 = require("./ZodFieldValidation");
-const ZodArrayEditor = ({ schema, jsonPath, setValue, defaultValue, value, onSave, showSaveButton, onRemove, saving, saveDisabledByParent, mayPad, }) => {
-    const { localValue, onChange, RevisionContextProvider, reset } = (0, local_state_1.useLocalState)({
-        unsavedValue: value,
-        schema,
-        setValue,
-        savedValue: defaultValue,
-    });
+const ZodArrayEditor = ({ schema, jsonPath, setValue, value, onRemove, mayPad }) => {
+    const onChange = (0, react_1.useCallback)((updater, { shouldSave }) => {
+        setValue(updater, { shouldSave });
+    }, [setValue]);
     const [expanded, setExpanded] = (0, react_1.useState)(true);
-    const arrayElement = (0, zod_schema_type_1.getArrayElement)(schema);
+    const arrayElement = (0, zod_schema_type_2.getArrayElement)(schema);
     const suffix = (0, react_1.useMemo)(() => {
         return expanded ? ' [' : ' [...] ';
     }, [expanded]);
@@ -63,24 +58,18 @@ const ZodArrayEditor = ({ schema, jsonPath, setValue, defaultValue, value, onSav
     if (!z) {
         throw new Error('expected zod');
     }
-    const zodTypes = (0, get_zod_if_possible_1.useZodTypesIfPossible)();
-    const isDefaultValue = (0, react_1.useMemo)(() => {
-        return (0, deep_equal_1.deepEqual)(localValue.value, defaultValue);
-    }, [defaultValue, localValue]);
-    return (jsx_runtime_1.jsxs(Fieldset_1.Fieldset, { shouldPad: mayPad, success: localValue.zodValidation.success, children: [
+    const zodValidation = (0, react_1.useMemo)(() => (0, zod_schema_type_1.zodSafeParse)(schema, value), [schema, value]);
+    return (jsx_runtime_1.jsxs(Fieldset_1.Fieldset, { shouldPad: mayPad, children: [
             jsx_runtime_1.jsx("div", { style: {
                     display: 'flex',
                     flexDirection: 'row',
-                }, children: jsx_runtime_1.jsx(SchemaLabel_1.SchemaLabel, { onReset: reset, isDefaultValue: isDefaultValue, jsonPath: jsonPath, onRemove: onRemove, suffix: suffix, onSave: () => {
-                        onSave(() => localValue.value, false, false);
-                    }, saveDisabledByParent: saveDisabledByParent, saving: saving, showSaveButton: showSaveButton, valid: localValue.zodValidation.success, handleClick: () => setExpanded(!expanded) }) }), expanded ? (jsx_runtime_1.jsx(RevisionContextProvider, { children: jsx_runtime_1.jsxs(SchemaVerticalGuide_1.SchemaVerticalGuide, { isRoot: false, children: [localValue.value.map((child, i) => {
-                            var _a;
-                            return (
-                            // eslint-disable-next-line react/no-array-index-key
-                            jsx_runtime_1.jsxs(react_1.default.Fragment, { children: [
-                                    jsx_runtime_1.jsx(ZodArrayItemEditor_1.ZodArrayItemEditor, { onChange: onChange, value: child, elementSchema: arrayElement, index: i, jsonPath: jsonPath, defaultValue: (_a = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue[i]) !== null && _a !== void 0 ? _a : (0, create_zod_values_1.createZodValues)(arrayElement, z, zodTypes), onSave: onSave, showSaveButton: showSaveButton, saving: saving, saveDisabledByParent: saveDisabledByParent, mayPad: mayPad, mayRemove: true }), jsx_runtime_1.jsx(SchemaSeparationLine_1.SchemaArrayItemSeparationLine, { schema: schema, index: i, onChange: onChange, isLast: i === localValue.value.length - 1, showAddButton: true })
-                                ] }, `${i}${localValue.keyStabilityRevision}`));
-                        }), value.length === 0 ? (jsx_runtime_1.jsx(SchemaSeparationLine_1.SchemaArrayItemSeparationLine, { schema: schema, index: 0, onChange: onChange, isLast: true, showAddButton: true })) : null] }) })) : null, jsx_runtime_1.jsx(ZodFieldValidation_1.ZodFieldValidation, { path: jsonPath, localValue: localValue })
+                }, children: jsx_runtime_1.jsx(SchemaLabel_1.SchemaLabel, { jsonPath: jsonPath, onRemove: onRemove, suffix: suffix, valid: zodValidation.success, handleClick: () => setExpanded(!expanded) }) }), expanded ? (jsx_runtime_1.jsxs(SchemaVerticalGuide_1.SchemaVerticalGuide, { isRoot: false, children: [value.map((child, i) => {
+                        return (
+                        // eslint-disable-next-line react/no-array-index-key
+                        jsx_runtime_1.jsxs(react_1.default.Fragment, { children: [
+                                jsx_runtime_1.jsx(ZodArrayItemEditor_1.ZodArrayItemEditor, { onChange: onChange, value: child, elementSchema: arrayElement, index: i, jsonPath: jsonPath, mayPad: mayPad, mayRemove: true }), jsx_runtime_1.jsx(SchemaSeparationLine_1.SchemaArrayItemSeparationLine, { schema: schema, index: i, onChange: onChange, isLast: i === value.length - 1, showAddButton: true })
+                            ] }, i));
+                    }), value.length === 0 ? (jsx_runtime_1.jsx(SchemaSeparationLine_1.SchemaArrayItemSeparationLine, { schema: schema, index: 0, onChange: onChange, isLast: true, showAddButton: true })) : null] })) : null, jsx_runtime_1.jsx(ZodFieldValidation_1.ZodFieldValidation, { path: jsonPath, zodValidation: zodValidation })
         ] }));
 };
 exports.ZodArrayEditor = ZodArrayEditor;