sanity-plugin-mux-input 2.11.1 → 2.12.0

package/README.md

@@ -198,21 +198,65 @@ sanity documents delete secrets.mux
 
 More information on signed URLs is available on Mux's [docs](https://docs.mux.com/docs/headless-cms-sanity#advanced-signed-urls)
 
-### MP4 support (downloadable videos or offline viewing)
+### Static Renditions (downloadable videos or offline viewing)
 
-To enable [static MP4 renditions](https://docs.mux.com/guides/video/enable-static-mp4-renditions), add `mp4_support: 'standard'` to the `options` of your `mux.video` schema type.
+To enable [static MP4 renditions](https://docs.mux.com/guides/video/enable-static-mp4-renditions), add `static_renditions` to your plugin configuration. This allows users to download videos for offline viewing.
+
+#### Standard Mode (Recommended)
 
 ```js
 import {muxInput} from 'sanity-plugin-mux-input'
 
 export default defineConfig({
-  plugins: [muxInput({mp4_support: 'standard'})],
+  plugins: [
+    muxInput({
+      static_renditions: ['highest'], // Enables MP4 downloads at the highest quality (up to 4K)
+      // or
+      static_renditions: ['highest', 'audio-only'], // Also includes audio-only (M4A) downloads
+    }),
+  ],
 })
 ```
 
-If MP4 support is enabled in the plugin's configuration, editors can still choose to enable MP4 renditions on a per-video basis when uploading new assets.
+**Standard mode options:**
+- `'highest'`: Produces an MP4 file with video resolution up to 4K (2160p)
+- `'audio-only'`: Produces an M4A (audio-only MP4) file
+
+#### Advanced Mode (Specific Resolutions)
+
+For more control, you can specify exact resolutions:
+
+```js
+import {muxInput} from 'sanity-plugin-mux-input'
+
+export default defineConfig({
+  plugins: [
+    muxInput({
+      static_renditions: ['1080p', '720p', 'audio-only'],
+    }),
+  ],
+})
+```
+
+**Advanced mode options:**
+- Specific resolutions: `'270p'`, `'360p'`, `'480p'`, `'540p'`, `'720p'`, `'1080p'`, `'1440p'`, `'2160p'`
+- `'audio-only'`: M4A file
+
+**Important notes:**
+- You cannot mix `'highest'` with specific resolutions (e.g., `['highest', '1080p']` is invalid)
+- Mux will not upscale videos - renditions requiring upscaling are automatically skipped
+- When uploading new assets, editors can choose different rendition settings on a per-video basis
+
+#### Backward Compatibility
+
+The deprecated `mp4_support` field is still supported for backward compatibility:
+
+```js
+// ⚠️ Deprecated - use static_renditions instead
+muxInput({mp4_support: 'standard'}) // Equivalent to static_renditions: ['highest']
+```
 
-MP4 allows users to download videos for later or offline viewing. More information can be found on Mux's [documentation](https://docs.mux.com/guides/enable-static-mp4-renditions).
+More information can be found on Mux's [documentation](https://docs.mux.com/guides/enable-static-mp4-renditions).
 
 ### Video resolution (max_resolution_tier)
 

package/dist/index.d.mts

@@ -30,12 +30,18 @@ declare interface MuxAsset {
   static_renditions?: {
     status: 'ready' | 'preparing' | 'disabled' | 'errored'
     files: {
-      name: 'low.mp4' | 'medium.mp4' | 'high.mp4' | 'audio.m4a'
+      name: string
       ext: 'mp4' | 'm4a'
       height: number
       width: number
       bitrate: number
-      filesize: number
+      filesize: string
+      type: 'standard' | 'advanced'
+      status: 'ready' | 'preparing' | 'skipped' | 'errored'
+      resolution_tier?: string
+      resolution?: string
+      id: string
+      passthrough?: string
     }[]
   }
   recording_times?: {
@@ -78,6 +84,19 @@ export declare const muxInput: Plugin_2<void | Partial<PluginConfig>>
 
 declare interface MuxInputConfig {
   /**
+   * Enable static renditions by default. Can be overwritten on a per-asset basis.
+   * Supports:
+   * - Standard mode: 'highest' (up to 4K MP4) and/or 'audio-only' (M4A)
+   * - Advanced mode: Specific resolutions ('270p', '360p', '480p', '540p', '720p', '1080p', '1440p', '2160p') and/or 'audio-only'
+   *
+   * **Important**: 'highest' cannot be mixed with specific resolutions. If both are provided, only 'highest' will be used.
+   *
+   * @see {@link https://docs.mux.com/guides/video/enable-static-mp4-renditions}
+   * @defaultValue []
+   */
+  static_renditions: StaticRenditionResolution[]
+  /**
+   * @deprecated Use `static_renditions` instead. This field is kept for backward compatibility.
    * Enable static renditions by setting this to 'standard'. Can be overwritten on a per-asset basis.
    * Requires `"video_quality": "plus"`
    * @see {@link https://docs.mux.com/guides/video/enable-static-mp4-renditions#why-enable-mp4-support}
@@ -195,6 +214,21 @@ declare interface PluginConfig extends MuxInputConfig {
   allowedRolesForConfiguration: string[]
 }
 
+/**
+ * All static rendition resolution options supported by Mux
+ */
+declare type StaticRenditionResolution =
+  | 'highest'
+  | 'audio-only'
+  | '270p'
+  | '360p'
+  | '480p'
+  | '540p'
+  | '720p'
+  | '1080p'
+  | '1440p'
+  | '2160p'
+
 declare const SUPPORTED_MUX_LANGUAGES_VALUES: (
   | 'en'
   | 'es'

package/dist/index.d.ts

@@ -30,12 +30,18 @@ declare interface MuxAsset {
   static_renditions?: {
     status: 'ready' | 'preparing' | 'disabled' | 'errored'
     files: {
-      name: 'low.mp4' | 'medium.mp4' | 'high.mp4' | 'audio.m4a'
+      name: string
       ext: 'mp4' | 'm4a'
       height: number
       width: number
       bitrate: number
-      filesize: number
+      filesize: string
+      type: 'standard' | 'advanced'
+      status: 'ready' | 'preparing' | 'skipped' | 'errored'
+      resolution_tier?: string
+      resolution?: string
+      id: string
+      passthrough?: string
     }[]
   }
   recording_times?: {
@@ -78,6 +84,19 @@ export declare const muxInput: Plugin_2<void | Partial<PluginConfig>>
 
 declare interface MuxInputConfig {
   /**
+   * Enable static renditions by default. Can be overwritten on a per-asset basis.
+   * Supports:
+   * - Standard mode: 'highest' (up to 4K MP4) and/or 'audio-only' (M4A)
+   * - Advanced mode: Specific resolutions ('270p', '360p', '480p', '540p', '720p', '1080p', '1440p', '2160p') and/or 'audio-only'
+   *
+   * **Important**: 'highest' cannot be mixed with specific resolutions. If both are provided, only 'highest' will be used.
+   *
+   * @see {@link https://docs.mux.com/guides/video/enable-static-mp4-renditions}
+   * @defaultValue []
+   */
+  static_renditions: StaticRenditionResolution[]
+  /**
+   * @deprecated Use `static_renditions` instead. This field is kept for backward compatibility.
    * Enable static renditions by setting this to 'standard'. Can be overwritten on a per-asset basis.
    * Requires `"video_quality": "plus"`
    * @see {@link https://docs.mux.com/guides/video/enable-static-mp4-renditions#why-enable-mp4-support}
@@ -195,6 +214,21 @@ declare interface PluginConfig extends MuxInputConfig {
   allowedRolesForConfiguration: string[]
 }
 
+/**
+ * All static rendition resolution options supported by Mux
+ */
+declare type StaticRenditionResolution =
+  | 'highest'
+  | 'audio-only'
+  | '270p'
+  | '360p'
+  | '480p'
+  | '540p'
+  | '720p'
+  | '1080p'
+  | '1440p'
+  | '2160p'
+
 declare const SUPPORTED_MUX_LANGUAGES_VALUES: (
   | 'en'
   | 'es'

package/dist/index.js

@@ -1527,7 +1527,7 @@ function VideoPlayer({
             crossOrigin: "anonymous",
             metadata: {
               player_name: "Sanity Admin Dashboard",
-              player_version: "2.11.1",
+              player_version: "2.12.0",
               page_type: "Preview Player"
             },
             audio: isAudio,
@@ -1618,21 +1618,21 @@ function PublishedStatus(props) {
 }
 function PaneItemPreview(props) {
   const { icon, layout, presence, schemaType, value } = props, title = sanity.isRecord(value.title) && React.isValidElement(value.title) || isString__default.default(value.title) || isNumber__default.default(value.title) ? value.title : null, observable = React.useMemo(
-    () => sanity.getPreviewStateObservable(props.documentPreviewStore, schemaType, value._id, title),
-    [props.documentPreviewStore, schemaType, title, value._id]
-  ), { draft, published, isLoading } = reactRx.useObservable(observable, {
-    draft: null,
-    published: null,
-    isLoading: !0
+    () => sanity.getPreviewStateObservable(props.documentPreviewStore, schemaType, value._id),
+    [props.documentPreviewStore, schemaType, value._id]
+  ), { snapshot, original, isLoading } = reactRx.useObservable(observable, {
+    isLoading: !0,
+    snapshot: null,
+    original: null
   }), status = isLoading ? null : /* @__PURE__ */ jsxRuntime.jsxs(ui.Inline, { space: 4, children: [
     presence && presence.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(sanity.DocumentPreviewPresence, { presence }),
-    /* @__PURE__ */ jsxRuntime.jsx(PublishedStatus, { document: published }),
-    /* @__PURE__ */ jsxRuntime.jsx(DraftStatus, { document: draft })
+    /* @__PURE__ */ jsxRuntime.jsx(PublishedStatus, { document: original }),
+    /* @__PURE__ */ jsxRuntime.jsx(DraftStatus, { document: snapshot })
   ] });
   return /* @__PURE__ */ jsxRuntime.jsx(
     sanity.SanityDefaultPreview,
     {
-      ...sanity.getPreviewValueWithFallback({ value, draft, published }),
+      ...sanity.getPreviewValueWithFallback({ snapshot, original, fallback: { title } }),
       isPlaceholder: isLoading,
       icon,
       layout,
@@ -2437,9 +2437,14 @@ const useAccessControl = (config) => {
   sanity.isReference(asset) ? asset._ref : "",
   path
 ), useMuxPolling = (asset) => {
-  const client = useClient(), projectId = sanity.useProjectId(), dataset = sanity.useDataset(), shouldFetch = React.useMemo(
-    () => !!asset?.assetId && (asset?.status === "preparing" || asset?.data?.static_renditions?.status === "preparing"),
-    [asset?.assetId, asset?.data?.static_renditions?.status, asset?.status]
+  const client = useClient(), projectId = sanity.useProjectId(), dataset = sanity.useDataset(), isPreparingStaticRenditions = React.useMemo(() => {
+    if (asset?.data?.static_renditions?.status && asset?.data?.static_renditions?.status !== "disabled")
+      return !1;
+    const files = asset?.data?.static_renditions?.files;
+    return !files || files.length === 0 ? !1 : files.some((file) => file.status === "preparing");
+  }, [asset?.data?.static_renditions?.status, asset?.data?.static_renditions?.files]), shouldFetch = React.useMemo(
+    () => !!asset?.assetId && (asset?.status === "preparing" || isPreparingStaticRenditions),
+    [asset?.assetId, asset?.status, isPreparingStaticRenditions]
   );
   return useSWR__default.default(
     shouldFetch ? `/${projectId}/addons/mux/assets/${dataset}/data/${asset?.assetId}` : null,
@@ -2454,7 +2459,7 @@ const useAccessControl = (config) => {
     { refreshInterval: 2e3, refreshWhenHidden: !0, dedupingInterval: 1e3 }
   );
 };
-var c = function(r) {
+var c = (function(r) {
   var t, e;
   function n(t2) {
     var e2;
@@ -2470,7 +2475,7 @@ var c = function(r) {
     var r2 = this.state, t2 = this.props, e2 = t2.render, n2 = t2.children, o2 = t2.renderError;
     return r2.hasError ? o2 ? o2({ error: r2.error }) : null : e2 ? e2() : n2 || null;
   }, n;
-}(React.PureComponent), u = function(r, t) {
+})(React.PureComponent), u = function(r, t) {
   switch (t.type) {
     case "catch":
       return { didCatch: !0, error: t.error };
@@ -2746,13 +2751,14 @@ function testUrl(url) {
   const error = new Error("Invalid URL");
   if (typeof url != "string")
     return rxjs.throwError(error);
+  const trimmedUrl = url.trim();
   let parsed;
   try {
-    parsed = new URL(url);
+    parsed = new URL(trimmedUrl);
   } catch {
     return rxjs.throwError(error);
   }
-  return parsed && !parsed.protocol.match(/http:|https:/) ? rxjs.throwError(error) : rxjs.of(url);
+  return parsed && !parsed.protocol.match(/http:|https:/) ? rxjs.throwError(error) : rxjs.of(trimmedUrl);
 }
 function optionsFromFile(opts, file) {
   if (!(typeof window > "u" || !(file instanceof window.File)))
@@ -2927,7 +2933,12 @@ const TopControls = styledComponents.styled.div`
     ) : null
   ] }) });
 }, Player = ({ asset, buttons, readOnly, onChange }) => {
-  const isLoading = React.useMemo(() => asset?.status === "preparing" ? "Preparing the video" : asset?.status === "waiting_for_upload" ? "Waiting for upload to start" : asset?.status === "waiting" ? "Processing upload" : !(asset?.status === "ready" || typeof asset?.status > "u"), [asset]), isPreparingStaticRenditions = React.useMemo(() => asset?.data?.static_renditions?.status === "preparing", [asset?.data?.static_renditions?.status]), playRef = React.useRef(null), muteRef = React.useRef(null), handleCancelUpload = useCancelUpload(asset, onChange);
+  const isLoading = React.useMemo(() => asset?.status === "preparing" ? "Preparing the video" : asset?.status === "waiting_for_upload" ? "Waiting for upload to start" : asset?.status === "waiting" ? "Processing upload" : !(asset?.status === "ready" || typeof asset?.status > "u"), [asset]), isPreparingStaticRenditions = React.useMemo(() => {
+    if (asset?.data?.static_renditions?.status && asset?.data?.static_renditions?.status !== "disabled")
+      return !1;
+    const files = asset?.data?.static_renditions?.files;
+    return !files || files.length === 0 ? !1 : files.some((file) => file.status === "preparing");
+  }, [asset?.data?.static_renditions?.status, asset?.data?.static_renditions?.files]), playRef = React.useRef(null), muteRef = React.useRef(null), handleCancelUpload = useCancelUpload(asset, onChange);
   return React.useEffect(() => {
     const style = document.createElement("style");
     style.innerHTML = "button svg { vertical-align: middle; }", playRef.current?.shadowRoot && playRef.current.shadowRoot.appendChild(style), muteRef?.current?.shadowRoot && muteRef.current.shadowRoot.appendChild(style.cloneNode(!0));
@@ -3348,7 +3359,20 @@ const VIDEO_QUALITY_LEVELS = [
   { value: "1080p", label: "1080p" },
   { value: "1440p", label: "1440p (2k)" },
   { value: "2160p", label: "2160p (4k)" }
+], ADVANCED_RESOLUTIONS = [
+  { value: "270p", label: "270p" },
+  { value: "360p", label: "360p" },
+  { value: "480p", label: "480p" },
+  { value: "540p", label: "540p" },
+  { value: "720p", label: "720p" },
+  { value: "1080p", label: "1080p" },
+  { value: "1440p", label: "1440p" },
+  { value: "2160p", label: "2160p" }
 ];
+function sanitizeStaticRenditions(renditions) {
+  const hasHighest = renditions.includes("highest"), hasSpecificResolutions = renditions.some((r) => r !== "highest" && r !== "audio-only");
+  return hasHighest && hasSpecificResolutions ? renditions.filter((r) => r === "highest" || r === "audio-only") : renditions;
+}
 function UploadConfiguration({
   stagedUpload,
   secrets,
@@ -3371,18 +3395,18 @@ function UploadConfiguration({
         case "video_quality":
           return action.value === "basic" ? Object.assign({}, prev, {
             video_quality: action.value,
-            mp4_support: "none",
+            static_renditions: [],
             max_resolution_tier: "1080p",
             text_tracks: prev.text_tracks?.filter(({ type }) => type !== "autogenerated"),
             public_policy: !0,
             signed_policy: !1
           }) : Object.assign({}, prev, {
             video_quality: action.value,
-            mp4_support: pluginConfig.mp4_support,
+            static_renditions: sanitizeStaticRenditions(pluginConfig.static_renditions || []),
             max_resolution_tier: pluginConfig.max_resolution_tier,
             text_tracks: [...autoTextTracks, ...prev.text_tracks || []]
           });
-        case "mp4_support":
+        case "static_renditions":
         case "max_resolution_tier":
         case "normalize_audio":
         case "signed_policy":
@@ -3421,13 +3445,34 @@ function UploadConfiguration({
     {
       video_quality: pluginConfig.video_quality,
       max_resolution_tier: pluginConfig.max_resolution_tier,
-      mp4_support: pluginConfig.mp4_support,
+      static_renditions: sanitizeStaticRenditions(pluginConfig.static_renditions || []),
       signed_policy: secrets.enableSignedUrls && pluginConfig.defaultSigned,
       public_policy: pluginConfig.defaultPublic,
       normalize_audio: pluginConfig.normalize_audio,
       text_tracks: autoTextTracks
     }
-  ), { disableTextTrackConfig, disableUploadConfig } = pluginConfig, skipConfig = disableTextTrackConfig && disableUploadConfig;
+  ), isAdvancedMode = React.useMemo(() => config.static_renditions.filter(
+    (r) => r !== "highest" && r !== "audio-only"
+  ).length > 0, [config.static_renditions]), [renditionMode, setRenditionMode] = React.useState(
+    isAdvancedMode ? "advanced" : "standard"
+  ), toggleRendition = (rendition) => {
+    const current = config.static_renditions, hasRendition = current.includes(rendition);
+    dispatch(hasRendition ? {
+      action: "static_renditions",
+      value: current.filter((r) => r !== rendition)
+    } : {
+      action: "static_renditions",
+      value: [...current, rendition]
+    });
+  }, handleModeChange = (mode) => {
+    setRenditionMode(mode), dispatch(mode === "standard" ? {
+      action: "static_renditions",
+      value: config.static_renditions.filter((r) => r === "highest" || r === "audio-only")
+    } : {
+      action: "static_renditions",
+      value: config.static_renditions.filter((r) => r !== "highest")
+    });
+  }, { disableTextTrackConfig, disableUploadConfig } = pluginConfig, skipConfig = disableTextTrackConfig && disableUploadConfig;
   if (React.useEffect(() => {
     skipConfig && startUpload(formatUploadConfig(config));
   }, []), skipConfig) return null;
@@ -3542,25 +3587,101 @@ function UploadConfiguration({
               }) })
             }
           ),
-          !basicConfig && /* @__PURE__ */ jsxRuntime.jsx(sanity.FormField, { title: "Additional Configuration", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
+          !basicConfig && /* @__PURE__ */ jsxRuntime.jsx(sanity.FormField, { title: "Additional Configuration", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
             /* @__PURE__ */ jsxRuntime.jsx(PlaybackPolicy, { id, config, secrets, dispatch }),
-            !basicConfig && /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, padding: [0, 2], children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                ui.Checkbox,
-                {
-                  id: `${id}--mp4_support`,
-                  style: { display: "block" },
-                  name: "mp4_support",
-                  required: !0,
-                  checked: config.mp4_support === "standard",
-                  onChange: (e) => dispatch({
-                    action: "mp4_support",
-                    value: e.currentTarget.checked ? "standard" : "none"
-                  })
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { children: /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: `${id}--mp4_support`, children: "MP4 support (allow downloading)" }) })
-            ] })
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { space: 3, children: /* @__PURE__ */ jsxRuntime.jsx(
+              sanity.FormField,
+              {
+                title: "Static Renditions",
+                description: "Generate downloadable MP4 or M4A files. Note: Mux will not upscale to produce MP4 renditions - renditions that would cause upscaling are skipped.",
+                children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 3, children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        ui.Radio,
+                        {
+                          checked: renditionMode === "standard",
+                          name: "rendition-mode",
+                          onChange: () => handleModeChange("standard"),
+                          value: "standard",
+                          id: `${id}--mode-standard`
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "label", htmlFor: `${id}--mode-standard`, children: "Standard" })
+                    ] }),
+                    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        ui.Radio,
+                        {
+                          checked: renditionMode === "advanced",
+                          name: "rendition-mode",
+                          onChange: () => handleModeChange("advanced"),
+                          value: "advanced",
+                          id: `${id}--mode-advanced`
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "label", htmlFor: `${id}--mode-advanced`, children: "Advanced" })
+                    ] })
+                  ] }),
+                  renditionMode === "standard" && /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, padding: [0, 2], children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        ui.Checkbox,
+                        {
+                          id: `${id}--highest`,
+                          style: { display: "block" },
+                          checked: config.static_renditions.includes("highest"),
+                          onChange: () => toggleRendition("highest")
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "label", htmlFor: `${id}--highest`, children: "Highest Resolution (up to 4K)" })
+                    ] }),
+                    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, padding: [0, 2], children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        ui.Checkbox,
+                        {
+                          id: `${id}--audio-only-standard`,
+                          style: { display: "block" },
+                          checked: config.static_renditions.includes("audio-only"),
+                          onChange: () => toggleRendition("audio-only")
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "label", htmlFor: `${id}--audio-only-standard`, children: "Audio Only (M4A)" })
+                    ] })
+                  ] }),
+                  renditionMode === "advanced" && /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: 1, muted: !0, children: "Select specific resolutions:" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { gap: 2, wrap: "wrap", children: ADVANCED_RESOLUTIONS.map(({ value, label }) => {
+                      const inputId = `${id}--resolution-${value}`;
+                      return /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          ui.Checkbox,
+                          {
+                            id: inputId,
+                            style: { display: "block" },
+                            checked: config.static_renditions.includes(value),
+                            onChange: () => toggleRendition(value)
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "label", htmlFor: inputId, size: 1, children: label })
+                      ] }, value);
+                    }) }),
+                    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, padding: [2, 2, 0, 2], children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        ui.Checkbox,
+                        {
+                          id: `${id}--audio-only-advanced`,
+                          style: { display: "block" },
+                          checked: config.static_renditions.includes("audio-only"),
+                          onChange: () => toggleRendition("audio-only")
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "label", htmlFor: `${id}--audio-only-advanced`, children: "Audio Only (M4A)" })
+                    ] })
+                  ] })
+                ] })
+              }
+            ) })
           ] }) })
         ] }),
         !disableTextTrackConfig && !basicConfig && /* @__PURE__ */ jsxRuntime.jsx(
@@ -3612,7 +3733,7 @@ function formatUploadConfig(config) {
         []
       )
     ],
-    mp4_support: config.mp4_support,
+    static_renditions: config.static_renditions.length > 0 ? config.static_renditions.map((resolution) => ({ resolution })) : void 0,
     playback_policy: setPlaybackPolicy(config),
     max_resolution_tier: config.max_resolution_tier,
     video_quality: config.video_quality,
@@ -3790,7 +3911,7 @@ function Uploader(props) {
       const events$ = new rxjs.Subject();
       return {
         observable: events$.asObservable(),
-        handleClick: (event) => events$.next(event)
+        handleClick: ((event) => events$.next(event))
       };
     })()
   ).current, uploadRef = React.useRef(null), uploadingDocumentId = React.useRef(null), [state, dispatch] = React.useReducer(
@@ -3801,7 +3922,7 @@ function Uploader(props) {
         case "commitUpload":
           return Object.assign({}, prev, { uploadStatus: { progress: 0 } });
         case "progressInfo": {
-          const { ...payload } = action;
+          const { type, action: _, ...payload } = action;
           return Object.assign({}, prev, {
             uploadStatus: {
               ...prev.uploadStatus,
@@ -3909,7 +4030,7 @@ function Uploader(props) {
     });
   }, handlePaste = (event) => {
     event.preventDefault(), event.stopPropagation();
-    const url = (event.clipboardData || window.clipboardData).getData("text");
+    const url = (event.clipboardData || window.clipboardData).getData("text")?.trim();
     if (!isValidUrl(url)) {
       toast.push({ status: "error", title: "Invalid URL for Mux video input." });
       return;
@@ -4115,12 +4236,18 @@ const muxVideoSchema = {
   name: "mux.staticRenditionFile",
   type: "object",
   fields: [
-    { type: "string", name: "ext" },
     { type: "string", name: "name" },
+    { type: "string", name: "ext" },
+    { type: "number", name: "height" },
     { type: "number", name: "width" },
     { type: "number", name: "bitrate" },
-    { type: "number", name: "filesize" },
-    { type: "number", name: "height" }
+    { type: "string", name: "filesize" },
+    { type: "string", name: "type" },
+    { type: "string", name: "status" },
+    { type: "string", name: "resolution_tier" },
+    { type: "string", name: "resolution" },
+    { type: "string", name: "id" },
+    { type: "string", name: "passthrough" }
   ]
 }, muxStaticRenditions = {
   name: "mux.staticRenditions",
@@ -4251,6 +4378,7 @@ const muxVideoSchema = {
   muxAssetData,
   muxVideoAsset
 ], defaultConfig = {
+  static_renditions: [],
   mp4_support: "none",
   video_quality: "plus",
   max_resolution_tier: "1080p",
@@ -4259,12 +4387,20 @@ const muxVideoSchema = {
   defaultSigned: !1,
   tool: DEFAULT_TOOL_CONFIG,
   allowedRolesForConfiguration: []
-}, muxInput = sanity.definePlugin((userConfig) => {
+};
+function convertLegacyConfig(config) {
+  return config.static_renditions && config.static_renditions.length > 0 ? { static_renditions: config.static_renditions } : config.mp4_support === "standard" ? { static_renditions: ["highest"] } : { static_renditions: [] };
+}
+const muxInput = sanity.definePlugin((userConfig) => {
   if (typeof userConfig == "object" && "encoding_tier" in userConfig) {
     const deprecated_encoding_tier = userConfig.encoding_tier;
     userConfig.video_quality || (deprecated_encoding_tier === "baseline" && (userConfig.video_quality = "basic"), deprecated_encoding_tier === "smart" && (userConfig.video_quality = "plus"));
   }
-  const config = { ...defaultConfig, ...userConfig || {} };
+  const config = {
+    ...defaultConfig,
+    ...userConfig || {},
+    ...convertLegacyConfig(userConfig || {})
+  };
   return {
     name: "mux-input",
     schema: {