@vidispine/vdt-materialui 26.1.0-pre.2 → 26.1.0-pre.4

package/dist/cjs/item/player/ItemImagePlayer.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),o=require("clsx"),i=require("@material-ui/core"),r=["image/apng","image/bmp","image/gif","image/jpeg","image/x-icon","image/png","image/svg+xml"],g=()=>({root:{width:"100%",display:"flex",justifyContent:"center"},img:{display:"block",margin:"auto",maxWidth:"100%",maxHeight:"70vh"}});function n({classes:e,className:a,previewSource:m={}}){const{src:s}=m;return t.jsx(i.Box,{className:o(e.root,a),children:t.jsx("img",{className:e.img,src:s,alt:""})})}const l=i.withStyles(g,{name:"VdtItemImagePlayer"})(n);exports.ALLOWED_MIME_TYPES=r;exports.default=l;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),g=require("clsx"),i=require("@material-ui/core"),o=["image/apng","image/bmp","image/gif","image/jpeg","image/x-icon","image/png","image/svg+xml","image/webp"],r=()=>({root:{width:"100%",display:"flex",justifyContent:"center"},img:{display:"block",margin:"auto",maxWidth:"100%",maxHeight:"70vh"}});function n({classes:e,className:a,previewSource:m={}}){const{src:s}=m;return t.jsx(i.Box,{className:g(e.root,a),children:t.jsx("img",{className:e.img,src:s,alt:""})})}const l=i.withStyles(r,{name:"VdtItemImagePlayer"})(n);exports.ALLOWED_MIME_TYPES=o;exports.default=l;

package/dist/cjs/item/player/ItemPlayer/ItemPlayer.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),g=require("react"),L=require("clsx"),u=require("@material-ui/core"),ne=require("@material-ui/lab"),m=require("@vidispine/vdt-js"),$=require("../ItemAudioPlayer.js"),F=require("../ItemImagePlayer.js"),q=require("../ItemVideoPlayer.js"),oe=[...q.ALLOWED_MIME_TYPES,...F.ALLOWED_MIME_TYPES,...$.ALLOWED_MIME_TYPES],_="IMAGE",j="AUDIO",A="VIDEO",ae="DOCUMENT",se="BINARY",ie=e=>e.height?e.fieldOrder?`${e.tag} (${e.height}${e.fieldOrder[0]})`:`${e.tag} (${e.height}x${e.width})`:e.audioFormat?e.containerFormat!==e.audioFormat?`${e.tag} (${e.audioFormat} - ${e.containerFormat})`:`${e.tag} (${e.audioFormat})`:e.tag.join(", "),ce=e=>{const s=i=>i.split(":").reduce((o,c)=>60*o+Number(c));if(e.timeCode)return Math.floor(e.timeCode.toSeconds());if(e.duration)return s(e.duration)},le=u.withStyles({},{name:"VdtSourceSelection"})(({value:e,onChange:s,options:i,previewSourceText:o="Preview Source"})=>{const c=i.find(l=>l.label===e.label);return t.jsxs(u.FormControl,{variant:"standard",fullWidth:!0,children:[t.jsx(u.InputLabel,{children:o}),t.jsx(u.Select,{value:c,onChange:s,children:i.map(l=>t.jsx(u.MenuItem,{value:l,children:l.label},l.src))})]})}),ue=u.withStyles({},{name:"VdtLoadingPlayer"})(e=>t.jsx(ne.Skeleton,{variant:"rect",width:"100%",height:520,...e})),de=u.withStyles(e=>({root:{backgroundColor:e.palette.divider,width:"100%",height:520,display:"flex",justifyContent:"center",alignItems:"center"},label:{...e.typography.button}}),{name:"VdtNoPreviewPlayer"})(({className:e,classes:s,label:i="No Previews"})=>t.jsx("div",{className:L(s.root,e),children:t.jsx("div",{className:s.label,children:i})})),fe=()=>({root:{}});function Se({className:e,classes:s={},itemId:i,videoEl:o,itemType:c,isLoading:l,subtitleGroup:T="stl_subtitle",subtitleField:V="stl_text",sampleRate:Y="PAL",allowedMimeTypes:x=oe,additionalMimeTypes:y=[],LoadingPlayerComponent:C=ue,NoPreviewPlayerComponent:W=de,ItemImagePlayerComponent:M=F.default,ItemAudioPlayerComponent:P=$.default,ItemVideoPlayerComponent:v=q.default,ItemBinaryPlayerComponent:b,onReady:I,onCinema:p,onScreenshot:U,width:w="100%",sourceTag:S="original",SourceSelectionComponent:D=le,videoPlayerProps:B={},audioPlayerProps:R={},shapeToLabel:O=ie,ItemVideoPlayerProps:k={},ItemBinaryPlayerProps:G={},LoadingPlayerProps:J={},NoPreviewPlayerProps:z={},...H}){const[d,K]=g.useState(),n=g.useMemo(()=>m.filterShapeSource(c,{allowedMimeTypes:[...x,...y]}).map(f=>({...f,label:O(f.shape)})),[c,x,y,O]),a=g.useMemo(()=>{if(d)return m.getShapeMediaType(d.shape);if(n&&n.length>0)return m.getShapeMediaType(n[0].shape)},[d,n]),Q=({target:{value:h}})=>{const{src:f,shape:Z,type:ee}=h;if(a===A||a===j){const r=o&&o.current&&o.current.player&&o.current.player.videojs;if(!r||r.currentSrc()===f)return;const te=r.paused(),re=r.currentTime(),E=Math.floor(r.duration()),N=ce(Z);r.preload==="none"&&(r.preload="metadata"),E<=N+2&&E>=N-2?(r.addClass("vjs-has-started"),r.bigPlayButton.hide(),r.poster(""),r.one("loadedmetadata",()=>{r.currentTime(re),te||r.play()})):r.one("loadeddata",()=>{r.bigPlayButton.show()}),r.pause(),r.src({src:f,type:ee.replace("x-","")})}K(h)},X=l||a===void 0||n.length===0;return t.jsx("div",{className:L(s.root,e,"VdtItemPlayer-root"),children:X?t.jsx(t.Fragment,{children:l?t.jsx(C,{...J}):t.jsx(W,{...z})}):t.jsxs(t.Fragment,{children:[(a===_||a===j||a===ae)&&t.jsxs(t.Fragment,{children:[M&&a===_&&t.jsx(M,{previewSource:d||n[0],videoEl:o,...H}),P&&a===j&&t.jsx(P,{videoEl:o,onReady:I,width:w,sourceTag:S,previewSources:n,audioPlayerProps:R}),D&&n.length>1&&t.jsx(D,{options:n,value:d||n[0],onChange:Q})]}),b&&a===se&&t.jsx(b,{itemId:i,itemType:c,source:d||(n==null?void 0:n[0]),sourceTag:S,previewSources:n,...G}),v&&a===A&&t.jsx(v,{videoEl:o,itemType:c,subtitleGroup:T,subtitleField:V,sampleRate:Y,onReady:I,onCinema:p,onScreenshot:U,width:w,sourceTag:S,previewSources:n,videoPlayerProps:B,...k})]})})}exports.default=Se;exports.styles=fe;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),h=require("react"),L=require("clsx"),l=require("@material-ui/core"),ae=require("@material-ui/lab"),g=require("@vidispine/vdt-js"),$=require("../ItemAudioPlayer.js"),T=require("../ItemImagePlayer.js"),q=require("../ItemVideoPlayer.js"),oe=[...q.ALLOWED_MIME_TYPES,...T.ALLOWED_MIME_TYPES,...$.ALLOWED_MIME_TYPES],A="IMAGE",x="AUDIO",F="VIDEO",se="DOCUMENT",ie="BINARY",ue=e=>e.height?e.fieldOrder?`${e.tag} (${e.height}${e.fieldOrder[0]})`:`${e.tag} (${e.height}x${e.width})`:e.audioFormat?e.containerFormat!==e.audioFormat?`${e.tag} (${e.audioFormat} - ${e.containerFormat})`:`${e.tag} (${e.audioFormat})`:e.tag.join(", "),ce=e=>{const i=u=>u.split(":").reduce((a,o)=>60*a+Number(o));if(e.timeCode)return Math.floor(e.timeCode.toSeconds());if(e.duration)return i(e.duration)},le=l.withStyles({},{name:"VdtSourceSelection"})(({value:e,onChange:i,options:u,previewSourceText:a="Preview Source"})=>{const o=u.find(c=>c.label===e.label);return t.jsxs(l.FormControl,{variant:"standard",fullWidth:!0,children:[t.jsx(l.InputLabel,{children:a}),t.jsx(l.Select,{value:o,onChange:i,children:u.map(c=>t.jsx(l.MenuItem,{value:c,children:c.label},c.src))})]})}),de=l.withStyles({},{name:"VdtLoadingPlayer"})(e=>t.jsx(ae.Skeleton,{variant:"rect",width:"100%",height:520,...e})),fe=l.withStyles(e=>({root:{backgroundColor:e.palette.divider,width:"100%",height:520,display:"flex",justifyContent:"center",alignItems:"center"},label:{...e.typography.button}}),{name:"VdtNoPreviewPlayer"})(({className:e,classes:i,label:u="No Previews"})=>t.jsx("div",{className:L(i.root,e),children:t.jsx("div",{className:i.label,children:u})})),Se=()=>({root:{}});function he({className:e,classes:i={},itemId:u,videoEl:a,itemType:o,isLoading:c,subtitleGroup:p="stl_subtitle",subtitleField:V="stl_text",sampleRate:C="PAL",allowedMimeTypes:M=oe,additionalMimeTypes:y=[],LoadingPlayerComponent:Y=de,NoPreviewPlayerComponent:U=fe,ItemImagePlayerComponent:P=T.default,ItemAudioPlayerComponent:v=$.default,ItemVideoPlayerComponent:b=q.default,ItemBinaryPlayerComponent:I,onReady:w,onCinema:W,onScreenshot:B,width:D="100%",sourceTag:m="original",SourceSelectionComponent:O=le,videoPlayerProps:R={},audioPlayerProps:k={},shapeToLabel:E=ue,ItemVideoPlayerProps:G={},ItemBinaryPlayerProps:J={},LoadingPlayerProps:z={},NoPreviewPlayerProps:H={},...K}){const[d,Q]=h.useState(),n=h.useMemo(()=>g.filterShapeSource(o,{allowedMimeTypes:[...M,...y]}).map(S=>({...S,label:E(S.shape)})),[o,M,y,E]),j=h.useMemo(()=>{const{metadata:f}=o;return f?g.parseMetadataType(f,{flat:!0}).mediaType[0].toUpperCase():""},[o]),s=h.useMemo(()=>{if(j)return j;if(d)return g.getShapeMediaType(d.shape);if(n&&n.length>0)return g.getShapeMediaType(n[0].shape)},[d,n,j]),X=({target:{value:f}})=>{const{src:S,shape:ee,type:te}=f;if(s===F||s===x){const r=a&&a.current&&a.current.player&&a.current.player.videojs;if(!r||r.currentSrc()===S)return;const re=r.paused(),ne=r.currentTime(),N=Math.floor(r.duration()),_=ce(ee);r.preload==="none"&&(r.preload="metadata"),N<=_+2&&N>=_-2?(r.addClass("vjs-has-started"),r.bigPlayButton.hide(),r.poster(""),r.one("loadedmetadata",()=>{r.currentTime(ne),re||r.play()})):r.one("loadeddata",()=>{r.bigPlayButton.show()}),r.pause(),r.src({src:S,type:te.replace("x-","")})}Q(f)},Z=c||s===void 0||n.length===0;return t.jsx("div",{className:L(i.root,e,"VdtItemPlayer-root"),children:Z?t.jsx(t.Fragment,{children:c?t.jsx(Y,{...z}):t.jsx(U,{...H})}):t.jsxs(t.Fragment,{children:[(s===A||s===x||s===se)&&t.jsxs(t.Fragment,{children:[P&&s===A&&t.jsx(P,{previewSource:d||n[0],videoEl:a,...K}),v&&s===x&&t.jsx(v,{videoEl:a,onReady:w,width:D,sourceTag:m,previewSources:n,audioPlayerProps:k}),O&&n.length>1&&t.jsx(O,{options:n,value:d||n[0],onChange:X})]}),I&&s===ie&&t.jsx(I,{itemId:u,itemType:o,source:d||(n==null?void 0:n[0]),sourceTag:m,previewSources:n,...J}),b&&s===F&&t.jsx(b,{videoEl:a,itemType:o,subtitleGroup:p,subtitleField:V,sampleRate:C,onReady:w,onCinema:W,onScreenshot:B,width:D,sourceTag:m,previewSources:n,videoPlayerProps:R,...G})]})})}exports.default=he;exports.styles=Se;

package/dist/es/item/player/ItemImagePlayer.js

@@ -1,6 +1,6 @@
 import { jsx as m } from "react/jsx-runtime";
-import o from "clsx";
-import { withStyles as g, Box as r } from "@material-ui/core";
+import g from "clsx";
+import { withStyles as o, Box as r } from "@material-ui/core";
 const x = [
   "image/apng",
   "image/bmp",
@@ -8,7 +8,8 @@ const x = [
   "image/jpeg",
   "image/x-icon",
   "image/png",
-  "image/svg+xml"
+  "image/svg+xml",
+  "image/webp"
 ], n = () => ({
   root: {
     width: "100%",
@@ -24,9 +25,9 @@ const x = [
 });
 function s({ classes: e, className: t, previewSource: a = {} }) {
   const { src: i } = a;
-  return /* @__PURE__ */ m(r, { className: o(e.root, t), children: /* @__PURE__ */ m("img", { className: e.img, src: i, alt: "" }) });
+  return /* @__PURE__ */ m(r, { className: g(e.root, t), children: /* @__PURE__ */ m("img", { className: e.img, src: i, alt: "" }) });
 }
-const f = g(n, { name: "VdtItemImagePlayer" })(s);
+const f = o(n, { name: "VdtItemImagePlayer" })(s);
 export {
   x as ALLOWED_MIME_TYPES,
   f as default

package/dist/es/item/player/ItemPlayer/ItemPlayer.js

@@ -1,31 +1,31 @@
-import { jsxs as g, jsx as o, Fragment as S } from "react/jsx-runtime";
-import { useState as et, useMemo as w } from "react";
+import { jsxs as E, jsx as o, Fragment as h } from "react/jsx-runtime";
+import { useState as ot, useMemo as g } from "react";
 import Y from "clsx";
-import { withStyles as M, FormControl as ot, InputLabel as nt, Select as at, MenuItem as it } from "@material-ui/core";
+import { withStyles as P, FormControl as at, InputLabel as nt, Select as it, MenuItem as ct } from "@material-ui/core";
 import { Skeleton as lt } from "@material-ui/lab";
-import { filterShapeSource as ct, getShapeMediaType as N } from "@vidispine/vdt-js";
-import ut, { ALLOWED_MIME_TYPES as dt } from "../ItemAudioPlayer.js";
-import st, { ALLOWED_MIME_TYPES as mt } from "../ItemImagePlayer.js";
-import ft, { ALLOWED_MIME_TYPES as St } from "../ItemVideoPlayer.js";
-const ht = [...St, ...mt, ...dt], p = "IMAGE", h = "AUDIO", T = "VIDEO", gt = "DOCUMENT", Mt = "BINARY", Et = (t) => t.height ? t.fieldOrder ? `${t.tag} (${t.height}${t.fieldOrder[0]})` : `${t.tag} (${t.height}x${t.width})` : t.audioFormat ? t.containerFormat !== t.audioFormat ? `${t.tag} (${t.audioFormat} - ${t.containerFormat})` : `${t.tag} (${t.audioFormat})` : t.tag.join(", "), Pt = (t) => {
-  const i = (l) => l.split(":").reduce((n, c) => 60 * n + Number(c));
+import { filterShapeSource as ut, parseMetadataType as dt, getShapeMediaType as N } from "@vidispine/vdt-js";
+import st, { ALLOWED_MIME_TYPES as mt } from "../ItemAudioPlayer.js";
+import ft, { ALLOWED_MIME_TYPES as St } from "../ItemImagePlayer.js";
+import ht, { ALLOWED_MIME_TYPES as gt } from "../ItemVideoPlayer.js";
+const Mt = [...gt, ...St, ...mt], T = "IMAGE", M = "AUDIO", F = "VIDEO", Et = "DOCUMENT", Pt = "BINARY", It = (t) => t.height ? t.fieldOrder ? `${t.tag} (${t.height}${t.fieldOrder[0]})` : `${t.tag} (${t.height}x${t.width})` : t.audioFormat ? t.containerFormat !== t.audioFormat ? `${t.tag} (${t.audioFormat} - ${t.containerFormat})` : `${t.tag} (${t.audioFormat})` : t.tag.join(", "), yt = (t) => {
+  const c = (l) => l.split(":").reduce((a, n) => 60 * a + Number(n));
   if (t.timeCode)
     return Math.floor(t.timeCode.toSeconds());
   if (t.duration)
-    return i(t.duration);
-}, It = M(
+    return c(t.duration);
+}, Lt = P(
   {},
   { name: "VdtSourceSelection" }
-)(({ value: t, onChange: i, options: l, previewSourceText: n = "Preview Source" }) => {
-  const c = l.find((u) => u.label === t.label);
-  return /* @__PURE__ */ g(ot, { variant: "standard", fullWidth: !0, children: [
-    /* @__PURE__ */ o(nt, { children: n }),
-    /* @__PURE__ */ o(at, { value: c, onChange: i, children: l.map((u) => /* @__PURE__ */ o(it, { value: u, children: u.label }, u.src)) })
+)(({ value: t, onChange: c, options: l, previewSourceText: a = "Preview Source" }) => {
+  const n = l.find((u) => u.label === t.label);
+  return /* @__PURE__ */ E(at, { variant: "standard", fullWidth: !0, children: [
+    /* @__PURE__ */ o(nt, { children: a }),
+    /* @__PURE__ */ o(it, { value: n, onChange: c, children: l.map((u) => /* @__PURE__ */ o(ct, { value: u, children: u.label }, u.src)) })
   ] });
-}), Lt = M(
+}), Dt = P(
   {},
   { name: "VdtLoadingPlayer" }
-)((t) => /* @__PURE__ */ o(lt, { variant: "rect", width: "100%", height: 520, ...t })), yt = M(
+)((t) => /* @__PURE__ */ o(lt, { variant: "rect", width: "100%", height: 520, ...t })), _t = P(
   (t) => ({
     root: {
       backgroundColor: t.palette.divider,
@@ -40,133 +40,138 @@ const ht = [...St, ...mt, ...dt], p = "IMAGE", h = "AUDIO", T = "VIDEO", gt = "D
     }
   }),
   { name: "VdtNoPreviewPlayer" }
-)(({ className: t, classes: i, label: l = "No Previews" }) => /* @__PURE__ */ o("div", { className: Y(i.root, t), children: /* @__PURE__ */ o("div", { className: i.label, children: l }) })), pt = () => ({
+)(({ className: t, classes: c, label: l = "No Previews" }) => /* @__PURE__ */ o("div", { className: Y(c.root, t), children: /* @__PURE__ */ o("div", { className: c.label, children: l }) })), Ft = () => ({
   root: {}
 });
-function Tt({
+function Yt({
   className: t,
-  classes: i = {},
+  classes: c = {},
   itemId: l,
-  videoEl: n,
-  itemType: c,
+  videoEl: a,
+  itemType: n,
   isLoading: u,
   subtitleGroup: x = "stl_subtitle",
-  subtitleField: F = "stl_text",
-  sampleRate: W = "PAL",
-  allowedMimeTypes: E = ht,
-  additionalMimeTypes: P = [],
+  subtitleField: W = "stl_text",
+  sampleRate: V = "PAL",
+  allowedMimeTypes: I = Mt,
+  additionalMimeTypes: y = [],
   // extends the default set
-  LoadingPlayerComponent: V = Lt,
-  NoPreviewPlayerComponent: j = yt,
-  ItemImagePlayerComponent: I = st,
-  ItemAudioPlayerComponent: L = ut,
-  ItemVideoPlayerComponent: y = ft,
-  ItemBinaryPlayerComponent: D,
-  onReady: _,
-  onCinema: C,
-  onScreenshot: U,
-  width: O = "100%",
-  sourceTag: m = "original",
-  SourceSelectionComponent: v = It,
-  videoPlayerProps: B = {},
-  audioPlayerProps: k = {},
-  shapeToLabel: A = Et,
-  ItemVideoPlayerProps: G = {},
-  ItemBinaryPlayerProps: R = {},
-  LoadingPlayerProps: q = {},
-  NoPreviewPlayerProps: z = {},
-  ...H
+  LoadingPlayerComponent: j = Dt,
+  NoPreviewPlayerComponent: C = _t,
+  ItemImagePlayerComponent: L = ft,
+  ItemAudioPlayerComponent: D = st,
+  ItemVideoPlayerComponent: _ = ht,
+  ItemBinaryPlayerComponent: p,
+  onReady: O,
+  onCinema: U,
+  onScreenshot: B,
+  width: v = "100%",
+  sourceTag: f = "original",
+  SourceSelectionComponent: A = Lt,
+  videoPlayerProps: k = {},
+  audioPlayerProps: G = {},
+  shapeToLabel: $ = It,
+  ItemVideoPlayerProps: R = {},
+  ItemBinaryPlayerProps: q = {},
+  LoadingPlayerProps: z = {},
+  NoPreviewPlayerProps: H = {},
+  ...J
 }) {
-  const [d, J] = et(), e = w(() => ct(c, {
-    allowedMimeTypes: [...E, ...P]
-  }).map((s) => ({
-    ...s,
-    label: A(s.shape)
-  })), [c, E, P, A]), a = w(() => {
+  const [d, K] = ot(), e = g(() => ut(n, {
+    allowedMimeTypes: [...I, ...y]
+  }).map((m) => ({
+    ...m,
+    label: $(m.shape)
+  })), [n, I, y, $]), S = g(() => {
+    const { metadata: s } = n;
+    return s ? dt(s, { flat: !0 }).mediaType[0].toUpperCase() : "";
+  }, [n]), i = g(() => {
+    if (S)
+      return S;
     if (d)
       return N(d.shape);
     if (e && e.length > 0)
       return N(e[0].shape);
-  }, [d, e]), K = ({ target: { value: f } }) => {
-    const { src: s, shape: X, type: Z } = f;
-    if (a === T || a === h) {
-      const r = n && n.current && n.current.player && n.current.player.videojs;
-      if (!r || r.currentSrc() === s)
+  }, [d, e, S]), Q = ({ target: { value: s } }) => {
+    const { src: m, shape: Z, type: tt } = s;
+    if (i === F || i === M) {
+      const r = a && a.current && a.current.player && a.current.player.videojs;
+      if (!r || r.currentSrc() === m)
         return;
-      const tt = r.paused(), rt = r.currentTime(), $ = Math.floor(r.duration()), b = Pt(X);
-      r.preload === "none" && (r.preload = "metadata"), $ <= b + 2 && $ >= b - 2 ? (r.addClass("vjs-has-started"), r.bigPlayButton.hide(), r.poster(""), r.one("loadedmetadata", () => {
-        r.currentTime(rt), tt || r.play();
+      const rt = r.paused(), et = r.currentTime(), b = Math.floor(r.duration()), w = yt(Z);
+      r.preload === "none" && (r.preload = "metadata"), b <= w + 2 && b >= w - 2 ? (r.addClass("vjs-has-started"), r.bigPlayButton.hide(), r.poster(""), r.one("loadedmetadata", () => {
+        r.currentTime(et), rt || r.play();
       })) : r.one("loadeddata", () => {
         r.bigPlayButton.show();
-      }), r.pause(), r.src({ src: s, type: Z.replace("x-", "") });
+      }), r.pause(), r.src({ src: m, type: tt.replace("x-", "") });
     }
-    J(f);
-  }, Q = u || a === void 0 || e.length === 0;
-  return /* @__PURE__ */ o("div", { className: Y(i.root, t, "VdtItemPlayer-root"), children: Q ? (
+    K(s);
+  }, X = u || i === void 0 || e.length === 0;
+  return /* @__PURE__ */ o("div", { className: Y(c.root, t, "VdtItemPlayer-root"), children: X ? (
     // eslint-disable-next-line react/jsx-no-useless-fragment
-    /* @__PURE__ */ o(S, { children: u ? /* @__PURE__ */ o(V, { ...q }) : /* @__PURE__ */ o(j, { ...z }) })
-  ) : /* @__PURE__ */ g(S, { children: [
-    (a === p || a === h || a === gt) && /* @__PURE__ */ g(S, { children: [
-      I && a === p && /* @__PURE__ */ o(
-        I,
+    /* @__PURE__ */ o(h, { children: u ? /* @__PURE__ */ o(j, { ...z }) : /* @__PURE__ */ o(C, { ...H }) })
+  ) : /* @__PURE__ */ E(h, { children: [
+    (i === T || i === M || i === Et) && /* @__PURE__ */ E(h, { children: [
+      L && i === T && /* @__PURE__ */ o(
+        L,
         {
           previewSource: d || e[0],
-          videoEl: n,
-          ...H
+          videoEl: a,
+          ...J
         }
       ),
-      L && a === h && /* @__PURE__ */ o(
-        L,
+      D && i === M && /* @__PURE__ */ o(
+        D,
         {
-          videoEl: n,
-          onReady: _,
-          width: O,
-          sourceTag: m,
+          videoEl: a,
+          onReady: O,
+          width: v,
+          sourceTag: f,
           previewSources: e,
-          audioPlayerProps: k
+          audioPlayerProps: G
         }
       ),
-      v && e.length > 1 && /* @__PURE__ */ o(
-        v,
+      A && e.length > 1 && /* @__PURE__ */ o(
+        A,
         {
           options: e,
           value: d || e[0],
-          onChange: K
+          onChange: Q
         }
       )
     ] }),
-    D && a === Mt && /* @__PURE__ */ o(
-      D,
+    p && i === Pt && /* @__PURE__ */ o(
+      p,
       {
         itemId: l,
-        itemType: c,
+        itemType: n,
         source: d || (e == null ? void 0 : e[0]),
-        sourceTag: m,
+        sourceTag: f,
         previewSources: e,
-        ...R
+        ...q
       }
     ),
-    y && a === T && /* @__PURE__ */ o(
-      y,
+    _ && i === F && /* @__PURE__ */ o(
+      _,
       {
-        videoEl: n,
-        itemType: c,
+        videoEl: a,
+        itemType: n,
         subtitleGroup: x,
-        subtitleField: F,
-        sampleRate: W,
-        onReady: _,
-        onCinema: C,
-        onScreenshot: U,
-        width: O,
-        sourceTag: m,
+        subtitleField: W,
+        sampleRate: V,
+        onReady: O,
+        onCinema: U,
+        onScreenshot: B,
+        width: v,
+        sourceTag: f,
         previewSources: e,
-        videoPlayerProps: B,
-        ...G
+        videoPlayerProps: k,
+        ...R
       }
     )
   ] }) });
 }
 export {
-  Tt as default,
-  pt as styles
+  Yt as default,
+  Ft as styles
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vidispine/vdt-materialui",
-  "version": "26.1.0-pre.2",
+  "version": "26.1.0-pre.4",
   "license": "SEE LICENSE IN LICENSE.md",
   "publishConfig": {
     "access": "public",
@@ -36,11 +36,11 @@
   },
   "dependencies": {
     "@babel/runtime": "7.26.10",
-    "@vidispine/proptypes": "26.1.0-pre.2",
-    "@vidispine/vdt-api": "26.1.0-pre.2",
-    "@vidispine/vdt-js": "26.1.0-pre.2",
-    "@vidispine/vdt-react": "26.1.0-pre.2",
-    "@vidispine/vdt-videojs-react": "26.1.0-pre.2",
+    "@vidispine/proptypes": "26.1.0-pre.4",
+    "@vidispine/vdt-api": "26.1.0-pre.4",
+    "@vidispine/vdt-js": "26.1.0-pre.4",
+    "@vidispine/vdt-react": "26.1.0-pre.4",
+    "@vidispine/vdt-videojs-react": "26.1.0-pre.4",
     "clsx": "1.2.1",
     "filesize": "10.1.0",
     "final-form": "4.20.10",
@@ -74,11 +74,11 @@
     "@material-ui/icons": "4.11.3",
     "@material-ui/lab": "4.0.0-alpha.61",
     "@types/jest": "29.5.11",
-    "@vidispine/eslint-config-mdx": "26.1.0-pre.2",
-    "@vidispine/eslint-config-react": "26.1.0-pre.2",
-    "@vidispine/eslint-config-storybook": "26.1.0-pre.2",
-    "@vidispine/prettier-config": "26.1.0-pre.2",
-    "@vidispine/proptypes": "26.1.0-pre.2",
+    "@vidispine/eslint-config-mdx": "26.1.0-pre.4",
+    "@vidispine/eslint-config-react": "26.1.0-pre.4",
+    "@vidispine/eslint-config-storybook": "26.1.0-pre.4",
+    "@vidispine/prettier-config": "26.1.0-pre.4",
+    "@vidispine/proptypes": "26.1.0-pre.4",
     "@vitejs/plugin-react": "4.2.1",
     "@wojtekmaj/enzyme-adapter-react-17": "0.8.0",
     "axios": "1.7.7",