@webitel/ui-sdk 26.6.43 → 26.6.45

package/dist/wt-button-BJmzJIU6.js

@@ -0,0 +1,134 @@
+import { t as e } from "./wt-icon-pxO7IjwV.js";
+import { c as t, d as n, u as r } from "./enums-pbYAJNeb.js";
+import { computed as i, createBlock as a, createCommentVNode as o, createElementVNode as s, createTextVNode as c, defineComponent as l, inject as u, mergeProps as d, normalizeClass as f, openBlock as p, ref as m, renderSlot as h, resolveComponent as g, toDisplayString as _, toRef as v, unref as y, useAttrs as b, watch as x, withCtx as S, withModifiers as C } from "vue";
+//#endregion
+//#region src/components/wt-badge-new/wt-badge.vue
+var w = /* @__PURE__ */ l({
+	__name: "wt-badge",
+	props: {
+		value: { default: "" },
+		severity: { default: null },
+		size: { default: t.MD }
+	},
+	setup(e) {
+		let t = e;
+		return (e, n) => {
+			let r = g("p-badge");
+			return p(), a(r, {
+				value: t.value,
+				class: f([[t.size && `p-badge--${t.size}`, t.severity && `p-badge--${t.severity}`], "wt-badge typo-caption"])
+			}, {
+				default: S(() => [h(e.$slots, "default")], void 0, !0),
+				_: 3
+			}, 8, ["value", "class"]);
+		};
+	}
+}), T = { class: "wt-button__contents" }, E = /* @__PURE__ */ l({
+	__name: "wt-button",
+	props: {
+		color: { default: n.PRIMARY },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		loading: {
+			type: Boolean,
+			default: !1
+		},
+		size: { default: t.MD },
+		wide: {
+			type: Boolean,
+			default: !1
+		},
+		widthByContent: {
+			type: Boolean,
+			default: !1
+		},
+		icon: { default: "" },
+		iconPrefix: { default: "" },
+		badge: {},
+		badgeSeverity: {},
+		badgeAbsolutePosition: { type: Boolean },
+		variant: { default: r.ACTIVE }
+	},
+	emits: ["click"],
+	setup(n, { emit: r }) {
+		let l = {
+			[t.XS]: "extra-small",
+			[t.SM]: "small",
+			[t.MD]: "medium"
+		}, E = {
+			[t.XS]: "sm",
+			[t.SM]: "sm",
+			[t.MD]: "md"
+		}, D = n, O = r, k = b(), A = m(!1), j = i(() => ({ "wt-badge--absolute": D.badgeAbsolutePosition })), M = v(u("darkMode")), N = i(() => M.value ? "on-dark" : "on-light");
+		return x(() => D.loading, (e) => {
+			e ? A.value = !0 : setTimeout(() => {
+				A.value = e;
+			}, 1e3);
+		}, { immediate: !0 }), (r, i) => {
+			let u = g("wt-loader"), m = g("p-button");
+			return p(), a(m, d(y(k), {
+				class: [{
+					"p-button--width-by-content": n.widthByContent || n.icon,
+					"p-button--wide": n.wide,
+					"p-button--with-badge": D.badge,
+					"p-button--loading": A.value,
+					"p-button--icon": n.icon,
+					[`p-button--size-${n.size}`]: !0,
+					[`p-button--icon-${n.variant} p-button--icon-${n.size}`]: n.icon
+				}, "wt-button typo-button typo-button"],
+				disabled: n.disabled,
+				loading: A.value,
+				severity: n.color,
+				size: l[n.size],
+				variant: n.variant
+			}, { onClick: i[0] ||= C((e) => O("click", e), ["prevent"]) }), {
+				default: S(() => [A.value ? (p(), a(u, {
+					key: 0,
+					color: N.value,
+					size: "sm"
+				}, null, 8, ["color"])) : o("", !0), s("div", T, [
+					n.icon ? o("", !0) : h(r.$slots, "default", { key: 0 }, () => [i[1] ||= c(" no content provided", -1)]),
+					D.badge ? (p(), a(w, {
+						key: 1,
+						value: D.badge,
+						severity: D.badgeSeverity,
+						class: f(j.value),
+						size: y(t).MD
+					}, {
+						default: S(() => [h(r.$slots, "badge", {}, () => [c(_(D.badge), 1)])]),
+						_: 3
+					}, 8, [
+						"value",
+						"severity",
+						"class",
+						"size"
+					])) : o("", !0),
+					n.icon ? (p(), a(e, {
+						key: 2,
+						class: f({ "wt-button__icon--hidden": A.value }),
+						icon: n.icon,
+						"icon-prefix": n.iconPrefix,
+						size: E[n.size]
+					}, null, 8, [
+						"class",
+						"icon",
+						"icon-prefix",
+						"size"
+					])) : o("", !0)
+				])], void 0, !0),
+				_: 3
+			}, 16, [
+				"class",
+				"disabled",
+				"loading",
+				"severity",
+				"size",
+				"variant"
+			]);
+		};
+	}
+});
+//#endregion
+export { w as n, E as t };

package/dist/{wt-chat-emoji-vxVz6wNF.js → wt-chat-emoji-D3jwmQoi.js}

@@ -1,9 +1,9 @@
 import { t as e } from "./chunk-CY3AvKd6.js";
 import { n as t, t as n } from "./dist-BYiYpK00.js";
-import "./components-XaNw-CXF.js";
+import "./components-Z7U49tas.js";
 import { t as r } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as i } from "./enums-pbYAJNeb.js";
-import { t as a } from "./wt-button-DENbrKdy.js";
+import { t as a } from "./wt-button-BJmzJIU6.js";
 import "./sortQueryAdapters-CyYXvnDN.js";
 import { t as o } from "./isObject-Dgs_L5xI.js";
 import { a as s, i as c, n as l, o as u, r as d, s as f } from "./debounce-DrmECuJ2.js";

package/dist/{wt-display-chip-items-BpDQ9Z0-.js → wt-display-chip-items-DJEixQxK.js}

@@ -1,4 +1,4 @@
-import { c as e, i as t } from "./components-XaNw-CXF.js";
+import { c as e, i as t } from "./components-Z7U49tas.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-expansion-card-DEqwyRq_.js → wt-expansion-card--JQgcTaF.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as t } from "./enums-pbYAJNeb.js";
 import { t as n } from "./useExpansion-DVdIpoOn.js";
-import "./composables-DJxQeK6R.js";
+import "./composables-C5OKo5yW.js";
 import { t as r } from "./wt-expand-transition-C2p9bR4j.js";
 import { createElementBlock as i, createElementVNode as a, createVNode as o, defineComponent as s, guardReactiveProps as c, normalizeClass as l, normalizeProps as u, openBlock as d, renderSlot as f, resolveComponent as p, toRef as m, unref as h, vShow as g, withCtx as _, withDirectives as v, withKeys as y } from "vue";
 //#region src/components/wt-expansion-card/wt-expansion-card.vue?vue&type=script&setup=true&lang.ts

package/dist/{wt-galleria-Xt27edEP.js → wt-galleria-B1gOHiGe.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { t } from "./vue-i18n-B8Px6VcD.js";
-import { a as n, o as r } from "./composables-DJxQeK6R.js";
+import { a as n, o as r } from "./composables-C5OKo5yW.js";
 import { Fragment as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, mergeModels as p, mergeProps as m, nextTick as h, normalizeClass as g, onMounted as _, onUnmounted as v, openBlock as y, ref as b, renderSlot as x, resolveComponent as S, toDisplayString as C, unref as w, useAttrs as T, useModel as E, vShow as D, watch as O, withCtx as k, withDirectives as A } from "vue";
 //#region src/modules/DeleteConfirmationPopup/composables/useDeleteConfirmationPopup.js
 var j = () => {

package/dist/{wt-player-uidPXSTe.js → wt-player-DROQ1CPs.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./wt-icon-pxO7IjwV.js";
 import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as n } from "./enums-pbYAJNeb.js";
-import { t as r } from "./wt-button-DENbrKdy.js";
+import { t as r } from "./wt-button-BJmzJIU6.js";
 import { n as i, t as a } from "./useVidstackSrc-DfNrFbOO.js";
 import { t as o } from "./wt-popover-CJZH3wMl.js";
 import { t as s } from "./wt-slider-BS3SoGht.js";

package/dist/{wt-send-message-popup-B0M1ilx0.js → wt-send-message-popup-tV8OM9Au.js}

@@ -1,4 +1,4 @@
-import { n as e } from "./components-XaNw-CXF.js";
+import { n as e } from "./components-Z7U49tas.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-table-TBeu10EU.js → wt-table--FlzjuAF.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { t } from "./vue-i18n-B8Px6VcD.js";
 import { n, t as r } from "./sortQueryAdapters-CyYXvnDN.js";
-import { t as i } from "./composables-DJxQeK6R.js";
+import { t as i } from "./composables-C5OKo5yW.js";
 import { Fragment as ee, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createSlots as u, createTextVNode as d, createVNode as f, defineComponent as p, nextTick as m, normalizeStyle as h, onMounted as g, onUnmounted as _, openBlock as v, ref as y, renderList as b, renderSlot as x, resolveComponent as S, resolveDirective as C, toDisplayString as w, useSlots as T, useTemplateRef as E, withCtx as D, withDirectives as O, withModifiers as k } from "vue";
 //#region src/components/wt-table/wt-table.vue?vue&type=script&setup=true&lang.ts
 var A = { class: "wt-table__th__content typo-body-1-bold" }, j = { class: "wt-table__td__actions" }, M = 10, N = /*#__PURE__*/ e(/* @__PURE__ */ p({

package/dist/{wt-type-extension-value-input-DMaPgwC1.js → wt-type-extension-value-input-B6VJ9AKB.js}

@@ -1,4 +1,4 @@
-import { a as e, o as t, r as n, s as r } from "./components-XaNw-CXF.js";
+import { a as e, o as t, r as n, s as r } from "./components-Z7U49tas.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-D_UJdRzh.js → wt-vidstack-player-BjULgk7W.js}

@@ -1,7 +1,7 @@
-import { l as e } from "./components-XaNw-CXF.js";
+import { l as e } from "./components-Z7U49tas.js";
 import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as n } from "./enums-pbYAJNeb.js";
-import "./wt-button-DENbrKdy.js";
+import "./wt-button-BJmzJIU6.js";
 import { t as r } from "./wt-icon-btn-CjjI4cgE.js";
 import { $ as i, A as a, B as o, C as s, F as c, G as l, H as u, I as d, J as f, K as p, L as m, M as h, N as g, O as ee, P as te, Q as _, R as ne, T as re, U as v, W as ie, X as ae, Y as oe, Z as y, _ as b, a as se, at as ce, b as le, c as ue, d as de, et as x, f as fe, g as pe, h as me, i as S, it as he, k as ge, l as C, m as _e, n as w, nt as ve, o as T, p as E, q as D, r as O, rt as k, st as ye, t as be, tt as xe, u as Se, v as A, w as j, x as Ce, y as we, z as Te } from "./vidstack-BGSTndAW-CyKM_CM4.js";
 import { _ as Ee, a as De, c as Oe, f as ke, g as Ae, h as je, i as Me, l as Ne, n as Pe, r as Fe, s as Ie, t as Le, u as Re, v as ze, x as Be, y as Ve } from "./useVidstackSrc-DfNrFbOO.js";

package/package.json

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

package/src/components/_internals/composables/useSelect/useSelectOptions.ts

@@ -110,14 +110,16 @@ export const useSelectOptions = ({
 			search,
 			page,
 		});
+		const matchingCached = search
+			? selectedOptionsCache.value.filter((option) =>
+					getOptionLabel(option).toLowerCase().includes(search.toLowerCase()),
+				)
+			: selectedOptionsCache.value;
 		const baseOptions =
 			searchParams.page === 1
 				? dedupeByKey(
 						[
-							...(!allowCustomValues.value ? selectedOptionsCache.value : []),
-							...toArray(selected.value).filter(
-								(s) => s != null && typeof s === 'object',
-							),
+							...matchingCached,
 							...items,
 						],
 						dataKey.value,
@@ -146,7 +148,6 @@ export const useSelectOptions = ({
 			filteredOptions.value = sortOptions(
 				dedupeByKey(
 					[
-						...(!allowCustomValues.value ? selectedOptionsCache.value : []),
 						...matchingOptions,
 					],
 					dataKey.value,

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

@@ -53,8 +53,7 @@
 
 <script lang="ts" setup>
 import type { ButtonProps } from 'primevue';
-import { computed, inject, ref, useAttrs, watch } from 'vue';
-import { useStore } from 'vuex';
+import { computed, inject, toRef, ref, useAttrs, watch } from 'vue';
 
 import { ButtonColor, ButtonVariant, ComponentSize } from '../../enums';
 import WtBadge from '../wt-badge-new/wt-badge.vue';
@@ -111,28 +110,7 @@ const badgeClass = computed(() => ({
 	'wt-badge--absolute': props.badgeAbsolutePosition,
 }));
 
-// @Ler24
-// Compatibility mode for Vuex (old mode) and when there is no Vuex in project (new mode)
-let store = null;
-try {
-	store = useStore();
-} catch {
-	store = null;
-}
-
-const injectDarkMode = inject('darkMode');
-
-const darkMode = computed(() => {
-	if (injectDarkMode?.value) {
-		return injectDarkMode.value;
-	}
-
-	if (store?.getters) {
-		return store.getters['appearance/DARK_MODE'] ?? false;
-	}
-
-	return false;
-});
+const darkMode = toRef(inject<boolean>('darkMode'));
 
 /**
  * @author: @Opelsandr Palonnyi

package/src/components/wt-multi-select/wt-multi-select.vue

@@ -22,6 +22,7 @@
       :id="selectId"
       :show-clear="showClear"
       :focus-on-hover="false"
+      :auto-option-focus="true"
       :disabled="disabled"
       :placeholder="placeholder || label"
       :option-disabled="() => disabledOptions"
@@ -45,6 +46,17 @@
       @show="onDropdownShow"
       @hide="onDropdownHide"
     >
+      <template v-if="!chipsView" #value="{ value, placeholder }">
+        <span v-if="value && value.length">
+          <template v-if="value.length > MAX_SELECTED_LABELS">
+            {{ value.length }} {{ t('webitelUI.select.selectedItemsLabel') }}
+          </template>
+          <template v-else>
+            {{ value.map((v) => getOptionLabel(v)).join(', ') }}
+          </template>
+        </span>
+        <span v-else class="p-placeholder">{{ placeholder }}</span>
+      </template>
       <template #header>
         <wt-input-text
           v-if="filterable"

package/src/components/wt-single-select/wt-single-select.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="wt-single-select">
+  <div class="wt-single-select" :class="{ 'wt-single-select--has-value': model }">
     <wt-label 
       v-if="hasLabel" 
       :disabled="disabled" 
@@ -235,6 +235,17 @@ onMounted(() => {
   min-width: 0;
 }
 
+/*
+  @author @HlukhovYe
+
+  PrimeVue applies data-p="placeholder" to the label span when the selected item
+  is not found in visibleOptions (e.g. during search). Override the placeholder
+  color since our #value slot renders the correct label from the model directly.
+*/
+.wt-single-select--has-value :deep(.p-select-label[data-p~='placeholder']) {
+  color: inherit;
+}
+
 .wt-single-select__option-label {
   user-select: none;
 }

package/src/modules/TableComponentModule/composables/useTableEmpty.js

@@ -1,7 +1,6 @@
 import deepmerge from 'deepmerge';
-import { computed, inject } from 'vue';
+import { computed, inject, toRef } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import { EmptyCause } from '../../../enums/index';
 import { isEmpty } from '../../../scripts/index.js';
@@ -14,7 +13,6 @@ export const useTableEmpty = (
 	{ dataList, filters, error, isLoading },
 	overrides = {},
 ) => {
-	const store = useStore();
 	const { t } = useI18n();
 
 	// use computed, so that at locale change, texts will be updated too
@@ -62,17 +60,7 @@ export const useTableEmpty = (
 
 	const merged = computed(() => deepmerge(defaults.value, overrides));
 
-	let darkMode = computed(() => false);
-
-	try {
-		darkMode = inject('darkMode');
-	} catch {
-		try {
-			darkMode = computed(() => store.getters['appearance/DARK_MODE']);
-		} catch {
-			console.warn('"darkMode" value not found, using "false" as default');
-		}
-	}
+	const darkMode = toRef(inject('darkMode'));
 
 	const emptyState = computed(() => {
 		return !isLoading?.value && !error?.value && !dataList?.value?.length;