sanity-plugin-mux-input 2.19.1 → 3.0.1

package/dist/index.js

@@ -19,7 +19,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 Object.defineProperty(exports, "__esModule", { value: !0 });
-var sanity = require("sanity"), jsxRuntime = require("react/jsx-runtime"), icons = require("@sanity/icons"), ui = require("@sanity/ui"), React = require("react"), compact = require("lodash/compact.js"), toLower = require("lodash/toLower.js"), trim = require("lodash/trim.js"), uniq = require("lodash/uniq.js"), words = require("lodash/words.js"), suspendReact = require("suspend-react"), rxjs = require("rxjs"), styledComponents = require("styled-components"), uuid = require("@sanity/uuid"), operators = require("rxjs/operators"), LanguagesList = require("iso-639-1"), MuxPlayer = require("@mux/mux-player-react/lazy"), router = require("sanity/router"), isNumber = require("lodash/isNumber.js"), isString = require("lodash/isString.js"), reactRx = require("react-rx"), useSWR = require("swr"), scrollIntoView = require("scroll-into-view-if-needed"), upchunk = require("@mux/upchunk"), reactIs = require("react-is");
+var sanity = require("sanity"), jsxRuntime = require("react/jsx-runtime"), icons = require("@sanity/icons"), ui = require("@sanity/ui"), React = require("react"), compact = require("lodash/compact.js"), toLower = require("lodash/toLower.js"), trim = require("lodash/trim.js"), uniq = require("lodash/uniq.js"), words = require("lodash/words.js"), suspendReact = require("suspend-react"), rxjs = require("rxjs"), styledComponents = require("styled-components"), uuid = require("@sanity/uuid"), operators = require("rxjs/operators"), LanguagesList = require("iso-639-1"), MuxPlayer = require("@mux/mux-player-react/lazy"), useDevicePixelRatio = require("use-device-pixel-ratio"), router = require("sanity/router"), isNumber = require("lodash/isNumber.js"), isString = require("lodash/isString.js"), reactRx = require("react-rx"), useSWR = require("swr"), scrollIntoView = require("scroll-into-view-if-needed"), upchunk = require("@mux/upchunk"), reactIs = require("react-is");
 function _interopDefaultCompat(e) {
   return e && typeof e == "object" && "default" in e ? e : { default: e };
 }
@@ -147,7 +147,7 @@ function useAssets() {
 function useDialogState() {
   return React.useState(!1);
 }
-const PLUGIN_VERSION_QUERY = { sanityVersion: "2.19.1" };
+const PLUGIN_VERSION_QUERY = { sanityVersion: "3.0.1" };
 function saveSecrets(client, token, secretKey, enableSignedUrls, signingKeyId, signingKeyPrivate, drmConfigId) {
   const doc = {
     _id: "secrets.mux",
@@ -391,7 +391,7 @@ const Logo = styledComponents.styled.span`
   /* @__PURE__ */ jsxRuntime.jsx(Logo, { children: /* @__PURE__ */ jsxRuntime.jsx(MuxLogo, { height: 13 }) }),
   "API Credentials"
 ] });
-function FormField(props) {
+function FormField$1(props) {
   const { children, title, description, inputId } = props;
   return /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 1, children: [
     /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { align: "flex-end", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { flex: 1, paddingY: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
@@ -401,7 +401,7 @@ function FormField(props) {
     /* @__PURE__ */ jsxRuntime.jsx("div", { children })
   ] });
 }
-var FormField$1 = React.memo(FormField);
+var FormField = React.memo(FormField$1);
 const fieldNames = ["token", "secretKey", "enableSignedUrls", "drmConfigId"];
 function ConfigureApiDialog({ secrets, setDialogState }) {
   const client = useClient(), [state, dispatch] = useSecretsFormState(secrets), hasSecretsInitially = React.useMemo(() => secrets.token && secrets.secretKey, [secrets]), handleClose = React.useCallback(() => setDialogState(!1), [setDialogState]), dirty = React.useMemo(
@@ -498,7 +498,7 @@ function ConfigureApiDialog({ secrets, setDialogState }) {
             "The credentials will be stored safely in a hidden document only available to editors."
           ] })
         ] }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(FormField$1, { title: "Access Token", inputId: tokenId, children: /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx(FormField, { title: "Access Token", inputId: tokenId, children: /* @__PURE__ */ jsxRuntime.jsx(
           ui.TextInput,
           {
             id: tokenId,
@@ -509,7 +509,7 @@ function ConfigureApiDialog({ secrets, setDialogState }) {
             required: !!state.secretKey || state.enableSignedUrls
           }
         ) }),
-        /* @__PURE__ */ jsxRuntime.jsx(FormField$1, { title: "Secret Key", inputId: secretKeyId, children: /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx(FormField, { title: "Secret Key", inputId: secretKeyId, children: /* @__PURE__ */ jsxRuntime.jsx(
           ui.TextInput,
           {
             id: secretKeyId,
@@ -542,7 +542,7 @@ function ConfigureApiDialog({ secrets, setDialogState }) {
             ] })
           ] }) }) : null
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(FormField$1, { title: "DRM Configuration ID", inputId: drmConfigIdId, children: /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx(FormField, { title: "DRM Configuration ID", inputId: drmConfigIdId, children: /* @__PURE__ */ jsxRuntime.jsx(
           ui.TextInput,
           {
             id: drmConfigIdId,
@@ -2974,14 +2974,6 @@ function CaptionsDialog({ asset }) {
   const { setDialogState } = useDialogStateContext(), dialogId = `CaptionsDialog${React.useId()}`;
   return /* @__PURE__ */ jsxRuntime.jsx(ui.Dialog, { id: dialogId, header: "Edit Captions", onClose: () => setDialogState(!1), width: 1, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { padding: 4, children: /* @__PURE__ */ jsxRuntime.jsx(TextTracksManager, { asset }) }) });
 }
-function getDevicePixelRatio(options) {
-  const {
-    defaultDpr = 1,
-    maxDpr = 3,
-    round = !0
-  } = options || {}, dpr = typeof window < "u" && typeof window.devicePixelRatio == "number" ? window.devicePixelRatio : defaultDpr;
-  return Math.min(Math.max(1, round ? Math.floor(dpr) : dpr), maxDpr);
-}
 function formatSeconds(seconds) {
   if (typeof seconds != "number" || Number.isNaN(seconds))
     return "";
@@ -3005,7 +2997,7 @@ function EditThumbnailDialog({ asset, currentTime = 0 }) {
     () => formatSecondsToHHMMSS(currentTime)
   ), [nextTime, setNextTime] = React.useState(currentTime), [inputError, setInputError] = React.useState(""), assetWithNewThumbnail = React.useMemo(() => ({ ...asset, thumbTime: nextTime }), [asset, nextTime]), [saving, setSaving] = React.useState(!1), [saveThumbnailError, setSaveThumbnailError] = React.useState(null), handleSave = () => {
     setSaving(!0), client.patch(asset._id).set({ thumbTime: nextTime }).commit({ returnDocuments: !1 }).then(() => void setDialogState(!1)).catch(setSaveThumbnailError).finally(() => void setSaving(!1));
-  }, width = 300 * getDevicePixelRatio({ maxDpr: 2 });
+  }, width = 300 * useDevicePixelRatio.getDevicePixelRatio({ maxDpr: 2 });
   if (saveThumbnailError)
     throw saveThumbnailError;
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -3173,7 +3165,7 @@ function VideoPlayer({
                   crossOrigin: "anonymous",
                   metadata: {
                     player_name: "Sanity Admin Dashboard",
-                    player_version: "2.19.1",
+                    player_version: "3.0.1",
                     page_type: "Preview Player"
                   },
                   audio: isAudio,
@@ -3541,7 +3533,7 @@ function useVideoDetails(props) {
     isResyncing
   };
 }
-const AssetInput = (props) => /* @__PURE__ */ jsxRuntime.jsx(FormField$1, { title: props.label, description: props.description, inputId: props.label, children: /* @__PURE__ */ jsxRuntime.jsx(
+const AssetInput = (props) => /* @__PURE__ */ jsxRuntime.jsx(FormField, { title: props.label, description: props.description, inputId: props.label, children: /* @__PURE__ */ jsxRuntime.jsx(
   ui.TextInput,
   {
     id: props.label,
@@ -4233,7 +4225,7 @@ function a(t) {
   }, []);
   return { ErrorBoundary: (p = h.current, p !== null ? p : (h.current = l(), h.current)), didCatch: i.didCatch, error: i.error, reset: s };
 }
-function ErrorBoundaryCard(props) {
+function ErrorBoundaryCard$1(props) {
   const { children, schemaType } = props, { push: pushToast } = ui.useToast(), errorRef = React.useRef(null), { ErrorBoundary, didCatch, error, reset } = a({
     onDidCatch: (err, errorInfo) => {
       console.group(err.toString()), console.groupCollapsed("console.error"), console.error(err), console.groupEnd(), err.stack && (console.groupCollapsed("error.stack"), console.log(err.stack), console.groupEnd()), errorInfo?.componentStack && (console.groupCollapsed("errorInfo.componentStack"), console.log(errorInfo.componentStack), console.groupEnd()), console.groupEnd(), pushToast({
@@ -4274,7 +4266,7 @@ function ErrorBoundaryCard(props) {
     /* @__PURE__ */ jsxRuntime.jsx(ui.Inline, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: handleRetry, text: "Retry" }) })
   ] }) }) }) : /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary, { children });
 }
-var ErrorBoundaryCard$1 = React.memo(ErrorBoundaryCard);
+var ErrorBoundaryCard = React.memo(ErrorBoundaryCard$1);
 const InputFallback = () => /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 1 }, children: /* @__PURE__ */ jsxRuntime.jsx(
   ui.Card,
   {
@@ -4870,7 +4862,7 @@ const FileButton = styledComponents.styled(ui.MenuItem)(({ theme }) => {
   background: transparent;
   color: white;
 `, isVideoAsset = (asset) => asset._type === "mux.videoAsset";
-function PlayerActionsMenu(props) {
+function PlayerActionsMenu$1(props) {
   const { asset, readOnly, dialogState, setDialogState, onChange, onSelect, accept } = props, [open, setOpen] = React.useState(!1), [menuElement, setMenuRef] = React.useState(null), isSigned = React.useMemo(() => getPlaybackPolicy(asset)?.policy === "signed", [asset]), { hasConfigAccess } = useAccessControl(props.config), { resyncAsset, isResyncing } = useResyncAsset({ showToast: !0 }), onReset = React.useCallback(() => onChange(sanity.PatchEvent.from(sanity.unset([]))), [onChange]), handleResync = React.useCallback(async () => {
     setOpen(!1), await resyncAsset(asset);
   }, [resyncAsset, asset]);
@@ -4982,7 +4974,7 @@ function PlayerActionsMenu(props) {
     )
   ] });
 }
-var PlayerActionsMenu$1 = React.memo(PlayerActionsMenu);
+var PlayerActionsMenu = React.memo(PlayerActionsMenu$1);
 function useFetchFileSize(stagedUpload, maxFileSize) {
   const [fileSize, setFileSize] = React.useState(null), [isLoadingFileSize, setIsLoadingFileSize] = React.useState(!1), [canSkipFileSizeValidation, setCanSkipFileSizeValidation] = React.useState(!1);
   return React.useEffect(() => {
@@ -5691,7 +5683,7 @@ function TextTracksEditor({
   defaultLang
 }) {
   const track = tracks[0];
-  return /* @__PURE__ */ jsxRuntime.jsx(sanity.FormField, { title: "Auto-generated subtitle or caption", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
+  return /* @__PURE__ */ jsxRuntime.jsx(sanity.FormField, { title: "Auto-generated subtitle or caption", path: [], children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
     /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         ui.Checkbox,
@@ -5934,6 +5926,7 @@ const RESOLUTION_TIERS = [
 }) => /* @__PURE__ */ jsxRuntime.jsx(
   sanity.FormField,
   {
+    path: [],
     title: "Resolution Tier",
     description: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       "The maximum",
@@ -6009,6 +6002,7 @@ const RESOLUTION_TIERS = [
   return /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { space: 3, children: /* @__PURE__ */ jsxRuntime.jsx(
     sanity.FormField,
     {
+      path: [],
       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: [
@@ -6277,6 +6271,7 @@ function UploadConfiguration({
           /* @__PURE__ */ jsxRuntime.jsx(
             sanity.FormField,
             {
+              path: [],
               title: "Video Quality Level",
               description: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
                 "The video quality level informs the cost, quality, and available platform features for the asset.",
@@ -6313,7 +6308,7 @@ function UploadConfiguration({
             }
           ),
           !basicConfig && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(sanity.FormField, { title: "Additional Configuration", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(sanity.FormField, { title: "Additional Configuration", path: [], children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
               /* @__PURE__ */ jsxRuntime.jsx(PlaybackPolicy, { id, config, secrets, dispatch }),
               maxSupportedResolution > 0 && /* @__PURE__ */ jsxRuntime.jsx(
                 ResolutionTierSelector,
@@ -6431,6 +6426,7 @@ function WatermarkSection({
   return videoAssetMetadata?.isAudioOnly !== !1 ? null : /* @__PURE__ */ jsxRuntime.jsx(
     sanity.FormField,
     {
+      path: [],
       title: "Watermark",
       description: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         "Add a watermark overlay to your video using Mux's native watermark support.",
@@ -6949,7 +6945,7 @@ function Uploader(props) {
                 onChange: props.onChange,
                 config: props.config,
                 buttons: /* @__PURE__ */ jsxRuntime.jsx(
-                  PlayerActionsMenu$1,
+                  PlayerActionsMenu,
                   {
                     accept: acceptMimeString,
                     asset: props.asset,
@@ -6989,12 +6985,12 @@ function Uploader(props) {
     )
   ] });
 }
-const Input = (props) => {
+const Input$1 = (props) => {
   const client = useClient(), secretDocumentValues = useSecretsDocumentValues(), assetDocumentValues = useAssetDocumentValues(props.value?.asset), poll = useMuxPolling(props.readOnly ? void 0 : assetDocumentValues?.value || void 0), [dialogState, setDialogState] = useDialogState(), { hasConfigAccess } = useAccessControl(props.config), error = secretDocumentValues.error || assetDocumentValues.error || poll.error;
   if (error)
     throw error;
   const isLoading = secretDocumentValues.isLoading || assetDocumentValues.isLoading;
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundaryCard$1, { schemaType: props.schemaType, children: /* @__PURE__ */ jsxRuntime.jsx(React.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(InputFallback, {}), children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(InputFallback, {}) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundaryCard, { schemaType: props.schemaType, children: /* @__PURE__ */ jsxRuntime.jsx(React.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(InputFallback, {}), children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(InputFallback, {}) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     secretDocumentValues.value.needsSetup && !assetDocumentValues.value ? /* @__PURE__ */ jsxRuntime.jsx(Onboard, { setDialogState, config: props.config }) : /* @__PURE__ */ jsxRuntime.jsx(
       Uploader,
       {
@@ -7018,11 +7014,11 @@ const Input = (props) => {
     )
   ] }) }) }) });
 };
-var Input$1 = React.memo(Input);
+var Input = React.memo(Input$1);
 function muxVideoCustomRendering(config) {
   return {
     components: {
-      input: (props) => /* @__PURE__ */ jsxRuntime.jsx(Input$1, { config: { ...config, ...props.schemaType.options }, ...props })
+      input: (props) => /* @__PURE__ */ jsxRuntime.jsx(Input, { config: { ...config, ...props.schemaType.options }, ...props })
     },
     preview: {
       select: {