@saasmakers/ui 2.0.42 → 2.0.44

package/app/composables/useKeyboardWarmup.ts

@@ -0,0 +1,44 @@
+// Always-mounted hidden input used to open the mobile keyboard within the user
+// gesture, before any async work (network create) breaks user activation.
+// Kept at module scope so every consumer shares the same singleton input.
+let warmupInput: HTMLInputElement | undefined
+
+export default function useKeyboardWarmup() {
+  const { isDesktopBrowser } = useDevice()
+
+  function ensureWarmupInput() {
+    if (!import.meta.client || warmupInput) {
+      return
+    }
+
+    const input = document.createElement('input')
+
+    input.type = 'text'
+    input.tabIndex = -1
+
+    input.setAttribute('aria-hidden', 'true')
+
+    input.style.cssText = 'position:fixed;top:0;left:0;height:1px;width:1px;opacity:0;pointer-events:none;'
+
+    document.body.appendChild(input)
+
+    warmupInput = input
+  }
+
+  // Must run synchronously inside a user gesture. Focusing a real text input
+  // raises the on-screen keyboard; a later text-to-text focus move (to the
+  // profile name field) keeps it open without needing a fresh gesture.
+  function focusWarmupInput() {
+    if (isDesktopBrowser.value) {
+      return
+    }
+
+    ensureWarmupInput()
+    warmupInput?.focus()
+  }
+
+  return {
+    ensureWarmupInput,
+    focusWarmupInput,
+  }
+}

package/app/composables/useToasts.ts

@@ -19,6 +19,7 @@ export default function useToast() {
 
   const createToast = (params: {
     action?: BaseToastAction
+    durationMs?: number
     emoji?: string
     i18nParams?: Record<string, number | string>
     message: string
@@ -56,7 +57,10 @@ export default function useToast() {
         existingToast.action = params.action
       }
 
-      scheduleDismiss(existingToast.id, !!existingToast.action)
+      scheduleDismiss(existingToast.id, {
+        durationMs: params.durationMs,
+        hasAction: !!existingToast.action,
+      })
 
       return
     }
@@ -70,7 +74,10 @@ export default function useToast() {
     }
 
     toasts.value.push(toast)
-    scheduleDismiss(toast.id, !!params.action)
+    scheduleDismiss(toast.id, {
+      durationMs: params.durationMs,
+      hasAction: !!params.action,
+    })
   }
 
   return {
@@ -123,10 +130,24 @@ function getFingerprint(params: {
   return parts.join(':')
 }
 
-function scheduleDismiss(toastId: string, hasAction: boolean) {
+function getDismissDuration(params: {
+  durationMs?: number
+  hasAction: boolean
+}): number {
+  if (params.durationMs !== undefined) {
+    return params.durationMs
+  }
+
+  return (params.hasAction ? 8 : 5) * 1000
+}
+
+function scheduleDismiss(toastId: string, params: {
+  durationMs?: number
+  hasAction: boolean
+}) {
   clearDismissTimer(toastId)
 
-  const duration = (hasAction ? 8 : 5) * 1000
+  const duration = getDismissDuration(params)
   const timer = setTimeout(() => closeToast(toastId), duration)
 
   dismissTimers.set(toastId, timer)

package/nuxt.config.ts

@@ -140,11 +140,6 @@ export default defineNuxtConfig({
   },
 
   unocss: {
-    nuxtLayers: true,
-    presets: uno.presets,
-    rules: uno.rules,
-    shortcuts: uno.shortcuts,
-    theme: uno.theme,
     content: {
       // Force consumers to scan layer classes even when resolved from node_modules,
       // otherwise transition utilities used only here are purged during their prod build.
@@ -152,5 +147,10 @@ export default defineNuxtConfig({
         path.join(currentDir, 'app/**/*.{vue,ts}'),
       ],
     },
+    nuxtLayers: true,
+    presets: uno.presets,
+    rules: uno.rules,
+    shortcuts: uno.shortcuts,
+    theme: uno.theme,
   },
 })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saasmakers/ui",
-  "version": "2.0.42",
+  "version": "2.0.44",
   "private": false,
   "description": "Reusable Nuxt UI components for SaaS Makers projects",
   "license": "MIT",