@webitel/ui-sdk 26.6.51 → 26.6.52

package/dist/{wt-chat-emoji-Dfd4PYWk.js → wt-chat-emoji-BMsFdEFN.js}

@@ -1,6 +1,6 @@
 import { a as e, t } from "./chunk-CY3AvKd6.js";
 import { n, t as r } from "./dist-BYiYpK00.js";
-import "./components-CCbLe_rX.js";
+import "./components-CkQp88E1.js";
 import { t as i } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as a } from "./enums-pbYAJNeb.js";
 import { t as o } from "./wt-button-CZfPNaIj.js";

package/dist/{wt-display-chip-items-Ca8E1ka5.js → wt-display-chip-items-C_FJyoHS.js}

@@ -1,4 +1,4 @@
-import { c as e, i as t } from "./components-CCbLe_rX.js";
+import { c as e, i as t } from "./components-CkQp88E1.js";
 import { t as n } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { t as r } from "./displayText-CtaxzaBz.js";
 import { Fragment as i, computed as a, createCommentVNode as o, createElementBlock as s, createTextVNode as c, createVNode as l, defineComponent as u, openBlock as d, renderList as f, renderSlot as p, toDisplayString as m, unref as h, withCtx as g } from "vue";

package/dist/{wt-player-BxvfY3f0.js → wt-player-B-8_UKI8.js}

@@ -3,7 +3,7 @@ import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as n } from "./enums-pbYAJNeb.js";
 import { t as r } from "./wt-button-CZfPNaIj.js";
 import { n as i, t as a } from "./useVidstackSrc-jCDCYTce.js";
-import { t as o } from "./wt-popover-CJZH3wMl.js";
+import { t as o } from "./wt-popover-CJin-2BO.js";
 import { t as s } from "./wt-slider-BS3SoGht.js";
 import { Fragment as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createVNode as m, defineComponent as h, normalizeClass as g, openBlock as _, ref as v, renderList as y, resolveComponent as b, toDisplayString as x, toRefs as S, unref as C, watch as w, withCtx as T } from "vue";
 //#region src/components/_shared/settings-panel/components/speed-settings/speed-settings.vue?vue&type=script&setup=true&lang.ts

package/dist/{wt-popover-CJZH3wMl.js → wt-popover-CJin-2BO.js}

@@ -1,18 +1,26 @@
 import { r as e } from "./chunk-CY3AvKd6.js";
 import { createElementBlock as t, createVNode as n, defineComponent as r, guardReactiveProps as i, mergeProps as a, normalizeProps as o, onBeforeUnmount as s, onMounted as c, openBlock as l, renderSlot as u, resolveComponent as d, toHandlers as f, unref as p, useAttrs as m, useTemplateRef as h, withCtx as g } from "vue";
 //#region src/components/wt-popover/_internals/composables/usePopoverOverlayFix.ts
-var _ = (e) => {
-	let t = (t) => {
-		if (!t.target?.closest(".p-select-overlay, .p-multiselect-overlay")) return;
-		let n = e.value?.outsideClickListener;
-		n && (document.removeEventListener("click", n), document.addEventListener("click", () => {
-			document.addEventListener("click", n);
-		}, {
-			once: !0,
-			capture: !1
-		}));
+var _ = (e, t) => {
+	let n = (n) => {
+		let r = n.target;
+		if (r?.closest(".p-select-overlay, .p-multiselect-overlay")) {
+			let t = e.value?.outsideClickListener;
+			if (!t) return;
+			document.removeEventListener("click", t), document.addEventListener("click", () => {
+				setTimeout(() => {
+					let t = e.value?.outsideClickListener;
+					t && document.addEventListener("click", t);
+				}, 0);
+			}, {
+				once: !0,
+				capture: !0
+			});
+			return;
+		}
+		e.value?.visible && e.value.container && (e.value.container.contains(r) || t.value?.contains(r) || e.value.hide?.());
 	};
-	c(() => document.addEventListener("pointerdown", t, !0)), s(() => document.removeEventListener("pointerdown", t, !0));
+	c(() => document.addEventListener("pointerdown", n, !0)), s(() => document.removeEventListener("pointerdown", n, !0));
 }, v = /*@__PURE__*/ r({
 	__name: "wt-popover",
 	props: {
@@ -42,25 +50,28 @@ var _ = (e) => {
 	},
 	emits: ["show", "hide"],
 	setup(e, { expose: r }) {
-		let s = m(), c = h("innerPopover"), v = e;
-		_(c);
-		let y = (e, t) => {
-			v.disabled || c.value?.toggle(e, t ?? void 0);
-		}, b = (e, t) => {
-			v.disabled || c.value?.show(e, t ?? void 0);
-		}, x = (e) => {
+		let s = m(), c = h("innerPopover"), v = h("wrapper"), y = e;
+		_(c, v);
+		let b = (e, t) => {
+			y.disabled || c.value?.toggle(e, t ?? void 0);
+		}, x = (e, t) => {
+			y.disabled || c.value?.show(e, t ?? void 0);
+		}, S = (e) => {
 			c.value?.hide(e);
 		};
 		return r({
-			toggle: y,
-			show: b,
-			hide: x
+			toggle: b,
+			show: x,
+			hide: S
 		}), (r, m) => {
 			let h = d("p-popover");
-			return l(), t("div", null, [u(r.$slots, "activator", o(i({
-				show: b,
-				toggle: y,
-				hide: x
+			return l(), t("div", {
+				ref_key: "wrapper",
+				ref: v
+			}, [u(r.$slots, "activator", o(i({
+				show: x,
+				toggle: b,
+				hide: S
 			}))), n(h, a(p(s), {
 				ref_key: "innerPopover",
 				ref: c
@@ -76,8 +87,8 @@ var _ = (e) => {
 				unstyled: e.unstyled
 			}, f(p(s))), {
 				default: g(() => [u(r.$slots, "default", o(i({
-					hide: x,
-					toggle: y
+					hide: S,
+					toggle: b
 				})))], void 0, !0),
 				_: 3
 			}, 16, [
@@ -90,7 +101,7 @@ var _ = (e) => {
 				"pt-options",
 				"close-on-escape",
 				"unstyled"
-			])]);
+			])], 512);
 		};
 	}
 }), y = /* @__PURE__ */ e({ default: () => b }), b = v;

package/dist/{wt-send-message-popup-iP4Sf5tM.js → wt-send-message-popup-DnpN75TV.js}

@@ -1,4 +1,4 @@
-import { n as e } from "./components-CCbLe_rX.js";
+import { n as e } from "./components-CkQp88E1.js";
 import { t } from "./vue-i18n-B8Px6VcD.js";
 import { n, r } from "./clients-aQCH0OHp.js";
 import { createBlock as i, createTextVNode as a, createVNode as o, defineComponent as s, inject as c, mergeProps as l, onMounted as u, openBlock as d, ref as f, resolveComponent as p, toDisplayString as m, unref as h, withCtx as g } from "vue";

package/dist/{wt-type-extension-value-input-Do7kwcYM.js → wt-type-extension-value-input-DblktBU4.js}

@@ -1,4 +1,4 @@
-import { a as e, o as t, r as n, s as r } from "./components-CCbLe_rX.js";
+import { a as e, o as t, r as n, s as r } from "./components-CkQp88E1.js";
 import { t as i } from "./enums-pbYAJNeb.js";
 import { t as a } from "./vue-i18n-B8Px6VcD.js";
 import { t as o } from "./clients-aQCH0OHp.js";

package/dist/{wt-vidstack-player-ChEwg7sN.js → wt-vidstack-player-CeejfVM2.js}

@@ -1,4 +1,4 @@
-import { l as e } from "./components-CCbLe_rX.js";
+import { l as e } from "./components-CkQp88E1.js";
 import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as n } from "./enums-pbYAJNeb.js";
 import "./wt-button-CZfPNaIj.js";

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webitel/ui-sdk",
-	"version": "26.6.51",
+	"version": "26.6.52",
 	"private": false,
 	"scripts": {
 		"dev": "npm run docs:dev",

package/src/components/wt-popover/_internals/composables/usePopoverOverlayFix.ts

@@ -5,27 +5,57 @@ import { onBeforeUnmount, onMounted, type Ref } from 'vue';
 // the click retargets to body and PrimeVue's outside-click closes the popover.
 // Fix: on pointerdown inside a teleported overlay, suppress the popover's outside-click
 // listener for one click cycle so it doesn't fire on the retargeted body click.
+//
+/*
+ * @author @Oleksandr Palonnyi
+ *
+ * Additionally: vidstack's media-button calls stopPropagation() on click events to prevent
+ * the media player from intercepting them. This stops PrimeVue's bubble-phase document click
+ * listener from ever firing, so any popover inside a media-button stays open when the user
+ * clicks outside. A capture-phase pointerdown listener on document fires top-down before any
+ * element handler runs, so stopPropagation on click cannot affect it.
+ *
+ * [WTEL-9770](https://webitel.atlassian.net/browse/WTEL-9770)
+ */
 export const usePopoverOverlayFix = (
 	innerPopover: Ref<{
 		outsideClickListener?: EventListener;
+		visible?: boolean;
+		container?: HTMLElement | null;
+		hide?: () => void;
 	} | null>,
+	wrapperElement: Ref<HTMLElement | null>,
 ) => {
 	const onDocumentPointerdown = (event: PointerEvent) => {
 		const target = event.target as Element;
-		if (!target?.closest('.p-select-overlay, .p-multiselect-overlay')) return;
-		const listener = innerPopover.value?.outsideClickListener;
-		if (!listener) return;
-		document.removeEventListener('click', listener);
-		document.addEventListener(
-			'click',
-			() => {
-				document.addEventListener('click', listener);
-			},
-			{
-				once: true,
-				capture: false,
-			},
-		);
+
+		if (target?.closest('.p-select-overlay, .p-multiselect-overlay')) {
+			const outsideClickListener = innerPopover.value?.outsideClickListener;
+			if (!outsideClickListener) return;
+			document.removeEventListener('click', outsideClickListener);
+			document.addEventListener(
+				'click',
+				() => {
+					setTimeout(() => {
+						const listenerToRestore = innerPopover.value?.outsideClickListener;
+						if (listenerToRestore) {
+							document.addEventListener('click', listenerToRestore);
+						}
+					}, 0);
+				},
+				{
+					once: true,
+					capture: true,
+				},
+			);
+			return;
+		}
+
+		if (!innerPopover.value?.visible) return;
+		if (!innerPopover.value.container) return;
+		if (innerPopover.value.container.contains(target)) return;
+		if (wrapperElement.value?.contains(target)) return;
+		innerPopover.value.hide?.();
 	};
 
 	onMounted(() =>

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

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div ref="wrapper">
     <slot name="activator" v-bind="{ show, toggle, hide }" />
 
     <p-popover
@@ -32,6 +32,7 @@ interface Props extends PopoverProps {
 
 const attrs = useAttrs();
 const innerPopover = useTemplateRef('innerPopover');
+const wrapper = useTemplateRef('wrapper');
 const props = withDefaults(defineProps<Props>(), {
 	appendTo: 'body',
 	baseZIndex: 0,
@@ -46,7 +47,7 @@ const props = withDefaults(defineProps<Props>(), {
 });
 defineEmits<PopoverEmitsOptions>();
 
-usePopoverOverlayFix(innerPopover);
+usePopoverOverlayFix(innerPopover, wrapper);
 
 const toggle = (event?: Event, target?: HTMLElement | null | undefined) => {
 	if (props.disabled) return;

package/types/components/wt-popover/_internals/composables/usePopoverOverlayFix.d.ts

@@ -1,4 +1,7 @@
 import { type Ref } from 'vue';
 export declare const usePopoverOverlayFix: (innerPopover: Ref<{
     outsideClickListener?: EventListener;
-} | null>) => void;
+    visible?: boolean;
+    container?: HTMLElement | null;
+    hide?: () => void;
+} | null>, wrapperElement: Ref<HTMLElement | null>) => void;