@phonghq/go-chat 1.0.29 → 1.0.31

package/dist/test/chat/page/home/Home.vue.js

@@ -20,6 +20,7 @@ const isLoading = ref(false);
 const infoUser = shallowRef(null);
 const listMessage = ref([]);
 const chatMessageRef = ref(null);
+const inputChatRef = ref(null);
 onMounted(() => { });
 onUnmounted(() => {
     handleDisconnectMqtt();
@@ -104,6 +105,7 @@ const getData = async (data) => {
     try {
         isLoading.value = true;
         listMessage.value = [];
+        inputChatRef.value?.clearInput();
         handleGetDetailReceiver(data);
         await Promise.allSettled([handleGetMessage({ resetList: true })]);
         // readMessages(infoUser.value?.conversation_id)
@@ -207,27 +209,35 @@ __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
 // @ts-ignore
 const __VLS_0 = __VLS_asFunctionalComponent(HomeHeader, new HomeHeader({
     ...{ 'onCall': {} },
+    ...{ 'onBack': {} },
     ...{ class: "shrink-0" },
     data: (__VLS_ctx.infoUser),
+    responsive: (__VLS_ctx.responsive),
 }));
 const __VLS_1 = __VLS_0({
     ...{ 'onCall': {} },
+    ...{ 'onBack': {} },
     ...{ class: "shrink-0" },
     data: (__VLS_ctx.infoUser),
+    responsive: (__VLS_ctx.responsive),
 }, ...__VLS_functionalComponentArgsRest(__VLS_0));
 let __VLS_3;
 let __VLS_4;
 const __VLS_5 = ({ call: {} },
     { onCall: (__VLS_ctx.call) });
-// @ts-ignore
-[infoUser, call,];
+const __VLS_6 = ({ back: {} },
+    { onBack: (...[$event]) => {
+            __VLS_ctx.emit('back');
+            // @ts-ignore
+            [infoUser, responsive, call, emit,];
+        } });
 var __VLS_2;
 if (__VLS_ctx.listMessage?.length) {
     // @ts-ignore
     [listMessage,];
     /** @type {[typeof ChatMessage, ]} */ ;
     // @ts-ignore
-    const __VLS_7 = __VLS_asFunctionalComponent(ChatMessage, new ChatMessage({
+    const __VLS_8 = __VLS_asFunctionalComponent(ChatMessage, new ChatMessage({
         ...{ 'onScrollTop': {} },
         ...{ 'onCallBack': {} },
         ref: "chatMessageRef",
@@ -237,7 +247,7 @@ if (__VLS_ctx.listMessage?.length) {
         responsive: (__VLS_ctx.responsive),
         showNewCustomer: (__VLS_ctx.page >= __VLS_ctx.pageCount),
     }));
-    const __VLS_8 = __VLS_7({
+    const __VLS_9 = __VLS_8({
         ...{ 'onScrollTop': {} },
         ...{ 'onCallBack': {} },
         ref: "chatMessageRef",
@@ -246,32 +256,32 @@ if (__VLS_ctx.listMessage?.length) {
         ...{ class: "grow" },
         responsive: (__VLS_ctx.responsive),
         showNewCustomer: (__VLS_ctx.page >= __VLS_ctx.pageCount),
-    }, ...__VLS_functionalComponentArgsRest(__VLS_7));
-    let __VLS_10;
+    }, ...__VLS_functionalComponentArgsRest(__VLS_8));
     let __VLS_11;
-    const __VLS_12 = ({ scrollTop: {} },
+    let __VLS_12;
+    const __VLS_13 = ({ scrollTop: {} },
         { onScrollTop: (__VLS_ctx.handleScrollTop) });
-    const __VLS_13 = ({ callBack: {} },
+    const __VLS_14 = ({ callBack: {} },
         { onCallBack: (__VLS_ctx.call) });
     /** @type {typeof __VLS_ctx.chatMessageRef} */ ;
-    var __VLS_14 = {};
+    var __VLS_15 = {};
     // @ts-ignore
-    [infoUser, call, reversedList, responsive, page, pageCount, handleScrollTop, chatMessageRef,];
-    var __VLS_9;
+    [infoUser, responsive, call, reversedList, page, pageCount, handleScrollTop, chatMessageRef,];
+    var __VLS_10;
 }
 else if (!__VLS_ctx.isLoading) {
     // @ts-ignore
     [isLoading,];
     /** @type {[typeof NewCustomer, ]} */ ;
     // @ts-ignore
-    const __VLS_17 = __VLS_asFunctionalComponent(NewCustomer, new NewCustomer({
+    const __VLS_18 = __VLS_asFunctionalComponent(NewCustomer, new NewCustomer({
         data: (__VLS_ctx.infoUser),
         ...{ class: "grow" },
     }));
-    const __VLS_18 = __VLS_17({
+    const __VLS_19 = __VLS_18({
         data: (__VLS_ctx.infoUser),
         ...{ class: "grow" },
-    }, ...__VLS_functionalComponentArgsRest(__VLS_17));
+    }, ...__VLS_functionalComponentArgsRest(__VLS_18));
     // @ts-ignore
     [infoUser,];
 }
@@ -282,29 +292,35 @@ else {
 }
 /** @type {[typeof InputChat, ]} */ ;
 // @ts-ignore
-const __VLS_21 = __VLS_asFunctionalComponent(InputChat, new InputChat({
+const __VLS_22 = __VLS_asFunctionalComponent(InputChat, new InputChat({
     ...{ 'onSendMessage': {} },
     ...{ 'onFocus': {} },
     data: (__VLS_ctx.infoUser),
+    ref: "inputChatRef",
     ...{ class: "p-6" },
 }));
-const __VLS_22 = __VLS_21({
+const __VLS_23 = __VLS_22({
     ...{ 'onSendMessage': {} },
     ...{ 'onFocus': {} },
     data: (__VLS_ctx.infoUser),
+    ref: "inputChatRef",
     ...{ class: "p-6" },
-}, ...__VLS_functionalComponentArgsRest(__VLS_21));
-let __VLS_24;
+}, ...__VLS_functionalComponentArgsRest(__VLS_22));
 let __VLS_25;
-const __VLS_26 = ({ sendMessage: {} },
+let __VLS_26;
+const __VLS_27 = ({ sendMessage: {} },
     { onSendMessage: (__VLS_ctx.handleSendMessage) });
-const __VLS_27 = ({ focus: {} },
+const __VLS_28 = ({ focus: {} },
     { onFocus: (...[$event]) => {
             __VLS_ctx.emit('inputFocus');
             // @ts-ignore
-            [infoUser, handleSendMessage, emit,];
+            [infoUser, emit, handleSendMessage,];
         } });
-var __VLS_23;
+/** @type {typeof __VLS_ctx.inputChatRef} */ ;
+var __VLS_29 = {};
+// @ts-ignore
+[inputChatRef,];
+var __VLS_24;
 /** @type {__VLS_StyleScopedClasses['h-full']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex-col']} */ ;
@@ -315,7 +331,7 @@ var __VLS_23;
 /** @type {__VLS_StyleScopedClasses['grow']} */ ;
 /** @type {__VLS_StyleScopedClasses['p-6']} */ ;
 // @ts-ignore
-var __VLS_15 = __VLS_14;
+var __VLS_16 = __VLS_15, __VLS_30 = __VLS_29;
 const __VLS_export = (await import('vue')).defineComponent({
     setup: () => (__VLS_exposed),
     __typeEmits: {},

package/dist/test/chat/page/home/HomeHeader.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 IconPhone from '../../../assets/icons/IconPhone.vue';
 import { PAGE } from '../../../constant/general';
 import Avatar from '../../../components/chat/customer/Avatar.vue';
@@ -5,6 +6,7 @@ import { routerPush } from '../../../utils/chat/chat-router';
 import { user } from '../../../utils/chat/user';
 import { dataProfile } from '../../../utils/chat/auth';
 import { digibotId } from '../../../composable/useDigibot';
+import IconArrowLeft from '../../../assets/icons/IconArrowLeft.vue';
 const props = withDefaults(defineProps(), {});
 const emit = defineEmits();
 const goToViewUser = () => {
@@ -31,41 +33,56 @@ __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
     ...{ class: "px-8 pb-4 border-b border-chat-gray-5" },
 });
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-    ...{ class: "flex items-center" },
+    ...{ class: "flex items-center gap-2" },
+});
+__VLS_asFunctionalElement(__VLS_elements.button, __VLS_elements.button)({
+    ...{ onClick: (...[$event]) => {
+            __VLS_ctx.emit('back');
+            // @ts-ignore
+            [emit,];
+        } },
+    ...{ class: "shrink-0 flex items-center" },
 });
+/** @type {[typeof IconArrowLeft, ]} */ ;
+// @ts-ignore
+const __VLS_0 = __VLS_asFunctionalComponent(IconArrowLeft, new IconArrowLeft({}));
+const __VLS_1 = __VLS_0({}, ...__VLS_functionalComponentArgsRest(__VLS_0));
 /** @type {[typeof Avatar, ]} */ ;
 // @ts-ignore
-const __VLS_0 = __VLS_asFunctionalComponent(Avatar, new Avatar({
+const __VLS_4 = __VLS_asFunctionalComponent(Avatar, new Avatar({
     ...{ 'onClick': {} },
+    ...{ class: "shrink-0" },
     ...{ class: ({ 'cursor-pointer': __VLS_ctx.dataProfile?.user_type == 'tenant' }) },
     src: (__VLS_ctx.data?.avatar ?? ''),
     id: (__VLS_ctx.data?.id ?? ''),
     color: (__VLS_ctx.data?.color),
     name: (__VLS_ctx.data?.username),
 }));
-const __VLS_1 = __VLS_0({
+const __VLS_5 = __VLS_4({
     ...{ 'onClick': {} },
+    ...{ class: "shrink-0" },
     ...{ class: ({ 'cursor-pointer': __VLS_ctx.dataProfile?.user_type == 'tenant' }) },
     src: (__VLS_ctx.data?.avatar ?? ''),
     id: (__VLS_ctx.data?.id ?? ''),
     color: (__VLS_ctx.data?.color),
     name: (__VLS_ctx.data?.username),
-}, ...__VLS_functionalComponentArgsRest(__VLS_0));
-let __VLS_3;
-let __VLS_4;
-const __VLS_5 = ({ click: {} },
+}, ...__VLS_functionalComponentArgsRest(__VLS_4));
+let __VLS_7;
+let __VLS_8;
+const __VLS_9 = ({ click: {} },
     { onClick: (__VLS_ctx.goToViewUser) });
 // @ts-ignore
 [dataProfile, data, data, data, data, goToViewUser,];
-var __VLS_2;
+var __VLS_6;
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-    ...{ class: "flex-1 ml-3" },
+    ...{ class: "grow overflow-x-hidden" },
 });
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-    ...{ class: "flex justify-between items-center" },
+    ...{ class: "w-full flex justify-between items-center gap-4" },
 });
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
     ...{ onClick: (__VLS_ctx.goToViewUser) },
+    ...{ class: "grow overflow-x-hidden" },
     ...{ class: ({ 'cursor-pointer': __VLS_ctx.dataProfile?.user_type == 'tenant' }) },
 });
 // @ts-ignore
@@ -74,7 +91,7 @@ __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
     ...{ class: "flex items-center" },
 });
 __VLS_asFunctionalElement(__VLS_elements.p, __VLS_elements.p)({
-    ...{ class: "font-semibold" },
+    ...{ class: "font-semibold truncate" },
 });
 (__VLS_ctx.data?.username ?? 'n/a');
 // @ts-ignore
@@ -90,12 +107,12 @@ if (__VLS_ctx.data?.id && __VLS_ctx.data?.id != __VLS_ctx.digibotId.toString() &
                 // @ts-ignore
                 [emit,];
             } },
-        ...{ class: "flex-center text-[#0051E6] bg-chat-haze-200 w-9 h-9 rounded-lg" },
+        ...{ class: "shrink-0 flex-center text-[#0051E6] bg-chat-haze-200 w-9 h-9 rounded-lg" },
     });
     /** @type {[typeof IconPhone, ]} */ ;
     // @ts-ignore
-    const __VLS_7 = __VLS_asFunctionalComponent(IconPhone, new IconPhone({}));
-    const __VLS_8 = __VLS_7({}, ...__VLS_functionalComponentArgsRest(__VLS_7));
+    const __VLS_11 = __VLS_asFunctionalComponent(IconPhone, new IconPhone({}));
+    const __VLS_12 = __VLS_11({}, ...__VLS_functionalComponentArgsRest(__VLS_11));
 }
 /** @type {__VLS_StyleScopedClasses['px-8']} */ ;
 /** @type {__VLS_StyleScopedClasses['pb-4']} */ ;
@@ -103,16 +120,27 @@ if (__VLS_ctx.data?.id && __VLS_ctx.data?.id != __VLS_ctx.digibotId.toString() &
 /** @type {__VLS_StyleScopedClasses['border-chat-gray-5']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['items-center']} */ ;
+/** @type {__VLS_StyleScopedClasses['gap-2']} */ ;
+/** @type {__VLS_StyleScopedClasses['shrink-0']} */ ;
+/** @type {__VLS_StyleScopedClasses['flex']} */ ;
+/** @type {__VLS_StyleScopedClasses['items-center']} */ ;
+/** @type {__VLS_StyleScopedClasses['shrink-0']} */ ;
 /** @type {__VLS_StyleScopedClasses['cursor-pointer']} */ ;
-/** @type {__VLS_StyleScopedClasses['flex-1']} */ ;
-/** @type {__VLS_StyleScopedClasses['ml-3']} */ ;
+/** @type {__VLS_StyleScopedClasses['grow']} */ ;
+/** @type {__VLS_StyleScopedClasses['overflow-x-hidden']} */ ;
+/** @type {__VLS_StyleScopedClasses['w-full']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['justify-between']} */ ;
 /** @type {__VLS_StyleScopedClasses['items-center']} */ ;
+/** @type {__VLS_StyleScopedClasses['gap-4']} */ ;
+/** @type {__VLS_StyleScopedClasses['grow']} */ ;
+/** @type {__VLS_StyleScopedClasses['overflow-x-hidden']} */ ;
 /** @type {__VLS_StyleScopedClasses['cursor-pointer']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['items-center']} */ ;
 /** @type {__VLS_StyleScopedClasses['font-semibold']} */ ;
+/** @type {__VLS_StyleScopedClasses['truncate']} */ ;
+/** @type {__VLS_StyleScopedClasses['shrink-0']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex-center']} */ ;
 /** @type {__VLS_StyleScopedClasses['text-[#0051E6]']} */ ;
 /** @type {__VLS_StyleScopedClasses['bg-chat-haze-200']} */ ;

package/dist/test/chat/page/home/InputChat.vue.js

@@ -2,6 +2,7 @@ import IconPlus from '../../../assets/icons/IconPlus.vue';
 import IconPlan from '../../../assets/icons/IconPlan.vue';
 import EmojiPicker from 'vue3-emoji-picker';
 import 'vue3-emoji-picker/css';
+import { useDebounce } from '../../../utils/debounce';
 import dayjs from 'dayjs';
 import { DATE_FORMATS, TIME_ZONE_UTC } from '../../../constant/datetime';
 import { dataProfile } from '../../../utils/chat/auth';
@@ -85,9 +86,22 @@ const handleActivePlivoSmsChange = async (is_active) => {
     }
     loading.value = false;
 };
+const setInputHeight = () => {
+    const el = chatInputRef.value;
+    el.style.height = 'auto';
+    el.style.height = el.scrollHeight + 'px';
+};
+const handleSetInputHeight = useDebounce(() => {
+    setInputHeight();
+}, 50);
 const handleInput = () => {
     emit('focus');
 };
+const clearInput = () => {
+    keyword.value = '';
+};
+const __VLS_exposed = { clearInput };
+defineExpose(__VLS_exposed);
 debugger; /* PartiallyEnd: #3632/scriptSetup.vue */
 const __VLS_modelEmit = defineEmits();
 const __VLS_defaults = {};
@@ -146,12 +160,12 @@ if (__VLS_ctx.dataProfile?.user_type == 'tenant') {
     }
 }
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-    ...{ class: "flex gap-2" },
+    ...{ class: "flex gap-2 items-end h-max" },
 });
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
     ...{ class: "relative grow" },
 });
-__VLS_asFunctionalElement(__VLS_elements.input)({
+__VLS_asFunctionalElement(__VLS_elements.textarea)({
     ...{ onKeydown: (...[$event]) => {
             __VLS_ctx.handleSendMessage('message');
             // @ts-ignore
@@ -162,16 +176,22 @@ __VLS_asFunctionalElement(__VLS_elements.input)({
             // @ts-ignore
             [handleInput,];
         } },
-    ...{ class: "w-full chat-input !rounded-xl h-11 px-4 border border-chat-haze-200" },
+    ...{ onInput: (...[$event]) => {
+            __VLS_ctx.setInputHeight();
+            // @ts-ignore
+            [setInputHeight,];
+        } },
+    ...{ class: "w-full min-h-11 resize-none overflow-hidden chat-input !rounded-xl pl-4 py-2 pr-[96px] border border-chat-haze-200" },
     ref: "chatInputRef",
     placeholder: "Send Message",
+    rows: "1",
+    value: (__VLS_ctx.keyword),
 });
-(__VLS_ctx.keyword);
 /** @type {typeof __VLS_ctx.chatInputRef} */ ;
 // @ts-ignore
 [keyword, chatInputRef,];
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-    ...{ class: "flex gap-2 absolute right-0 bottom-0" },
+    ...{ class: "flex gap-2 absolute right-0 bottom-2" },
 });
 /** @type {[typeof PopoverBase, typeof PopoverBase, ]} */ ;
 // @ts-ignore
@@ -226,32 +246,6 @@ __VLS_asFunctionalElement(__VLS_elements.button, __VLS_elements.button)({
     var __VLS_19;
 }
 var __VLS_13;
-const __VLS_24 = {}.EmojiPicker;
-/** @type {[typeof __VLS_components.EmojiPicker, typeof __VLS_components.emojiPicker, ]} */ ;
-// @ts-ignore
-EmojiPicker;
-// @ts-ignore
-const __VLS_25 = __VLS_asFunctionalComponent(__VLS_24, new __VLS_24({
-    ...{ 'onSelect': {} },
-    ...{ class: "opacity-0 pointer-events-none absolute" },
-    native: (true),
-    offset: (2),
-    hideSearch: true,
-}));
-const __VLS_26 = __VLS_25({
-    ...{ 'onSelect': {} },
-    ...{ class: "opacity-0 pointer-events-none absolute" },
-    native: (true),
-    offset: (2),
-    hideSearch: true,
-}, ...__VLS_functionalComponentArgsRest(__VLS_25));
-let __VLS_28;
-let __VLS_29;
-const __VLS_30 = ({ select: {} },
-    { onSelect: (__VLS_ctx.onSelectEmoji) });
-// @ts-ignore
-[onSelectEmoji,];
-var __VLS_27;
 __VLS_asFunctionalElement(__VLS_elements.button, __VLS_elements.button)({
     ...{ onClick: (...[$event]) => {
             __VLS_ctx.handleSendMessage('message');
@@ -262,10 +256,10 @@ __VLS_asFunctionalElement(__VLS_elements.button, __VLS_elements.button)({
 });
 /** @type {[typeof IconPlan, ]} */ ;
 // @ts-ignore
-const __VLS_32 = __VLS_asFunctionalComponent(IconPlan, new IconPlan({}));
-const __VLS_33 = __VLS_32({}, ...__VLS_functionalComponentArgsRest(__VLS_32));
+const __VLS_24 = __VLS_asFunctionalComponent(IconPlan, new IconPlan({}));
+const __VLS_25 = __VLS_24({}, ...__VLS_functionalComponentArgsRest(__VLS_24));
 __VLS_asFunctionalElement(__VLS_elements.label, __VLS_elements.label)({
-    ...{ class: "shrink-0 cursor-pointer relative" },
+    ...{ class: "shrink-0 cursor-pointer relative -translate-y-1" },
 });
 __VLS_asFunctionalElement(__VLS_elements.input)({
     ...{ onChange: (__VLS_ctx.handleFileUpload) },
@@ -282,43 +276,47 @@ __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
 });
 /** @type {[typeof IconPlus, ]} */ ;
 // @ts-ignore
-const __VLS_36 = __VLS_asFunctionalComponent(IconPlus, new IconPlus({
+const __VLS_28 = __VLS_asFunctionalComponent(IconPlus, new IconPlus({
     ...{ class: "text-white" },
 }));
-const __VLS_37 = __VLS_36({
+const __VLS_29 = __VLS_28({
     ...{ class: "text-white" },
-}, ...__VLS_functionalComponentArgsRest(__VLS_36));
+}, ...__VLS_functionalComponentArgsRest(__VLS_28));
 /** @type {__VLS_StyleScopedClasses['z-10']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['gap-2']} */ ;
 /** @type {__VLS_StyleScopedClasses['mb-2']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['gap-2']} */ ;
+/** @type {__VLS_StyleScopedClasses['items-end']} */ ;
+/** @type {__VLS_StyleScopedClasses['h-max']} */ ;
 /** @type {__VLS_StyleScopedClasses['relative']} */ ;
 /** @type {__VLS_StyleScopedClasses['grow']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-full']} */ ;
+/** @type {__VLS_StyleScopedClasses['min-h-11']} */ ;
+/** @type {__VLS_StyleScopedClasses['resize-none']} */ ;
+/** @type {__VLS_StyleScopedClasses['overflow-hidden']} */ ;
 /** @type {__VLS_StyleScopedClasses['chat-input']} */ ;
 /** @type {__VLS_StyleScopedClasses['!rounded-xl']} */ ;
-/** @type {__VLS_StyleScopedClasses['h-11']} */ ;
-/** @type {__VLS_StyleScopedClasses['px-4']} */ ;
+/** @type {__VLS_StyleScopedClasses['pl-4']} */ ;
+/** @type {__VLS_StyleScopedClasses['py-2']} */ ;
+/** @type {__VLS_StyleScopedClasses['pr-[96px]']} */ ;
 /** @type {__VLS_StyleScopedClasses['border']} */ ;
 /** @type {__VLS_StyleScopedClasses['border-chat-haze-200']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['gap-2']} */ ;
 /** @type {__VLS_StyleScopedClasses['absolute']} */ ;
 /** @type {__VLS_StyleScopedClasses['right-0']} */ ;
-/** @type {__VLS_StyleScopedClasses['bottom-0']} */ ;
+/** @type {__VLS_StyleScopedClasses['bottom-2']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-11']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-10']} */ ;
 /** @type {__VLS_StyleScopedClasses['!w-[300px]']} */ ;
-/** @type {__VLS_StyleScopedClasses['opacity-0']} */ ;
-/** @type {__VLS_StyleScopedClasses['pointer-events-none']} */ ;
-/** @type {__VLS_StyleScopedClasses['absolute']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-11']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-10']} */ ;
 /** @type {__VLS_StyleScopedClasses['shrink-0']} */ ;
 /** @type {__VLS_StyleScopedClasses['cursor-pointer']} */ ;
 /** @type {__VLS_StyleScopedClasses['relative']} */ ;
+/** @type {__VLS_StyleScopedClasses['-translate-y-1']} */ ;
 /** @type {__VLS_StyleScopedClasses['hidden']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-11']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-11']} */ ;
@@ -327,6 +325,7 @@ const __VLS_37 = __VLS_36({
 /** @type {__VLS_StyleScopedClasses['bg-[#002E6B]']} */ ;
 /** @type {__VLS_StyleScopedClasses['text-white']} */ ;
 const __VLS_export = (await import('vue')).defineComponent({
+    setup: () => (__VLS_exposed),
     __typeEmits: {},
     __typeProps: {},
     props: {},