filepond 5.0.0-beta.2 → 5.0.0-beta.21

package/esm/templates/media.js

@@ -1,31 +1,33 @@
 /*!
-* FilePond v5.0.0-beta.2
+* FilePond v5.0.0-beta.21
 * Copyright (c) 2017-2026 Pqina B.V.
 * Released under the MIT License
 * https://filepond.com
 */
 import "../elements/FilePondEntryList/components/MediaVideo/index.js";
-import { createButton as a, hasExtensionWithStatusCode as p, createSpringPane as c, whenEntryIs as m, whenEntryNotHasStatus as u, whenEntryHasAction as y, getExtensionByAction as S, hasExtensionWithStatusType as R } from "./helpers.js";
+import { createEntryMatcher as F, createButton as c, hasExtensionWithStatusCode as u, createSpringPane as l, whenEntryIs as R, whenEntryNotHasStatus as M, whenEntryHasAction as h, getExtensionByAction as I, hasExtensionWithStatusType as _, hasExtensionWithProp as B } from "./helpers.js";
 import "../elements/components/RangeInput/index.js";
-import { supportsRequestFullscreen as E } from "../utils/support.js";
-import { toTime as M } from "../utils/date.js";
-import { nodeTree as s } from "../elements/common/nodeTree.js";
-import { boolToAttributeValue as l } from "../utils/dom.js";
+import { supportsRequestFullscreen as C } from "../utils/support.js";
+import { toTime as U } from "../utils/date.js";
+import { nodeTree as d } from "../elements/common/nodeTree.js";
+import { boolToAttributeValue as E } from "../utils/dom.js";
 import "../elements/FilePondEntryList/components/MediaTimeIndicator/index.js";
 import "../elements/FilePondEntryList/components/EntryActivityIndicator/index.js";
 import "../elements/FilePondEntryList/components/MediaImage/index.js";
-import i from "../elements/components/SpringElement/index.svelte.js";
-import T from "../elements/FilePondEntryList/components/EntryActivityIndicator/index.svelte.js";
-import O from "../elements/FilePondEntryList/components/MediaImage/index.svelte.js";
-import h from "../elements/FilePondEntryList/components/MediaVideo/index.svelte.js";
-import A from "../elements/components/RangeInput/index.svelte.js";
-import v from "../elements/FilePondEntryList/components/MediaTimeIndicator/index.svelte.js";
-function g(e) {
+import a from "../elements/components/SpringElement/index.svelte.js";
+import "../elements/components/ElementPane/index.js";
+import w from "../elements/FilePondEntryList/components/EntryActivityIndicator/index.svelte.js";
+import V from "../elements/FilePondEntryList/components/MediaImage/index.svelte.js";
+import N from "../elements/FilePondEntryList/components/MediaVideo/index.svelte.js";
+import x from "../elements/components/RangeInput/index.svelte.js";
+import L from "../elements/FilePondEntryList/components/MediaTimeIndicator/index.svelte.js";
+import j from "../elements/components/ElementPane/index.svelte.js";
+function T(e) {
   const { action: t = "editMedia" } = e ?? {};
   return {
     key: "button-media-edit",
-    component: T,
-    props: ({ id: n, entry: o }, { updateEntryState: r }) => ({
+    component: w,
+    props: ({ id: n, entry: r }, { updateEntryState: o }) => ({
       buttonPart: "media-button",
       states: [
         {
@@ -36,58 +38,81 @@ function g(e) {
             "TRANSFORM_COMPLETE",
             "TRANSFORM_BUSY"
           ],
-          button: a("button-transform-activate", {
+          button: c("button-transform-activate", {
             icon: "mediaEdit",
-            onclick: () => r?.(n, { [t]: !0 }),
-            disabled: p(o, [
+            disabled: u(r, [
               "STORE_QUEUED",
               "STORE_BUSY",
               "TRANSFORM_BUSY"
-            ])
+            ]),
+            onclick: () => o?.(n, { [t]: !0 })
           })
         },
         {
           codes: ["TRANSFORM_PREPARE"],
           progress: !0,
-          button: a("button-transform-abort", {
+          button: c("button-transform-abort", {
             icon: "abort",
-            onclick: () => r(n, {
-              [t]: null
-            }),
-            disabled: p(o, [
+            disabled: u(r, [
               "STORE_QUEUED",
               "STORE_BUSY",
               "TRANSFORM_BUSY"
-            ])
+            ]),
+            onclick: () => o(n, {
+              [t]: null
+            })
           })
         }
       ]
     })
   };
 }
-function b(e) {
+function O(e) {
   const { action: t = "editMedia" } = e ?? {};
-  return a("button-media-reset", {
-    props: ({ id: n, entry: o }, { updateEntryState: r }) => ({
-      buttonPart: "media-button",
-      disabled: p(o, [
+  return c("button-media-reset", {
+    props: ({ id: n, entry: r }, { updateEntryState: o }) => ({
+      part: "media-button",
+      disabled: u(r, [
         "STORE_QUEUED",
         "STORE_BUSY",
         "TRANSFORM_PREPARE",
         "TRANSFORM_BUSY"
-      ]) || !S(o, t)?.input,
+      ]) || !I(r, t)?.input,
       icon: "mediaReset",
       label: "reset",
       title: "reset",
-      onclick: () => r?.(n, { [t]: !1 })
+      onclick: () => o?.(n, { [t]: !1 })
     })
   });
 }
-function P(e) {
-  const { objectSize: t = void 0 } = e ?? {};
+function v(e) {
+  return {
+    key: e,
+    component: j,
+    spring: ({ visualRect: t }) => ({
+      opacity: {
+        value: t.height > 0 ? 1 : 0,
+        config: {
+          stiffness: 0.02,
+          damping: 0.85,
+          precision: 0.1
+        }
+      }
+    }),
+    props: ({ visualRect: t, opacity: n }) => ({
+      part: "media-pane",
+      class: "media-pane",
+      width: t.width,
+      height: t.height,
+      opacity: n
+    })
+  };
+}
+function Y(e) {
+  const { objectFit: t = void 0 } = e ?? {};
   return {
     key: "entry-image-spring",
-    component: i,
+    component: a,
     props: {
       class: "entry-media",
       part: "entry-media"
@@ -95,19 +120,16 @@ function P(e) {
     children: [
       {
         key: "entry-image",
-        component: O,
+        component: V,
         props: e
       },
       {
         if: {
           test: () => t === "contain",
-          then: c({
-            key: "entry-image-pane",
-            class: "media-pane"
-          })
+          then: v("entry-image-pane")
         }
       },
-      c({
+      l({
         key: "entry-image-overlay",
         class: "media-overlay",
         part: "media-overlay"
@@ -115,18 +137,18 @@ function P(e) {
     ]
   };
 }
-function _({ entry: e }) {
+function S({ entry: e }) {
   const { media: t, video: n } = e.extension.EntryListView || {};
   return {
     media: t,
     video: n
   };
 }
-function B(e) {
-  const { objectSize: t = void 0 } = e ?? {};
+function D(e) {
+  const { objectFit: t = void 0 } = e ?? {};
   return {
     key: "entry-video-spring",
-    component: i,
+    component: a,
     props: {
       class: "entry-media",
       part: "entry-media"
@@ -134,19 +156,16 @@ function B(e) {
     children: [
       {
         key: "entry-video",
-        component: h,
+        component: N,
         props: e
       },
       {
         if: {
           test: () => t === "contain",
-          then: c({
-            key: "entry-video-pane",
-            class: "media-pane"
-          })
+          then: v("entry-video-pane")
         }
       },
-      c({
+      l({
         key: "entry-video-overlay",
         class: "media-overlay",
         part: "media-overlay"
@@ -154,115 +173,122 @@ function B(e) {
     ]
   };
 }
-function U(e) {
-  const { key: t, justifyContent: n } = e || {}, o = "media-control-group" + (n ? ` justify-content-${n}` : "");
-  return s({
+function Q(e) {
+  const { key: t, justifyContent: n } = e || {}, r = "media-control-group" + (n ? ` justify-content-${n}` : "");
+  return d({
     key: t,
-    component: i,
+    component: a,
     props: {
       subtag: "element-stack",
-      class: o
+      class: r
     },
     children: [
-      c({
+      l({
         key: "media-control-group-background",
         class: "media-control-pane"
       })
     ]
   });
 }
-function d(e) {
+function m(e) {
   const { key: t } = e || {};
-  return s({
+  return d({
     key: t,
-    component: i,
+    component: a,
     props: {
       subtag: "element-stack",
       class: "media-control"
     },
     children: [
-      c({
+      l({
         key: "media-control-background",
         class: "media-control-pane"
       })
     ]
   });
 }
-function f(e) {
-  const { key: t = "media-controls", justifyContent: n } = e || {}, o = "entry-media-controls" + (n ? ` justify-content-${n}` : "");
-  return s({
+function A(e) {
+  const { key: t = "media-controls", justifyContent: n } = e || {}, r = "entry-media-controls" + (n ? ` justify-content-${n}` : "");
+  return d({
     if: {
       // don't render media controls if in error state
-      test: ({ entry: r }) => !R(r, ["error"]),
+      test: ({ entry: o }) => {
+        const { media: i } = S({ entry: o });
+        return i && i.isReady && !_(o, ["error"]);
+      },
       then: {
         key: t,
         tag: "element-stack",
-        context: _,
-        attrs: ({ media: r, video: k }) => ({
-          class: o,
+        context: S,
+        attrs: ({ media: o, video: i }) => ({
+          class: r,
           part: "media-controls",
-          "data-media-is-visible": l(r?.isVisible),
-          "data-media-is-playing": l(k?.isPlaying)
+          "data-media-is-visible": E(o?.isVisible),
+          "data-media-is-playing": E(i?.isPlaying)
         })
       }
     }
   });
 }
-function F() {
+function W() {
   return {
     key: "toggle-playback-spring",
-    component: i,
+    component: a,
     props: {
       class: "toggle-playback"
     },
-    children: a("toggle-playback", ({ video: e }) => ({
+    children: c("toggle-playback", ({ video: e }) => ({
+      part: "media-button",
       icon: e?.isPaused ? "mediaPlay" : "mediaPause"
     }))
   };
 }
-function I() {
+function H() {
   return {
     key: "toggle-audio-spring",
-    component: i,
+    component: a,
     props: {
       class: "toggle-audio"
     },
-    children: a("toggle-audio", ({ video: e }) => ({
+    children: c("toggle-audio", ({ video: e }) => ({
+      part: "media-button",
       icon: e?.isMute ? "mediaSilent" : e?.isMuted ? "mediaUnmute" : "mediaMute",
       disabled: e?.isMute
     }))
   };
 }
-function X() {
+function ue() {
   return {
     // only added when fullscreen is supported
     if: {
-      test: E,
+      test: C,
       then: {
         key: "toggle-fullscreen-spring",
-        component: i,
+        component: a,
         props: {
           class: "toggle-fullscreen"
         },
-        children: a("toggle-fullscreen", {
+        children: c("toggle-fullscreen", {
+          part: "media-button",
           icon: "mediaFullscreen"
         })
       }
     }
   };
 }
-function C() {
+function $() {
   return {
     key: "media-scrubber-spring",
-    component: i,
+    component: a,
     props: {
       class: "media-scrubber"
     },
     children: [
       {
         key: "media-scrubber",
-        component: A,
+        component: x,
         props: ({ video: e }) => ({
+          part: "media-scrubber",
           step: e?.framesPerSecond,
           value: e?.time,
           min: 0,
@@ -272,12 +298,12 @@ function C() {
     ]
   };
 }
-function Z() {
+function ge() {
   return {
     key: "media-scrubber-title",
     tag: "time",
     context: ({ hoverValue: e }) => ({
-      time: M(e)
+      time: U(e)
     }),
     attrs: ({ time: e }) => ({
       datetime: e
@@ -285,16 +311,16 @@ function Z() {
     children: "{{time}}"
   };
 }
-function V() {
+function q() {
   return {
     key: "media-time-indicator-spring",
-    component: i,
+    component: a,
     props: {
       class: "media-time-indicator"
     },
     children: {
       key: "media-time-indicator",
-      component: v,
+      component: L,
       props: ({ video: e }) => ({
         timeISO: e?.timeISO,
         timeLabel: e?.timeLabel,
@@ -304,65 +330,71 @@ function V() {
     }
   };
 }
-function ee(e, t) {
-  const { imageViewOptions: n } = t ?? {};
-  s(e).find("entry").append(
-    m("image").append(
-      P(n),
-      u("error").append(
-        y("editMedia").append(
-          f({ justifyContent: "end" }).append(
-            d().append(b()),
-            d().append(g())
+const G = F("image");
+function ye(e, t) {
+  const { imageViewOptions: n, imageEditOptions: r } = t ?? {}, { enableEdit: o = !0, enableReset: i = !0 } = r ?? {}, p = o || i;
+  return d(e).find("entry").append(
+    R((s) => G(s) || B(s, "poster")).append(
+      Y(n),
+      p && M("error").append(
+        h("editMedia").append(
+          A({ justifyContent: "end" }).append(
+            i && m().append(O()),
+            o && m().append(T())
           )
         )
       )
     )
-  );
+  ), e;
 }
-function te(e, t) {
-  const { videoViewOptions: n } = t ?? {};
-  s(e).update("entry", (o) => {
-    o.routes = {
+function be(e, t) {
+  const { videoViewOptions: n, videoEditOptions: r, videoControlOptions: o } = t ?? {}, {
+    enablePlay: i = !0,
+    enableScrubber: p = !0,
+    enableTime: s = !0,
+    enableMute: g = !0
+  } = o ?? {}, { enableEdit: y = !0, enableReset: b = !0 } = r ?? {}, f = y || b, k = i || p || s || g;
+  return d(e).update("entry", (P) => {
+    P.routes = {
       "toggle-playback:click": "entry-video.togglePlayback",
       "toggle-audio:click": "entry-video.toggleAudio",
       "toggle-fullscreen:click": "entry-video.toggleFullscreen",
       "media-scrubber:input": "entry-video.setCurrentTime"
     };
   }).append(
-    m("video").append(
-      B(n),
-      u("error").append(
-        f().append(
-          U({ key: "video-controls" }).append(
-            F(),
-            C(),
-            V(),
-            I()
+    R("video").append(
+      D(n),
+      (f || k) && M("error").append(
+        A().append(
+          k && Q({ key: "video-controls" }).append(
+            i && W(),
+            p && $(),
+            s && q(),
+            g && H()
           ),
-          y("editMedia").append(
-            d().append(b()),
-            d().append(g())
+          f && h("editMedia").append(
+            b && m().append(O()),
+            y && m().append(T())
           )
         )
       )
     )
-  );
+  ), e;
 }
 export {
-  ee as appendEntryImageView,
-  te as appendEntryVideoView,
-  g as createEditMediaButton,
-  P as createImageView,
-  d as createMediaControl,
-  U as createMediaControlGroup,
-  f as createMediaControls,
-  C as createMediaScrubber,
-  Z as createMediaScrubberTitle,
-  V as createMediaTimeIndicator,
-  b as createResetMediaButton,
-  I as createToggleAudioButton,
-  X as createToggleFullscreenButton,
-  F as createTogglePlaybackButton,
-  B as createVideoView
+  ye as appendEntryImageView,
+  be as appendEntryVideoView,
+  T as createEditMediaButton,
+  Y as createImageView,
+  m as createMediaControl,
+  Q as createMediaControlGroup,
+  A as createMediaControls,
+  $ as createMediaScrubber,
+  ge as createMediaScrubberTitle,
+  q as createMediaTimeIndicator,
+  O as createResetMediaButton,
+  H as createToggleAudioButton,
+  ue as createToggleFullscreenButton,
+  W as createTogglePlaybackButton,
+  D as createVideoView
 };

package/esm/utils/array.js

@@ -1,5 +1,5 @@
 /*!
-* FilePond v5.0.0-beta.2
+* FilePond v5.0.0-beta.21
 * Copyright (c) 2017-2026 Pqina B.V.
 * Released under the MIT License
 * https://filepond.com

package/esm/utils/bounds.js

@@ -1,5 +1,5 @@
 /*!
-* FilePond v5.0.0-beta.2
+* FilePond v5.0.0-beta.21
 * Copyright (c) 2017-2026 Pqina B.V.
 * Released under the MIT License
 * https://filepond.com

package/esm/utils/cache.js

@@ -1,5 +1,5 @@
 /*!
-* FilePond v5.0.0-beta.2
+* FilePond v5.0.0-beta.21
 * Copyright (c) 2017-2026 Pqina B.V.
 * Released under the MIT License
 * https://filepond.com

package/esm/utils/canvasToBlob.js

@@ -1,5 +1,5 @@
 /*!
-* FilePond v5.0.0-beta.2
+* FilePond v5.0.0-beta.21
 * Copyright (c) 2017-2026 Pqina B.V.
 * Released under the MIT License
 * https://filepond.com

package/esm/utils/date.js

@@ -1,5 +1,5 @@
 /*!
-* FilePond v5.0.0-beta.2
+* FilePond v5.0.0-beta.21
 * Copyright (c) 2017-2026 Pqina B.V.
 * Released under the MIT License
 * https://filepond.com

package/esm/utils/debounce.js

@@ -1,5 +1,5 @@
 /*!
-* FilePond v5.0.0-beta.2
+* FilePond v5.0.0-beta.21
 * Copyright (c) 2017-2026 Pqina B.V.
 * Released under the MIT License
 * https://filepond.com