@phonghq/go-chat 1.0.43 → 1.0.44

package/dist/test/components/chat/call/Calling.vue.js

@@ -1,3 +1,4 @@
+/// <reference types="C:/phonghq/go-chat-v2/node_modules/.vue-global-types/vue_3.5_0.d.ts" />
 import { computed, onMounted, onUnmounted, ref } from 'vue';
 import IconPhone from '../../../assets/icons/call/IconPhone.vue';
 import { dataProfile } from '../../../utils/chat/auth.js';
@@ -12,10 +13,12 @@ import IconClose from '../../../assets/icons/call/IconClose.vue';
 import { usePlivo } from '../../../composable/usePlivo';
 import { PLIVO_CALL_STATUS } from '../../../types/chat/call';
 import IconMic from '../../../assets/icons/call/IconMic.vue';
-import { useError } from '../../../composable/useError';
 import { useDebounce } from '../../../utils/debounce';
 import { phoneNumberFormat } from '../../../utils/string-helper';
-const props = withDefaults(defineProps(), {});
+import { handleMedialPermissionError, showPageError } from '../../../utils/chat/page-error';
+const props = withDefaults(defineProps(), {
+    responsive: 'window'
+});
 const emit = defineEmits();
 // const {
 //   // call,
@@ -48,11 +51,11 @@ const handlePlivoCallBack = (status, data) => {
         startTimer();
     }
     else if (status == PLIVO_CALL_STATUS.MEDIA_PERMISSION_FAIL) {
-        emit('error:mediaPermissionFail');
+        handleMedialPermissionError();
     }
 };
-const { plivoLogin, plivoCallAnswer, plivoCall, plivoEndCall, plivoCallSwishMute } = usePlivo(handlePlivoCallBack);
-const { showError } = useError();
+const { plivoLogin, plivoCallAnswer, plivoCall, plivoEndCall, plivoCallSwishMute, plivoCallSwishSpeaker } = usePlivo(handlePlivoCallBack);
+// const { showError } = useError()
 const STATUS_LABEL = computed(() => {
     return {
         [PLIVO_CALL_STATUS.CONNECTING]: 'Connecting...',
@@ -93,7 +96,7 @@ onMounted(async () => {
         }
     }
     catch {
-        showError('We’re having trouble connecting the call. Please try again in a moment');
+        showPageError('We’re having trouble connecting the call. Please try again in a moment');
     }
 });
 onUnmounted(() => {
@@ -157,7 +160,7 @@ const refreshToken = async () => {
             setTimeout(() => refreshToken(), 60 * 1000);
         }
         else {
-            showError('We’re having trouble connecting the call. Please try again in a moment');
+            showPageError('We’re having trouble connecting the call. Please try again in a moment');
         }
         console.log(e);
     }
@@ -167,9 +170,14 @@ const open = () => {
     disable.value = true;
     drawerVisibleRef.value?.open();
 };
-const handleMute = () => {
-    plivoCallSwishMute(!isMute.value);
-    isMute.value = !isMute.value;
+const handleMute = async () => {
+    try {
+        plivoCallSwishMute(!isMute.value);
+        isMute.value = !isMute.value;
+    }
+    catch (e) {
+        alert(e);
+    }
 };
 const startCall = async (data) => {
     try {
@@ -274,7 +282,9 @@ const handleAfterClose = () => {
 let __VLS_exposed;
 defineExpose({ startCall, endCall, userRemoter, callStatus, answer, label });
 debugger; /* PartiallyEnd: #3632/scriptSetup.vue */
-const __VLS_defaults = {};
+const __VLS_defaults = {
+    responsive: 'window'
+};
 const __VLS_ctx = {
     ...{},
     ...{},
@@ -285,6 +295,11 @@ const __VLS_ctx = {
 let __VLS_elements;
 let __VLS_components;
 let __VLS_directives;
+/** @type {__VLS_StyleScopedClasses['call-avatar']} */ ;
+/** @type {__VLS_StyleScopedClasses['call-avatar']} */ ;
+/** @type {__VLS_StyleScopedClasses['call-avatar']} */ ;
+/** @type {__VLS_StyleScopedClasses['call-avatar']} */ ;
+/** @type {__VLS_StyleScopedClasses['call-avatar']} */ ;
 /** @type {[typeof DrawerBaseCustom, typeof DrawerBaseCustom, ]} */ ;
 // @ts-ignore
 const __VLS_0 = __VLS_asFunctionalComponent(DrawerBaseCustom, new DrawerBaseCustom({
@@ -315,15 +330,19 @@ const { default: __VLS_8 } = __VLS_2.slots;
 {
     const { content: __VLS_9 } = __VLS_2.slots;
     __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-        ...{ class: "flex flex-col items-center justify-center h-full bg-chat-haze-300 text-white relative" },
+        ...{ class: "flex flex-col items-center justify-center h-full relative bg-white" },
+        ...{ style: {} },
+    });
+    __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
+        ...{ class: "h-40 w-40 call-avatar  mb-8" },
     });
     __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-        ...{ class: "h-40 w-40 rounded-full overflow-hidden mb-4 border-4 border-gray-700 flex-center" },
+        ...{ class: "h-40 w-40 rounded-full overflow-hidden mb-4 border-4 border-white flex-center" },
     });
     /** @type {[typeof Avatar, ]} */ ;
     // @ts-ignore
     const __VLS_10 = __VLS_asFunctionalComponent(Avatar, new Avatar({
-        ...{ class: "" },
+        ...{ class: "bg-white z-[2]" },
         src: (__VLS_ctx.userRemoter?.avatar ?? ''),
         id: (__VLS_ctx.userRemoter?.id ?? ''),
         color: (__VLS_ctx.userRemoter?.color),
@@ -331,7 +350,7 @@ const { default: __VLS_8 } = __VLS_2.slots;
         size: "xxl",
     }));
     const __VLS_11 = __VLS_10({
-        ...{ class: "" },
+        ...{ class: "bg-white z-[2]" },
         src: (__VLS_ctx.userRemoter?.avatar ?? ''),
         id: (__VLS_ctx.userRemoter?.id ?? ''),
         color: (__VLS_ctx.userRemoter?.color),
@@ -340,6 +359,19 @@ const { default: __VLS_8 } = __VLS_2.slots;
     }, ...__VLS_functionalComponentArgsRest(__VLS_10));
     // @ts-ignore
     [userRemoter, userRemoter, userRemoter, userRemoter,];
+    if (__VLS_ctx.callStatus == __VLS_ctx.PLIVO_CALL_STATUS.RINGING || __VLS_ctx.callStatus == __VLS_ctx.PLIVO_CALL_STATUS.CALLING) {
+        // @ts-ignore
+        [callStatus, callStatus, PLIVO_CALL_STATUS, PLIVO_CALL_STATUS,];
+        __VLS_asFunctionalElement(__VLS_elements.span, __VLS_elements.span)({
+            ...{ class: "bubble bubble-1" },
+        });
+        __VLS_asFunctionalElement(__VLS_elements.span, __VLS_elements.span)({
+            ...{ class: "bubble bubble-2" },
+        });
+        __VLS_asFunctionalElement(__VLS_elements.span, __VLS_elements.span)({
+            ...{ class: "bubble bubble-3" },
+        });
+    }
     __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
         ...{ class: "text-center" },
     });
@@ -352,26 +384,12 @@ const { default: __VLS_8 } = __VLS_2.slots;
     __VLS_asFunctionalElement(__VLS_elements.p, __VLS_elements.p)({
         ...{ class: "text-gray-400 mt-1" },
     });
-    (__VLS_ctx.STATUS_LABEL[__VLS_ctx.callStatus]);
+    (__VLS_ctx.callStatus == __VLS_ctx.PLIVO_CALL_STATUS.CALL_START ? __VLS_ctx.duration : __VLS_ctx.STATUS_LABEL[__VLS_ctx.callStatus]);
     // @ts-ignore
-    [STATUS_LABEL, callStatus,];
+    [callStatus, callStatus, PLIVO_CALL_STATUS, duration, STATUS_LABEL,];
     __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
         ...{ class: "flex items-center justify-center gap-8 mt-10" },
     });
-    if (__VLS_ctx.callStatus == __VLS_ctx.PLIVO_CALL_STATUS.RINGING) {
-        // @ts-ignore
-        [callStatus, PLIVO_CALL_STATUS,];
-        __VLS_asFunctionalElement(__VLS_elements.button, __VLS_elements.button)({
-            ...{ onClick: (__VLS_ctx.answer) },
-            ...{ class: "w-16 h-16 bg-chat-success hover:bg-green-600 text-white rounded-full flex items-center justify-center shadow-lg transition" },
-        });
-        // @ts-ignore
-        [answer,];
-        /** @type {[typeof IconPhone, ]} */ ;
-        // @ts-ignore
-        const __VLS_14 = __VLS_asFunctionalComponent(IconPhone, new IconPhone({}));
-        const __VLS_15 = __VLS_14({}, ...__VLS_functionalComponentArgsRest(__VLS_14));
-    }
     if (__VLS_ctx.record_link && __VLS_ctx.callStatus == __VLS_ctx.PLIVO_CALL_STATUS.CALL_END) {
         // @ts-ignore
         [callStatus, PLIVO_CALL_STATUS, record_link,];
@@ -385,8 +403,8 @@ const { default: __VLS_8 } = __VLS_2.slots;
         [record_link, exportRecordFile,];
         /** @type {[typeof IconSoundDownload, ]} */ ;
         // @ts-ignore
-        const __VLS_18 = __VLS_asFunctionalComponent(IconSoundDownload, new IconSoundDownload({}));
-        const __VLS_19 = __VLS_18({}, ...__VLS_functionalComponentArgsRest(__VLS_18));
+        const __VLS_14 = __VLS_asFunctionalComponent(IconSoundDownload, new IconSoundDownload({}));
+        const __VLS_15 = __VLS_14({}, ...__VLS_functionalComponentArgsRest(__VLS_14));
     }
     if (__VLS_ctx.callStatus == __VLS_ctx.PLIVO_CALL_STATUS.CALL_START) {
         // @ts-ignore
@@ -399,16 +417,16 @@ const { default: __VLS_8 } = __VLS_2.slots;
                     // @ts-ignore
                     [handleMute,];
                 } },
-            ...{ class: "w-16 h-16 bg-white hover:bg-green-600 text-black rounded-full flex items-center justify-center shadow-lg transition" },
+            ...{ class: "w-16 h-16 shadow-lg bg-white hover:bg-green-600 text-black rounded-full flex items-center justify-center shadow-3xl transition" },
         });
         /** @type {[typeof IconMic, ]} */ ;
         // @ts-ignore
-        const __VLS_22 = __VLS_asFunctionalComponent(IconMic, new IconMic({
+        const __VLS_18 = __VLS_asFunctionalComponent(IconMic, new IconMic({
             mute: (__VLS_ctx.isMute),
         }));
-        const __VLS_23 = __VLS_22({
+        const __VLS_19 = __VLS_18({
             mute: (__VLS_ctx.isMute),
-        }, ...__VLS_functionalComponentArgsRest(__VLS_22));
+        }, ...__VLS_functionalComponentArgsRest(__VLS_18));
         // @ts-ignore
         [isMute,];
     }
@@ -423,12 +441,12 @@ const { default: __VLS_8 } = __VLS_2.slots;
                     // @ts-ignore
                     [endCall,];
                 } },
-            ...{ class: "w-16 h-16 bg-white hover:bg-green-600 text-white rounded-full flex items-center justify-center shadow-lg transition" },
+            ...{ class: "w-16 h-16 bg-white hover:bg-green-600 text-white rounded-full flex items-center justify-center shadow-3xl transition" },
         });
         /** @type {[typeof IconClose, ]} */ ;
         // @ts-ignore
-        const __VLS_26 = __VLS_asFunctionalComponent(IconClose, new IconClose({}));
-        const __VLS_27 = __VLS_26({}, ...__VLS_functionalComponentArgsRest(__VLS_26));
+        const __VLS_22 = __VLS_asFunctionalComponent(IconClose, new IconClose({}));
+        const __VLS_23 = __VLS_22({}, ...__VLS_functionalComponentArgsRest(__VLS_22));
     }
     if (__VLS_ctx.callStatus != __VLS_ctx.PLIVO_CALL_STATUS.CALL_END) {
         // @ts-ignore
@@ -441,38 +459,59 @@ const { default: __VLS_8 } = __VLS_2.slots;
                     // @ts-ignore
                     [endCall,];
                 } },
-            ...{ class: "w-16 h-16 rounded-full bg-chat-error hover:bg-red-700 flex items-center justify-center" },
+            ...{ class: "shadow-3xl w-16 h-16 rounded-full bg-chat-error hover:bg-red-700 flex text-white items-center justify-center" },
         });
         /** @type {[typeof IconPhoneCancel, ]} */ ;
         // @ts-ignore
-        const __VLS_30 = __VLS_asFunctionalComponent(IconPhoneCancel, new IconPhoneCancel({}));
+        const __VLS_26 = __VLS_asFunctionalComponent(IconPhoneCancel, new IconPhoneCancel({}));
+        const __VLS_27 = __VLS_26({}, ...__VLS_functionalComponentArgsRest(__VLS_26));
+    }
+    if (__VLS_ctx.callStatus == __VLS_ctx.PLIVO_CALL_STATUS.RINGING) {
+        // @ts-ignore
+        [callStatus, PLIVO_CALL_STATUS,];
+        __VLS_asFunctionalElement(__VLS_elements.button, __VLS_elements.button)({
+            ...{ onClick: (__VLS_ctx.answer) },
+            ...{ class: "shadow-3xl w-16 h-16 bg-chat-success hover:bg-green-600 rounded-full text-white flex items-center justify-center shadow-lg transition" },
+        });
+        // @ts-ignore
+        [answer,];
+        /** @type {[typeof IconPhone, ]} */ ;
+        // @ts-ignore
+        const __VLS_30 = __VLS_asFunctionalComponent(IconPhone, new IconPhone({}));
         const __VLS_31 = __VLS_30({}, ...__VLS_functionalComponentArgsRest(__VLS_30));
     }
-    __VLS_asFunctionalElement(__VLS_elements.p, __VLS_elements.p)({
-        ...{ class: "absolute bottom-6 text-gray-500 text-sm" },
+    __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
+        ...{ class: "flex items-center justify-center gap-8 mt-10" },
     });
-    (__VLS_ctx.duration);
-    // @ts-ignore
-    [duration,];
 }
 var __VLS_2;
-/** @type {__VLS_StyleScopedClasses['']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex-col']} */ ;
 /** @type {__VLS_StyleScopedClasses['items-center']} */ ;
 /** @type {__VLS_StyleScopedClasses['justify-center']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-full']} */ ;
-/** @type {__VLS_StyleScopedClasses['bg-chat-haze-300']} */ ;
-/** @type {__VLS_StyleScopedClasses['text-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['relative']} */ ;
+/** @type {__VLS_StyleScopedClasses['bg-white']} */ ;
+/** @type {__VLS_StyleScopedClasses['h-40']} */ ;
+/** @type {__VLS_StyleScopedClasses['w-40']} */ ;
+/** @type {__VLS_StyleScopedClasses['call-avatar']} */ ;
+/** @type {__VLS_StyleScopedClasses['mb-8']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-40']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-40']} */ ;
 /** @type {__VLS_StyleScopedClasses['rounded-full']} */ ;
 /** @type {__VLS_StyleScopedClasses['overflow-hidden']} */ ;
 /** @type {__VLS_StyleScopedClasses['mb-4']} */ ;
 /** @type {__VLS_StyleScopedClasses['border-4']} */ ;
-/** @type {__VLS_StyleScopedClasses['border-gray-700']} */ ;
+/** @type {__VLS_StyleScopedClasses['border-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex-center']} */ ;
+/** @type {__VLS_StyleScopedClasses['bg-white']} */ ;
+/** @type {__VLS_StyleScopedClasses['z-[2]']} */ ;
+/** @type {__VLS_StyleScopedClasses['bubble']} */ ;
+/** @type {__VLS_StyleScopedClasses['bubble-1']} */ ;
+/** @type {__VLS_StyleScopedClasses['bubble']} */ ;
+/** @type {__VLS_StyleScopedClasses['bubble-2']} */ ;
+/** @type {__VLS_StyleScopedClasses['bubble']} */ ;
+/** @type {__VLS_StyleScopedClasses['bubble-3']} */ ;
 /** @type {__VLS_StyleScopedClasses['text-center']} */ ;
 /** @type {__VLS_StyleScopedClasses['text-2xl']} */ ;
 /** @type {__VLS_StyleScopedClasses['font-semibold']} */ ;
@@ -485,7 +524,7 @@ var __VLS_2;
 /** @type {__VLS_StyleScopedClasses['mt-10']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-16']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-16']} */ ;
-/** @type {__VLS_StyleScopedClasses['bg-chat-success']} */ ;
+/** @type {__VLS_StyleScopedClasses['bg-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['hover:bg-green-600']} */ ;
 /** @type {__VLS_StyleScopedClasses['text-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['rounded-full']} */ ;
@@ -496,49 +535,54 @@ var __VLS_2;
 /** @type {__VLS_StyleScopedClasses['transition']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-16']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-16']} */ ;
+/** @type {__VLS_StyleScopedClasses['shadow-lg']} */ ;
 /** @type {__VLS_StyleScopedClasses['bg-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['hover:bg-green-600']} */ ;
-/** @type {__VLS_StyleScopedClasses['text-white']} */ ;
+/** @type {__VLS_StyleScopedClasses['text-black']} */ ;
 /** @type {__VLS_StyleScopedClasses['rounded-full']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['items-center']} */ ;
 /** @type {__VLS_StyleScopedClasses['justify-center']} */ ;
-/** @type {__VLS_StyleScopedClasses['shadow-lg']} */ ;
+/** @type {__VLS_StyleScopedClasses['shadow-3xl']} */ ;
 /** @type {__VLS_StyleScopedClasses['transition']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-16']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-16']} */ ;
 /** @type {__VLS_StyleScopedClasses['bg-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['hover:bg-green-600']} */ ;
-/** @type {__VLS_StyleScopedClasses['text-black']} */ ;
+/** @type {__VLS_StyleScopedClasses['text-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['rounded-full']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['items-center']} */ ;
 /** @type {__VLS_StyleScopedClasses['justify-center']} */ ;
-/** @type {__VLS_StyleScopedClasses['shadow-lg']} */ ;
+/** @type {__VLS_StyleScopedClasses['shadow-3xl']} */ ;
 /** @type {__VLS_StyleScopedClasses['transition']} */ ;
+/** @type {__VLS_StyleScopedClasses['shadow-3xl']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-16']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-16']} */ ;
-/** @type {__VLS_StyleScopedClasses['bg-white']} */ ;
-/** @type {__VLS_StyleScopedClasses['hover:bg-green-600']} */ ;
-/** @type {__VLS_StyleScopedClasses['text-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['rounded-full']} */ ;
+/** @type {__VLS_StyleScopedClasses['bg-chat-error']} */ ;
+/** @type {__VLS_StyleScopedClasses['hover:bg-red-700']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
+/** @type {__VLS_StyleScopedClasses['text-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['items-center']} */ ;
 /** @type {__VLS_StyleScopedClasses['justify-center']} */ ;
-/** @type {__VLS_StyleScopedClasses['shadow-lg']} */ ;
-/** @type {__VLS_StyleScopedClasses['transition']} */ ;
+/** @type {__VLS_StyleScopedClasses['shadow-3xl']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-16']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-16']} */ ;
+/** @type {__VLS_StyleScopedClasses['bg-chat-success']} */ ;
+/** @type {__VLS_StyleScopedClasses['hover:bg-green-600']} */ ;
 /** @type {__VLS_StyleScopedClasses['rounded-full']} */ ;
-/** @type {__VLS_StyleScopedClasses['bg-chat-error']} */ ;
-/** @type {__VLS_StyleScopedClasses['hover:bg-red-700']} */ ;
+/** @type {__VLS_StyleScopedClasses['text-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['items-center']} */ ;
 /** @type {__VLS_StyleScopedClasses['justify-center']} */ ;
-/** @type {__VLS_StyleScopedClasses['absolute']} */ ;
-/** @type {__VLS_StyleScopedClasses['bottom-6']} */ ;
-/** @type {__VLS_StyleScopedClasses['text-gray-500']} */ ;
-/** @type {__VLS_StyleScopedClasses['text-sm']} */ ;
+/** @type {__VLS_StyleScopedClasses['shadow-lg']} */ ;
+/** @type {__VLS_StyleScopedClasses['transition']} */ ;
+/** @type {__VLS_StyleScopedClasses['flex']} */ ;
+/** @type {__VLS_StyleScopedClasses['items-center']} */ ;
+/** @type {__VLS_StyleScopedClasses['justify-center']} */ ;
+/** @type {__VLS_StyleScopedClasses['gap-8']} */ ;
+/** @type {__VLS_StyleScopedClasses['mt-10']} */ ;
 // @ts-ignore
 var __VLS_7 = __VLS_6;
 const __VLS_export = (await import('vue')).defineComponent({

package/dist/test/components/chat/common/tab/TabBase.vue.js

@@ -1,3 +1,4 @@
+/// <reference types="C:/phonghq/go-chat-v2/node_modules/.vue-global-types/vue_3.5_0.d.ts" />
 const props = withDefaults(defineProps(), {});
 const emit = defineEmits();
 const active = defineModel('active');

package/dist/test/components/chat/common/tabs/TabBase.vue.js

@@ -0,0 +1,92 @@
+import { Tabs, TabsList, TabsTrigger } from '../../../ui/tabs';
+const props = withDefaults(defineProps(), {});
+const active = defineModel('active');
+debugger; /* PartiallyEnd: #3632/scriptSetup.vue */
+const __VLS_modelEmit = defineEmits();
+const __VLS_defaults = {};
+const __VLS_ctx = {
+    ...{},
+    ...{},
+    ...{},
+    ...{},
+    ...{},
+};
+let __VLS_elements;
+let __VLS_components;
+let __VLS_directives;
+__VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
+    ...{ class: "flex w-full max-w-sm flex-col gap-6" },
+});
+const __VLS_0 = {}.Tabs;
+/** @type {[typeof __VLS_components.Tabs, typeof __VLS_components.Tabs, ]} */ ;
+// @ts-ignore
+Tabs;
+// @ts-ignore
+const __VLS_1 = __VLS_asFunctionalComponent(__VLS_0, new __VLS_0({
+    modelValue: (__VLS_ctx.active),
+}));
+const __VLS_2 = __VLS_1({
+    modelValue: (__VLS_ctx.active),
+}, ...__VLS_functionalComponentArgsRest(__VLS_1));
+const { default: __VLS_4 } = __VLS_3.slots;
+// @ts-ignore
+[active,];
+const __VLS_5 = {}.TabsList;
+/** @type {[typeof __VLS_components.TabsList, typeof __VLS_components.TabsList, ]} */ ;
+// @ts-ignore
+TabsList;
+// @ts-ignore
+const __VLS_6 = __VLS_asFunctionalComponent(__VLS_5, new __VLS_5({}));
+const __VLS_7 = __VLS_6({}, ...__VLS_functionalComponentArgsRest(__VLS_6));
+const { default: __VLS_9 } = __VLS_8.slots;
+for (const [item] of __VLS_getVForSourceType((__VLS_ctx.tabs))) {
+    // @ts-ignore
+    [tabs,];
+    const __VLS_10 = {}.TabsTrigger;
+    /** @type {[typeof __VLS_components.TabsTrigger, typeof __VLS_components.TabsTrigger, ]} */ ;
+    // @ts-ignore
+    TabsTrigger;
+    // @ts-ignore
+    const __VLS_11 = __VLS_asFunctionalComponent(__VLS_10, new __VLS_10({
+        ...{ class: "px-4 py-2 relative" },
+        value: (item.value),
+        key: (item.value),
+    }));
+    const __VLS_12 = __VLS_11({
+        ...{ class: "px-4 py-2 relative" },
+        value: (item.value),
+        key: (item.value),
+    }, ...__VLS_functionalComponentArgsRest(__VLS_11));
+    const { default: __VLS_14 } = __VLS_13.slots;
+    __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
+        ...{ class: "w-5 h-5 bg-chat-error rounded-full absolute -top-[8px] -right-2 text-white" },
+    });
+    __VLS_asFunctionalDirective(__VLS_directives.vShow)(null, { ...__VLS_directiveBindingRestFields, value: (item.badge) }, null, null);
+    (item.badge);
+    (item.label);
+    var __VLS_13;
+}
+var __VLS_8;
+var __VLS_3;
+/** @type {__VLS_StyleScopedClasses['flex']} */ ;
+/** @type {__VLS_StyleScopedClasses['w-full']} */ ;
+/** @type {__VLS_StyleScopedClasses['max-w-sm']} */ ;
+/** @type {__VLS_StyleScopedClasses['flex-col']} */ ;
+/** @type {__VLS_StyleScopedClasses['gap-6']} */ ;
+/** @type {__VLS_StyleScopedClasses['px-4']} */ ;
+/** @type {__VLS_StyleScopedClasses['py-2']} */ ;
+/** @type {__VLS_StyleScopedClasses['relative']} */ ;
+/** @type {__VLS_StyleScopedClasses['w-5']} */ ;
+/** @type {__VLS_StyleScopedClasses['h-5']} */ ;
+/** @type {__VLS_StyleScopedClasses['bg-chat-error']} */ ;
+/** @type {__VLS_StyleScopedClasses['rounded-full']} */ ;
+/** @type {__VLS_StyleScopedClasses['absolute']} */ ;
+/** @type {__VLS_StyleScopedClasses['-top-[8px]']} */ ;
+/** @type {__VLS_StyleScopedClasses['-right-2']} */ ;
+/** @type {__VLS_StyleScopedClasses['text-white']} */ ;
+const __VLS_export = (await import('vue')).defineComponent({
+    __typeEmits: {},
+    __typeProps: {},
+    props: {},
+});
+export default {};

package/dist/test/components/chat/layout/mobile/Footer.vue.js

@@ -52,7 +52,7 @@ let __VLS_elements;
 let __VLS_components;
 let __VLS_directives;
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-    ...{ class: "bg-white rounded-t-3xl shadow-lg pb-2 flex grid grid-cols-4 h-[80px]" },
+    ...{ class: "bg-white rounded-t-3xl sm:rounded-0 shadow-lg pb-2 flex grid grid-cols-4 sm:grid-cols-1 h-[80px] w-full sm:h-full sm:w-[100px]" },
 });
 for (const [item] of __VLS_getVForSourceType((__VLS_ctx.LAYOUT_CONFIG))) {
     // @ts-ignore
@@ -88,12 +88,17 @@ for (const [item] of __VLS_getVForSourceType((__VLS_ctx.LAYOUT_CONFIG))) {
 }
 /** @type {__VLS_StyleScopedClasses['bg-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['rounded-t-3xl']} */ ;
+/** @type {__VLS_StyleScopedClasses['sm:rounded-0']} */ ;
 /** @type {__VLS_StyleScopedClasses['shadow-lg']} */ ;
 /** @type {__VLS_StyleScopedClasses['pb-2']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['grid']} */ ;
 /** @type {__VLS_StyleScopedClasses['grid-cols-4']} */ ;
+/** @type {__VLS_StyleScopedClasses['sm:grid-cols-1']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-[80px]']} */ ;
+/** @type {__VLS_StyleScopedClasses['w-full']} */ ;
+/** @type {__VLS_StyleScopedClasses['sm:h-full']} */ ;
+/** @type {__VLS_StyleScopedClasses['sm:w-[100px]']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex-col']} */ ;
 /** @type {__VLS_StyleScopedClasses['justify-center']} */ ;

package/dist/test/components/common/drawer/DrawerBaseCustom.vue.js

@@ -1,3 +1,4 @@
+/// <reference types="C:/phonghq/go-chat-v2/node_modules/.vue-global-types/vue_3.5_0.d.ts" />
 import { computed, ref } from 'vue';
 const props = withDefaults(defineProps(), {
     position: 'right',

package/dist/test/components/common/select/SelectBase.vue.js

@@ -0,0 +1,139 @@
+/// <reference types="C:/phonghq/go-chat-v2/node_modules/.vue-global-types/vue_3.5_0.d.ts" />
+import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue, } from '../../ui/select';
+debugger; /* PartiallyEnd: #3632/scriptSetup.vue */
+const __VLS_ctx = {
+    ...{},
+    ...{},
+};
+let __VLS_elements;
+let __VLS_components;
+let __VLS_directives;
+const __VLS_0 = {}.Select;
+/** @type {[typeof __VLS_components.Select, typeof __VLS_components.Select, ]} */ ;
+// @ts-ignore
+Select;
+// @ts-ignore
+const __VLS_1 = __VLS_asFunctionalComponent(__VLS_0, new __VLS_0({}));
+const __VLS_2 = __VLS_1({}, ...__VLS_functionalComponentArgsRest(__VLS_1));
+var __VLS_4 = {};
+const { default: __VLS_5 } = __VLS_3.slots;
+const __VLS_6 = {}.SelectTrigger;
+/** @type {[typeof __VLS_components.SelectTrigger, typeof __VLS_components.SelectTrigger, ]} */ ;
+// @ts-ignore
+SelectTrigger;
+// @ts-ignore
+const __VLS_7 = __VLS_asFunctionalComponent(__VLS_6, new __VLS_6({
+    ...{ class: "w-[180px]" },
+}));
+const __VLS_8 = __VLS_7({
+    ...{ class: "w-[180px]" },
+}, ...__VLS_functionalComponentArgsRest(__VLS_7));
+const { default: __VLS_10 } = __VLS_9.slots;
+const __VLS_11 = {}.SelectValue;
+/** @type {[typeof __VLS_components.SelectValue, ]} */ ;
+// @ts-ignore
+SelectValue;
+// @ts-ignore
+const __VLS_12 = __VLS_asFunctionalComponent(__VLS_11, new __VLS_11({
+    placeholder: "Select a fruit",
+}));
+const __VLS_13 = __VLS_12({
+    placeholder: "Select a fruit",
+}, ...__VLS_functionalComponentArgsRest(__VLS_12));
+var __VLS_9;
+const __VLS_16 = {}.SelectContent;
+/** @type {[typeof __VLS_components.SelectContent, typeof __VLS_components.SelectContent, ]} */ ;
+// @ts-ignore
+SelectContent;
+// @ts-ignore
+const __VLS_17 = __VLS_asFunctionalComponent(__VLS_16, new __VLS_16({}));
+const __VLS_18 = __VLS_17({}, ...__VLS_functionalComponentArgsRest(__VLS_17));
+const { default: __VLS_20 } = __VLS_19.slots;
+const __VLS_21 = {}.SelectGroup;
+/** @type {[typeof __VLS_components.SelectGroup, typeof __VLS_components.SelectGroup, ]} */ ;
+// @ts-ignore
+SelectGroup;
+// @ts-ignore
+const __VLS_22 = __VLS_asFunctionalComponent(__VLS_21, new __VLS_21({}));
+const __VLS_23 = __VLS_22({}, ...__VLS_functionalComponentArgsRest(__VLS_22));
+const { default: __VLS_25 } = __VLS_24.slots;
+const __VLS_26 = {}.SelectLabel;
+/** @type {[typeof __VLS_components.SelectLabel, typeof __VLS_components.SelectLabel, ]} */ ;
+// @ts-ignore
+SelectLabel;
+// @ts-ignore
+const __VLS_27 = __VLS_asFunctionalComponent(__VLS_26, new __VLS_26({}));
+const __VLS_28 = __VLS_27({}, ...__VLS_functionalComponentArgsRest(__VLS_27));
+const { default: __VLS_30 } = __VLS_29.slots;
+var __VLS_29;
+const __VLS_31 = {}.SelectItem;
+/** @type {[typeof __VLS_components.SelectItem, typeof __VLS_components.SelectItem, ]} */ ;
+// @ts-ignore
+SelectItem;
+// @ts-ignore
+const __VLS_32 = __VLS_asFunctionalComponent(__VLS_31, new __VLS_31({
+    value: "apple",
+}));
+const __VLS_33 = __VLS_32({
+    value: "apple",
+}, ...__VLS_functionalComponentArgsRest(__VLS_32));
+const { default: __VLS_35 } = __VLS_34.slots;
+var __VLS_34;
+const __VLS_36 = {}.SelectItem;
+/** @type {[typeof __VLS_components.SelectItem, typeof __VLS_components.SelectItem, ]} */ ;
+// @ts-ignore
+SelectItem;
+// @ts-ignore
+const __VLS_37 = __VLS_asFunctionalComponent(__VLS_36, new __VLS_36({
+    value: "banana",
+}));
+const __VLS_38 = __VLS_37({
+    value: "banana",
+}, ...__VLS_functionalComponentArgsRest(__VLS_37));
+const { default: __VLS_40 } = __VLS_39.slots;
+var __VLS_39;
+const __VLS_41 = {}.SelectItem;
+/** @type {[typeof __VLS_components.SelectItem, typeof __VLS_components.SelectItem, ]} */ ;
+// @ts-ignore
+SelectItem;
+// @ts-ignore
+const __VLS_42 = __VLS_asFunctionalComponent(__VLS_41, new __VLS_41({
+    value: "blueberry",
+}));
+const __VLS_43 = __VLS_42({
+    value: "blueberry",
+}, ...__VLS_functionalComponentArgsRest(__VLS_42));
+const { default: __VLS_45 } = __VLS_44.slots;
+var __VLS_44;
+const __VLS_46 = {}.SelectItem;
+/** @type {[typeof __VLS_components.SelectItem, typeof __VLS_components.SelectItem, ]} */ ;
+// @ts-ignore
+SelectItem;
+// @ts-ignore
+const __VLS_47 = __VLS_asFunctionalComponent(__VLS_46, new __VLS_46({
+    value: "grapes",
+}));
+const __VLS_48 = __VLS_47({
+    value: "grapes",
+}, ...__VLS_functionalComponentArgsRest(__VLS_47));
+const { default: __VLS_50 } = __VLS_49.slots;
+var __VLS_49;
+const __VLS_51 = {}.SelectItem;
+/** @type {[typeof __VLS_components.SelectItem, typeof __VLS_components.SelectItem, ]} */ ;
+// @ts-ignore
+SelectItem;
+// @ts-ignore
+const __VLS_52 = __VLS_asFunctionalComponent(__VLS_51, new __VLS_51({
+    value: "pineapple",
+}));
+const __VLS_53 = __VLS_52({
+    value: "pineapple",
+}, ...__VLS_functionalComponentArgsRest(__VLS_52));
+const { default: __VLS_55 } = __VLS_54.slots;
+var __VLS_54;
+var __VLS_24;
+var __VLS_19;
+var __VLS_3;
+/** @type {__VLS_StyleScopedClasses['w-[180px]']} */ ;
+const __VLS_export = (await import('vue')).defineComponent({});
+export default {};