@webitel/ui-sdk 26.2.71 → 26.2.73

package/src/components/wt-expansion-panel/wt-expansion-panel.vue

@@ -1,14 +1,24 @@
 <template>
-  <div :class="[`wt-expansion-panel--${props.size}`]" class="wt-expansion-panel">
+  <div
+    :class="[`wt-expansion-panel--${props.size}`]"
+    class="wt-expansion-panel"
+  >
     <div
-:class="[props.size === 'sm' ? 'typo-subtitle-2' : 'typo-subtitle-1']" class="wt-expansion-panel-header"
-      tabindex="0" @click="toggle" @keypress.enter="toggle">
-      <slot name="title" />
+      :class="[props.size === 'sm' ? 'typo-subtitle-2' : 'typo-subtitle-1']"
+      class="wt-expansion-panel-header"
+      tabindex="0"
+      @click="toggle"
+      @keypress.enter="toggle"
+    >
+      <slot name="title"/>
+
       <div class="wt-expansion-panel-actions">
         <slot name="actions" v-bind="{ open, opened }" />
         <wt-icon
-:class="{ 'wt-expansion-panel-arrow--opened': opened }" class="wt-expansion-panel-arrow"
-          icon="arrow-right" />
+          :class="{ 'wt-expansion-panel-arrow--opened': opened }"
+          class="wt-expansion-panel-arrow"
+          icon="arrow-right"
+        />
       </div>
     </div>
     <wt-expand-transition v-show="opened">
@@ -19,9 +29,10 @@
   </div>
 </template>
 
-<script setup>
-import { ref, watch } from 'vue';
-
+<script setup lang="ts">
+import { toRef } from 'vue';
+import { useExpansion } from '../../composables/useExpansion/useExpansion';
+import { ComponentSize } from '../../enums';
 import WtExpandTransition from '../transitions/wt-expand-transition.vue';
 
 /**
@@ -34,63 +45,34 @@ import WtExpandTransition from '../transitions/wt-expand-transition.vue';
  * @slot-scope {function} open - Function to open the panel
  * @slot-scope {boolean} opened - Whether the panel is currently opened
  */
-const props = defineProps({
-	/**
-	 * Size of the expansion panel
-	 * @type {string}
-	 * @default 'md'
-	 * @options ['sm', 'md']
-	 */
-	size: {
-		type: String,
-		default: 'md',
-	},
-	/**
-	 * Whether the expansion panel is initially collapsed. Also, can force expansion state, if changed
-	 * @type {boolean}
-	 * @default false
-	 */
-	collapsed: {
-		type: Boolean,
-		default: false,
+const props = withDefaults(
+	defineProps<{
+		/**
+		 * Size of the expansion panel
+		 * @type {string}
+		 * @default 'md'
+		 * @options ['sm', 'md']
+		 */
+		size?: ComponentSize;
+		/**
+		 * Whether the expansion panel is initially collapsed. Also, can force expansion state, if changed
+		 * @type {boolean}
+		 * @default false
+		 */
+		collapsed?: boolean;
+	}>(),
+	{
+		size: ComponentSize.MD,
+		collapsed: false,
 	},
-});
-
-const emit = defineEmits([
-	'opened',
-	'closed',
-]);
-
-const opened = ref(!props.collapsed);
-
-function open() {
-	if (!opened.value) {
-		opened.value = true;
-		emit('opened');
-	}
-}
-
-function close() {
-	if (opened.value) {
-		opened.value = false;
-		emit('closed');
-	}
-}
+);
 
-function toggle() {
-	return opened.value ? close() : open();
-}
+const emit = defineEmits<{
+	opened: [];
+	closed: [];
+}>();
 
-watch(
-	() => props.collapsed,
-	(newVal) => {
-		if (newVal) {
-			close();
-		} else {
-			open();
-		}
-	},
-);
+const { opened, open, toggle } = useExpansion(toRef(props, 'collapsed'), emit);
 </script>
 
 <style scoped>
@@ -110,11 +92,6 @@ watch(
   color: var(--wt-expansion-panel-header-title-color);
 }
 
-.wt-expansion-panel-body {
-  background-color: var(--wt-expansion-panel-content-background-color);
-  color: var(--wt-expansion-panel-content-text-color);
-}
-
 .wt-expansion-panel-actions {
   display: flex;
   gap: var(--spacing-xs);
@@ -127,4 +104,10 @@ watch(
 .wt-expansion-panel-arrow--opened {
   transform: rotate(90deg);
 }
+
+.wt-expansion-panel-body {
+  background-color: var(--wt-expansion-panel-content-background-color);
+  color: var(--wt-expansion-panel-content-text-color);
+}
+
 </style>

package/src/composables/index.ts

@@ -4,6 +4,7 @@ export * from './useCard/useCardComponent';
 export * from './useCard/useCardTabs';
 export * from './useClose/useClose';
 export * from './useDestroyableSortable/useDestroyableSortable';
+export * from './useExpansion/useExpansion';
 export * from './useGalleriaFullscreen/useGalleriaFullscreen';
 export * from './useGalleriaMaskClick/useGalleriaMaskClick';
 export * from './useInputControl/useInputControl';

package/src/composables/useExpansion/useExpansion.ts

@@ -0,0 +1,34 @@
+import { type Ref, ref, watch } from 'vue';
+
+export function useExpansion(collapsed: Ref<boolean>, emit?) {
+	const opened = ref<boolean>(!collapsed.value);
+
+	function open(): void {
+		if (opened.value) return;
+
+		opened.value = true;
+		emit?.('opened');
+	}
+
+	function close(): void {
+		if (!opened.value) return;
+
+		opened.value = false;
+		emit?.('closed');
+	}
+
+	function toggle(): void {
+		opened.value ? close() : open();
+	}
+
+	watch(collapsed, (value) => {
+		value ? close() : open();
+	});
+
+	return {
+		opened,
+		open,
+		close,
+		toggle,
+	};
+}

package/src/install.ts

@@ -24,7 +24,6 @@ export default {
 			app.provide(globalKey, globals[globalKey]);
 		});
 		app.provide('$eventBus', eventBus);
-		if (router) app.use(router);
 		initPrimevue(app);
 	},
 	generateInstance,

package/src/locale/i18n.js

@@ -3,7 +3,7 @@ import { createI18n } from 'vue-i18n';
 import { messages } from './index';
 
 export default createI18n({
-	// legacy: false,
+	legacy: false,
 	locale: 'en',
 	allowComposition: true,
 	fallbackLocale: 'en',

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

@@ -166,7 +166,7 @@ export default class NotificationsStoreModule extends BaseStoreModule {
 			context,
 			{
 				locale,
-				text = i18n.t(locale),
+				text = i18n.global.t(locale),
 				icon = notificationIcon,
 				interval = NOTIFICATION_VISIBLE_INTERVAL,
 			},

package/types/components/wt-expansion-card/wt-expansion-card.vue.d.ts

@@ -0,0 +1,45 @@
+import { ComponentSize } from '../../enums';
+type __VLS_Props = {
+    /**
+     * Size of the expansion panel
+     * @type {string}
+     * @default 'md'
+     * @options ['sm', 'md']
+     */
+    size?: ComponentSize;
+    /**
+     * Whether the expansion panel is initially collapsed. Also, can force expansion state, if changed
+     * @type {boolean}
+     * @default false
+     */
+    collapsed?: boolean;
+};
+declare var __VLS_1: {}, __VLS_9: {}, __VLS_11: {
+    open: () => void;
+    opened: boolean;
+};
+type __VLS_Slots = {} & {
+    title?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_9) => any;
+} & {
+    actions?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    opened: () => any;
+    closed: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onOpened?: () => any;
+    onClosed?: () => any;
+}>, {
+    size: ComponentSize;
+    collapsed: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/types/components/wt-expansion-panel/wt-expansion-panel.vue.d.ts

@@ -1,18 +1,55 @@
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-type __VLS_WithSlots<T, S> = T & (new () => {
-    $slots: S;
-});
-declare const __VLS_base: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
-type __VLS_Slots = {
-    title?: (props: {}) => any;
+import { ComponentSize } from '../../enums';
+/**
+ * @emits {void} opened - Emitted when the expansion panel is opened
+ * @emits {void} closed - Emitted when the expansion panel is closed
+ *
+ * @slot default - Content of the expansion panel
+ * @slot title - Title of the expansion panel
+ * @slot actions - Actions of the expansion panel
+ * @slot-scope {function} open - Function to open the panel
+ * @slot-scope {boolean} opened - Whether the panel is currently opened
+ */
+type __VLS_Props = {
+    /**
+     * Size of the expansion panel
+     * @type {string}
+     * @default 'md'
+     * @options ['sm', 'md']
+     */
+    size?: ComponentSize;
+    /**
+     * Whether the expansion panel is initially collapsed. Also, can force expansion state, if changed
+     * @type {boolean}
+     * @default false
+     */
+    collapsed?: boolean;
+};
+declare var __VLS_1: {}, __VLS_3: {
+    open: () => void;
+    opened: boolean;
+}, __VLS_16: {};
+type __VLS_Slots = {} & {
+    title?: (props: typeof __VLS_1) => any;
 } & {
-    actions?: (props: {
-        open: typeof open;
-        opened: boolean;
-    }) => any;
+    actions?: (props: typeof __VLS_3) => any;
 } & {
-    default?: (props: {}) => any;
+    default?: (props: typeof __VLS_16) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    opened: () => any;
+    closed: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onOpened?: () => any;
+    onClosed?: () => any;
+}>, {
+    size: ComponentSize;
+    collapsed: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
 };
-declare function open(): void;

package/types/components/wt-select/wt-select-v2.vue.d.ts

@@ -30,8 +30,8 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     input: (...args: any[]) => void;
     reset: (...args: any[]) => void;
-    "update:modelValue": (...args: any[]) => void;
     closed: (...args: any[]) => void;
+    "update:modelValue": (...args: any[]) => void;
     "search-change": (...args: any[]) => void;
     "custom-value": (...args: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -64,8 +64,8 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
 }>> & Readonly<{
     onInput?: (...args: any[]) => any;
     onReset?: (...args: any[]) => any;
-    "onUpdate:modelValue"?: (...args: any[]) => any;
     onClosed?: (...args: any[]) => any;
+    "onUpdate:modelValue"?: (...args: any[]) => any;
     "onSearch-change"?: (...args: any[]) => any;
     "onCustom-value"?: (...args: any[]) => any;
 }>, {

package/types/components/wt-select/wt-select.vue.d.ts

@@ -183,7 +183,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
         tag(searchQuery: any, id: any): void;
         emitTagEvent(searchQuery: any, id: any): void;
     };
-}, import("vue").ComponentOptionsMixin, ("input" | "reset" | "update:modelValue" | "closed" | "search-change" | "custom-value")[], "input" | "reset" | "update:modelValue" | "closed" | "search-change" | "custom-value", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, ("input" | "reset" | "closed" | "update:modelValue" | "search-change" | "custom-value")[], "input" | "reset" | "closed" | "update:modelValue" | "search-change" | "custom-value", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     value: {};
     multiple: {
         type: BooleanConstructor;

package/types/composables/index.d.ts

@@ -11,3 +11,4 @@ export * from './useRepresentableAgentPauseCause/useRepresentableAgentPauseCause
 export * from './useTableColumnDrag/useTableColumnDrag';
 export * from './useValidate/useValidate';
 export * from './useWtTable/useWtTable';
+export * from './useExpansion/useExpansion';

package/types/composables/useExpansion/useExpansion.d.ts

@@ -0,0 +1,7 @@
+import { type Ref } from 'vue';
+export declare function useExpansion(collapsed: Ref<boolean>, emit?: any): {
+    opened: Ref<boolean, boolean>;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+};

package/types/locale/i18n.d.ts

@@ -7147,5 +7147,5 @@ declare const _default: import("vue-i18n").I18n<{
             markChatProcessed: string;
         };
     };
-}, {}, {}, string, true>;
+}, {}, {}, string, false>;
 export default _default;

package/types/modules/Notifications/store/NotificationsStoreModule.d.ts

@@ -29,7 +29,7 @@ export default class NotificationsStoreModule extends BaseStoreModule {
         STOP_SOUND: (context: any) => void;
         SEND_NOTIFICATION: (context: any, { locale, text, icon, interval, }: {
             locale: any;
-            text?: any;
+            text?: string;
             icon?: any;
             interval?: number;
         }) => void;