@webitel/ui-sdk 26.2.121 → 26.2.123

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webitel/ui-sdk",
-	"version": "26.2.121",
+	"version": "26.2.123",
 	"private": false,
 	"scripts": {
 		"make-all": "npm version patch --git-tag-version false && npm run build && (npm run build:types || true) && (npm run biome:format:all || true) && npm run publish-lib",

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

@@ -52,7 +52,7 @@ import 'vidstack/bundle';
 import type { AudioMimeType, MediaSrc } from 'vidstack';
 import { computed, useTemplateRef } from 'vue';
 
-import TimeGroup from '../wt-vidstack-player/components/panels/media-controls-panel/components/time-group.vue';
+import TimeGroup from '../wt-vidstack-player/components/panels/playback-controls-panel/components/time-group.vue';
 import MuteButton from './src/components/buttons/mute-button.vue';
 import PlayButton from './src/components/buttons/play-button.vue';
 import TimeSlider from './src/components/sliders/time-slider.vue';

package/src/components/wt-search-bar/wt-search-bar.vue

@@ -5,6 +5,8 @@
     :invalid="invalid"
 		class="wt-search-bar"
     type="search"
+		:v="v"
+		:custom-validators="customValidators"
     @update:model-value="handleInput"
     @keyup="handleKeyup"
   >

package/src/components/wt-vidstack-player/components/index.ts

@@ -1,6 +1,6 @@
 export { default as ControlsGroup } from './controls-group/controls-group.vue';
 export { default as VideoLayout } from './layouts/video-layout.vue';
-export { default as MediaControlsPanel } from './panels/media-controls-panel/media-controls-panel.vue';
+export { default as PlaybackControlsPanel } from './panels/playback-controls-panel/playback-controls-panel.vue';
 export { default as ScreenSharingControlsPanel } from './panels/screen-sharing-controls-panel/screen-sharing-controls-panel.vue';
 export { default as VideoCallControlsPanel } from './panels/video-call-controls-panel/video-call-controls-panel.vue';
 export { default as RecordingIndicator } from './recording-indicator/recording-indicator.vue';

package/src/components/wt-vidstack-player/components/layouts/video-layout.vue

@@ -12,7 +12,7 @@ v-if="!props.hideVideoDisplayPanel" :title="props.title" :username="props.userna
 
     <div class="video-layout-controls">
       <slot v-if="!props.hideControlsPanel" name="controls-panel">
-        <media-controls-panel />
+        <playback-controls-panel />
       </slot>
     </div>
   </media-controls>
@@ -22,7 +22,7 @@ v-if="!props.hideVideoDisplayPanel" :title="props.title" :username="props.userna
 import { inject } from 'vue';
 
 import type { WtVidstackPlayerSizeProvider } from '../../types/WtVidstackPlayerSizeProvider';
-import { MediaControlsPanel } from '../index';
+import { PlaybackControlsPanel } from '../index';
 import VideoDisplayPanel from '../panels/video-display-panel/video-display-panel.vue';
 
 const { size } = inject<WtVidstackPlayerSizeProvider>('size');

package/src/components/wt-vidstack-player/components/panels/{media-controls-panel/media-controls-panel.vue → playback-controls-panel/playback-controls-panel.vue}

@@ -1,5 +1,5 @@
 <template>
-  <controls-group class="media-control-panel">
+  <controls-group class="playback-control-panel">
     <play-button />
 
     <time-slider />
@@ -16,7 +16,7 @@ import TimeGroup from './components/time-group.vue';
 </script>
 
 <style scoped>
-.media-control-panel {
+.playback-control-panel {
   width: 100%;
   max-width: 100%;
 }

package/types/components/wt-vidstack-player/components/index.d.ts

@@ -1,6 +1,6 @@
 export { default as ControlsGroup } from './controls-group/controls-group.vue';
 export { default as VideoLayout } from './layouts/video-layout.vue';
-export { default as MediaControlsPanel } from './panels/media-controls-panel/media-controls-panel.vue';
+export { default as PlaybackControlsPanel } from './panels/playback-controls-panel/playback-controls-panel.vue';
 export { default as ScreenSharingControlsPanel } from './panels/screen-sharing-controls-panel/screen-sharing-controls-panel.vue';
 export { default as VideoCallControlsPanel } from './panels/video-call-controls-panel/video-call-controls-panel.vue';
 export { default as RecordingIndicator } from './recording-indicator/recording-indicator.vue';

package/dist/wt-player-DwTOLAJs.js

@@ -1,157 +0,0 @@
-import { defineComponent as u, createElementBlock as l, openBlock as t, Fragment as B, createElementVNode as m, createTextVNode as h, resolveComponent as w, createVNode as o, computed as x, normalizeClass as z, createBlock as g, createCommentVNode as _ } from "vue";
-/* empty css                                                                    */
-import { _ as i, E as f } from "./install-DOf0JHFD.js";
-import { _ as v } from "./wt-slider.vue_vue_type_script_setup_true_lang-DlaRDHxo.js";
-const C = { class: "time-group" }, E = {
-  key: 0,
-  type: "current",
-  remainder: ""
-}, T = /* @__PURE__ */ u({
-  __name: "time-group",
-  props: {
-    countdown: { type: Boolean, default: !1 }
-  },
-  setup(n) {
-    const r = n;
-    return (e, c) => (t(), l("div", C, [
-      r.countdown ? (t(), l("media-time", E)) : (t(), l(B, { key: 1 }, [
-        c[0] || (c[0] = m("media-time", { type: "current" }, null, -1)),
-        c[1] || (c[1] = h(" / ", -1)),
-        c[2] || (c[2] = m("media-time", { type: "duration" }, null, -1))
-      ], 64))
-    ]));
-  }
-}), V = /* @__PURE__ */ i(T, [["__scopeId", "data-v-4f888af4"]]), I = {}, S = { class: "mute-button" };
-function M(n, r) {
-  const e = w("wt-icon");
-  return t(), l("media-mute-button", S, [
-    o(e, {
-      type: "mute",
-      icon: "plyr-muted",
-      class: "mute-icon",
-      size: "sm"
-    }),
-    o(e, {
-      type: "volume",
-      icon: "plyr-volume",
-      class: "volume-icon",
-      size: "sm"
-    })
-  ]);
-}
-const N = /* @__PURE__ */ i(I, [["render", M], ["__scopeId", "data-v-8394e2c8"]]), F = { class: "play-button" }, O = /* @__PURE__ */ u({
-  __name: "play-button",
-  setup(n) {
-    return (r, e) => (t(), l("media-play-button", F, [
-      o(f, {
-        icon: "plyr-play",
-        type: "play",
-        class: "play-icon",
-        size: "sm"
-      }),
-      o(f, {
-        icon: "plyr-pause",
-        type: "pause",
-        class: "pause-icon",
-        size: "sm"
-      })
-    ]));
-  }
-}), P = /* @__PURE__ */ i(O, [["__scopeId", "data-v-e79e3bf5"]]), A = { class: "time-slider media-slider" }, G = /* @__PURE__ */ u({
-  __name: "time-slider",
-  setup(n) {
-    return (r, e) => (t(), l("media-time-slider", A, [
-      o(v, { class: "time-slider__slider" })
-    ]));
-  }
-}), U = /* @__PURE__ */ i(G, [["__scopeId", "data-v-e57a9871"]]), j = { class: "volume-slider media-slider" }, q = /* @__PURE__ */ u({
-  __name: "volume-slider",
-  setup(n) {
-    return (r, e) => (t(), l("media-volume-slider", j, [
-      o(v, { class: "volume-slider__slider" })
-    ]));
-  }
-}), D = /* @__PURE__ */ i(q, [["__scopeId", "data-v-b92a4daf"]]), H = ["src", "loop", "autoplay"], J = { class: "controls-group" }, K = /* @__PURE__ */ u({
-  __name: "wt-player",
-  props: {
-    src: {},
-    id: {},
-    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 },
-    closable: { type: Boolean, default: !0 },
-    position: { default: "sticky" }
-  },
-  emits: ["initialized", "close"],
-  setup(n, { emit: r }) {
-    const e = n, c = x(() => {
-      if (!e.src?.type) return e.src;
-      const s = $(e.src.type);
-      return {
-        src: e.src.src,
-        type: s
-      };
-    });
-    function $(s) {
-      return [
-        "audio/wav"
-      ].includes(s) ? "audio/mp3" : s;
-    }
-    function b() {
-      const s = typeof e.src == "string" ? e.src : e.src?.src, a = typeof e.download == "function" ? e.download(s) : e.download, p = e.src?.type.split("/").pop(), y = e.id || "unknown", d = document.createElement("a");
-      d.style.display = "none", d.href = a, d.download = `${y}.${p}`, document.body.appendChild(d), d.click(), document.body.removeChild(d);
-    }
-    function k(s) {
-      if (!e.resetOnEnd) return;
-      const a = s.target;
-      a.currentTime = 0;
-    }
-    return (s, a) => {
-      const p = w("wt-icon-btn");
-      return t(), l("media-player", {
-        class: z(["wt-player", `wt-player--position-${e.position}`]),
-        src: c.value,
-        loop: e.loop,
-        autoplay: n.autoplay,
-        onEnded: k
-      }, [
-        a[1] || (a[1] = m("media-provider", null, null, -1)),
-        m("media-controls-group", J, [
-          o(P),
-          o(U),
-          o(V, {
-            countdown: e.countdownTimeMode
-          }, null, 8, ["countdown"]),
-          o(N),
-          e.hideVolumeSlider ? _("", !0) : (t(), g(D, { key: 0 })),
-          e.download ? (t(), l("media-button", {
-            key: 1,
-            class: "download-button",
-            onClick: b
-          }, [
-            o(p, {
-              icon: "plyr-download",
-              size: "sm"
-            })
-          ])) : _("", !0),
-          e.closable ? (t(), l("media-button", {
-            key: 2,
-            class: "close-button",
-            onClick: a[0] || (a[0] = (y) => s.$emit("close"))
-          }, [
-            o(p, {
-              icon: "close",
-              size: "sm"
-            })
-          ])) : _("", !0)
-        ])
-      ], 42, H);
-    };
-  }
-}), X = /* @__PURE__ */ i(K, [["__scopeId", "data-v-5d88ce1f"]]);
-export {
-  X as default
-};