@sowell/quasar-app-extension-auth 1.11.1 → 1.11.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sowell/quasar-app-extension-auth",
-  "version": "1.11.1",
+  "version": "1.11.2",
   "description": "A Quasar app extension to manage Authentication",
   "main": "src/index.js",
   "repository": "https://github.com/sowell-ai/quasar.extension.auth",

package/src/components/dialogs/SendEmail.vue

@@ -122,7 +122,7 @@
           </q-input>
         </div>
       </q-card-section>
-      <q-space class="mobile" />
+      <q-space v-if="!keyboardOpen" class="mobile" />
       <q-card-actions class="q-ml-lg q-mr-lg q-mb-lg row justify-center">
         <q-btn
           data-testid="submit-btn"
@@ -148,6 +148,7 @@
 import { computed, defineComponent, ref } from "vue"
 import { useI18n } from "vue-i18n"
 import prompts from "app/quasar.extensions.json"
+import { useKeyboardOpen } from "../../composables/useKeyboardOpen"
 import {
   ionMailOutline,
   ionPaperPlaneOutline,
@@ -182,6 +183,7 @@ export default defineComponent({
       "@sowell/auth": { USE_SSO },
     } = prompts
     const email = ref("")
+    const { keyboardOpen } = useKeyboardOpen()
     const sendEmail = () => {
       emit("resetPassword", email.value)
     }
@@ -203,6 +205,7 @@ export default defineComponent({
 
     return {
       email,
+      keyboardOpen,
       sendEmail,
       emit,
       USE_SSO,

package/src/composables/useKeyboardOpen.ts

@@ -0,0 +1,55 @@
+import { ref, onMounted, onBeforeUnmount } from "vue"
+
+// Ecart minimal (px CSS) entre la fenetre de mise en page et la zone visible
+// pour conclure qu'un clavier virtuel est ouvert. Les barres d'URL ou de
+// navigation qui se replient restent largement en dessous.
+export const KEYBOARD_GAP_THRESHOLD = 150
+
+interface ViewportHost {
+  innerHeight: number
+  visualViewport?: {
+    height: number
+    addEventListener: (type: "resize", listener: () => void) => void
+    removeEventListener: (type: "resize", listener: () => void) => void
+  } | null
+}
+
+// Android 15+ edge-to-edge (WebView >= 140) : le clavier ne reduit que
+// visualViewport, innerHeight reste inchange. Sur iOS (Keyboard.resize native)
+// ou Android classique la WebView entiere retrecit : l'ecart reste nul et on
+// ne detecte rien, la mise en page suit deja le clavier.
+export const isKeyboardOpen = (host: ViewportHost): boolean => {
+  const viewport = host.visualViewport
+  if (!viewport) return false
+  return host.innerHeight - viewport.height > KEYBOARD_GAP_THRESHOLD
+}
+
+// Appelle `onChange` a chaque variation de l'etat (et une fois a l'initialisation),
+// rend la fonction de nettoyage. Sans visualViewport : etat false, rien a ecouter.
+export const observeKeyboard = (
+  host: ViewportHost,
+  onChange: (open: boolean) => void
+): (() => void) => {
+  const update = () => onChange(isKeyboardOpen(host))
+  update()
+  const viewport = host.visualViewport
+  if (!viewport) return () => undefined
+  viewport.addEventListener("resize", update)
+  return () => viewport.removeEventListener("resize", update)
+}
+
+export const useKeyboardOpen = () => {
+  const keyboardOpen = ref(false)
+  let stop: (() => void) | undefined
+  onMounted(() => {
+    if (typeof window === "undefined") return
+    stop = observeKeyboard(window, (open) => {
+      keyboardOpen.value = open
+    })
+  })
+  onBeforeUnmount(() => {
+    stop?.()
+    stop = undefined
+  })
+  return { keyboardOpen }
+}