@linktr.ee/messaging-react 1.26.1 → 1.28.0-rc-1776225927

package/dist/MediaPlayer-DE9MC6k6.js

@@ -0,0 +1,599 @@
+import { jsxs as V, jsx as u } from "react/jsx-runtime";
+import { FileIcon as Q, ImageIcon as le, SpeakerHighIcon as ie, VideoCameraIcon as oe, FileMdIcon as ce, FileTextIcon as se, FileZipIcon as ue, FilePptIcon as de, FileCsvIcon as me, FileXlsIcon as fe, FileDocIcon as ye, FilePdfIcon as he, CircleNotchIcon as ve, PlayIcon as Y, PauseIcon as we } from "@phosphor-icons/react";
+import b, { lazy as P, useRef as O, useEffect as N, useCallback as K, useState as _, Suspense as Pe } from "react";
+const be = [
+  [/pdf/, "pdf"],
+  [/wordprocessingml|msword|\.doc/, "doc"],
+  [/spreadsheetml|ms-excel|\.xls/, "xls"],
+  [/csv/, "csv"],
+  [/presentationml|ms-powerpoint|\.ppt/, "ppt"],
+  [/zip|x-rar|x-7z|x-tar|x-gzip/, "zip"],
+  [/plain|rtf/, "text"],
+  [/markdown/, "markdown"]
+];
+function ee(e) {
+  return e.startsWith("video/") ? "video" : e.startsWith("audio/") ? "audio" : e.startsWith("image/") ? "image" : "document";
+}
+function pe(e) {
+  const a = be.find(
+    ([c]) => c.test(e)
+  );
+  return a ? a[1] : "generic";
+}
+const ge = {
+  video: oe,
+  audio: ie,
+  image: le,
+  document: Q
+}, ke = {
+  pdf: he,
+  doc: ye,
+  xls: fe,
+  csv: me,
+  ppt: de,
+  zip: ue,
+  text: se,
+  markdown: ce,
+  generic: Q
+};
+function Ie(e) {
+  const a = ee(e);
+  return a !== "document" ? ge[a] : ke[pe(e)];
+}
+function xe(e, a) {
+  return b.createElement(Ie(e), a);
+}
+const te = /\.(m4a|m4b|mp4a|mpga|mp2|mp2a|mp3|m2a|m3a|wav|weba|aac|oga|spx)($|\?)/i, Z = /\.(mp4|og[gv]|webm|mov|m4v)(#t=[,\d+]+)?($|\?)/i, G = /\.(m3u8)($|\?)/i, Ee = /\.(mpd)($|\?)/i, _e = /stream\.mux\.com\/(?!\w+\.m3u8)(\w+)/, Ne = /(?:youtu\.be\/|youtube(?:-nocookie|education)?\.com\/(?:embed\/|v\/|watch\/|watch\?v=|watch\?.+&v=|shorts\/|live\/))((\w|-){11})|youtube\.com\/playlist\?list=|youtube\.com\/user\//, Te = /vimeo\.com\/(?!progressive_redirect).+/, Re = /(?:wistia\.(?:com|net)|wi\.st)\/(?:medias|embed)\/(?:iframe\/)?([^?]+)/, Me = /open\.spotify\.com\/(\w+)\/(\w+)/i, Se = /(?:www\.|go\.)?twitch\.tv\/([a-zA-Z0-9_]+|(videos?\/|\?video=)\d+)($|\?)/, Ae = /tiktok\.com\/(?:player\/v1\/|share\/video\/|@[^/]+\/video\/)([0-9]+)/, z = (e, a) => {
+  if (Array.isArray(e)) {
+    for (const c of e)
+      if (typeof c == "string" && z(c, a) || z(c.src, a))
+        return !0;
+    return !1;
+  }
+  return a(e);
+}, w = {
+  html: (e) => z(e, (a) => te.test(a) || Z.test(a)),
+  hls: (e) => z(e, (a) => G.test(a)),
+  dash: (e) => z(e, (a) => Ee.test(a)),
+  mux: (e) => _e.test(e),
+  youtube: (e) => Ne.test(e),
+  vimeo: (e) => Te.test(e) && !Z.test(e) && !G.test(e),
+  wistia: (e) => Re.test(e),
+  spotify: (e) => Me.test(e),
+  twitch: (e) => Se.test(e),
+  tiktok: (e) => Ae.test(e)
+}, Ce = b.forwardRef((e, a) => {
+  const c = te.test(`${e.src}`) ? "audio" : "video";
+  return /* @__PURE__ */ b.createElement(c, { ...e, ref: a }, e.children);
+});
+var Le = Ce;
+const Oe = [
+  {
+    key: "hls",
+    name: "hls.js",
+    canPlay: w.hls,
+    canEnablePIP: () => !0,
+    player: P(
+      () => import(
+        /* webpackChunkName: 'reactPlayerHls' */
+        "./react-Pea5fum1.js"
+      )
+    )
+  },
+  {
+    key: "dash",
+    name: "dash.js",
+    canPlay: w.dash,
+    canEnablePIP: () => !0,
+    player: P(
+      () => import(
+        /* webpackChunkName: 'reactPlayerDash' */
+        "./react-dS1WBxxz.js"
+      )
+    )
+  },
+  {
+    key: "mux",
+    name: "Mux",
+    canPlay: w.mux,
+    canEnablePIP: () => !0,
+    player: P(
+      () => import(
+        /* webpackChunkName: 'reactPlayerMux' */
+        "./index-Da-xN4Yq.js"
+      )
+    )
+  },
+  {
+    key: "youtube",
+    name: "YouTube",
+    canPlay: w.youtube,
+    player: P(
+      () => import(
+        /* webpackChunkName: 'reactPlayerYouTube' */
+        "./react-RiBbsUDd.js"
+      )
+    )
+  },
+  {
+    key: "vimeo",
+    name: "Vimeo",
+    canPlay: w.vimeo,
+    player: P(
+      () => import(
+        /* webpackChunkName: 'reactPlayerVimeo' */
+        "./react-Cn4WlMcl.js"
+      )
+    )
+  },
+  {
+    key: "wistia",
+    name: "Wistia",
+    canPlay: w.wistia,
+    canEnablePIP: () => !0,
+    player: P(
+      () => import(
+        /* webpackChunkName: 'reactPlayerWistia' */
+        "./react-CwTJArKY.js"
+      )
+    )
+  },
+  {
+    key: "spotify",
+    name: "Spotify",
+    canPlay: w.spotify,
+    canEnablePIP: () => !1,
+    player: P(
+      () => import(
+        /* webpackChunkName: 'reactPlayerSpotify' */
+        "./react-COAP-MIW.js"
+      )
+    )
+  },
+  {
+    key: "twitch",
+    name: "Twitch",
+    canPlay: w.twitch,
+    canEnablePIP: () => !1,
+    player: P(
+      () => import(
+        /* webpackChunkName: 'reactPlayerTwitch' */
+        "./react-BxlQMOfz.js"
+      )
+    )
+  },
+  {
+    key: "tiktok",
+    name: "TikTok",
+    canPlay: w.tiktok,
+    canEnablePIP: () => !1,
+    player: P(
+      () => import(
+        /* webpackChunkName: 'reactPlayerTiktok' */
+        "./react-DkfS_atT.js"
+      )
+    )
+  },
+  {
+    key: "html",
+    name: "html",
+    canPlay: w.html,
+    canEnablePIP: () => !0,
+    player: Le
+  }
+];
+var B = Oe;
+const Fe = {
+  // Falsy values don't need to be defined
+  //
+  // native video attrs
+  // src: undefined,
+  // preload: undefined,
+  // crossOrigin: undefined,
+  // autoPlay: false,
+  // muted: false,
+  // loop: false,
+  // controls: false,
+  // playsInline: false,
+  // disableRemotePlayback: false,
+  width: "320px",
+  height: "180px",
+  // native video props
+  volume: 1,
+  playbackRate: 1,
+  // custom props
+  // playing: undefined,
+  // pip: false,
+  // light: false,
+  // fallback: null,
+  previewTabIndex: 0,
+  previewAriaLabel: "",
+  oEmbedUrl: "https://noembed.com/embed?url={url}"
+}, ae = b.forwardRef((e, a) => {
+  const { playing: c, pip: m } = e, o = e.activePlayer, l = O(null), i = O(!0);
+  N(() => {
+    var n, s;
+    l.current && (l.current.paused && c === !0 && l.current.play(), !l.current.paused && c === !1 && l.current.pause(), l.current.playbackRate = (n = e.playbackRate) != null ? n : 1, l.current.volume = (s = e.volume) != null ? s : 1);
+  }), N(() => {
+    var n, s, d, y, g;
+    if (!(!l.current || !globalThis.document)) {
+      if (m && !document.pictureInPictureElement)
+        try {
+          (s = (n = l.current).requestPictureInPicture) == null || s.call(n);
+        } catch {
+        }
+      if (!m && document.pictureInPictureElement)
+        try {
+          (y = (d = l.current).exitPictureInPicture) == null || y.call(d), (g = document.exitPictureInPicture) == null || g.call(document);
+        } catch {
+        }
+    }
+  }, [m]);
+  const S = (n) => {
+    var s, d;
+    i.current = !0, (s = e.onReady) == null || s.call(e), (d = e.onLoadStart) == null || d.call(e, n);
+  }, p = (n) => {
+    var s, d;
+    i.current && (i.current = !1, (s = e.onStart) == null || s.call(e, n)), (d = e.onPlay) == null || d.call(e, n);
+  };
+  if (!o)
+    return null;
+  const T = {}, F = ["onReady", "onStart"];
+  for (const n in e)
+    n.startsWith("on") && !F.includes(n) && (T[n] = e[n]);
+  return /* @__PURE__ */ b.createElement(
+    o,
+    {
+      ...T,
+      style: e.style,
+      className: e.className,
+      slot: e.slot,
+      ref: K(
+        (n) => {
+          l.current = n, typeof a == "function" ? a(n) : a !== null && (a.current = n);
+        },
+        [a]
+      ),
+      src: e.src,
+      crossOrigin: e.crossOrigin,
+      preload: e.preload,
+      controls: e.controls,
+      muted: e.muted,
+      autoPlay: e.autoPlay,
+      loop: e.loop,
+      playsInline: e.playsInline,
+      disableRemotePlayback: e.disableRemotePlayback,
+      config: e.config,
+      onLoadStart: S,
+      onPlay: p
+    },
+    e.children
+  );
+});
+ae.displayName = "Player";
+var He = ae;
+const De = P(() => import(
+  /* webpackChunkName: 'reactPlayerPreview' */
+  "./Preview-DqAv16NS.js"
+)), U = [], Ue = (e, a) => {
+  const c = (o) => {
+    for (const l of [...U, ...e])
+      if (o && l.canPlay(o))
+        return l;
+    return a || null;
+  }, m = b.forwardRef((o, l) => {
+    const i = { ...Fe, ...o }, { src: S, slot: p, className: T, style: F, width: n, height: s, fallback: d, wrapper: y } = i, [g, f] = _(!!i.light);
+    N(() => {
+      i.light ? f(!0) : f(!1);
+    }, [i.light]);
+    const $ = (E) => {
+      var h;
+      f(!1), (h = i.onClickPreview) == null || h.call(i, E);
+    }, W = (E) => {
+      if (!E) return null;
+      const { light: h, playIcon: k, previewTabIndex: v, oEmbedUrl: I, previewAriaLabel: R } = i;
+      return /* @__PURE__ */ b.createElement(
+        De,
+        {
+          src: E,
+          light: h,
+          playIcon: k,
+          previewTabIndex: v,
+          previewAriaLabel: R,
+          oEmbedUrl: I,
+          onClickPreview: $
+        }
+      );
+    }, X = (E) => {
+      var h, k;
+      const v = c(E);
+      if (!v) return null;
+      const { style: I, width: R, height: x, wrapper: A } = i, C = (h = i.config) == null ? void 0 : h[v.key];
+      return /* @__PURE__ */ b.createElement(
+        He,
+        {
+          ...i,
+          ref: l,
+          activePlayer: (k = v.player) != null ? k : v,
+          slot: A ? void 0 : p,
+          className: A ? void 0 : T,
+          style: A ? { display: "block", width: "100%", height: "100%" } : { display: "block", width: R, height: x, ...I },
+          config: C
+        }
+      );
+    }, H = y ?? J, q = d === !1 ? J : Pe;
+    return /* @__PURE__ */ b.createElement(H, { slot: p, className: T, style: { width: n, height: s, ...F } }, /* @__PURE__ */ b.createElement(q, { fallback: d }, g ? W(S) : X(S)));
+  });
+  return m.displayName = "ReactPlayer", m.addCustomPlayer = (o) => {
+    U.push(o);
+  }, m.removeCustomPlayers = () => {
+    U.length = 0;
+  }, m.canPlay = (o) => {
+    if (o) {
+      for (const l of [...U, ...e])
+        if (l.canPlay(o))
+          return !0;
+    }
+    return !1;
+  }, m.canEnablePIP = (o) => {
+    var l;
+    if (o) {
+      for (const i of [...U, ...e])
+        if (i.canPlay(o) && ((l = i.canEnablePIP) != null && l.call(i)))
+          return !0;
+    }
+    return !1;
+  }, m;
+}, J = ({ children: e }) => e, ze = B[B.length - 1];
+var $e = Ue(B, ze);
+const We = (e, a) => e === "audio" && !a ? "bg-black/5" : "bg-black";
+function Xe(e) {
+  var a, c;
+  return "touches" in e ? ((a = e.touches[0]) == null ? void 0 : a.clientX) ?? ((c = e.changedTouches[0]) == null ? void 0 : c.clientX) ?? 0 : e.clientX;
+}
+const Ve = ({
+  source: e,
+  mimeType: a,
+  poster: c,
+  autoPlay: m = !1,
+  playing: o,
+  loop: l = !1,
+  controls: i = !0,
+  showProgress: S = !1,
+  onContainerClick: p,
+  muted: T = !1
+}) => {
+  const F = ee(a), [n, s] = _(m), d = O(o);
+  N(() => {
+    o !== void 0 && o !== d.current && (d.current = o, s(o));
+  }, [o]);
+  const [y, g] = _(0), [f, $] = _(!1), [W, X] = _(!1), [H, q] = _(null), [E, h] = _(!1), [k, v] = _(!1), I = O(null), R = O(null), x = O(null);
+  N(() => {
+    v(!1);
+  }, [e]), N(() => {
+    if (!n) {
+      x.current !== null && (cancelAnimationFrame(x.current), x.current = null);
+      return;
+    }
+    const t = () => {
+      const r = I.current;
+      r && r.duration && !f && g(r.currentTime / r.duration), x.current = requestAnimationFrame(t);
+    };
+    return x.current = requestAnimationFrame(t), () => {
+      x.current !== null && cancelAnimationFrame(x.current);
+    };
+  }, [n, f]), N(() => {
+    const t = I.current;
+    t && (n ? t.play().catch((r) => {
+      s(!1), v(!0);
+    }) : t.pause());
+  }, [n]);
+  const A = K(() => {
+    v(!1), s(!0);
+  }, []), C = K(
+    (t) => {
+      const r = R.current;
+      if (!r) return 0;
+      const L = r.getBoundingClientRect();
+      return Math.max(
+        0,
+        Math.min(1, (Xe(t) - L.left) / L.width)
+      );
+    },
+    []
+  ), M = K((t) => {
+    const r = I.current;
+    r && r.duration && (r.currentTime = t * r.duration);
+  }, []), j = (t) => {
+    t.stopPropagation(), $(!0);
+    const r = C(t);
+    g(r), M(r);
+  };
+  N(() => {
+    if (!f) return;
+    const t = (L) => g(C(L)), r = (L) => {
+      $(!1), M(C(L));
+    };
+    return window.addEventListener("mousemove", t), window.addEventListener("mouseup", r), window.addEventListener("touchmove", t, { passive: !0 }), window.addEventListener("touchend", r), () => {
+      window.removeEventListener("mousemove", t), window.removeEventListener("mouseup", r), window.removeEventListener("touchmove", t), window.removeEventListener("touchend", r);
+    };
+  }, [f, C, M]);
+  const ne = H ? { aspectRatio: String(H) } : void 0, re = H ? "" : " aspect-video", D = Math.round(y * 100);
+  return /* @__PURE__ */ V(
+    "div",
+    {
+      role: "button",
+      tabIndex: 0,
+      className: `relative cursor-pointer overflow-hidden ${We(F, c)}${re}`,
+      style: ne,
+      onClick: () => {
+        if (!k) {
+          if (p) {
+            p();
+            return;
+          }
+          i && s((t) => !t);
+        }
+      },
+      onKeyDown: (t) => {
+        if (!(t.key !== "Enter" && t.key !== " ") && (t.preventDefault(), !k)) {
+          if (p) {
+            p();
+            return;
+          }
+          i && s((r) => !r);
+        }
+      },
+      children: [
+        c && /* @__PURE__ */ u(
+          "img",
+          {
+            src: c,
+            alt: "",
+            className: "absolute inset-0 h-full w-full object-cover"
+          }
+        ),
+        !c && /* @__PURE__ */ u("div", { className: "absolute inset-0 flex items-center justify-center", children: xe(a, {
+          className: "size-12 text-black/20",
+          weight: "regular"
+        }) }),
+        /* @__PURE__ */ u("div", { className: "absolute inset-0", children: /* @__PURE__ */ u(
+          $e,
+          {
+            ref: I,
+            src: e,
+            poster: c,
+            loop: l,
+            muted: T,
+            playsInline: !0,
+            width: "100%",
+            height: "100%",
+            onLoadStart: () => h(!0),
+            onCanPlay: () => h(!1),
+            onWaiting: () => h(!0),
+            onPlay: () => v(!1),
+            onLoadedMetadata: () => {
+              const t = I.current;
+              t && t.videoWidth && t.videoHeight && q(t.videoWidth / t.videoHeight);
+            },
+            onEnded: () => {
+              l || (s(!1), g(0));
+            }
+          }
+        ) }),
+        E && !k && /* @__PURE__ */ u("div", { className: "absolute inset-0 z-10 flex items-center justify-center", children: /* @__PURE__ */ u(
+          ve,
+          {
+            className: "size-8 animate-spin text-white/80",
+            weight: "bold"
+          }
+        ) }),
+        k && !i && /* @__PURE__ */ u(
+          "div",
+          {
+            className: "absolute inset-0 z-30 flex cursor-pointer items-center justify-center bg-black/35",
+            role: "button",
+            tabIndex: 0,
+            "aria-label": "Play preview",
+            onClick: (t) => {
+              t.stopPropagation(), A();
+            },
+            onKeyDown: (t) => {
+              t.key !== "Enter" && t.key !== " " || (t.preventDefault(), t.stopPropagation(), A());
+            },
+            children: /* @__PURE__ */ u("span", { className: "flex size-16 items-center justify-center rounded-full bg-white/20 text-white backdrop-blur-sm", children: /* @__PURE__ */ u(Y, { className: "size-9 translate-x-0.5", weight: "fill" }) })
+          }
+        ),
+        S && !i && /* @__PURE__ */ u("div", { className: "absolute inset-x-0 bottom-0 px-3 pb-2.5 pt-6 bg-gradient-to-t from-black/40 to-transparent", children: /* @__PURE__ */ u(
+          "div",
+          {
+            role: "slider",
+            "aria-label": "Playback position",
+            "aria-valuenow": D,
+            "aria-valuemin": 0,
+            "aria-valuemax": 100,
+            tabIndex: 0,
+            ref: R,
+            className: "relative flex h-4 w-full cursor-pointer items-center",
+            onMouseDown: j,
+            onTouchStart: j,
+            onClick: (t) => t.stopPropagation(),
+            onKeyDown: (t) => {
+              t.key === "ArrowRight" && M(Math.min(1, y + 0.05)), t.key === "ArrowLeft" && M(Math.max(0, y - 0.05));
+            },
+            children: /* @__PURE__ */ u("div", { className: "w-full overflow-hidden rounded-full bg-white/30 h-1", children: /* @__PURE__ */ u(
+              "div",
+              {
+                className: "h-full rounded-full bg-white",
+                style: { width: `${D}%` }
+              }
+            ) })
+          }
+        ) }),
+        i && /* @__PURE__ */ V("div", { className: "absolute inset-x-0 bottom-0 flex items-center gap-2 bg-gradient-to-t from-black/60 to-transparent px-3 pb-2.5 pt-6 transition-all duration-200", children: [
+          /* @__PURE__ */ u(
+            "button",
+            {
+              type: "button",
+              onClick: (t) => {
+                t.stopPropagation(), s((r) => !r);
+              },
+              className: "shrink-0 text-white",
+              "aria-label": n ? "Pause" : "Play",
+              children: n ? /* @__PURE__ */ u(we, { className: "size-5", weight: "fill" }) : /* @__PURE__ */ u(Y, { className: "size-5 translate-x-px", weight: "fill" })
+            }
+          ),
+          /* @__PURE__ */ V(
+            "div",
+            {
+              role: "slider",
+              "aria-label": "Playback position",
+              "aria-valuenow": D,
+              "aria-valuemin": 0,
+              "aria-valuemax": 100,
+              tabIndex: 0,
+              ref: R,
+              className: "relative flex h-4 w-full cursor-pointer items-center",
+              onMouseDown: j,
+              onTouchStart: j,
+              onClick: (t) => t.stopPropagation(),
+              onMouseEnter: () => X(!0),
+              onMouseLeave: () => X(!1),
+              onKeyDown: (t) => {
+                t.key === "ArrowRight" && M(Math.min(1, y + 0.05)), t.key === "ArrowLeft" && M(Math.max(0, y - 0.05));
+              },
+              children: [
+                /* @__PURE__ */ u(
+                  "div",
+                  {
+                    className: `w-full overflow-hidden rounded-full bg-white/30 transition-all duration-200 ${W || f ? "h-1.5" : "h-1"}`,
+                    children: /* @__PURE__ */ u(
+                      "div",
+                      {
+                        className: "h-full rounded-full bg-white",
+                        style: { width: `${D}%` }
+                      }
+                    )
+                  }
+                ),
+                /* @__PURE__ */ u(
+                  "div",
+                  {
+                    className: `absolute size-3 -translate-x-1/2 rounded-full bg-white shadow transition-[opacity,transform] duration-200 ${W || f ? "scale-100 opacity-100" : "scale-0 opacity-0"}`,
+                    style: { left: `${D}%` }
+                  }
+                )
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+export {
+  Ve as M,
+  ee as g,
+  xe as r
+};
+//# sourceMappingURL=MediaPlayer-DE9MC6k6.js.map