@vesperjs/nuxt 0.1.0

package/README.md

@@ -0,0 +1,3 @@
+# Vesper Nuxt Layer
+
+This is Vesper for Nuxt.

package/app/composables/backend/api/create-fetch.ts

@@ -0,0 +1,3 @@
+export const createFetch = () => {
+  return $fetch.create({})
+}

package/app/composables/backend/api/create-request-fetch.ts

@@ -0,0 +1,5 @@
+import { useRequestFetch } from 'nuxt/app'
+
+export const createRequestFetch = () => {
+  return useRequestFetch()
+}

package/app/composables/backend/api/index.ts

@@ -0,0 +1,7 @@
+export type { QueryAPIOptions } from './use-query-api'
+
+export { createFetch } from './create-fetch'
+export { createRequestFetch } from './create-request-fetch'
+export { useOFetch } from './use-ofetch'
+export { useQueryApi } from './use-query-api'
+export { useMutationApi } from './use-mutation-api'

package/app/composables/backend/api/use-api-constants.ts

@@ -0,0 +1,21 @@
+import { useRuntimeConfig } from 'nuxt/app'
+
+import { computed } from '@vue/reactivity'
+
+export const useApiConstants = () => {
+  const runtimeConfig = useRuntimeConfig()
+
+  const baseOrigin = computed<string | undefined>(() => {
+    if (import.meta.client) {
+      return runtimeConfig.public.backendApiOrigin as string
+    } else if (import.meta.server) {
+      return runtimeConfig.backendApiOrigin as string
+    }
+  })
+
+  const basePath = runtimeConfig.public.backendApiPath as string
+
+  const baseURL = computed<string>(() => `${baseOrigin.value}${basePath}`)
+
+  return { baseURL }
+}

package/app/composables/backend/api/use-http-headers.ts

@@ -0,0 +1,18 @@
+import { computed, type Ref } from '@vue/reactivity'
+
+import { useLocale } from '../../use-locale'
+import { useTimeZone } from '../../use-time-zone'
+
+export const useHttpHeaders = () => {
+  const { locale } = useLocale()
+  const { timeZone } = useTimeZone()
+
+  const commonHeaders: Ref<Record<string, string>> = computed(() => ({
+    'X-Requested-With': 'XMLHttpRequest',
+    Accept: 'application/json',
+    'Accept-Language': locale.value,
+    'Time-Zone': timeZone.value.client,
+  }))
+
+  return { commonHeaders }
+}

package/app/composables/backend/api/use-mutation-api.ts

@@ -0,0 +1,64 @@
+import type { FetchOptions, FetchError, FetchResponse } from 'ofetch'
+
+import { useHttpHeaders } from './use-http-headers'
+import { useApiConstants } from './use-api-constants'
+import { useOFetch } from './use-ofetch'
+
+interface MutationAPIOptions {
+  method: 'post' | 'put' | 'delete'
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  body?: Record<string, any> | FormData
+  token?: string | null
+  onRequestError?: ({ error }: { error: Error }) => void
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  onResponseError?: ({ response }: { response: FetchResponse<any> }) => void
+}
+
+// eslint-disable-next-line
+export const useMutationApi = async <T = unknown, E = any>(
+  url: string,
+  { method, body = {}, token = null, onRequestError, onResponseError }: MutationAPIOptions,
+): Promise<{
+  token: string | undefined
+  data: T | undefined
+  error: FetchError<E> | undefined
+  pending: boolean
+}> => {
+  const { commonHeaders } = useHttpHeaders()
+  const { baseURL } = useApiConstants()
+
+  const headers: Record<string, string> = commonHeaders.value
+
+  const tokenRef = ref<string>()
+
+  if (token) {
+    headers.Authorization = `Bearer ${token}`
+    tokenRef.value = token
+  }
+
+  const options: FetchOptions<'json'> = {
+    baseURL: baseURL.value,
+    headers,
+    method,
+  }
+
+  if (onRequestError) {
+    options.onRequestError = onRequestError
+  }
+
+  if (onResponseError) {
+    options.onResponseError = onResponseError
+  }
+
+  if (method == 'post' || method == 'put') {
+    options.body = body
+    options.onResponse = ({ response }: { response: FetchResponse<T> }) => {
+      if ((method == 'post' && !tokenRef.value) || method == 'put')
+        tokenRef.value = response.headers.get('Authorization')?.split(' ')[1]
+    }
+  }
+
+  const { data, error, pending } = await useOFetch<T, E>(url, options)
+
+  return { token: tokenRef.value, data, error, pending }
+}

package/app/composables/backend/api/use-ofetch.ts

@@ -0,0 +1,24 @@
+import type { $Fetch, FetchOptions, FetchError } from 'ofetch'
+
+// eslint-disable-next-line
+export const useOFetch = async <T = unknown, E = any>(
+  url: string,
+  options?: FetchOptions<'json'>,
+) => {
+  const { $api } = useNuxtApp()
+
+  const pending = ref<boolean>(true)
+
+  const data = ref<T>()
+  const error = ref<FetchError<E>>()
+
+  try {
+    data.value = await ($api as $Fetch)<T>(url, options)
+  } catch (err: unknown) {
+    error.value = err as FetchError<E>
+  }
+
+  pending.value = false
+
+  return { data: data.value, error: error.value, pending: pending.value }
+}

package/app/composables/backend/api/use-query-api.ts

@@ -0,0 +1,93 @@
+import { useAsyncData, useNuxtApp } from 'nuxt/app'
+
+import type { FetchOptions, FetchResponse } from 'ofetch'
+
+import { ref } from '@vue/reactivity'
+
+import { useHttpHeaders } from './use-http-headers'
+import { useApiConstants } from './use-api-constants'
+import { useOFetch } from './use-ofetch'
+
+interface SearchParams {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  [key: string]: any
+}
+
+export type QueryAPIOptions = {
+  key?: MaybeRefOrGetter<string>
+  query?: SearchParams
+  token?: string | null
+  signal?: AbortSignal
+  onRequestError?: ({ error }: { error: Error }) => void
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  onResponseError?: ({ response }: { response: FetchResponse<any> }) => void
+  fresh?: boolean
+  cache?: boolean
+}
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export const useQueryApi = async <T = unknown, E = any>(url: string, options?: QueryAPIOptions) => {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const { $api } = useNuxtApp() as any
+  const { commonHeaders } = useHttpHeaders()
+  const { baseURL } = useApiConstants()
+
+  const key = options?.key ?? url
+
+  const tokenRef = ref<string>()
+
+  const headers: Record<string, string> = commonHeaders.value
+
+  const fresh: boolean = options?.fresh ?? false
+  const cache: boolean = options?.cache ?? true
+
+  if (options?.token) {
+    headers.Authorization = `Bearer ${options.token}`
+    tokenRef.value = options.token
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const getOptions: FetchOptions<'json', any> = {
+    baseURL: baseURL.value,
+    method: 'get',
+    query: options?.query ?? {},
+    headers,
+    onResponse({ response }: { response: FetchResponse<T> }) {
+      if (!tokenRef.value) tokenRef.value = response.headers.get('Authorization')?.split(' ')[1]
+    },
+  }
+
+  if (options?.signal) {
+    getOptions.signal = options.signal
+  }
+
+  if (options?.onRequestError) {
+    getOptions.onRequestError = options.onRequestError
+  }
+
+  if (options?.onResponseError) {
+    getOptions.onResponseError = options.onResponseError
+  }
+
+  if (cache) {
+    const { data, error, refresh, pending } = await useAsyncData<T, E>(key, () =>
+      $api(url, getOptions),
+    )
+
+    if (fresh) {
+      await refresh()
+    }
+
+    return {
+      token: tokenRef.value,
+      data: data.value,
+      error: error.value,
+      refresh,
+      pending: pending.value,
+    }
+  } else {
+    const { data, error, pending } = await useOFetch<T, E>(url, getOptions)
+
+    return { token: tokenRef.value, data, error, pending }
+  }
+}

package/app/composables/backend/error/index.ts

@@ -0,0 +1,2 @@
+export { useExternalErrors } from './use-external-errors'
+export { useBackendErrorInfo } from './use-backend-error-info'

package/app/composables/backend/error/use-backend-error-info.ts

@@ -0,0 +1,15 @@
+import type { BackendErrorInfo } from '../../../../interfaces'
+
+export function useBackendErrorInfo<R extends object>() {
+  const info = ref<BackendErrorInfo<R>>({})
+
+  const backendErrorInfo = computed<BackendErrorInfo<R>>(() => {
+    return info.value as BackendErrorInfo<R>
+  })
+
+  const clearBackendErrorInfo = (): void => {
+    info.value = {}
+  }
+
+  return { backendErrorInfo, clearBackendErrorInfo }
+}

package/app/composables/backend/error/use-external-errors.ts

@@ -0,0 +1,42 @@
+import type { Flash } from '../../../../interfaces'
+import type { ErrorMessages } from '../../../../types'
+
+export function useExternalErrors<P extends string>({ flash }: { flash: Ref<Flash> }) {
+  const errors = ref<ErrorMessages<P>>({})
+
+  const externalErrors = computed<ErrorMessages<P>>({
+    get() {
+      return errors.value as ErrorMessages<string>
+    },
+    set(value: ErrorMessages<P>) {
+      if (errors.value) {
+        for (const key in value) {
+          ;(errors.value as ErrorMessages<P>)[key] = value[key] ?? []
+        }
+      }
+    },
+  })
+
+  const clearExternalErrors = (): void => {
+    externalErrors.value = {}
+  }
+
+  const isSuccess = (): boolean => {
+    let result = true
+
+    for (const key in errors.value) {
+      const error = errors.value as ErrorMessages<string>
+      if ((error[key] as string[]).length > 0) result = false
+    }
+
+    if (flash.value.alert) result = false
+
+    return result
+  }
+
+  return {
+    externalErrors,
+    clearExternalErrors,
+    isSuccess,
+  }
+}

package/app/composables/backend/index.ts

@@ -0,0 +1,8 @@
+export type { QueryAPIOptions } from './api'
+
+export { createFetch, createRequestFetch, useOFetch, useMutationApi, useQueryApi } from './api'
+
+export { useAlert } from './use-alert'
+export { useExternalErrors } from './error'
+
+export type { UseAlertType } from './use-alert'

package/app/composables/backend/use-alert.ts

@@ -0,0 +1,94 @@
+import { useNuxtApp } from 'nuxt/app'
+
+import type { FetchError } from 'ofetch'
+import type { NuxtError } from 'nuxt/app'
+
+import type { Ref } from '@vue/reactivity'
+
+import type {
+  ErrorsResource,
+  BackendErrorInfo,
+  BackendErrorResource,
+  Flash,
+} from '../../../interfaces'
+import type { ErrorMessages } from '../../../types'
+
+import { useBackendErrorInfo } from './error'
+
+interface UseAlertOptions {
+  flash: Ref<Flash>
+  caller?: UseAlertCallerType
+}
+
+interface UseAlertCallerType {
+  externalErrors?: Ref<ErrorMessages<string>>
+  clearAccount?: () => void
+}
+
+export function useAlert<BER extends object = BackendErrorResource>({
+  flash,
+  caller,
+}: UseAlertOptions): {
+  backendErrorInfo: Ref<BackendErrorInfo<BER>, BER>
+  setError: (
+    error:
+      | NuxtError<ErrorsResource<ErrorMessages<string>> | BER>
+      | FetchError<ErrorsResource<ErrorMessages<string>> | BER>,
+    options?: {
+      off?: boolean
+    },
+  ) => void
+} {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const { $i18n } = useNuxtApp() as any
+  const { backendErrorInfo, clearBackendErrorInfo } = useBackendErrorInfo<BER>()
+
+  const setError = function (
+    error:
+      | NuxtError<ErrorsResource<ErrorMessages<string>> | BER>
+      | FetchError<ErrorsResource<ErrorMessages<string>> | BER>,
+    options?: { off?: boolean },
+  ): void {
+    const off = options?.off ?? false
+
+    clearBackendErrorInfo()
+    backendErrorInfo.value.status = error.status
+    if (off) {
+      switch (error.status) {
+        case 401:
+          // flash.value.alert = $i18n.t('backend.error.login')
+          if (caller && 'clearAccount' in caller && caller.clearAccount) caller.clearAccount()
+          break
+        // default:
+        //  flash.value.alert = $i18n.t('backend.error.api', { message: error.message })
+      }
+    } else {
+      switch (error.status) {
+        case 401:
+          flash.value.alert = $i18n.t('backend.error.login')
+          if (caller && 'clearAccount' in caller && caller.clearAccount) caller.clearAccount()
+          break
+        case 404:
+          {
+            const backendError = error.data as BER
+            backendErrorInfo.value.error = backendError
+          }
+          break
+        case 422: {
+          if (caller && 'externalErrors' in caller && caller.externalErrors && error.data) {
+            const { errors } = error.data as ErrorsResource<ErrorMessages<string>>
+            // globalThis.console.log(errors)
+            caller.externalErrors.value = errors
+          }
+          break
+        }
+        default:
+          flash.value.alert = $i18n.t('backend.error.api', { message: error.message })
+      }
+    }
+  }
+
+  return { backendErrorInfo, setError }
+}
+
+export type UseAlertType = ReturnType<typeof useAlert>

package/app/composables/index.ts

@@ -0,0 +1,8 @@
+export type { QueryAPIOptions } from './backend'
+
+export { createFetch, createRequestFetch, useOFetch, useMutationApi, useQueryApi } from './backend'
+export { useExternalErrors, useAlert } from './backend'
+
+export { useDate } from './util'
+
+export type { UseAlertType } from './backend'

package/app/composables/use-datetime-local.ts

@@ -0,0 +1,35 @@
+import { parse, format } from '@formkit/tempo'
+
+import { useLocale } from './use-locale'
+
+export const useDatetimeLocal = () => {
+  const { locale } = useLocale()
+
+  const parseDT = (datetime: string, format: string): Date => {
+    return parse(datetime, format, locale.value)
+  }
+
+  const toISO8601 = (datetime: string): string => {
+    return format(parseDT(datetime, 'YYYY/MM/DD HH:mm'), 'YYYY-MM-DDTHH:mm', locale.value)
+  }
+
+  const fromISO8601 = (datetime: string): string => {
+    return format(parseDT(datetime, 'YYYY-MM-DDTHH:mm'), 'YYYY/MM/DD HH:mm', locale.value)
+  }
+
+  const upDTL = (datetime: string | null): string | null => {
+    return datetime ? toISO8601(datetime) : null
+  }
+
+  const downDTL = (datetime: string | null): string => {
+    return datetime ? fromISO8601(datetime) : ''
+  }
+
+  const formatHTML = (datetime: string | null, fmt: string): string => {
+    return datetime
+      ? format(parse(datetime, 'YYYY/MM/DD HH:mm', locale.value), fmt, locale.value)
+      : ''
+  }
+
+  return { upDTL, downDTL, toISO8601, formatHTML }
+}

package/app/composables/use-entity.ts

@@ -0,0 +1,13 @@
+export function useEntity<M extends object, R extends object>() {
+  const create = ({ from }: { from: R }): M => {
+    const model: Partial<M> = {}
+    Object.assign(model, from)
+    return model as M
+  }
+
+  const copy = ({ from, to }: { from: R | M; to: M }): void => {
+    Object.assign(to, from)
+  }
+
+  return { create, copy }
+}

package/app/composables/use-flash.ts

@@ -0,0 +1,15 @@
+import type { Flash } from '../../interfaces'
+
+import { ref } from 'vue'
+
+export function useFlash() {
+  const flash = ref<Flash>({})
+
+  const clearFlash = (): void => {
+    flash.value = {}
+  }
+
+  return { flash, clearFlash }
+}
+
+export type UseFlashType = ReturnType<typeof useFlash>

package/app/composables/use-locale.ts

@@ -0,0 +1,23 @@
+import { useNuxtApp } from 'nuxt/app'
+import { useBrowserLocale } from '#i18n'
+
+export const useLocale = () => {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const { $i18n } = useNuxtApp() as any
+  const { locale, availableLocales, fallbackLocale } = $i18n
+  const autoDetect = (): void => {
+    const browserLocale: string | null = useBrowserLocale()
+    // console.log(browserLocale)
+    // console.log(locales.value)
+
+    type AvailableLocales = (typeof $i18n.availableLocales)[number]
+
+    locale.value = (
+      (availableLocales as string[]).includes(browserLocale ?? '')
+        ? browserLocale
+        : fallbackLocale.value
+    ) as AvailableLocales
+  }
+
+  return { locale, autoDetect }
+}

package/app/composables/use-more-scroll.ts

@@ -0,0 +1,70 @@
+import { useState } from 'nuxt/app'
+
+export function useMoreScroll({
+  key = null,
+  page,
+  pages,
+}: {
+  key?: string | null
+  page: number
+  pages: number
+}) {
+  const toFirstUpper = (str: string): string => {
+    return str.charAt(0).toUpperCase() + str.slice(1)
+  }
+
+  const currentPage = useState<number>(
+    key ? `currentPageFor${toFirstUpper(key)}` : 'currentPage',
+    () => {
+      return 1
+    },
+  )
+
+  const pagePrev = useState<boolean>(key ? `pagePrevFor${toFirstUpper(key)}` : 'pagePrev', () => {
+    return false
+  })
+  const pageNext = useState<boolean>(key ? `pageNextFor${toFirstUpper(key)}` : 'pageNext', () => {
+    return false
+  })
+
+  const minPage = useState<number>(key ? `minPageFor${toFirstUpper(key)}` : 'minPage', () => {
+    return 1
+  })
+  const maxPage = useState<number>(key ? `maxPageFor${toFirstUpper(key)}` : 'maxPage', () => {
+    return 1
+  })
+
+  const minMaxPage = () => {
+    minPage.value = currentPage.value < page ? currentPage.value : page
+    maxPage.value = currentPage.value > page ? currentPage.value : page
+  }
+
+  const pagePrevNext = () => {
+    if (currentPage.value == 1) pagePrev.value = false
+    if (currentPage.value == pages) pageNext.value = false
+    // console.log(`page prev: ${pagePrev.value}`)
+    // console.log(`page next: ${pageNext.value}`)
+  }
+
+  const init = () => {
+    currentPage.value = page
+    pagePrev.value = true
+    pageNext.value = true
+    minMaxPage()
+    pagePrevNext()
+  }
+
+  const decrement = () => {
+    currentPage.value = minPage.value - 1
+    minMaxPage()
+    pagePrevNext()
+  }
+
+  const increment = () => {
+    currentPage.value = maxPage.value + 1
+    minMaxPage()
+    pagePrevNext()
+  }
+
+  return { currentPage, pagePrev, pageNext, minPage, maxPage, init, decrement, increment }
+}

package/app/composables/use-referer.ts

@@ -0,0 +1,9 @@
+import { useState } from 'nuxt/app'
+
+export function useReferer() {
+  const referers = useState<Record<string, string>>('referers', () => {
+    return {}
+  })
+
+  return { referers }
+}

package/app/composables/use-time-zone.ts

@@ -0,0 +1,86 @@
+import { useRuntimeConfig } from 'nuxt/app'
+
+import { computed } from 'vue'
+
+import { format, tzDate } from '@formkit/tempo'
+
+import { useLocale } from './use-locale'
+import { useDatetimeLocal } from './use-datetime-local'
+
+interface TimeZone {
+  client: string
+  server: string
+}
+
+interface TZOptions {
+  text: string
+  value: string
+}
+
+export const useTimeZone = () => {
+  const runtimeConfig = useRuntimeConfig()
+  const { locale } = useLocale()
+  const { toISO8601, formatHTML } = useDatetimeLocal()
+
+  const serverTimeZone = runtimeConfig.public.timeZone as string
+
+  const timeZone = computed<TimeZone>(() => ({
+    client: Intl.DateTimeFormat().resolvedOptions().timeZone,
+    server: serverTimeZone,
+  }))
+
+  const tzOptions = computed<TZOptions[]>(() =>
+    Intl.supportedValuesOf('timeZone').map((e) => ({ text: e, value: e })),
+  )
+
+  const tzServerDate = (datetime: string): Date => {
+    return tzDate(toISO8601(datetime), timeZone.value.server)
+  }
+
+  const tzClientDate = (datetime: string): Date => {
+    return tzDate(toISO8601(datetime), timeZone.value.client)
+  }
+
+  const upTZ = (datetime: string | null): string => {
+    return timeZone.value.client === timeZone.value.server
+      ? (datetime ?? '')
+      : datetime
+        ? format({
+            date: tzServerDate(datetime),
+            format: 'YYYY/MM/DD HH:mm',
+            locale: locale.value,
+            tz: timeZone.value.client,
+          })
+        : ''
+  }
+
+  const downTZ = (datetime: string | null): string => {
+    return timeZone.value.client === timeZone.value.server
+      ? (datetime ?? '')
+      : datetime
+        ? format({
+            date: tzClientDate(datetime),
+            format: 'YYYY/MM/DD HH:mm',
+            locale: locale.value,
+            tz: timeZone.value.server,
+          })
+        : ''
+  }
+
+  const formatHtmlTZ = (datetime: string | null, fmt: string): string => {
+    return timeZone.value.client === timeZone.value.server
+      ? formatHTML(datetime, fmt)
+      : datetime
+        ? format({
+            date: tzServerDate(datetime),
+            format: fmt,
+            locale: locale.value,
+            tz: timeZone.value.client,
+          })
+        : ''
+  }
+
+  return { timeZone, tzOptions, upTZ, downTZ, formatHtmlTZ }
+}
+
+// export type UseTimeZoneType = ReturnType<typeof useTimeZone>

package/app/composables/util/index.ts

@@ -0,0 +1 @@
+export { useDate } from './use-date'

package/app/composables/util/use-date.ts

@@ -0,0 +1,7 @@
+export function useDate() {
+  const isValidDate = (str: string): boolean => {
+    return !!str && !!str.match(/\d{4}\/\d{2}\/\d{2}/) && !isNaN(Date.parse(str))
+  }
+
+  return { isValidDate }
+}

package/app.config.ts

@@ -0,0 +1,7 @@
+import { defineAppConfig } from 'nuxt/app'
+
+export default defineAppConfig({
+  myLayer: {
+    name: 'Vesper Nuxt layer',
+  },
+})

package/interfaces/error/backend-error-info.ts

@@ -0,0 +1,4 @@
+export interface BackendErrorInfo<BER> {
+  error?: BER
+  status?: number
+}

package/interfaces/error/index.ts

@@ -0,0 +1 @@
+export type { BackendErrorInfo } from './backend-error-info'

package/interfaces/flash.ts

@@ -0,0 +1,4 @@
+export interface Flash {
+  notice?: string
+  alert?: string
+}

package/interfaces/index.ts

@@ -0,0 +1,5 @@
+export type { BackendErrorInfo } from './error'
+
+export type { BackendErrorResource, ErrorsResource } from './resource'
+
+export type { Flash } from './flash'

package/interfaces/resource/beckend-error-resource.ts

@@ -0,0 +1,5 @@
+export interface BackendErrorResource {
+  source?: string
+  title: string
+  errors: string[]
+}

package/interfaces/resource/errors-resource.ts

@@ -0,0 +1,3 @@
+export interface ErrorsResource<T> {
+  errors: T
+}

package/interfaces/resource/index.ts

@@ -0,0 +1,2 @@
+export type { ErrorsResource } from './errors-resource'
+export type { BackendErrorResource } from './beckend-error-resource'

package/nuxt.config.ts

@@ -0,0 +1,6 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+import { defineNuxtConfig } from 'nuxt/config'
+
+export default defineNuxtConfig({
+  devtools: { enabled: true },
+})

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@vesperjs/nuxt",
+  "version": "0.1.0",
+  "files": [
+    "app",
+    "interfaces",
+    "types",
+    "nuxt.config.ts",
+    "app.config.ts"
+  ],
+  "type": "module",
+  "main": "./nuxt.config.ts",
+  "devDependencies": {
+    "@nuxt/eslint": "latest",
+    "@nuxtjs/i18n": "10.2.3",
+    "@types/node": "^24.11.0",
+    "eslint": "^9.39.3",
+    "nuxt": "^4.3.1",
+    "ofetch": "1.5.1",
+    "oxfmt": "^0.41.0",
+    "typescript": "^5.9.3",
+    "vue": "^3.6.0-beta.8"
+  },
+  "scripts": {
+    "dev": "nuxi dev .playground",
+    "dev:prepare": "nuxt prepare .playground",
+    "build": "nuxt build .playground",
+    "generate": "nuxt generate .playground",
+    "preview": "nuxt preview .playground",
+    "lint": "eslint .",
+    "fmt": "oxfmt"
+  }
+}

package/types/error-messages.ts

@@ -0,0 +1 @@
+export type ErrorMessages<T extends string> = Partial<Record<T, string[]>>

package/types/index.ts

@@ -0,0 +1 @@
+export type { ErrorMessages } from './error-messages'