@remotion/studio 4.0.424 → 4.0.426

package/dist/api/create-composition.d.ts

@@ -1,4 +1,3 @@
-import type { CompositionProps, StillProps } from 'remotion';
-import type { AnyZodObject } from 'zod';
+import type { AnyZodObject, CompositionProps, StillProps } from 'remotion';
 export declare const createComposition: <Schema extends AnyZodObject, Props extends Record<string, unknown>>({ ...other }: CompositionProps<Schema, Props>) => () => import("react/jsx-runtime").JSX.Element;
 export declare const createStill: <Schema extends AnyZodObject, Props extends Record<string, unknown>>({ ...other }: StillProps<Schema, Props>) => () => import("react/jsx-runtime").JSX.Element;

package/dist/api/helpers/calc-new-props.d.ts

@@ -1,5 +1,4 @@
-import type { AnyComposition } from 'remotion';
-import type { AnyZodObject } from 'zod';
+import type { AnyComposition, AnyZodObject } from 'remotion';
 export type UpdateDefaultPropsFunction = (currentValues: {
     schema: AnyZodObject | null;
     savedDefaultProps: Record<string, unknown>;

package/dist/components/AssetSelector.js

@@ -123,6 +123,6 @@ const AssetSelector = ({ readOnlyStudio }) => {
                         " in the root of your project and place a file in it."] }) }))) : (jsx_runtime_1.jsx("div", { className: "__remotion-vertical-scrollbar", style: {
                     ...list,
                     backgroundColor: isDropDiv ? colors_1.CLEAR_HOVER : colors_1.BACKGROUND,
-                }, onDragEnter: onDragEnter, onDragLeave: onDragLeave, children: jsx_runtime_1.jsx(AssetSelectorItem_1.AssetFolderTree, { item: assetTree, level: 0, parentFolder: null, name: null, tabIndex: tabIndex, toggleFolder: toggleFolder, dropLocation: dropLocation, setDropLocation: setDropLocation }) }))] }));
+                }, onDragEnter: onDragEnter, onDragLeave: onDragLeave, children: jsx_runtime_1.jsx(AssetSelectorItem_1.AssetFolderTree, { item: assetTree, level: 0, parentFolder: null, name: null, tabIndex: tabIndex, toggleFolder: toggleFolder, dropLocation: dropLocation, setDropLocation: setDropLocation, readOnlyStudio: readOnlyStudio }) }))] }));
 };
 exports.AssetSelector = AssetSelector;

package/dist/components/AssetSelectorItem.d.ts

@@ -9,4 +9,5 @@ export declare const AssetFolderTree: React.FC<{
     readonly toggleFolder: (folderName: string, parentName: string | null) => void;
     readonly dropLocation: string | null;
     readonly setDropLocation: React.Dispatch<React.SetStateAction<string | null>>;
+    readonly readOnlyStudio: boolean;
 }>;

package/dist/components/AssetSelectorItem.js

@@ -92,7 +92,7 @@ const revealIconStyle = {
     height: 12,
     color: 'currentColor',
 };
-const AssetFolderItem = ({ tabIndex, item, level, parentFolder, toggleFolder, dropLocation, setDropLocation, }) => {
+const AssetFolderItem = ({ tabIndex, item, level, parentFolder, toggleFolder, dropLocation, setDropLocation, readOnlyStudio, }) => {
     const [hovered, setHovered] = (0, react_1.useState)(false);
     const openFolderTimerRef = (0, react_1.useRef)(null);
     const { isDropDiv, onDragEnter, onDragLeave } = (0, use_asset_drag_events_1.default)({
@@ -139,20 +139,20 @@ const AssetFolderItem = ({ tabIndex, item, level, parentFolder, toggleFolder, dr
                     }
                 }, children: jsx_runtime_1.jsxs(layout_1.Row, { children: [
                         jsx_runtime_1.jsx(Icon, { style: iconStyle, color: hovered ? 'white' : colors_1.LIGHT_TEXT }), jsx_runtime_1.jsx(layout_1.Spacing, { x: 1 }), jsx_runtime_1.jsx("div", { style: label, children: item.name })
-                    ] }) }), item.expanded ? (jsx_runtime_1.jsx(exports.AssetFolderTree, { item: item.items, name: item.name, level: level, parentFolder: parentFolder, tabIndex: tabIndex, toggleFolder: toggleFolder, dropLocation: dropLocation, setDropLocation: setDropLocation }, item.name)) : null] }));
+                    ] }) }), item.expanded ? (jsx_runtime_1.jsx(exports.AssetFolderTree, { item: item.items, name: item.name, level: level, parentFolder: parentFolder, tabIndex: tabIndex, toggleFolder: toggleFolder, dropLocation: dropLocation, setDropLocation: setDropLocation, readOnlyStudio: readOnlyStudio }, item.name)) : null] }));
 };
-const AssetFolderTree = ({ item, level, name, parentFolder, toggleFolder, tabIndex, dropLocation, setDropLocation, }) => {
+const AssetFolderTree = ({ item, level, name, parentFolder, toggleFolder, tabIndex, dropLocation, setDropLocation, readOnlyStudio, }) => {
     const combinedParents = (0, react_1.useMemo)(() => {
         return [parentFolder, name].filter(no_react_1.NoReactInternals.truthy).join('/');
     }, [name, parentFolder]);
     return (jsx_runtime_1.jsxs("div", { children: [item.folders.map((folder) => {
-                return (jsx_runtime_1.jsx(AssetFolderItem, { item: folder, tabIndex: tabIndex, level: level + 1, parentFolder: combinedParents, toggleFolder: toggleFolder, dropLocation: dropLocation, setDropLocation: setDropLocation }, folder.name));
+                return (jsx_runtime_1.jsx(AssetFolderItem, { item: folder, tabIndex: tabIndex, level: level + 1, parentFolder: combinedParents, toggleFolder: toggleFolder, dropLocation: dropLocation, setDropLocation: setDropLocation, readOnlyStudio: readOnlyStudio }, folder.name));
             }), item.files.map((file) => {
-                return (jsx_runtime_1.jsx(AssetSelectorItem, { item: file, tabIndex: tabIndex, level: level, parentFolder: combinedParents }, file.src));
+                return (jsx_runtime_1.jsx(AssetSelectorItem, { item: file, tabIndex: tabIndex, level: level, parentFolder: combinedParents, readOnlyStudio: readOnlyStudio }, file.src));
             })] }));
 };
 exports.AssetFolderTree = AssetFolderTree;
-const AssetSelectorItem = ({ item, tabIndex, level, parentFolder }) => {
+const AssetSelectorItem = ({ item, tabIndex, level, parentFolder, readOnlyStudio }) => {
     const isMobileLayout = (0, mobile_layout_1.useMobileLayout)();
     const [hovered, setHovered] = (0, react_1.useState)(false);
     const { setSidebarCollapsedState } = (0, react_1.useContext)(sidebar_1.SidebarContext);
@@ -238,6 +238,7 @@ const AssetSelectorItem = ({ item, tabIndex, level, parentFolder }) => {
     }, [item.name, parentFolder]);
     return (jsx_runtime_1.jsx(layout_1.Row, { align: "center", children: jsx_runtime_1.jsxs("div", { style: style, onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, onClick: onClick, tabIndex: tabIndex, title: item.name, children: [
                 jsx_runtime_1.jsx(file_1.FileIcon, { style: iconStyle, color: colors_1.LIGHT_TEXT }), jsx_runtime_1.jsx(layout_1.Spacing, { x: 1 }), jsx_runtime_1.jsx("div", { style: label, children: item.name }), hovered ? (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
-                        jsx_runtime_1.jsx(layout_1.Spacing, { x: 0.5 }), jsx_runtime_1.jsx(InlineAction_1.InlineAction, { title: "Copy staticFile() name", renderAction: renderCopyAction, onClick: copyToClipboard }), jsx_runtime_1.jsx(layout_1.Spacing, { x: 0.5 }), jsx_runtime_1.jsx(InlineAction_1.InlineAction, { title: "Open in Explorer", renderAction: renderFileExplorerAction, onClick: revealInExplorer })
-                    ] })) : null] }) }));
+                        jsx_runtime_1.jsx(layout_1.Spacing, { x: 0.5 }), jsx_runtime_1.jsx(InlineAction_1.InlineAction, { title: "Copy staticFile() name", renderAction: renderCopyAction, onClick: copyToClipboard }), readOnlyStudio ? null : (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
+                                jsx_runtime_1.jsx(layout_1.Spacing, { x: 0.5 }), jsx_runtime_1.jsx(InlineAction_1.InlineAction, { title: "Open in Explorer", renderAction: renderFileExplorerAction, onClick: revealInExplorer })
+                            ] }))] })) : null] }) }));
 };

package/dist/components/InitialCompositionLoader.js

@@ -77,10 +77,22 @@ const InitialCompositionLoader = () => {
     const selectAsset = (0, exports.useSelectAsset)();
     const staticFiles = (0, use_static_files_1.useStaticFiles)();
     (0, react_1.useEffect)(() => {
+        const canvasContentFromUrl = (0, load_canvas_content_from_url_1.deriveCanvasContentFromUrl)();
         if (canvasContent) {
+            // If the URL points to a different composition than the one currently
+            // displayed, switch to it. This handles the case where the URL is
+            // updated externally (e.g. after duplicating a composition).
+            if (canvasContentFromUrl &&
+                canvasContentFromUrl.type === 'composition' &&
+                canvasContent.type === 'composition' &&
+                canvasContentFromUrl.compositionId !== canvasContent.compositionId) {
+                const exists = compositions.find((c) => c.id === canvasContentFromUrl.compositionId);
+                if (exists) {
+                    selectComposition(exists, false);
+                }
+            }
             return;
         }
-        const canvasContentFromUrl = (0, load_canvas_content_from_url_1.deriveCanvasContentFromUrl)();
         if (canvasContentFromUrl && canvasContentFromUrl.type === 'composition') {
             const exists = compositions.find((c) => c.id === canvasContentFromUrl.compositionId);
             if (exists) {

package/dist/components/NewComposition/CodemodFooter.d.ts

@@ -10,4 +10,5 @@ export declare const CodemodFooter: React.FC<{
     readonly submitLabel: (options: {
         relativeRootPath: string;
     }) => string;
+    readonly onSuccess: (() => void) | null;
 }>;

package/dist/components/NewComposition/CodemodFooter.js

@@ -11,7 +11,7 @@ const NotificationCenter_1 = require("../Notifications/NotificationCenter");
 const actions_1 = require("../RenderQueue/actions");
 const layout_1 = require("../layout");
 const DiffPreview_1 = require("./DiffPreview");
-const CodemodFooter = ({ codemod, valid, loadingNotification, successNotification, errorNotification, genericSubmitLabel, submitLabel, }) => {
+const CodemodFooter = ({ codemod, valid, loadingNotification, successNotification, errorNotification, genericSubmitLabel, submitLabel, onSuccess, }) => {
     const [submitting, setSubmitting] = (0, react_1.useState)(false);
     const { setSelectedModal } = (0, react_1.useContext)(modals_1.ModalsContext);
     const [codemodStatus, setCanApplyCodemod] = (0, react_1.useState)({
@@ -42,6 +42,7 @@ const CodemodFooter = ({ codemod, valid, loadingNotification, successNotificatio
         })
             .then(() => {
             notification.replaceContent(successNotification, 2000);
+            onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess();
         })
             .catch((err) => {
             notification.replaceContent(`${errorNotification}: ${err.message}`, 2000);
@@ -50,6 +51,7 @@ const CodemodFooter = ({ codemod, valid, loadingNotification, successNotificatio
         codemod,
         errorNotification,
         loadingNotification,
+        onSuccess,
         setSelectedModal,
         successNotification,
     ]);

package/dist/components/NewComposition/DeleteComposition.js

@@ -36,7 +36,7 @@ const DeleteCompositionLoaded = ({ compositionId }) => {
                             jsx_runtime_1.jsx("br", {}),
                             "The associated ",
                             jsx_runtime_1.jsx("code", { style: styles_1.inlineCodeSnippet, children: "component" }),
-                            " will remain in your code."] }), jsx_runtime_1.jsx(ModalFooter_1.ModalFooterContainer, { children: jsx_runtime_1.jsx(CodemodFooter_1.CodemodFooter, { errorNotification: `Could not delete composition`, loadingNotification: 'Deleting', successNotification: `Deleted ${unresolved.id}`, genericSubmitLabel: `Delete`, submitLabel: ({ relativeRootPath }) => `Delete from ${relativeRootPath}`, codemod: codemod, valid: true }) })
+                            " will remain in your code."] }), jsx_runtime_1.jsx(ModalFooter_1.ModalFooterContainer, { children: jsx_runtime_1.jsx(CodemodFooter_1.CodemodFooter, { errorNotification: `Could not delete composition`, loadingNotification: 'Deleting', successNotification: `Deleted ${unresolved.id}`, genericSubmitLabel: `Delete`, submitLabel: ({ relativeRootPath }) => `Delete from ${relativeRootPath}`, codemod: codemod, valid: true, onSuccess: null }) })
                 ] })
         ] }));
 };

package/dist/components/NewComposition/DuplicateComposition.js

@@ -4,6 +4,7 @@ exports.DuplicateComposition = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const remotion_1 = require("remotion");
+const url_state_1 = require("../../helpers/url-state");
 const validate_new_comp_data_1 = require("../../helpers/validate-new-comp-data");
 const ModalFooter_1 = require("../ModalFooter");
 const ModalHeader_1 = require("../ModalHeader");
@@ -166,6 +167,9 @@ const DuplicateCompositionLoaded = ({ initialType }) => {
         size.width,
         type,
     ]);
+    const onDuplicateSuccess = (0, react_1.useCallback)(() => {
+        (0, url_state_1.pushUrl)(`/${newId}`);
+    }, [newId]);
     const onSubmit = (0, react_1.useCallback)((e) => {
         e.preventDefault();
     }, []);
@@ -195,7 +199,7 @@ const DuplicateCompositionLoaded = ({ initialType }) => {
                                         ] })
                                 ] })) : null, type === 'composition' && hadDurationDefined ? (jsx_runtime_1.jsx(NewCompDuration_1.NewCompDuration, { durationInFrames: durationInFrames, setDurationInFrames: setDurationInFrames })) : null, type === 'composition' && hadFpsDefined ? (jsx_runtime_1.jsxs("div", { style: layout_1.optionRow, children: [
                                     jsx_runtime_1.jsx("div", { style: layout_1.label, children: "FPS" }), jsx_runtime_1.jsx("div", { style: layout_1.rightRow, children: jsx_runtime_1.jsx(InputDragger_1.InputDragger, { type: "number", value: selectedFrameRate, onTextChange: onTextFpsChange, placeholder: "Frame rate (fps)", name: "fps", min: 1, required: true, status: "ok", max: 240, step: 0.01, onValueChange: onFpsChange, rightAlign: false }) })
-                                ] })) : null] }), jsx_runtime_1.jsx(ModalFooter_1.ModalFooterContainer, { children: jsx_runtime_1.jsx(CodemodFooter_1.CodemodFooter, { loadingNotification: 'Duplicating...', errorNotification: 'Could not duplicate composition', successNotification: `Duplicated ${unresolved.id} as ${newId}`, genericSubmitLabel: 'Duplicate', submitLabel: ({ relativeRootPath }) => `Add to ${relativeRootPath}`, codemod: codemod, valid: valid }) })
+                                ] })) : null] }), jsx_runtime_1.jsx(ModalFooter_1.ModalFooterContainer, { children: jsx_runtime_1.jsx(CodemodFooter_1.CodemodFooter, { loadingNotification: 'Duplicating...', errorNotification: 'Could not duplicate composition', successNotification: `Duplicated ${unresolved.id} as ${newId}`, genericSubmitLabel: 'Duplicate', submitLabel: ({ relativeRootPath }) => `Add to ${relativeRootPath}`, codemod: codemod, valid: valid, onSuccess: onDuplicateSuccess }) })
                 ] })
         ] }));
 };

package/dist/components/NewComposition/RenameComposition.js

@@ -55,7 +55,7 @@ const RenameCompositionLoaded = () => {
                                             jsx_runtime_1.jsx(RemInput_1.RemotionInput, { value: newId, onChange: onNameChange, type: "text", autoFocus: true, placeholder: "Composition ID", status: "ok", rightAlign: true }), compNameErrMessage ? (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
                                                     jsx_runtime_1.jsx(layout_2.Spacing, { y: 1, block: true }), jsx_runtime_1.jsx(ValidationMessage_1.ValidationMessage, { align: "flex-start", message: compNameErrMessage, type: "error" })
                                                 ] })) : null] }) })
-                            ] }) }), jsx_runtime_1.jsx(ModalFooter_1.ModalFooterContainer, { children: jsx_runtime_1.jsx(CodemodFooter_1.CodemodFooter, { loadingNotification: 'Renaming...', errorNotification: 'Could not rename composition', successNotification: `Renamed to ${newId}`, genericSubmitLabel: 'Rename', submitLabel: ({ relativeRootPath }) => `Modify ${relativeRootPath}`, codemod: codemod, valid: valid }) })
+                            ] }) }), jsx_runtime_1.jsx(ModalFooter_1.ModalFooterContainer, { children: jsx_runtime_1.jsx(CodemodFooter_1.CodemodFooter, { loadingNotification: 'Renaming...', errorNotification: 'Could not rename composition', successNotification: `Renamed to ${newId}`, genericSubmitLabel: 'Rename', submitLabel: ({ relativeRootPath }) => `Modify ${relativeRootPath}`, codemod: codemod, valid: valid, onSuccess: null }) })
                 ] })
         ] }));
 };

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

@@ -1,10 +1,11 @@
 import React from 'react';
 import type { _InternalTypes } from 'remotion';
+import type { ZodSafeParseResult } from './SchemaEditor/zod-schema-type';
 export type State = {
     str: string;
     value: Record<string, unknown>;
     validJSON: true;
-    zodValidation: Zod.SafeParseReturnType<unknown, unknown>;
+    zodValidation: ZodSafeParseResult;
 } | {
     str: string;
     validJSON: false;

package/dist/components/RenderModal/DataEditor.js

@@ -51,6 +51,7 @@ const RenderModalJSONPropsEditor_1 = require("./RenderModalJSONPropsEditor");
 const SchemaEditor_1 = require("./SchemaEditor/SchemaEditor");
 const SchemaErrorMessages_1 = require("./SchemaEditor/SchemaErrorMessages");
 const extract_enum_json_paths_1 = require("./SchemaEditor/extract-enum-json-paths");
+const zod_schema_type_1 = require("./SchemaEditor/zod-schema-type");
 const WarningIndicatorButton_1 = require("./WarningIndicatorButton");
 const get_render_modal_warnings_1 = require("./get-render-modal-warnings");
 const errorExplanation = {
@@ -127,7 +128,8 @@ const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayS
         if (!unresolvedComposition.schema) {
             return 'no-schema';
         }
-        if (!(typeof unresolvedComposition.schema.safeParse === 'function')) {
+        if (!(typeof unresolvedComposition.schema
+            .safeParse === 'function')) {
             throw new Error('A value which is not a Zod schema was passed to `schema`');
         }
         return unresolvedComposition.schema;
@@ -139,7 +141,7 @@ const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayS
         if (schema === 'no-schema') {
             return 'no-schema';
         }
-        return schema.safeParse(defaultProps);
+        return (0, zod_schema_type_1.zodSafeParse)(schema, defaultProps);
     }, [defaultProps, schema]);
     const setShowWarning = (0, react_1.useCallback)((val) => {
         setShowWarningWithoutPersistance((prevVal) => {
@@ -310,10 +312,8 @@ const DataEditor = ({ unresolvedComposition, defaultProps, setDefaultProps, mayS
     if (zodValidationResult === 'no-schema') {
         throw new Error('expected schema');
     }
-    const def = schema._def;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const typeName = def.typeName;
-    if (typeName === z.ZodFirstPartyTypeKind.ZodAny) {
+    const typeName = (0, zod_schema_type_1.getZodSchemaType)(schema);
+    if (typeName === 'any') {
         return jsx_runtime_1.jsx(SchemaErrorMessages_1.NoSchemaDefined, {});
     }
     if (!unresolvedComposition.defaultProps) {

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { SerializedJSONWithCustomFields } from 'remotion';
-import type { z } from 'zod';
+import type { AnyZodSchema } from './SchemaEditor/zod-schema-type';
 export declare const RenderModalJSONPropsEditor: React.FC<{
     readonly value: unknown;
     readonly setValue: React.Dispatch<React.SetStateAction<Record<string, unknown>>>;
@@ -8,5 +8,5 @@ export declare const RenderModalJSONPropsEditor: React.FC<{
     readonly showSaveButton: boolean;
     readonly serializedJSON: SerializedJSONWithCustomFields | null;
     readonly defaultProps: Record<string, unknown>;
-    readonly schema: z.ZodTypeAny;
+    readonly schema: AnyZodSchema;
 }>;

package/dist/components/RenderModal/RenderModalJSONPropsEditor.js

@@ -46,6 +46,7 @@ const ValidationMessage_1 = require("../NewComposition/ValidationMessage");
 const layout_1 = require("../layout");
 const ZodErrorMessages_1 = require("./SchemaEditor/ZodErrorMessages");
 const deep_equal_1 = require("./SchemaEditor/deep-equal");
+const zod_schema_type_1 = require("./SchemaEditor/zod-schema-type");
 const style = {
     fontFamily: 'monospace',
     flex: 1,
@@ -59,7 +60,7 @@ const scrollable = {
 const parseJSON = (str, schema) => {
     try {
         const value = no_react_1.NoReactInternals.deserializeJSONWithSpecialTypes(str);
-        const zodValidation = schema.safeParse(value);
+        const zodValidation = (0, zod_schema_type_1.zodSafeParse)(schema, value);
         return { str, value, validJSON: true, zodValidation };
     }
     catch (e) {
@@ -84,7 +85,7 @@ const RenderModalJSONPropsEditor = ({ setValue, value, defaultProps, onSave, sho
     const onChange = (0, react_1.useCallback)((e) => {
         const parsed = parseJSON(e.target.value, schema);
         if (parsed.validJSON) {
-            const validationResult = schema.safeParse(parsed.value);
+            const validationResult = (0, zod_schema_type_1.zodSafeParse)(schema, parsed.value);
             setLocalValue({
                 str: e.target.value,
                 value: parsed.value,

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

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

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

@@ -13,6 +13,7 @@ const ZodObjectEditor_1 = require("./ZodObjectEditor");
 const deep_equal_1 = require("./deep-equal");
 const local_state_1 = require("./local-state");
 const scroll_to_default_props_path_1 = require("./scroll-to-default-props-path");
+const zod_schema_type_1 = require("./zod-schema-type");
 const scrollable = {
     display: 'flex',
     flexDirection: 'column',
@@ -66,20 +67,18 @@ const SchemaEditor = ({ schema, unsavedDefaultProps, setValue, zodValidationResu
             save.unregister();
         };
     }, [keybindings, onQuickSave, onSave]);
-    const def = schema._def;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const typeName = def.typeName;
+    const typeName = (0, zod_schema_type_1.getZodSchemaType)(schema);
     const reset = (0, react_1.useCallback)(() => {
         setValue(savedDefaultProps);
     }, [savedDefaultProps, setValue]);
     if (!zodValidationResult.success) {
-        const defaultPropsValid = schema.safeParse(savedDefaultProps);
+        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 !== z.ZodFirstPartyTypeKind.ZodObject) {
+    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 }) }) }));

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

@@ -1,12 +1,12 @@
-import type { z } from 'zod';
+import type { ZodSafeParseResult } from './zod-schema-type';
 export declare const ZodNotInstalled: () => import("react/jsx-runtime").JSX.Element;
 export declare const NoSchemaDefined: () => import("react/jsx-runtime").JSX.Element;
 export declare const NoDefaultProps: () => import("react/jsx-runtime").JSX.Element;
 export declare const InvalidDefaultProps: React.FC<{
-    zodValidationResult: z.SafeParseReturnType<unknown, unknown>;
+    zodValidationResult: ZodSafeParseResult;
 }>;
 export declare const InvalidSchema: React.FC<{
-    zodValidationResult: z.SafeParseReturnType<unknown, unknown>;
+    zodValidationResult: ZodSafeParseResult;
     reset: () => void;
 }>;
 export declare const TopLevelZodValue: React.FC<{

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

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TopLevelZodValue = exports.InvalidSchema = exports.InvalidDefaultProps = exports.NoDefaultProps = exports.NoSchemaDefined = exports.ZodNotInstalled = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+// Schema error messages for studio editor
 const colors_1 = require("../../../helpers/colors");
 const Button_1 = require("../../Button");
 const styles_1 = require("../../Menu/styles");

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

@@ -1,11 +1,11 @@
 import React from 'react';
-import type { z } from 'zod';
+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 index: number;
-    readonly schema: z.ZodTypeAny;
+    readonly schema: AnyZodSchema;
     readonly showAddButton: boolean;
     readonly isLast: boolean;
 }>;

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

@@ -9,6 +9,7 @@ const get_zod_if_possible_1 = require("../../get-zod-if-possible");
 const layout_1 = require("../../layout");
 const layout_2 = require("../layout");
 const create_zod_values_1 = require("./create-zod-values");
+const zod_schema_type_1 = require("./zod-schema-type");
 exports.VERTICAL_GUIDE_HEIGHT = 24;
 const line = {
     borderBottom: '1px solid ' + colors_1.LINE_COLOR,
@@ -32,16 +33,16 @@ const SchemaArrayItemSeparationLine = ({ onChange, index, schema, isLast, showAd
     if (!z) {
         throw new Error('expected zod');
     }
-    const def = schema._def;
+    const arrayElement = (0, zod_schema_type_1.getArrayElement)(schema);
     const onAdd = (0, react_1.useCallback)(() => {
         onChange((oldV) => {
             return [
                 ...oldV.slice(0, index + 1),
-                (0, create_zod_values_1.createZodValues)(def.type, z, zodTypes),
+                (0, create_zod_values_1.createZodValues)(arrayElement, z, zodTypes),
                 ...oldV.slice(index + 1),
             ];
         }, false, true);
-    }, [def.type, index, onChange, z, zodTypes]);
+    }, [arrayElement, index, onChange, z, zodTypes]);
     const dynamicAddButtonStyle = (0, react_1.useMemo)(() => {
         return {
             display: 'flex',

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

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { z } from 'zod';
 import type { UpdaterFunction } from './ZodSwitch';
+import type { AnyZodSchema } from './zod-schema-type';
 import type { JSONPath } from './zod-types';
 export declare const ZodArrayEditor: React.FC<{
-    readonly schema: z.ZodTypeAny;
+    readonly schema: AnyZodSchema;
     readonly jsonPath: JSONPath;
     readonly value: unknown[];
     readonly defaultValue: unknown[];

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

@@ -46,6 +46,7 @@ const ZodFieldValidation_1 = require("./ZodFieldValidation");
 const create_zod_values_1 = require("./create-zod-values");
 const deep_equal_1 = require("./deep-equal");
 const local_state_1 = require("./local-state");
+const zod_schema_type_1 = require("./zod-schema-type");
 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,
@@ -54,7 +55,7 @@ const ZodArrayEditor = ({ schema, jsonPath, setValue, defaultValue, value, onSav
         savedValue: defaultValue,
     });
     const [expanded, setExpanded] = (0, react_1.useState)(true);
-    const def = schema._def;
+    const arrayElement = (0, zod_schema_type_1.getArrayElement)(schema);
     const suffix = (0, react_1.useMemo)(() => {
         return expanded ? ' [' : ' [...] ';
     }, [expanded]);
@@ -63,10 +64,6 @@ const ZodArrayEditor = ({ schema, jsonPath, setValue, defaultValue, value, onSav
         throw new Error('expected zod');
     }
     const zodTypes = (0, get_zod_if_possible_1.useZodTypesIfPossible)();
-    const typeName = def.typeName;
-    if (typeName !== z.ZodFirstPartyTypeKind.ZodArray) {
-        throw new Error('expected object');
-    }
     const isDefaultValue = (0, react_1.useMemo)(() => {
         return (0, deep_equal_1.deepEqual)(localValue.value, defaultValue);
     }, [defaultValue, localValue]);
@@ -81,7 +78,7 @@ const ZodArrayEditor = ({ schema, jsonPath, setValue, defaultValue, value, onSav
                             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, def: def, 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)(def.type, 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 })
+                                    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 })
         ] }));

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

@@ -1,9 +1,10 @@
 import type { UpdaterFunction } from './ZodSwitch';
+import type { AnyZodSchema } from './zod-schema-type';
 import type { JSONPath } from './zod-types';
 export declare const ZodArrayItemEditor: React.FC<{
     jsonPath: JSONPath;
     onChange: UpdaterFunction<unknown[]>;
-    def: any;
+    elementSchema: AnyZodSchema;
     index: number;
     value: unknown;
     defaultValue: unknown;

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

@@ -5,7 +5,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const get_zod_if_possible_1 = require("../../get-zod-if-possible");
 const ZodSwitch_1 = require("./ZodSwitch");
-const ZodArrayItemEditor = ({ def, onChange, jsonPath, index, value, defaultValue, onSave: onSaveObject, showSaveButton, saving, saveDisabledByParent, mayPad, mayRemove, }) => {
+const ZodArrayItemEditor = ({ elementSchema, onChange, jsonPath, index, value, defaultValue, onSave: onSaveObject, showSaveButton, saving, saveDisabledByParent, mayPad, mayRemove, }) => {
     const z = (0, get_zod_if_possible_1.useZodIfPossible)();
     if (!z) {
         throw new Error('expected zod');
@@ -28,6 +28,6 @@ const ZodArrayItemEditor = ({ def, onChange, jsonPath, index, value, defaultValu
             ...oldV.slice(index + 1),
         ], false, false);
     }, [index, onSaveObject]);
-    return (jsx_runtime_1.jsx("div", { children: jsx_runtime_1.jsx(ZodSwitch_1.ZodSwitch, { jsonPath: newJsonPath, schema: def.type, value: value, setValue: setValue, defaultValue: defaultValue, onSave: onSave, showSaveButton: showSaveButton, onRemove: mayRemove ? onRemove : null, saving: saving, saveDisabledByParent: saveDisabledByParent, mayPad: mayPad }) }));
+    return (jsx_runtime_1.jsx("div", { children: jsx_runtime_1.jsx(ZodSwitch_1.ZodSwitch, { jsonPath: newJsonPath, schema: elementSchema, value: value, setValue: setValue, defaultValue: defaultValue, onSave: onSave, showSaveButton: showSaveButton, onRemove: mayRemove ? onRemove : null, saving: saving, saveDisabledByParent: saveDisabledByParent, mayPad: mayPad }) }));
 };
 exports.ZodArrayItemEditor = ZodArrayItemEditor;

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

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { z } from 'zod';
 import type { UpdaterFunction } from './ZodSwitch';
+import type { AnyZodSchema } from './zod-schema-type';
 import type { JSONPath } from './zod-types';
 export declare const ZodBooleanEditor: React.FC<{
-    readonly schema: z.ZodTypeAny;
+    readonly schema: AnyZodSchema;
     readonly jsonPath: JSONPath;
     readonly value: boolean;
     readonly setValue: UpdaterFunction<boolean>;

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

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { z } from 'zod';
 import type { UpdaterFunction } from './ZodSwitch';
+import type { AnyZodSchema } from './zod-schema-type';
 import type { JSONPath } from './zod-types';
 export declare const ZodColorEditor: React.FC<{
-    readonly schema: z.ZodTypeAny;
+    readonly schema: AnyZodSchema;
     readonly jsonPath: JSONPath;
     readonly value: string;
     readonly defaultValue: string;

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

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { z } from 'zod';
 import type { UpdaterFunction } from './ZodSwitch';
+import type { AnyZodSchema } from './zod-schema-type';
 import type { JSONPath } from './zod-types';
 export declare const ZodDateEditor: React.FC<{
-    readonly schema: z.ZodTypeAny;
+    readonly schema: AnyZodSchema;
     readonly jsonPath: JSONPath;
     readonly value: Date;
     readonly defaultValue: Date;

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

@@ -1,13 +1,13 @@
 import React from 'react';
-import type { z } from 'zod';
-import type { UpdaterFunction } from './ZodSwitch';
+import type { AnyZodSchema } from './zod-schema-type';
 import type { JSONPath } from './zod-types';
+import type { UpdaterFunction } from './ZodSwitch';
 export declare const ZodDefaultEditor: React.FC<{
     readonly showSaveButton: boolean;
     readonly jsonPath: JSONPath;
     readonly value: unknown;
     readonly defaultValue: unknown;
-    readonly schema: z.ZodTypeAny;
+    readonly schema: AnyZodSchema;
     readonly setValue: UpdaterFunction<unknown>;
     readonly onSave: UpdaterFunction<unknown>;
     readonly onRemove: null | (() => void);

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

@@ -2,9 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ZodDefaultEditor = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+const zod_schema_type_1 = require("./zod-schema-type");
 const ZodSwitch_1 = require("./ZodSwitch");
 const ZodDefaultEditor = ({ jsonPath, schema, setValue, onSave, defaultValue, value, showSaveButton, onRemove, saving, saveDisabledByParent, mayPad, }) => {
-    const { innerType } = schema._def;
+    const innerType = (0, zod_schema_type_1.getInnerType)(schema);
     return (jsx_runtime_1.jsx(ZodSwitch_1.ZodSwitch, { defaultValue: defaultValue, jsonPath: jsonPath, onRemove: onRemove, onSave: onSave, schema: innerType, setValue: setValue, showSaveButton: showSaveButton, value: value, saving: saving, saveDisabledByParent: saveDisabledByParent, mayPad: mayPad }));
 };
 exports.ZodDefaultEditor = ZodDefaultEditor;

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

@@ -1,8 +1,8 @@
-import type { z } from 'zod';
 import type { UpdaterFunction } from './ZodSwitch';
+import type { AnyZodSchema } from './zod-schema-type';
 import type { JSONPath } from './zod-types';
 export declare const ZodDiscriminatedUnionEditor: React.FC<{
-    schema: z.ZodTypeAny;
+    schema: AnyZodSchema;
     setValue: UpdaterFunction<Record<string, unknown>>;
     value: Record<string, unknown>;
     defaultValue: Record<string, unknown>;