@remotion/studio 4.0.236 → 4.0.237

package/.turbo/turbo-make.log

@@ -1,5 +1,5 @@
 
 
-> @remotion/studio@4.0.235 make /Users/jonathanburger/remotion/packages/studio
+> @remotion/studio@4.0.236 make /Users/jonathanburger/remotion/packages/studio
 > tsc -d && bun --env-file=../.env.bundle bundle.ts
 

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

@@ -6,5 +6,6 @@ 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 showAddButton: boolean;
     readonly isLast: boolean;
 }>;

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

@@ -22,8 +22,9 @@ const arraySeparationLine = {
     marginTop: -exports.VERTICAL_GUIDE_HEIGHT / 2,
     pointerEvents: 'none',
     width: '100%',
+    flexBasis: '100%',
 };
-const SchemaArrayItemSeparationLine = ({ onChange, index, schema, isLast }) => {
+const SchemaArrayItemSeparationLine = ({ onChange, index, schema, isLast, showAddButton }) => {
     const [outerHovered, setOuterHovered] = (0, react_1.useState)(false);
     const [innerHovered, setInnerHovered] = (0, react_1.useState)(false);
     const zodTypes = (0, get_zod_if_possible_1.useZodTypesIfPossible)();
@@ -47,8 +48,10 @@ const SchemaArrayItemSeparationLine = ({ onChange, index, schema, isLast }) => {
             justifyContent: 'center',
             height: exports.VERTICAL_GUIDE_HEIGHT,
             opacity: outerHovered || isLast ? 1 : 0,
-            position: 'relative',
-            marginTop: -4,
+            position: 'absolute',
+            top: '50%',
+            left: '50%',
+            transform: 'translate(-50%, -50%)',
         };
     }, [isLast, outerHovered]);
     const inner = (0, react_1.useMemo)(() => {
@@ -70,7 +73,17 @@ const SchemaArrayItemSeparationLine = ({ onChange, index, schema, isLast }) => {
     const onInnerMouseLeave = (0, react_1.useCallback)(() => {
         setInnerHovered(false);
     }, []);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'row' }, children: [(0, jsx_runtime_1.jsxs)("div", { style: { flex: 1 }, children: [(0, jsx_runtime_1.jsx)("div", { style: dynamicAddButtonStyle, onMouseEnter: onOuterMouseEnter, onMouseLeave: onOuterMouseLeave, children: (0, jsx_runtime_1.jsx)("div", { onClick: onAdd, style: inner, onMouseEnter: onInnerMouseEnter, onMouseLeave: onInnerMouseLeave, children: (0, jsx_runtime_1.jsx)(plus_1.Plus, { color: innerHovered ? 'white' : colors_1.LIGHT_TEXT, style: { height: exports.VERTICAL_GUIDE_HEIGHT / 2 } }) }) }), (0, jsx_runtime_1.jsx)("div", { style: arraySeparationLine })] }), isLast ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 1 }), (0, jsx_runtime_1.jsx)("div", { style: {
+    return ((0, jsx_runtime_1.jsxs)("div", { style: {
+            display: 'flex',
+            flexDirection: 'row',
+            height: exports.VERTICAL_GUIDE_HEIGHT,
+        }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
+                    flex: 1,
+                    position: 'relative',
+                    display: 'flex',
+                    flexDirection: 'column',
+                    alignItems: 'flex-end',
+                }, children: [showAddButton && ((0, jsx_runtime_1.jsx)("div", { style: dynamicAddButtonStyle, onMouseEnter: onOuterMouseEnter, onMouseLeave: onOuterMouseLeave, children: (0, jsx_runtime_1.jsx)("div", { onClick: onAdd, style: inner, onMouseEnter: onInnerMouseEnter, onMouseLeave: onInnerMouseLeave, children: (0, jsx_runtime_1.jsx)(plus_1.Plus, { color: innerHovered ? 'white' : colors_1.LIGHT_TEXT, style: { height: exports.VERTICAL_GUIDE_HEIGHT / 2 } }) }) })), (0, jsx_runtime_1.jsx)("div", { style: arraySeparationLine })] }), isLast ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 1 }), (0, jsx_runtime_1.jsx)("div", { style: {
                             ...layout_2.fieldSetText,
                             alignItems: 'center',
                             display: 'flex',

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

@@ -69,7 +69,7 @@ const ZodArrayEditor = ({ schema, jsonPath, setValue, defaultValue, value, onSav
                             var _a;
                             return (
                             // eslint-disable-next-line react/no-array-index-key
-                            (0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, 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 }), (0, jsx_runtime_1.jsx)(SchemaSeparationLine_1.SchemaArrayItemSeparationLine, { schema: schema, index: i, onChange: onChange, isLast: i === localValue.value.length - 1 })] }, `${i}${localValue.keyStabilityRevision}`));
-                        }), value.length === 0 ? ((0, jsx_runtime_1.jsx)(SchemaSeparationLine_1.SchemaArrayItemSeparationLine, { schema: schema, index: 0, onChange: onChange, isLast: true })) : null] }) })) : null, (0, jsx_runtime_1.jsx)(ZodFieldValidation_1.ZodFieldValidation, { path: jsonPath, localValue: localValue })] }));
+                            (0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, 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 }), (0, 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 ? ((0, jsx_runtime_1.jsx)(SchemaSeparationLine_1.SchemaArrayItemSeparationLine, { schema: schema, index: 0, onChange: onChange, isLast: true, showAddButton: true })) : null] }) })) : null, (0, jsx_runtime_1.jsx)(ZodFieldValidation_1.ZodFieldValidation, { path: jsonPath, localValue: localValue })] }));
 };
 exports.ZodArrayEditor = ZodArrayEditor;

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

@@ -19,6 +19,7 @@ const ZodOptionalEditor_1 = require("./ZodOptionalEditor");
 const ZodStaticFileEditor_1 = require("./ZodStaticFileEditor");
 const ZodStringEditor_1 = require("./ZodStringEditor");
 const ZodTextareaEditor_1 = require("./ZodTextareaEditor");
+const ZodTupleEditor_1 = require("./ZodTupleEditor");
 const ZodUnionEditor_1 = require("./ZodUnionEditor");
 const ZodSwitch = ({ schema, jsonPath, value, setValue, defaultValue, onSave, showSaveButton, onRemove, saving, saveDisabledByParent, mayPad, }) => {
     const def = schema._def;
@@ -96,6 +97,9 @@ const ZodSwitch = ({ schema, jsonPath, value, setValue, defaultValue, onSave, sh
     if (typeName === z.ZodFirstPartyTypeKind.ZodDiscriminatedUnion) {
         return ((0, jsx_runtime_1.jsx)(ZodDiscriminatedUnionEditor_1.ZodDiscriminatedUnionEditor, { defaultValue: defaultValue, mayPad: mayPad, schema: schema, setValue: setValue, value: value, jsonPath: jsonPath, onRemove: onRemove, onSave: onSave, saving: saving, saveDisabledByParent: saveDisabledByParent, showSaveButton: showSaveButton }));
     }
+    if (typeName === z.ZodFirstPartyTypeKind.ZodTuple) {
+        return ((0, jsx_runtime_1.jsx)(ZodTupleEditor_1.ZodTupleEditor, { setValue: setValue, value: value, jsonPath: jsonPath, schema: schema, defaultValue: defaultValue, onSave: onSave, showSaveButton: showSaveButton, onRemove: onRemove, saving: saving, saveDisabledByParent: saveDisabledByParent, mayPad: mayPad }));
+    }
     return ((0, jsx_runtime_1.jsx)(ZodNonEditableValue_1.ZonNonEditableValue, { jsonPath: jsonPath, showSaveButton: showSaveButton, label: `${typeName} (not editable)`, saving: saving, mayPad: mayPad }));
 };
 exports.ZodSwitch = ZodSwitch;

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

@@ -0,0 +1,17 @@
+import React from 'react';
+import type { z } from 'zod';
+import type { JSONPath } from './zod-types';
+import type { UpdaterFunction } from './ZodSwitch';
+export declare const ZodTupleEditor: React.FC<{
+    readonly schema: z.ZodTypeAny;
+    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/ZodTupleEditor.js

@@ -0,0 +1,75 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ZodTupleEditor = 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 ZodFieldValidation_1 = require("./ZodFieldValidation");
+const ZodTupleItemEditor_1 = require("./ZodTupleItemEditor");
+const ZodTupleEditor = ({ 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 [expanded, setExpanded] = (0, react_1.useState)(true);
+    const def = schema._def;
+    const suffix = (0, react_1.useMemo)(() => {
+        return expanded ? ' [' : ' [...] ';
+    }, [expanded]);
+    const z = (0, get_zod_if_possible_1.useZodIfPossible)();
+    if (!z) {
+        throw new Error('expected zod');
+    }
+    const zodTypes = (0, get_zod_if_possible_1.useZodTypesIfPossible)();
+    const typeName = def.typeName;
+    if (typeName !== z.ZodFirstPartyTypeKind.ZodTuple) {
+        throw new Error('expected object');
+    }
+    const isDefaultValue = (0, react_1.useMemo)(() => {
+        return (0, deep_equal_1.deepEqual)(localValue.value, defaultValue);
+    }, [defaultValue, localValue]);
+    return ((0, jsx_runtime_1.jsxs)(Fieldset_1.Fieldset, { shouldPad: mayPad, success: localValue.zodValidation.success, children: [(0, jsx_runtime_1.jsx)("div", { style: {
+                    display: 'flex',
+                    flexDirection: 'row',
+                }, children: (0, 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 ? ((0, jsx_runtime_1.jsx)(RevisionContextProvider, { children: (0, 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
+                            (0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(ZodTupleItemEditor_1.ZodTupleItemEditor, { 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.items[i], z, zodTypes), onSave: onSave, showSaveButton: showSaveButton, saving: saving, saveDisabledByParent: saveDisabledByParent, mayPad: mayPad }), (0, jsx_runtime_1.jsx)(SchemaSeparationLine_1.SchemaArrayItemSeparationLine, { schema: schema, index: i, onChange: onChange, isLast: i === localValue.value.length - 1, showAddButton: false })] }, `${i}${localValue.keyStabilityRevision}`));
+                        }), value.length === 0 ? ((0, jsx_runtime_1.jsx)(SchemaSeparationLine_1.SchemaArrayItemSeparationLine, { schema: schema, index: 0, onChange: onChange, isLast: true, showAddButton: false })) : null] }) })) : null, (0, jsx_runtime_1.jsx)(ZodFieldValidation_1.ZodFieldValidation, { path: jsonPath, localValue: localValue })] }));
+};
+exports.ZodTupleEditor = ZodTupleEditor;

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

@@ -0,0 +1,15 @@
+import type { UpdaterFunction } from './ZodSwitch';
+import type { JSONPath } from './zod-types';
+export declare const ZodTupleItemEditor: React.FC<{
+    jsonPath: JSONPath;
+    onChange: UpdaterFunction<unknown[]>;
+    def: any;
+    index: number;
+    value: unknown;
+    defaultValue: unknown;
+    onSave: UpdaterFunction<unknown[]>;
+    showSaveButton: boolean;
+    saving: boolean;
+    saveDisabledByParent: boolean;
+    mayPad: boolean;
+}>;

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

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ZodTupleItemEditor = void 0;
+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 ZodTupleItemEditor = ({ def, onChange, jsonPath, index, value, defaultValue, onSave: onSaveObject, showSaveButton, saving, saveDisabledByParent, mayPad, }) => {
+    const z = (0, get_zod_if_possible_1.useZodIfPossible)();
+    if (!z) {
+        throw new Error('expected zod');
+    }
+    const setValue = (0, react_1.useCallback)((val) => {
+        onChange((oldV) => [
+            ...oldV.slice(0, index),
+            typeof val === 'function' ? val(oldV[index]) : val,
+            ...oldV.slice(index + 1),
+        ], false, false);
+    }, [index, onChange]);
+    const newJsonPath = (0, react_1.useMemo)(() => [...jsonPath, index], [index, jsonPath]);
+    const onSave = (0, react_1.useCallback)((updater) => {
+        onSaveObject((oldV) => [
+            ...oldV.slice(0, index),
+            updater(oldV[index]),
+            ...oldV.slice(index + 1),
+        ], false, false);
+    }, [index, onSaveObject]);
+    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ZodSwitch_1.ZodSwitch, { jsonPath: newJsonPath, schema: def.items[index], value: value, setValue: setValue, defaultValue: defaultValue, onSave: onSave, showSaveButton: showSaveButton, onRemove: null, saving: saving, saveDisabledByParent: saveDisabledByParent, mayPad: mayPad }) }));
+};
+exports.ZodTupleItemEditor = ZodTupleItemEditor;