@dargmuesli/nuxt-vio 10.0.0 → 10.0.2

package/components/vio/_/VioError.vue

@@ -12,7 +12,7 @@
 </template>
 
 <script setup lang="ts">
-import { status } from '@http-util/status-i18n'
+const httpUtilStatusI18n = await import('@http-util/status-i18n')
 
 interface Props {
   statusCode?: number
@@ -31,7 +31,7 @@ const { locale, t } = useI18n()
 
 // data
 const title = `${props.statusCode ? `${props.statusCode} - ` : ''}${
-  status(props.statusCode, locale.value) || t('error')
+  httpUtilStatusI18n.status(props.statusCode, locale.value) || t('error')
 }`
 
 // initialization

package/composables/usePolyfills.ts

@@ -1,6 +1,8 @@
 import { POLYFILLS } from '../utils/constants'
 
 export const usePolyfills = () => {
+  if (!POLYFILLS.length) return
+
   const polyfillsUrl = `https://polyfill.io/v3/polyfill.min.js?features=${POLYFILLS.join(
     '%2C',
   )}&flags=gated`

package/nuxt.config.ts

@@ -186,7 +186,7 @@ export default defineNuxtConfig(
               // Cloudflare
               ...(process.env.NODE_ENV === 'production'
                 ? {
-                    'connect-src': ["'self'"], // `${SITE_URL}/cdn-cgi/rum`
+                    'connect-src': ['https://cloudflareinsights.com'],
                     'script-src': ['https://static.cloudflareinsights.com'], // TODO: replace with `script-src-elem` once Webkit supports it (https://caniuse.com/mdn-http_headers_content-security-policy_script-src-elem)
                   }
                 : {}),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dargmuesli/nuxt-vio",
-  "version": "10.0.0",
+  "version": "10.0.2",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/dargmuesli/vio.git"
@@ -12,7 +12,7 @@
   "engines": {
     "node": "20"
   },
-  "packageManager": "pnpm@8.12.0",
+  "packageManager": "pnpm@8.14.0",
   "files": [
     "assets",
     "components",
@@ -34,28 +34,28 @@
   ],
   "main": "nuxt.config.ts",
   "dependencies": {
-    "@dargmuesli/nuxt-cookie-control": "7.2.0",
-    "@heroicons/vue": "2.0.18",
+    "@dargmuesli/nuxt-cookie-control": "7.2.2",
+    "@heroicons/vue": "2.1.1",
     "@http-util/status-i18n": "0.8.1",
-    "@nuxt/devtools": "1.0.5",
+    "@nuxt/devtools": "1.0.6",
     "@nuxt/image": "1.1.0",
     "@nuxtjs/color-mode": "3.3.2",
     "@nuxtjs/html-validator": "1.6.0",
-    "@nuxtjs/i18n": "8.0.0-rc.9",
-    "@nuxtjs/tailwindcss": "6.10.1",
-    "@nuxtseo/module": "2.0.0-beta.50",
+    "@nuxtjs/i18n": "8.0.0",
+    "@nuxtjs/tailwindcss": "6.10.3",
+    "@nuxtseo/module": "2.0.0-beta.55",
     "@pinia/nuxt": "0.5.1",
     "@tailwindcss/forms": "0.5.7",
     "@tailwindcss/typography": "0.5.10",
     "@types/lodash-es": "4.17.12",
-    "@urql/core": "4.2.1",
+    "@urql/core": "4.2.2",
     "@vuelidate/core": "2.0.3",
     "@vuelidate/validators": "2.0.4",
     "clipboardy": "4.0.0",
     "dayjs": "2.0.0-alpha.4",
-    "jose": "5.1.3",
-    "nuxt-security": "1.0.0-rc.5",
-    "sweetalert2": "11.10.1",
+    "jose": "5.2.0",
+    "nuxt-security": "1.0.0",
+    "sweetalert2": "11.10.2",
     "vue-gtag": "2.0.1"
   },
   "devDependencies": {
@@ -70,37 +70,37 @@
     "consola": "3.2.3",
     "cookie-es": "1.0.0",
     "cross-env": "7.0.3",
-    "defu": "6.1.3",
-    "eslint": "8.55.0",
+    "defu": "6.1.4",
+    "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-plugin-compat": "4.2.0",
     "eslint-plugin-nuxt": "4.0.0",
-    "eslint-plugin-prettier": "5.0.1",
-    "eslint-plugin-yml": "1.10.0",
-    "h3": "1.9.0",
+    "eslint-plugin-prettier": "5.1.2",
+    "eslint-plugin-yml": "1.11.0",
+    "h3": "1.10.0",
     "jiti": "1.21.0",
     "lint-staged": "15.2.0",
     "lodash-es": "4.17.21",
-    "nuxt": "3.8.2",
+    "nuxt": "3.9.1",
     "pinia": "2.1.7",
     "prettier": "3.1.1",
-    "prettier-plugin-tailwindcss": "0.5.9",
+    "prettier-plugin-tailwindcss": "0.5.10",
     "serve": "14.2.1",
-    "stylelint": "16.0.2",
+    "stylelint": "16.1.0",
     "stylelint-config-recommended-vue": "1.5.0",
-    "stylelint-config-standard": "35.0.0",
-    "stylelint-no-unsupported-browser-features": "7.0.0",
-    "tailwindcss": "3.3.6",
+    "stylelint-config-standard": "36.0.0",
+    "stylelint-no-unsupported-browser-features": "8.0.0",
+    "tailwindcss": "3.4.1",
     "ufo": "1.3.2",
     "unhead": "1.8.9",
-    "vue": "3.3.11",
+    "vue": "3.4.5",
     "vue-router": "4.2.5",
-    "vue-tsc": "1.8.25"
+    "vue-tsc": "1.8.27"
   },
   "peerDependencies": {
-    "nuxt": "3.8.2",
+    "nuxt": "3.9.1",
     "playwright-core": "1.40.1",
-    "vue": "3.3.11",
+    "vue": "3.4.5",
     "vue-router": "4.2.5"
   },
   "scripts": {

package/plugins/dayjs.ts

@@ -1,16 +1,16 @@
-import dayjs from 'dayjs'
+export default defineNuxtPlugin(async (_nuxtApp) => {
+  const dayjs = (await import('dayjs')).default
 
-// workaround for [1]
-import de from 'dayjs/locale/de'
-// import 'dayjs/locale/de' does not make locale available
+  // workaround for [1]
+  const de = (await import('dayjs/locale/de')).default
+  // import 'dayjs/locale/de' does not make locale available
 
-import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'
-import localizedFormat from 'dayjs/plugin/localizedFormat'
-import relativeTime from 'dayjs/plugin/relativeTime'
-import timezone from 'dayjs/plugin/timezone'
-import utc from 'dayjs/plugin/utc'
+  const isSameOrBefore = (await import('dayjs/plugin/isSameOrBefore')).default
+  const localizedFormat = (await import('dayjs/plugin/localizedFormat')).default
+  const relativeTime = (await import('dayjs/plugin/relativeTime')).default
+  const timezone = (await import('dayjs/plugin/timezone')).default
+  const utc = (await import('dayjs/plugin/utc')).default
 
-export default defineNuxtPlugin((_nuxtApp) => {
   dayjs.extend(isSameOrBefore)
   dayjs.extend(localizedFormat)
   dayjs.extend(relativeTime)

package/plugins/gtag.client.ts

@@ -1,10 +1,10 @@
-import VueGtag from 'vue-gtag'
-
-export default defineNuxtPlugin((nuxtApp) => {
+export default defineNuxtPlugin(async (nuxtApp) => {
   const config = useRuntimeConfig()
   const router = useRouter()
   const cookieControl = useCookieControl()
 
+  const VueGtag = (await import('vue-gtag')).default
+
   nuxtApp.vueApp.use(
     VueGtag,
     {

package/utils/auth.ts

@@ -6,7 +6,6 @@ import { decodeJwt } from 'jose'
 import type { Store } from 'pinia'
 
 import { useVioAuthStore } from '../store/auth'
-import { xhrPromise } from '../utils/networking'
 import { JWT_NAME } from './constants'
 
 export const getJwtFromCookie = ({ req }: { req: IncomingMessage }) => {
@@ -61,7 +60,10 @@ export const jwtStore = async ({
     )
   } else {
     try {
-      await xhrPromise('POST', '/api/auth', jwt || '')
+      await $fetch('/api/auth', {
+        method: 'POST',
+        ...(jwt ? { headers: { Authorization: `Bearer ${jwt}` } } : {}),
+      })
     } catch (error: any) {
       return Promise.reject(Error('Authentication api call failed.'))
     }

package/utils/constants.ts

@@ -37,7 +37,9 @@ export const I18N_VUE_CONFIG = {
 }
 export const JWT_NAME = () =>
   `${process.env.NODE_ENV === 'production' ? '__Secure-' : ''}jwt`
-export const POLYFILLS = ['Promise']
+export const POLYFILLS = [
+  // 'Promise', // op_mini
+]
 export const REGEX_UUID =
   /^[a-z0-9]{8}-[a-z0-9]{4}-[a-z0-9]{4}-[a-z0-9]{4}-[a-z0-9]{12}$/
 export const TIMEZONE_COOKIE_NAME = [COOKIE_PREFIX, 'tz'].join(COOKIE_SEPARATOR)

package/utils/form.ts

@@ -1,12 +1,13 @@
+import type { Validation } from '@vuelidate/core'
 import { consola } from 'consola'
 
 export const isFormValid = async ({
   v$,
   isFormSent,
 }: {
-  v$: any
+  v$: Ref<Validation>
   isFormSent: Ref<boolean>
-}): Promise<boolean> => {
+}) => {
   v$.value.$touch()
 
   const isValid = await v$.value.$validate()

package/utils/networking.ts

@@ -129,25 +129,3 @@ export const getTimezone = async (event: H3Event) => {
 
   return undefined
 }
-
-// TODO: use fetch
-export const xhrPromise = (method: string, url: string, jwt: string) =>
-  new Promise((resolve, reject) => {
-    const xhr = new XMLHttpRequest()
-    xhr.open(method, url)
-
-    if (jwt) {
-      xhr.setRequestHeader('Authorization', 'Bearer ' + jwt)
-    }
-
-    xhr.onload = () => {
-      if (xhr.status >= 200 && xhr.status < 300) {
-        resolve(xhr.response)
-      } else {
-        reject(new Error(`${xhr.status}\n${xhr.statusText}`))
-      }
-    }
-    xhr.onerror = () => reject(new Error(`${xhr.status}\n${xhr.statusText}`))
-
-    xhr.send()
-  })