@webitel/ui-sdk 26.6.12 → 26.6.13

package/src/components/wt-player/wt-player.vue

@@ -56,7 +56,7 @@
 >
 import 'vidstack/bundle';
 import type { MediaSrc } from 'vidstack';
-import { ref, toRefs } from 'vue';
+import { ref, toRefs, watch } from 'vue';
 import { ComponentSize } from '../../enums';
 import SettingsPanel, {
 	type MediaSettings,
@@ -203,6 +203,17 @@ function handleEnded(event: Event) {
 	const player = event.target as HTMLMediaElement;
 	player.currentTime = 0;
 }
+
+function resetPlayerSettings() {
+	playerSettings.value.playbackRate = 1;
+}
+
+watch(
+	() => props.src,
+	() => {
+		resetPlayerSettings();
+	},
+);
 </script>
 
 <style scoped>

package/dist/wt-display-chip-items-BJBcrF_I.js

@@ -1,47 +0,0 @@
-import { defineComponent as _, computed as c, createElementBlock as t, openBlock as s, createCommentVNode as a, renderSlot as n, createVNode as d, toDisplayString as o, createTextVNode as h, unref as m, withCtx as u, Fragment as v, renderList as k } from "vue";
-import { H as C, ah as I, _ as B } from "./install-BjrTYVuH.js";
-import { E, d as S } from "./displayText-Cbh4IOfM.js";
-const b = { class: "wt-display-chip-items" }, g = { key: 0 }, w = ["onClick"], F = /* @__PURE__ */ _({
-  __name: "wt-display-chip-items",
-  props: {
-    hideFirstItem: { type: Boolean },
-    useEmptySymbol: { type: Boolean },
-    title: {},
-    items: {}
-  },
-  setup(p) {
-    const e = p, y = c(() => e.items?.length ? e.items[0]?.name : e.useEmptySymbol ? E : ""), i = c(() => e.items?.length ? e.hideFirstItem ? e.items : e.items.slice(1) : []);
-    return (l, N) => (s(), t("div", b, [
-      e.title ? (s(), t("p", g, o(p.title) + ":", 1)) : a("", !0),
-      e.hideFirstItem ? a("", !0) : n(l.$slots, "first-item", { key: 1 }, () => [
-        h(o(m(S)(y.value)), 1)
-      ], !0),
-      d(m(C), null, {
-        activator: u(({ toggle: r }) => [
-          n(l.$slots, "activator", { toggle: r }, () => [
-            i.value.length ? (s(), t("div", {
-              key: 0,
-              onClick: r
-            }, [
-              d(m(I), null, {
-                default: u(() => [
-                  h(" +" + o(i.value.length), 1)
-                ], void 0, !0),
-                _: 1
-              })
-            ], 8, w)) : a("", !0)
-          ], !0)
-        ]),
-        default: u(() => [
-          n(l.$slots, "items", { items: i.value }, () => [
-            (s(!0), t(v, null, k(i.value, ({ name: r, id: f }) => (s(), t("div", { key: f }, o(r), 1))), 128))
-          ], !0)
-        ]),
-        _: 3
-      })
-    ]));
-  }
-}), V = /* @__PURE__ */ B(F, [["__scopeId", "data-v-4c67fbb7"]]);
-export {
-  V as default
-};

package/dist/wt-player-CQhYaufW.js

@@ -1,282 +0,0 @@
-import { defineComponent as f, computed as E, createElementBlock as c, openBlock as a, createElementVNode as y, createVNode as t, unref as o, withCtx as V, toDisplayString as F, Fragment as I, renderList as R, resolveComponent as M, createBlock as z, ref as T, toRefs as N, normalizeClass as P, createCommentVNode as S } from "vue";
-import { E as g, C as i, F as h, G as U, _ as p, H as O } from "./install-BjrTYVuH.js";
-import { u as D, T as G } from "./useVidstackSrc-DDO7Varm.js";
-import { _ as x } from "./wt-slider.vue_vue_type_script_setup_true_lang-DlaRDHxo.js";
-const W = { class: "speed-settings" }, j = { class: "speed-settings__controls" }, H = { class: "speed-settings__label" }, L = { class: "speed-settings__presets" }, $ = 0.25, B = 3, C = 0.25, q = /* @__PURE__ */ f({
-  __name: "speed-settings",
-  props: {
-    modelValue: { default: 1 }
-  },
-  emits: ["update:modelValue"],
-  setup(n, { emit: u }) {
-    const e = n, r = u, b = [
-      {
-        speed: 0.5,
-        icon: "playback-0.50"
-      },
-      {
-        speed: 0.75,
-        icon: "playback-0.75"
-      },
-      {
-        speed: 1,
-        icon: "playback-1.00"
-      },
-      {
-        speed: 1.5,
-        icon: "playback-1.50"
-      },
-      {
-        speed: 1.75,
-        icon: "playback-1.75"
-      }
-    ], m = E(() => `${e.modelValue.toFixed(2)}x`);
-    function w() {
-      const l = parseFloat((e.modelValue - C).toFixed(2)), s = Math.max($, l);
-      r("update:modelValue", s);
-    }
-    function v() {
-      const l = parseFloat((e.modelValue + C).toFixed(2)), s = Math.min(B, l);
-      r("update:modelValue", s);
-    }
-    return (l, s) => (a(), c("div", W, [
-      y("div", j, [
-        t(o(g), {
-          size: o(i).SM,
-          disabled: n.modelValue <= $,
-          class: "speed-settings__step-button",
-          variant: "outlined",
-          color: "secondary",
-          onClick: w
-        }, {
-          default: V(() => [
-            t(o(h), {
-              icon: "minus",
-              size: o(i).SM
-            }, null, 8, ["size"])
-          ]),
-          _: 1
-        }, 8, ["size", "disabled"]),
-        y("span", H, F(m.value), 1),
-        t(o(g), {
-          size: o(i).SM,
-          disabled: n.modelValue >= B,
-          class: "speed-settings__step-button",
-          variant: "outlined",
-          color: "secondary",
-          onClick: v
-        }, {
-          default: V(() => [
-            t(o(h), {
-              icon: "plus",
-              size: o(i).SM
-            }, null, 8, ["size"])
-          ]),
-          _: 1
-        }, 8, ["size", "disabled"])
-      ]),
-      t(o(U), {
-        class: "speed-settings__slider",
-        "model-value": n.modelValue,
-        min: $,
-        max: B,
-        step: C,
-        "onUpdate:modelValue": s[0] || (s[0] = (d) => l.$emit("update:modelValue", d))
-      }, null, 8, ["model-value"]),
-      y("div", L, [
-        (a(), c(I, null, R(b, (d) => t(o(g), {
-          key: d.speed,
-          size: o(i).SM,
-          variant: "outlined",
-          class: "speed-settings__preset-button",
-          color: "secondary",
-          onClick: (k) => l.$emit("update:modelValue", d.speed)
-        }, {
-          default: V(() => [
-            t(o(h), {
-              icon: d.icon,
-              size: o(i).SM
-            }, null, 8, ["icon", "size"])
-          ]),
-          _: 2
-        }, 1032, ["size", "onClick"])), 64))
-      ])
-    ]));
-  }
-}), A = /* @__PURE__ */ p(q, [["__scopeId", "data-v-cf19f492"]]), J = ["onClick"], K = /* @__PURE__ */ f({
-  __name: "settings-panel",
-  props: {
-    modelValue: { default: () => ({
-      playbackRate: 1
-    }) }
-  },
-  emits: ["update:modelValue"],
-  setup(n, { emit: u }) {
-    const e = n, r = u;
-    function b(m) {
-      r("update:modelValue", {
-        ...e.modelValue,
-        playbackRate: m
-      });
-    }
-    return (m, w) => {
-      const v = M("wt-icon-btn");
-      return a(), z(o(O), { class: "settings-panel" }, {
-        activator: V(({ toggle: l }) => [
-          y("media-button", {
-            class: "settings-panel__button",
-            onClick: l
-          }, [
-            t(v, {
-              icon: "plyr-settings",
-              size: o(i).SM
-            }, null, 8, ["size"])
-          ], 8, J)
-        ]),
-        default: V(() => [
-          t(A, {
-            "model-value": n.modelValue.playbackRate,
-            "onUpdate:modelValue": b
-          }, null, 8, ["model-value"])
-        ], void 0, !0),
-        _: 1
-      });
-    };
-  }
-}), Q = /* @__PURE__ */ p(K, [["__scopeId", "data-v-16b027f7"]]), X = {}, Y = { class: "mute-button" };
-function Z(n, u) {
-  const e = M("wt-icon");
-  return a(), c("media-mute-button", Y, [
-    t(e, {
-      type: "mute",
-      icon: "plyr-muted",
-      class: "mute-icon",
-      size: "sm"
-    }),
-    t(e, {
-      type: "volume",
-      icon: "plyr-volume",
-      class: "volume-icon",
-      size: "sm"
-    })
-  ]);
-}
-const ee = /* @__PURE__ */ p(X, [["render", Z], ["__scopeId", "data-v-45e5719d"]]), te = { class: "play-button" }, oe = /* @__PURE__ */ f({
-  __name: "play-button",
-  setup(n) {
-    return (u, e) => (a(), c("media-play-button", te, [
-      t(h, {
-        icon: "plyr-play",
-        type: "play",
-        class: "play-icon",
-        size: "sm"
-      }),
-      t(h, {
-        icon: "plyr-pause",
-        type: "pause",
-        class: "pause-icon",
-        size: "sm"
-      })
-    ]));
-  }
-}), se = /* @__PURE__ */ p(oe, [["__scopeId", "data-v-e6149485"]]), ne = { class: "time-slider media-slider" }, le = /* @__PURE__ */ f({
-  __name: "time-slider",
-  setup(n) {
-    return (u, e) => (a(), c("media-time-slider", ne, [
-      t(x, { class: "time-slider__slider" })
-    ]));
-  }
-}), ae = /* @__PURE__ */ p(le, [["__scopeId", "data-v-e57a9871"]]), de = { class: "volume-slider media-slider" }, ie = /* @__PURE__ */ f({
-  __name: "volume-slider",
-  setup(n) {
-    return (u, e) => (a(), c("media-volume-slider", de, [
-      t(x, { class: "volume-slider__slider" })
-    ]));
-  }
-}), ce = /* @__PURE__ */ p(ie, [["__scopeId", "data-v-b92a4daf"]]), ue = ["src", "loop", "autoplay", "playback-rate"], re = { class: "controls-group" }, pe = /* @__PURE__ */ f({
-  __name: "wt-player",
-  props: {
-    src: {},
-    id: {},
-    fileName: {},
-    autoplay: { type: Boolean, default: !0 },
-    loop: { type: Boolean, default: !1 },
-    download: { type: [String, Function, Boolean], default: () => (n) => n.replace("/stream", "/download") },
-    resetOnEnd: { type: Boolean, default: !1 },
-    countdownTimeMode: { type: Boolean },
-    hideVolumeSlider: { type: Boolean, default: !1 },
-    hideMuteButton: { type: Boolean, default: !1 },
-    hideSettings: { type: Boolean, default: !1 },
-    closable: { type: Boolean, default: !0 },
-    position: { default: "sticky" },
-    invertTime: { type: Boolean, default: !0 },
-    resetVolume: { type: Boolean, default: !1 }
-  },
-  emits: ["initialized", "close"],
-  setup(n, { emit: u }) {
-    const e = n, r = T({
-      playbackRate: 1
-    }), { src: b } = N(e), { normalizedSrcObject: m } = D({
-      src: b
-    });
-    function w() {
-      const l = typeof e.src == "string" ? e.src : e.src?.src, s = typeof e.download == "function" ? e.download(l) : e.download, d = e.src?.type.split("/").pop(), k = e.fileName || e.id || "unknown", _ = document.createElement("a");
-      _.style.display = "none", _.href = s, _.download = `${k}.${d}`, document.body.appendChild(_), _.click(), document.body.removeChild(_);
-    }
-    function v(l) {
-      if (!e.resetOnEnd) return;
-      const s = l.target;
-      s.currentTime = 0;
-    }
-    return (l, s) => {
-      const d = M("wt-icon-btn");
-      return a(), c("media-player", {
-        class: P(["wt-player", `wt-player--position-${e.position}`]),
-        src: o(m),
-        loop: e.loop,
-        autoplay: n.autoplay,
-        "playback-rate": r.value.playbackRate,
-        onEnded: v
-      }, [
-        s[2] || (s[2] = y("media-provider", null, null, -1)),
-        y("media-controls-group", re, [
-          t(se),
-          t(ae),
-          t(G, {
-            countdown: e.countdownTimeMode
-          }, null, 8, ["countdown"]),
-          e.hideMuteButton ? S("", !0) : (a(), z(ee, { key: 0 })),
-          e.hideVolumeSlider ? S("", !0) : (a(), z(ce, { key: 1 })),
-          e.hideSettings ? S("", !0) : (a(), z(Q, {
-            key: 2,
-            "model-value": r.value,
-            "onUpdate:modelValue": s[0] || (s[0] = (k) => r.value = k)
-          }, null, 8, ["model-value"])),
-          e.download ? (a(), c("media-button", {
-            key: 3,
-            class: "download-button",
-            onClick: w
-          }, [
-            t(d, {
-              icon: "plyr-download",
-              size: o(i).SM
-            }, null, 8, ["size"])
-          ])) : S("", !0),
-          e.closable ? (a(), c("media-button", {
-            key: 4,
-            class: "close-button",
-            onClick: s[1] || (s[1] = (k) => l.$emit("close"))
-          }, [
-            t(d, {
-              icon: "close",
-              size: o(i).SM
-            }, null, 8, ["size"])
-          ])) : S("", !0)
-        ])
-      ], 42, ue);
-    };
-  }
-}), be = /* @__PURE__ */ p(pe, [["__scopeId", "data-v-5dba068e"]]);
-export {
-  be as default
-};