@webitel/ui-sdk 26.8.53 → 26.8.55

package/dist/{wt-chat-emoji-DVIlMP3o.js → wt-chat-emoji-B13JscVZ.js}

@@ -1,4 +1,4 @@
-import "./components-C4rE9PlV.js";
+import "./components-DNSY1_s4.js";
 import { t as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { l as t } from "./enums-DY3jIXFF.js";
 import { t as n } from "./wt-button-2_aOV7LX.js";

package/dist/{wt-display-chip-items-DwMS-DJc.js → wt-display-chip-items-Cf8L5Upd.js}

@@ -1,4 +1,4 @@
-import { C as e, i as t } from "./components-C4rE9PlV.js";
+import { C as e, i as t } from "./components-DNSY1_s4.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-send-message-popup-DPjllTAk.js → wt-send-message-popup-CO92UYST.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./rolldown-runtime-BEcgMyyN.js";
-import { n as t, r as n } from "./clients-jhkEj9YI.js";
-import { T as r, n as i, w as a } from "./components-C4rE9PlV.js";
+import { n as t, r as n } from "./clients-Ck0KwDIR.js";
+import { T as r, n as i, w as a } from "./components-DNSY1_s4.js";
 import { t as o } from "./vue-i18n-Db_oYfO8.js";
 import { n as s } from "./useEventBus-B-ZeklLu.js";
 import { createBlock as c, createTextVNode as l, createVNode as u, defineComponent as d, mergeProps as f, onMounted as p, openBlock as m, ref as h, resolveComponent as g, toDisplayString as _, unref as v, withCtx as y } from "vue";

package/dist/{wt-type-extension-value-input-BO44atDh.js → wt-type-extension-value-input-FHQ4bN4j.js}

@@ -1,5 +1,5 @@
-import { t as e } from "./clients-jhkEj9YI.js";
-import { a as t, o as n, r, s as i } from "./components-C4rE9PlV.js";
+import { t as e } from "./clients-Ck0KwDIR.js";
+import { a as t, o as n, r, s as i } from "./components-DNSY1_s4.js";
 import { t as a } from "./enums-DY3jIXFF.js";
 import { t as o } from "./vue-i18n-Db_oYfO8.js";
 import { computed as s, createBlock as c, createCommentVNode as l, createVNode as u, defineComponent as d, mergeModels as f, mergeProps as p, openBlock as m, renderSlot as h, resolveComponent as g, unref as _, useModel as v } from "vue";

package/dist/{wt-vidstack-player-BD28KRTU.js → wt-vidstack-player-DcItshB2.js}

@@ -1,4 +1,4 @@
-import { D as e } from "./components-C4rE9PlV.js";
+import { D as e } from "./components-DNSY1_s4.js";
 import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { l as n } from "./enums-DY3jIXFF.js";
 import "./wt-button-2_aOV7LX.js";

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webitel/ui-sdk",
-	"version": "26.8.53",
+	"version": "26.8.55",
 	"private": false,
 	"scripts": {
 		"dev": "npm run docs:dev",
@@ -124,6 +124,7 @@
 		"@biomejs/biome": "2.4.16",
 		"@pinia/testing": "^1.0.3",
 		"@regle/core": "^1.16.2",
+		"@regle/schemas": "^1.x",
 		"@tsconfig/node22": "^22.0.0",
 		"@types/deep-equal": "^1.0.4",
 		"@types/file-saver-es": "^2.0.3",

package/src/components/on-demand/wt-type-extension-value-input/wt-type-extension-value-input.vue

@@ -111,7 +111,7 @@ const props = defineProps<{
 
 const { t } = useI18n();
 
-const label = computed(() => {
+const computedLabel = computed(() => {
 	return props.label || t(props.field?.name || 'vocabulary.labels');
 });
 
@@ -125,7 +125,7 @@ const value = computed<any>(() => {
 });
 
 const sharedChildrenProps = computed(() => ({
-	label: label.value,
+	label: computedLabel.value,
 	required: isRequired.value,
 	v: props.v,
 }));

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

@@ -1,8 +1,8 @@
 <template>
   <div
 class="wt-image" :style="{
-    width,
-    height,
+    width: resolvedWidth,
+    height: resolvedHeight,
     minWidth,
     minHeight,
     maxWidth,
@@ -56,7 +56,7 @@ const emit = defineEmits([
 	'click',
 ]);
 
-const width = computed(() => {
+const resolvedWidth = computed(() => {
 	const width = props.size ? sizeToUnits[props.size] : props.width;
 
 	// if converted to Number without an error, it has no units in it
@@ -67,7 +67,7 @@ const width = computed(() => {
 	return width;
 });
 
-const height = computed(() => {
+const resolvedHeight = computed(() => {
 	// if (props.aspectRatio) return null;
 
 	const height = props.size ? sizeToUnits[props.size] : props.height;

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

@@ -133,7 +133,7 @@
 <script setup lang="ts">
 import type { SuperCompatibleRegleFieldStatus } from '@regle/core';
 import type { SelectProps } from 'primevue';
-import { computed, toRefs, useSlots, useTemplateRef } from 'vue';
+import { computed, ref, toRefs, useSlots, useTemplateRef } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { ChipColor, ComponentSize, MessageVariant } from '../../enums';
 import { useValidation } from '../../mixins/validationMixin/useValidation';
@@ -142,6 +142,7 @@ import type {
 	VuelidateFieldLike,
 } from '../../mixins/validationMixin/vuelidate/useVuelidateValidation';
 import type {
+	SelectComponentRef,
 	SelectOption,
 	SelectSearchMethod,
 } from '../_internals/composables/useSelect/types';
@@ -220,7 +221,7 @@ const MAX_SELECTED_LABELS = 3;
 const selectId = `select-${Math.random().toString(36).slice(2, 11)}`;
 
 const filterInput = useTemplateRef('filterInput');
-const selectRef = useTemplateRef('selectRef');
+const selectRef = ref<SelectComponentRef>();
 
 const emit = defineEmits<{
 	'add:custom-value': [

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

@@ -109,14 +109,17 @@
 <script setup lang="ts">
 import type { SuperCompatibleRegleFieldStatus } from '@regle/core';
 import type { SelectProps } from 'primevue';
-import { computed, toRefs, useSlots, useTemplateRef } from 'vue';
+import { computed, ref, toRefs, useSlots, useTemplateRef } from 'vue';
 import { ComponentSize, MessageVariant } from '../../enums';
 import { useValidation } from '../../mixins/validationMixin/useValidation';
 import type {
 	CompatCustomValidator,
 	VuelidateFieldLike,
 } from '../../mixins/validationMixin/vuelidate/useVuelidateValidation';
-import type { SelectSearchMethod } from '../_internals/composables/useSelect/types';
+import type {
+	SelectComponentRef,
+	SelectSearchMethod,
+} from '../_internals/composables/useSelect/types';
 import { useSelect } from '../_internals/composables/useSelect/useSelect';
 
 interface Props extends Omit<SelectProps, 'size' | 'options'> {
@@ -195,7 +198,7 @@ const emit = defineEmits<{
 const selectId = `select-${Math.random().toString(36).slice(2, 11)}`;
 
 const filterInput = useTemplateRef('filterInput');
-const selectRef = useTemplateRef('selectRef');
+const selectRef = ref<SelectComponentRef>();
 
 const {
 	showFooterLoader,

package/src/modules/AgentStatusSelect/components/_internals/wt-cc-activity-type-options.vue

@@ -0,0 +1,52 @@
+<template>
+  <form
+    class="wt-cc-activity-type-options"
+    @submit.prevent
+  >
+    <ul class="wt-cc-activity-type-options__list">
+      <li
+        v-for="option of options"
+        :key="option.id"
+        class="wt-cc-activity-type-options__item"
+      >
+        <wt-radio
+          :label="option.name"
+          :selected="model?.id"
+          :value="option.id"
+          class="wt-cc-activity-type-options__radio"
+          @update:selected="model = option"
+        />
+      </li>
+    </ul>
+  </form>
+</template>
+
+<script setup lang="ts">
+import type { LookupOption } from '../../../../types';
+
+withDefaults(
+	defineProps<{
+		options?: LookupOption[];
+	}>(),
+	{
+		options: () => [],
+	},
+);
+
+const model = defineModel<LookupOption | undefined>();
+</script>
+
+<style scoped>
+.wt-cc-activity-type-options__list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-sm);
+  padding: var(--spacing-sm);
+}
+
+.wt-cc-activity-type-options__item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+</style>

package/src/modules/AgentStatusSelect/components/_internals/wt-cc-activity-type-popup.vue

@@ -8,23 +8,11 @@
       {{ t('webitelUI.agentStatusSelect.activityTypePopup.title') }}
     </template>
     <template #main>
-      <form @submit.prevent="setActivityType">
-        <ul class="wt-cc-activity-type-popup-option__wrapper">
-          <li
-            v-for="option of options"
-            :key="option.id"
-            class="wt-cc-activity-type-popup-option"
-          >
-            <wt-radio
-              :label="option.name"
-              :selected="selected?.id"
-              :value="option.id"
-              class="wt-cc-activity-type-popup-option__radio"
-              @update:selected="select(option)"
-            />
-          </li>
-        </ul>
-      </form>
+      <wt-cc-activity-type-options
+        :model-value="selected"
+        :options="options"
+        @update:model-value="selected = $event"
+      />
     </template>
     <template #actions>
       <wt-button
@@ -47,6 +35,7 @@
 import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import type { LookupOption } from '../../../../types';
+import WtCcActivityTypeOptions from './wt-cc-activity-type-options.vue';
 
 const props = withDefaults(
 	defineProps<{
@@ -66,11 +55,7 @@ const emit = defineEmits<{
 
 const { t } = useI18n();
 
-const selected = ref<LookupOption | undefined>(props.options[0]);
-
-function select(option: LookupOption) {
-	selected.value = option;
-}
+const selected = ref<LookupOption | undefined>(props.options?.[0]);
 
 function close() {
 	emit('close');
@@ -88,17 +73,4 @@ function setActivityType() {
     max-height: 500px;
   }
 }
-
-.wt-cc-activity-type-popup-option {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.wt-cc-activity-type-popup-option__wrapper {
-  display: flex;
-  flex-direction: column;
-  gap: var(--spacing-sm);
-  padding: var(--spacing-sm);
-}
 </style>

package/src/modules/AgentStatusSelect/components/_internals/wt-cc-pause-cause-popup.vue

@@ -84,13 +84,13 @@ const emit = defineEmits([
 	'close',
 ]);
 
-const options = toRef(props, 'options');
+const optionsRef = toRef(props, 'options');
 
 const selected = ref(null);
 
 const { t } = useI18n();
 
-const { representablePauseCause } = useRepresentableAgentPauseCause(options);
+const { representablePauseCause } = useRepresentableAgentPauseCause(optionsRef);
 
 const pauseCause = computed(() =>
 	representablePauseCause.value.map((cause) => ({

package/src/modules/AgentStatusSelect/components/wt-cc-agent-status-select.vue

@@ -9,7 +9,7 @@
       @update:model-value="toggleCallCenterMode"
     />
     <wt-status-select
-			:key="status"
+      :key="status"
       :status="status"
       :status-duration="statusDuration"
       @change="handleStatus"
@@ -36,7 +36,6 @@
 </template>
 
 <script setup lang="ts">
-import { OnlineSkillsAPI } from '@webitel/api-services/api';
 import type { EngineForAgentPauseCause } from '@webitel/api-services/gen';
 import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
@@ -47,6 +46,7 @@ import { AgentStatus } from '../../../enums';
 import type { LookupOption } from '../../../types';
 import AgentStatusAPIFactory from '../api/agent-status.js';
 import PauseCauseAPIFactory from '../api/pause-cause.js';
+import { useActivityTypesOptions } from '../composables/useActivityTypesOptions';
 import { useCCenterModeSwitcher } from '../composables/useCCenterModeSwitcher';
 import type { StatusChangePayload } from '../types/StatusChangePayload.types';
 import ActivityTypePopup from './_internals/wt-cc-activity-type-popup.vue';
@@ -90,9 +90,9 @@ const pauseCauses = ref<EngineForAgentPauseCause[]>([]);
 const error = ref(null);
 
 const isActivityTypePopup = ref(false);
-const activityTypes = ref<ActivityType[]>([]);
 
-const defaultActivityTypeOption = ref<ActivityType | null>(null);
+const { activityTypes, defaultActivityTypeOption, loadActivityTypes } =
+	useActivityTypesOptions();
 
 const { callCenterModeChanging, toggleCallCenterMode } = useCCenterModeSwitcher(
 	{
@@ -127,20 +127,6 @@ function closeActivityTypePopup() {
 	callCenterModeChanging.value = false;
 }
 
-async function loadActivityTypes(): Promise<void> {
-	const response = await OnlineSkillsAPI.getList({
-		skipDefault: false,
-	});
-	defaultActivityTypeOption.value = response.items[0];
-	activityTypes.value = [
-		{
-			id: defaultActivityTypeOption.value?.id,
-			name: t('webitelUI.agentStatusSelect.activityTypePopup.defaultOption'),
-		},
-		...response.items.slice(1),
-	];
-}
-
 async function updateStatus({
 	agentId,
 	status,

package/src/modules/AgentStatusSelect/composables/useActivityTypesOptions.ts

@@ -0,0 +1,37 @@
+import { OnlineSkillsAPI } from '@webitel/api-services/api';
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+import type { LookupOption } from '../../../types';
+
+export const useActivityTypesOptions = () => {
+	const { t } = useI18n();
+
+	const activityTypes = ref<LookupOption[]>([]);
+	const defaultActivityTypeOption = ref<LookupOption | null>(null);
+
+	async function loadActivityTypes(): Promise<void> {
+		const response = await OnlineSkillsAPI.getList({
+			skipDefault: false,
+		});
+		if (!response?.items?.length) {
+			defaultActivityTypeOption.value = null;
+			activityTypes.value = [];
+			return;
+		}
+		defaultActivityTypeOption.value = response.items[0];
+		activityTypes.value = [
+			{
+				id: response.items[0].id,
+				name: t('webitelUI.agentStatusSelect.activityTypePopup.defaultOption'),
+			},
+			...response.items.slice(1),
+		];
+	}
+
+	return {
+		activityTypes,
+		defaultActivityTypeOption,
+		loadActivityTypes,
+	};
+};

package/src/modules/Notifications/store/NotificationsStoreModule.js

@@ -7,12 +7,16 @@ import newChatSound from '../assets/audio/chat-new.wav';
 import newMessageSound from '../assets/audio/chat-new-message.wav';
 import endCallSound from '../assets/audio/end-call.wav';
 import ringingSound from '../assets/audio/ringing.mp3';
+import selfAssignedCallSound from '../assets/audio/self-assigned-call.wav';
 import endTask from '../assets/audio/task-end.wav';
 import newTask from '../assets/audio/task-new.wav';
 import notificationIcon from '../assets/img/notification-icon.png';
 
 const NOTIFICATION_VISIBLE_INTERVAL = 2000;
 
+// no CallActions member represents this - it is a client-only notification, not a CTI transport event
+export const SELF_ASSIGNED_CALL_ACTION = 'self_assigned_call';
+
 const getNotificationSound = (action) => {
 	switch (action) {
 		case JobState.Distribute:
@@ -31,6 +35,8 @@ const getNotificationSound = (action) => {
 			return new Audio(ringingSound);
 		case CallActions.Hangup:
 			return new Audio(endCallSound);
+		case SELF_ASSIGNED_CALL_ACTION:
+			return new Audio(selfAssignedCallSound);
 		default:
 			return false;
 	}