fix: selecting text with mouse closes modal - fixed #2195

packages/hoppscotch-app/components/app/Share.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="t('app.invite_your_friends')"
     @close="hideModal"
   >

packages/hoppscotch-app/components/app/Support.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="t('support.title')"
     max-width="sm:max-w-md"
     @close="$emit('hide-modal')"

packages/hoppscotch-app/components/collections/Add.vue

@@ -1,5 +1,10 @@
 <template>
-  <SmartModal v-if="show" :title="$t('collection.new')" @close="hideModal">
+  <SmartModal
+    v-if="show"
+    dialog
+    :title="$t('collection.new')"
+    @close="hideModal"
+  >
     <template #body>
       <div class="flex flex-col px-2">
         <input

packages/hoppscotch-app/components/collections/AddFolder.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="$t('folder.new')"
     @close="$emit('hide-modal')"
   >

packages/hoppscotch-app/components/collections/Edit.vue

@@ -1,5 +1,10 @@
 <template>
-  <SmartModal v-if="show" :title="$t('collection.edit')" @close="hideModal">
+  <SmartModal
+    v-if="show"
+    dialog
+    :title="$t('collection.edit')"
+    @close="hideModal"
+  >
     <template #body>
       <div class="flex flex-col px-2">
         <input

packages/hoppscotch-app/components/collections/EditFolder.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="$t('folder.edit')"
     @close="$emit('hide-modal')"
   >

packages/hoppscotch-app/components/collections/EditRequest.vue

@@ -1,5 +1,10 @@
 <template>
-  <SmartModal v-if="show" :title="$t('modal.edit_request')" @close="hideModal">
+  <SmartModal
+    v-if="show"
+    dialog
+    :title="$t('modal.edit_request')"
+    @close="hideModal"
+  >
     <template #body>
       <div class="flex flex-col px-2">
         <input

packages/hoppscotch-app/components/collections/ImportExport.vue

@@ -1,9 +1,9 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="`${t('modal.collections')}`"
     max-width="sm:max-w-md"
-    dialog
     @close="hideModal"
   >
     <template #actions>

packages/hoppscotch-app/components/collections/SaveRequest.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="`${t('collection.save_as')}`"
     @close="hideModal"
   >

packages/hoppscotch-app/components/collections/graphql/Add.vue

@@ -1,5 +1,10 @@
 <template>
-  <SmartModal v-if="show" :title="`${$t('collection.new')}`" @close="hideModal">
+  <SmartModal
+    v-if="show"
+    dialog
+    :title="`${$t('collection.new')}`"
+    @close="hideModal"
+  >
     <template #body>
       <div class="flex flex-col px-2">
         <input

packages/hoppscotch-app/components/collections/graphql/AddFolder.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="$t('folder.new')"
     @close="$emit('hide-modal')"
   >

packages/hoppscotch-app/components/collections/graphql/Edit.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="`${$t('collection.edit')}`"
     @close="hideModal"
   >

packages/hoppscotch-app/components/collections/graphql/EditFolder.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="`${$t('folder.edit')}`"
     @close="$emit('hide-modal')"
   >

packages/hoppscotch-app/components/collections/graphql/EditRequest.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="`${$t('modal.edit_request')}`"
     @close="hideModal"
   >

packages/hoppscotch-app/components/collections/graphql/ImportExport.vue

@@ -1,9 +1,9 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="`${t('modal.collections')}`"
     max-width="sm:max-w-md"
-    dialog
     @close="hideModal"
   >
     <template #actions>

packages/hoppscotch-app/components/environments/Details.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="$t(`environment.${action}`)"
     @close="hideModal"
   >

packages/hoppscotch-app/components/environments/ImportExport.vue

@@ -1,9 +1,9 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="`${t('environment.title')}`"
     max-width="sm:max-w-md"
-    dialog
     @close="hideModal"
   >
     <template #actions>

packages/hoppscotch-app/components/firebase/Login.vue

@@ -1,9 +1,9 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="`${$t('auth.login_to_hoppscotch')}`"
     max-width="sm:max-w-md"
-    dialog
     @close="hideModal"
   >
     <template #body>

packages/hoppscotch-app/components/http/CodegenModal.vue

@@ -1,6 +1,7 @@
 <template>
   <SmartModal
     v-if="show"
+    dialog
     :title="`${t('request.generate_code')}`"
     @close="hideModal"
   >

packages/hoppscotch-app/components/http/ImportCurl.vue

@@ -1,5 +1,10 @@
 <template>
-  <SmartModal v-if="show" :title="`${t('import.curl')}`" @close="hideModal">
+  <SmartModal
+    v-if="show"
+    dialog
+    :title="`${t('import.curl')}`"
+    @close="hideModal"
+  >
     <template #body>
       <div class="px-2 h-46">
         <div

packages/hoppscotch-app/components/teams/Add.vue

@@ -1,5 +1,5 @@
 <template>
-  <SmartModal v-if="show" :title="t('team.new')" @close="hideModal">
+  <SmartModal v-if="show" dialog :title="t('team.new')" @close="hideModal">
     <template #body>
       <div class="flex flex-col px-2">
         <input

packages/hoppscotch-app/components/teams/Edit.vue

@@ -1,5 +1,5 @@
 <template>
-  <SmartModal v-if="show" :title="t('team.edit')" @close="hideModal">
+  <SmartModal v-if="show" dialog :title="t('team.edit')" @close="hideModal">
     <template #body>
       <div class="flex flex-col px-2">
         <div class="relative flex">

packages/hoppscotch-app/components/teams/Invite.vue

@@ -1,5 +1,5 @@
 <template>
-  <SmartModal v-if="show" :title="t('team.invite')" @close="hideModal">
+  <SmartModal v-if="show" dialog :title="t('team.invite')" @close="hideModal">
     <template #body>
       <div v-if="sendInvitesResult.length" class="flex flex-col px-4">
         <div class="flex flex-col items-center justify-center max-w-md">

packages/hoppscotch-app/components/teams/Modal.vue

@@ -1,5 +1,10 @@
 <template>
-  <SmartModal v-if="show" :title="t('team.select_a_team')" @close="hideModal">
+  <SmartModal
+    v-if="show"
+    dialog
+    :title="t('team.select_a_team')"
+    @close="hideModal"
+  >
     <template #body>
       <Teams :modal="true" />
     </template>