@webitel/ui-sdk 26.8.116 → 26.8.118

package/dist/{wt-chat-emoji-C-dTBZ_F.js → wt-chat-emoji-v9gpIuHe.js}

@@ -1,4 +1,4 @@
-import "./components-DSjkNfg7.js";
+import "./components-CeOlovz8.js";
 import { t as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { m as t } from "./enums-CsINFPBu.js";
 import { t as n } from "./wt-button-rUZKbswL.js";

package/dist/{wt-display-chip-items-BX7cB5E4.js → wt-display-chip-items-Bob7miL_.js}

@@ -1,4 +1,4 @@
-import { C as e, i as t } from "./components-DSjkNfg7.js";
+import { C as e, i as t } from "./components-CeOlovz8.js";
 import { t as n } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { t as r } from "./utils-DHSDTqJG.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-BqE4XZke.js → wt-send-message-popup-9O69XY0L.js}

@@ -1,6 +1,6 @@
-import { n as e } from "./components-DSjkNfg7.js";
+import { n as e } from "./components-CeOlovz8.js";
 import "./convertDuration-CW5qzlwH.js";
-import { i as t, r as n } from "./clients-BFB093fa.js";
+import { i as t, r as n } from "./clients-DWcx-Mfk.js";
 import { n as r } from "./vue-i18n-VBiROMZ4.js";
 import { n as i } from "./useEventBus-B-ZeklLu.js";
 import { createBlock as a, createTextVNode as o, createVNode as s, defineComponent 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-B9KVFkOD.js → wt-type-extension-value-input-55YmFcBp.js}

@@ -1,8 +1,8 @@
 import { a as e, c as t, i as n, n as r, r as i, s as a, t as o } from "./dist-EXdgfpvN.js";
 import { n as s } from "./genClient-CvWlQ0TZ.js";
 import { a as c } from "./caseConverters-DGri4uJo.js";
-import { a as l, o as u, r as d, s as f } from "./components-DSjkNfg7.js";
-import { a as p, n as m, t as h } from "./clients-BFB093fa.js";
+import { a as l, o as u, r as d, s as f } from "./components-CeOlovz8.js";
+import { a as p, n as m, t as h } from "./clients-DWcx-Mfk.js";
 import { a as g, b as _, d as v, f as y, g as b, i as x, n as S, o as C, r as w, s as T, t as E, y as D } from "./enums-CsINFPBu.js";
 import { n as ee, t as te } from "./vue-i18n-VBiROMZ4.js";
 import "./wt-toast-pXV44Y3v.js";

package/dist/{wt-vidstack-player-RBadmXaK.js → wt-vidstack-player-ETPSioGH.js}

@@ -1,4 +1,4 @@
-import { w as e } from "./components-DSjkNfg7.js";
+import { w as e } from "./components-CeOlovz8.js";
 import "./convertDuration-CW5qzlwH.js";
 import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { m as n } from "./enums-CsINFPBu.js";

package/package.json

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

package/src/components/wt-popup/_variables.css

@@ -9,6 +9,10 @@
 	--wt-popup-size-md: 800px;
 	--wt-popup-size-lg: 1140px;
 
+	--wt-popup-height-sm: 300px;
+	--wt-popup-height-md: 400px;
+	--wt-popup-height-lg: 600px;
+
 	--popup-max-height: 90%;
 
 	--wt-popup-background-color: var(--dp-24-surface-color);

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

@@ -1,7 +1,14 @@
 <template>
   <div
-v-show="showPopupComponent" :class="[`wt-popup--size-${size}`, { 'wt-popup--overflow': overflow }]"
-    class="wt-popup">
+    v-show="showPopupComponent"
+    :class="[
+      `wt-popup--size-${size}`, 
+      height && `wt-popup--height-${height}`,
+      {
+      'wt-popup--overflow': overflow,
+      }]"
+    class="wt-popup"
+  >
     <!--    &lt;!&ndash;  @slot check source code for scoped bindings :( &ndash;&gt;-->
     <!--    <slot-->
     <!--      class="wt-popup-activator"-->
@@ -51,6 +58,12 @@ interface Props {
 	 */
 	shown?: boolean;
 	size?: ComponentSize;
+	/**
+	 * temprorary height of the popup for WS2
+	 * to avoid WS1 popup broken
+	 * will be removed after primevue migration
+	 */
+	height?: ComponentSize;
 	/**
 	 * if true, popup contents will overflow popup container, without scrolling
 	 * useful for small popups with select components, which have not enough space
@@ -207,6 +220,18 @@ watch(wrapperShown, (value) => {
   width: var(--wt-popup-size-lg);
 }
 
+.wt-popup--height-sm .wt-popup__popup {
+  height: var(--wt-popup-height-sm);
+}
+
+.wt-popup--height-md .wt-popup__popup {
+  height: var(--wt-popup-height-md);
+}
+
+.wt-popup--height-lg .wt-popup__popup {
+  height: var(--wt-popup-height-lg);
+}
+
 .wt-popup__popup {
   display: flex;
   flex-direction: column;

package/src/composables/index.ts

@@ -4,5 +4,6 @@ export * from './useCard/useCardComponent';
 export * from './useClose/useClose';
 export * from './useDestroyableSortable/useDestroyableSortable';
 export * from './useEventBus/useEventBus';
+export * from './useMinDurationLoader/useMinDurationLoader';
 export * from './useRepresentableAgentPauseCause/useRepresentableAgentPauseCause';
 export * from './useValidate/useValidate';

package/src/composables/useMinDurationLoader/useMinDurationLoader.ts

@@ -0,0 +1,30 @@
+import { type Ref, ref } from 'vue';
+
+export interface UseMinDurationLoaderReturn {
+	isLoading: Ref<boolean>;
+	runWithMinDuration: <T>(action: () => Promise<T>) => Promise<T>;
+}
+
+export const useMinDurationLoader = (
+	minDurationMs = 500,
+): UseMinDurationLoaderReturn => {
+	const isLoading = ref(false);
+
+	const runWithMinDuration = async <T>(
+		action: () => Promise<T>,
+	): Promise<T> => {
+		isLoading.value = true;
+		try {
+			return await action();
+		} finally {
+			setTimeout(() => {
+				isLoading.value = false;
+			}, minDurationMs);
+		}
+	};
+
+	return {
+		isLoading,
+		runWithMinDuration,
+	};
+};

package/src/utils/__tests__/findTreePath.spec.ts

@@ -0,0 +1,83 @@
+import { describe, expect, it } from 'vitest';
+
+import { findTreePath } from '../findTreePath';
+
+interface Service {
+	id: string;
+	name: string;
+	service?: Service[];
+}
+
+const services: Service[] = [
+	{
+		id: 'billing',
+		name: 'Billing',
+		service: [
+			{
+				id: 'refunds',
+				name: 'Refunds',
+				service: [
+					{
+						id: 'card',
+						name: 'Card refund',
+					},
+				],
+			},
+		],
+	},
+	{
+		id: 'support',
+		name: 'Support',
+	},
+];
+
+const byId = (id: string) => (service: Service) => service.id === id;
+
+describe('findTreePath', () => {
+	it('returns the nodes from the root down to the target', () => {
+		expect(
+			findTreePath(services, byId('card'), 'service')?.map(({ name }) => name),
+		).toEqual([
+			'Billing',
+			'Refunds',
+			'Card refund',
+		]);
+	});
+
+	it('returns a one-node path for a root', () => {
+		expect(findTreePath(services, byId('support'), 'service')).toEqual([
+			services[1],
+		]);
+	});
+
+	it('returns null when nothing matches, or there is no tree', () => {
+		expect(findTreePath(services, byId('missing'), 'service')).toBeNull();
+		expect(findTreePath(undefined, byId('card'), 'service')).toBeNull();
+		expect(findTreePath([], byId('card'), 'service')).toBeNull();
+	});
+
+	it('stops at the first match, depth first', () => {
+		const tree = [
+			{
+				id: 'a',
+				children: [
+					{
+						id: 'x',
+					},
+				],
+			},
+			{
+				id: 'x',
+			},
+		];
+
+		expect(
+			findTreePath(tree, (node) => node.id === 'x', 'children')?.map(
+				({ id }) => id,
+			),
+		).toEqual([
+			'a',
+			'x',
+		]);
+	});
+});

package/src/utils/findTreePath.ts

@@ -0,0 +1,33 @@
+/**
+ * Walks a tree depth-first and returns the nodes from a root down to the
+ * first node matching `isTarget`, both ends included, or `null` when nothing
+ * matches. Children are read from `childrenKey` (e.g. `service` for case
+ * service catalogs, whose services nest under `service`).
+ *
+ * The path is what a breadcrumb, an "A / B / C" label or an ancestor check
+ * needs: `path.map(({ name }) => name)`, `path.slice(0, -1)`, and so on.
+ */
+export function findTreePath<TNode extends object>(
+	nodes: readonly TNode[] | null | undefined,
+	isTarget: (node: TNode) => boolean,
+	// NoInfer: the node type comes from `nodes` only; inferred from the key
+	// literal instead, loosely typed trees narrowed to `{ service: any }`
+	childrenKey: NoInfer<keyof TNode>,
+): TNode[] | null {
+	for (const node of nodes ?? []) {
+		if (isTarget(node))
+			return [
+				node,
+			];
+		const children = node[childrenKey];
+		if (Array.isArray(children)) {
+			const path = findTreePath(children as TNode[], isTarget, childrenKey);
+			if (path)
+				return [
+					node,
+					...path,
+				];
+		}
+	}
+	return null;
+}

package/src/utils/index.ts

@@ -1,3 +1,4 @@
 export * from './displayText';
+export * from './findTreePath';
 export * from './formatDate';
 export * from './prettifyDate';