@dargmuesli/nuxt-vio 20.5.2 → 20.6.1

package/.config/certificates/mkcert.sh

@@ -1,30 +1,49 @@
 #!/bin/sh
-THIS=$(dirname "$(readlink -f "$0")")
+set -e
 
-create() {
-    NAME="$1"
-    shift
-    CONTENT=$*
-
-    path="$THIS/$NAME"
-    certfile="$path.crt"
-    keyfile="$path.key"
-
-    if [ "$CONTENT" != "" ]; then
-        # shellcheck disable=SC2086
-        mkcert \
-            -cert-file "$certfile" \
-            -ecdsa \
-            -key-file "$keyfile" $CONTENT
-    fi
+SCRIPT_DIRECTORY=$(dirname "$(readlink -f "$0")")
+CERTIFICATE_SUFFIX="-dev"
+
+[ -n "$CI" ] && CERTIFICATE_SUFFIX="-ci"
+
+is_certificate_valid() {
+    certificate_path="$1"
+    root_ca_path="$(mkcert -CAROOT)/rootCA.pem"
 
-    cat "$(mkcert -CAROOT)/rootCA.pem" >> "$certfile"
+    [ -f "$certificate_path" ] || return 1
+
+    openssl verify -CAfile "$root_ca_path" "$certificate_path" >/dev/null 2>&1 && openssl x509 -checkend 86400 -noout -in "$certificate_path" >/dev/null 2>&1
 }
 
-echo "key crt" | tr ' ' '\n' | while read -r glob; do
-    if test -n "$(find "$THIS" -maxdepth 1 -name "*.$glob" -print -quit)"; then
-        rm "$THIS"/*."$glob"
+generate_certificate() {
+    certificate_name="$1"
+    shift
+    domains="$*"
+
+    certificate_path="${SCRIPT_DIRECTORY}/${certificate_name}${CERTIFICATE_SUFFIX}.crt"
+    key_file_path="${SCRIPT_DIRECTORY}/${certificate_name}${CERTIFICATE_SUFFIX}.key"
+
+    if is_certificate_valid "$certificate_path"; then
+        echo "✓ Certificate '${certificate_name}' is valid"
+        return 0
+    fi
+
+    if [ -f "$certificate_path" ]; then
+        echo "✗ Removing outdated certificate: '${certificate_name}'"
+        rm -f "$certificate_path" "$key_file_path"
     fi
-done
 
-create "ssl" "localhost" "127.0.0.1" "0.0.0.0"
+    echo "→ Generating certificate: '${certificate_name}'"
+    # shellcheck disable=SC2086
+    mkcert \
+        -cert-file "$certificate_path" \
+        -key-file "$key_file_path" \
+        -ecdsa \
+        $domains
+
+    cat "$(mkcert -CAROOT)/rootCA.pem" >> "$certificate_path"
+
+    echo "✓ Certificate generated: '${certificate_name}'"
+}
+
+generate_certificate "ssl" "localhost" "app.localhost" "127.0.0.1" "0.0.0.0"

package/app/components/vio/_/VioApp.vue

@@ -10,12 +10,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { ogImageComponent = undefined } = defineProps<{
   ogImageComponent?: string
-}
-const props = withDefaults(defineProps<Props>(), {
-  ogImageComponent: undefined,
-})
+}>()
 
 const { t } = useI18n()
 const timeZone = useTimeZone()
@@ -44,7 +41,7 @@ onMounted(() => indicateLoadingDone())
 
 // initialization
 defineOgImageComponent(
-  props.ogImageComponent || 'NuxtSeo',
+  ogImageComponent || 'NuxtSeo',
   {},
   {
     alt: t('globalSeoOgImageAlt'),

package/app/components/vio/_/VioError.vue

@@ -12,29 +12,29 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const {
+  status = undefined,
+  statusCode = undefined,
+  statusMessage: _statusMessage = undefined,
+  statusText: _statusText = undefined,
+  description,
+  stack = undefined,
+} = defineProps<{
   status?: number
   statusCode?: number
   statusMessage?: string
   statusText?: string
   description: string
   stack?: string
-}
-const props = withDefaults(defineProps<Props>(), {
-  status: undefined,
-  statusCode: undefined,
-  statusMessage: undefined,
-  statusText: undefined,
-  stack: undefined,
-})
+}>()
 
 const runtimeConfig = useRuntimeConfig()
 const { locale, t } = useI18n()
 
 // data
-const title = `${props.status || props.statusCode ? `${props.status || props.statusCode} - ` : ''}${
+const title = `${status || statusCode ? `${status || statusCode} - ` : ''}${
   (await import('@http-util/status-i18n')).status(
-    props.status || props.statusCode,
+    status || statusCode,
     locale.value,
   ) || t('error')
 }`

package/app/components/vio/_/VioLink.vue

@@ -27,7 +27,15 @@
 <script setup lang="ts">
 import type { NuxtLinkProps } from '#app'
 
-interface Props {
+const {
+  ariaLabel = undefined,
+  isColored = true,
+  isToRelative = false,
+  isUnderlined = false,
+  locale = undefined,
+  nofollow = false,
+  to,
+} = defineProps<{
   ariaLabel?: string
   isColored?: boolean
   isToRelative?: boolean
@@ -35,15 +43,7 @@ interface Props {
   locale?: I18N_LOCALE_CODE
   nofollow?: boolean
   to: NuxtLinkProps['to']
-}
-const props = withDefaults(defineProps<Props>(), {
-  ariaLabel: undefined,
-  isColored: true,
-  isToRelative: false,
-  isUnderlined: false,
-  locale: undefined,
-  nofollow: false,
-})
+}>()
 
 const emit = defineEmits<{
   click: []
@@ -55,8 +55,8 @@ const route = useRoute()
 const classes = computed(() => {
   return [
     'rounded-sm',
-    ...(props.isColored ? ['text-link-dark dark:text-link-bright'] : []),
-    ...(props.isUnderlined ? ['underline'] : []),
+    ...(isColored ? ['text-link-dark dark:text-link-bright'] : []),
+    ...(isUnderlined ? ['underline'] : []),
   ].join(' ')
 })
 </script>

package/app/components/vio/_/VioTime.vue

@@ -1,8 +1,8 @@
 <template>
   <NuxtTime
     v-bind="forwardedProps"
-    :locale="props.options.locale || defaultLocale"
-    :time-zone="props.options.timeZone || defaultTimeZone"
+    :locale="options.locale || defaultLocale"
+    :time-zone="options.timeZone || defaultTimeZone"
   />
 </template>
 
@@ -12,22 +12,20 @@ import type { NuxtTimeProps } from 'nuxt/app'
 const { locale: defaultLocale } = useI18n()
 const defaultTimeZone = useTimeZone()
 
-const props = withDefaults(
-  defineProps<{
-    datetime: NuxtTimeProps['datetime']
-    options?: Omit<NuxtTimeProps, 'datetime'>
-  }>(),
-  {
-    options: () => ({
-      dateStyle: 'medium',
-      timeStyle: 'short',
-    }),
+const {
+  datetime,
+  options = {
+    dateStyle: 'medium',
+    timeStyle: 'short',
   },
-)
+} = defineProps<{
+  datetime: NuxtTimeProps['datetime']
+  options?: Omit<NuxtTimeProps, 'datetime'>
+}>()
 
 const forwardedProps = computed(() => {
-  const { locale, timeZone, ...delegated } = props.options
+  const { locale, timeZone, ...delegated } = options
 
-  return { datetime: props.datetime, ...delegated }
+  return { datetime: datetime, ...delegated }
 })
 </script>

package/app/components/vio/button/VioButton.vue

@@ -28,7 +28,16 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const {
+  ariaLabel,
+  classes = undefined,
+  disabled = false,
+  isBlock = false,
+  isLinkColored = false,
+  isToRelative = false,
+  to = undefined,
+  type = 'button',
+} = defineProps<{
   ariaLabel: string
   classes?: string
   disabled?: boolean
@@ -37,16 +46,7 @@ interface Props {
   isToRelative?: boolean
   to?: string
   type?: 'button' | 'submit' | 'reset'
-}
-const props = withDefaults(defineProps<Props>(), {
-  classes: undefined,
-  disabled: false,
-  isBlock: false,
-  isLinkColored: false,
-  isToRelative: false,
-  to: undefined,
-  type: 'button',
-})
+}>()
 
 const emit = defineEmits<{
   click: [event?: MouseEvent]
@@ -55,9 +55,9 @@ const emit = defineEmits<{
 // computations
 const classesComputed = computed(() => {
   return [
-    props.classes,
-    ...(props.isBlock ? ['block'] : ['inline-flex items-center gap-2']),
-    ...(props.isLinkColored ? ['text-link-dark dark:text-link-bright'] : []),
+    classes,
+    ...(isBlock ? ['block'] : ['inline-flex items-center gap-2']),
+    ...(isLinkColored ? ['text-link-dark dark:text-link-bright'] : []),
   ].join(' ')
 })
 </script>

package/app/components/vio/button/VioButtonColored.vue

@@ -30,21 +30,21 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const {
+  ariaLabel,
+  disabled = false,
+  isPrimary = true,
+  isToRelative = false,
+  to = undefined,
+  type = 'button',
+} = defineProps<{
   ariaLabel: string
   disabled?: boolean
   isPrimary?: boolean
   isToRelative?: boolean
   to?: string
   type?: 'button' | 'reset' | 'submit'
-}
-withDefaults(defineProps<Props>(), {
-  disabled: false,
-  isPrimary: true,
-  isToRelative: false,
-  to: undefined,
-  type: 'button',
-})
+}>()
 
 const emit = defineEmits<{
   click: []

package/app/components/vio/button/VioButtonIcon.vue

@@ -13,17 +13,17 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const {
+  ariaLabel,
+  disabled = false,
+  to = undefined,
+  type = 'button',
+} = defineProps<{
   ariaLabel: string
   disabled?: boolean
   to?: string
   type?: 'button' | 'submit' | 'reset'
-}
-withDefaults(defineProps<Props>(), {
-  disabled: false,
-  to: undefined,
-  type: 'button',
-})
+}>()
 
 const emit = defineEmits<{
   click: []

package/app/components/vio/button/VioButtonShare.vue

@@ -13,10 +13,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { url } = defineProps<{
   url: string
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 

package/app/components/vio/card/VioCard.vue

@@ -8,12 +8,11 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const {
+  backgroundColor = 'bg-background-brighten dark:bg-background-darken',
+  isHigh = false,
+} = defineProps<{
   backgroundColor?: string
   isHigh?: boolean
-}
-withDefaults(defineProps<Props>(), {
-  backgroundColor: 'bg-background-brighten dark:bg-background-darken',
-  isHigh: false,
-})
+}>()
 </script>

package/app/components/vio/card/state/VioCardState.vue

@@ -9,12 +9,8 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { backgroundColor = undefined, isEdgy = false } = defineProps<{
   backgroundColor?: string
   isEdgy?: boolean
-}
-withDefaults(defineProps<Props>(), {
-  backgroundColor: undefined,
-  isEdgy: false,
-})
+}>()
 </script>

package/app/components/vio/card/state/VioCardStateAlert.vue

@@ -5,10 +5,7 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { isEdgy = false } = defineProps<{
   isEdgy?: boolean
-}
-withDefaults(defineProps<Props>(), {
-  isEdgy: false,
-})
+}>()
 </script>

package/app/components/vio/card/state/VioCardStateInfo.vue

@@ -5,10 +5,7 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { isEdgy = false } = defineProps<{
   isEdgy?: boolean
-}
-withDefaults(defineProps<Props>(), {
-  isEdgy: false,
-})
+}>()
 </script>

package/app/components/vio/form/VioForm.vue

@@ -45,7 +45,15 @@
 <script setup lang="ts">
 import type { BaseValidation } from '@vuelidate/core'
 
-interface Props {
+const {
+  errors = undefined,
+  errorsPgIds = undefined,
+  form,
+  formClass = undefined,
+  isFormSent: _isFormSent = false,
+  isLoading = undefined,
+  submitName = undefined,
+} = defineProps<{
   errors?: BackendError[]
   errorsPgIds?: Record<string, string>
   form: BaseValidation
@@ -53,15 +61,7 @@ interface Props {
   isFormSent?: boolean
   isLoading?: boolean
   submitName?: string
-}
-const props = withDefaults(defineProps<Props>(), {
-  errors: undefined,
-  errorsPgIds: undefined,
-  formClass: undefined,
-  isFormSent: false,
-  isLoading: undefined,
-  submitName: undefined,
-})
+}>()
 
 const emit = defineEmits<{
   click: []
@@ -72,9 +72,7 @@ const { t } = useI18n()
 
 // computations
 const errorMessages = computed(() =>
-  props.errors
-    ? getCombinedErrorMessages(props.errors, props.errorsPgIds)
-    : undefined,
+  errors ? getCombinedErrorMessages(errors, errorsPgIds) : undefined,
 )
 </script>
 

package/app/components/vio/form/VioFormCheckbox.vue

@@ -12,14 +12,10 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { formKey = undefined, value = undefined } = defineProps<{
   formKey?: string
   value?: boolean
-}
-withDefaults(defineProps<Props>(), {
-  formKey: undefined,
-  value: undefined,
-})
+}>()
 
 const emit = defineEmits<{
   change: [change: boolean]

package/app/components/vio/form/VioFormContact.vue

@@ -79,14 +79,9 @@ import { required } from '@vuelidate/validators'
 
 type FormValid = { emailAddress: string; name: string; message: string }
 
-withDefaults(
-  defineProps<{
-    isLoading?: boolean
-  }>(),
-  {
-    isLoading: undefined,
-  },
-)
+const { isLoading = undefined } = defineProps<{
+  isLoading?: boolean
+}>()
 
 const emit = defineEmits<{
   submit: [form: FormValid]

package/app/components/vio/form/input/VioFormInput.vue

@@ -119,7 +119,23 @@
 import type { BaseValidation } from '@vuelidate/core'
 import { consola } from 'consola'
 
-interface Props {
+const {
+  idLabel = undefined,
+  isDisabled = false,
+  isOptional = false,
+  isReadonly = false,
+  isRequired = false,
+  isValidatable = false,
+  name = undefined,
+  placeholder = undefined,
+  success = false,
+  title,
+  type = undefined,
+  validationProperty = undefined,
+  value = undefined,
+  valueFormatter = (x?: string) => x,
+  warning = false,
+} = defineProps<{
   idLabel?: string
   isDisabled?: boolean
   isOptional?: boolean
@@ -135,23 +151,7 @@ interface Props {
   value?: BaseValidation
   valueFormatter?: (x?: string) => typeof x | undefined
   warning?: boolean
-}
-const props = withDefaults(defineProps<Props>(), {
-  idLabel: undefined,
-  isDisabled: false,
-  isOptional: false,
-  isReadonly: false,
-  isRequired: false,
-  isValidatable: false,
-  name: undefined,
-  placeholder: undefined,
-  success: false,
-  type: undefined,
-  validationProperty: undefined,
-  value: undefined,
-  valueFormatter: (x?: string) => x,
-  warning: false,
-})
+}>()
 
 const emit = defineEmits<{
   icon: []
@@ -164,16 +164,16 @@ const runtimeConfig = useRuntimeConfig()
 const siteConfig = useSiteConfig()
 
 // data
-const idLabelFull = props.idLabel
+const idLabelFull = idLabel
   ? `${siteConfig.id}-${
       runtimeConfig.public.vio.isInProduction ? 'prod' : 'dev'
-    }-${props.idLabel}`
+    }-${idLabel}`
   : undefined
 
 // initialization
 if (
-  !props.placeholder &&
-  props.type &&
+  !placeholder &&
+  type &&
   ![
     'checkbox',
     'datetime-local',
@@ -182,17 +182,13 @@ if (
     'textarea',
     'tiptap',
     'radio',
-  ].includes(props.type)
+  ].includes(type)
 ) {
-  consola.warn(`placeholder is missing for ${props.idLabel}!`)
+  consola.warn(`placeholder is missing for ${idLabel}!`)
 }
 
-if (
-  !props.value &&
-  props.type &&
-  !['checkbox', 'select'].includes(props.type)
-) {
-  consola.warn(`value is missing for ${props.idLabel}!`)
+if (!value && type && !['checkbox', 'select'].includes(type)) {
+  consola.warn(`value is missing for ${idLabel}!`)
 }
 </script>
 

package/app/components/vio/form/input/VioFormInputCaptcha.vue

@@ -49,12 +49,9 @@
 <script setup lang="ts">
 import type { BaseValidation } from '@vuelidate/core'
 
-withDefaults(
-  defineProps<{
-    formInput: BaseValidation
-  }>(),
-  {},
-)
+const { formInput } = defineProps<{
+  formInput: BaseValidation
+}>()
 
 const emit = defineEmits<{
   input: [event?: string]

package/app/components/vio/form/input/VioFormInputEmailAddress.vue

@@ -36,19 +36,19 @@
 <script setup lang="ts">
 import type { BaseValidation } from '@vuelidate/core'
 
-interface Props {
+const {
+  formInput,
+  id = 'email-address',
+  isOptional = false,
+  isRequired = false,
+  title = undefined,
+} = defineProps<{
   formInput: BaseValidation
   id?: string
   isOptional?: boolean
   isRequired?: boolean
   title?: string
-}
-withDefaults(defineProps<Props>(), {
-  id: 'email-address',
-  isOptional: false,
-  isRequired: false,
-  title: undefined,
-})
+}>()
 
 const emit = defineEmits<{
   input: [event: string]

package/app/components/vio/form/input/VioFormInputUrl.vue

@@ -29,15 +29,15 @@
 <script setup lang="ts">
 import type { BaseValidation } from '@vuelidate/core'
 
-interface Props {
+const {
+  formInput,
+  id = 'phone-number',
+  isOptional = false,
+} = defineProps<{
   formInput: BaseValidation
   id?: string
   isOptional?: boolean
-}
-withDefaults(defineProps<Props>(), {
-  id: 'phone-number',
-  isOptional: false,
-})
+}>()
 
 const emit = defineEmits<{
   input: [event: string]

package/app/components/vio/form/input/state/VioFormInputStateError.vue

@@ -19,14 +19,13 @@
 <script setup lang="ts">
 import type { BaseValidation } from '@vuelidate/core'
 
-interface Props {
+const {
+  formInput = undefined,
+  isValidationLive = false,
+  validationProperty = undefined,
+} = defineProps<{
   formInput?: BaseValidation
   isValidationLive?: boolean
   validationProperty?: string
-}
-withDefaults(defineProps<Props>(), {
-  formInput: undefined,
-  isValidationLive: false,
-  validationProperty: undefined,
-})
+}>()
 </script>

package/app/components/vio/form/input/state/VioFormInputStateInfo.vue

@@ -19,14 +19,13 @@
 <script setup lang="ts">
 import type { BaseValidation } from '@vuelidate/core'
 
-interface Props {
+const {
+  formInput = undefined,
+  isValidationLive = false,
+  validationProperty = undefined,
+} = defineProps<{
   formInput?: BaseValidation
   isValidationLive?: boolean
   validationProperty?: string
-}
-withDefaults(defineProps<Props>(), {
-  formInput: undefined,
-  isValidationLive: false,
-  validationProperty: undefined,
-})
+}>()
 </script>

package/app/components/vio/icon/VioIconArrowRight.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconCalendar.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconChartBar.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconCheckCircle.vue

@@ -13,10 +13,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconContainer.vue

@@ -5,12 +5,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
-  classes?: string
-  title?: string
-}
-withDefaults(defineProps<Props>(), {
-  classes: 'h-5 md:h-6 w-5 md:w-6 shrink-0',
-  title: undefined,
-})
+const { classes = 'h-5 md:h-6 w-5 md:w-6 shrink-0', title = undefined } =
+  defineProps<{
+    classes?: string
+    title?: string
+  }>()
 </script>

package/app/components/vio/icon/VioIconDownload.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconExclamationCircle.vue

@@ -13,10 +13,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconHeart.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconHome.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconHourglass.vue

@@ -16,10 +16,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconShare.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconSignIn.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/icon/VioIconTv.vue

@@ -15,10 +15,9 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { title } = defineProps<{
   title?: string // eslint-disable-line vue/require-default-prop
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 
 const { t } = useI18n()
 </script>

package/app/components/vio/layout/VioLayoutBreadcrumbs.vue

@@ -60,14 +60,10 @@ export interface Breadcrumb {
   to: string
 }
 
-interface Props {
+const { prefixes = undefined, suffixes = undefined } = defineProps<{
   prefixes?: Breadcrumb[]
   suffixes?: Breadcrumb[]
-}
-withDefaults(defineProps<Props>(), {
-  prefixes: undefined,
-  suffixes: undefined,
-})
+}>()
 
 const localePath = useLocalePath()
 const { t } = useI18n()

package/app/components/vio/layout/VioLayoutFooterCategory.vue

@@ -10,8 +10,7 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { heading } = defineProps<{
   heading: string
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 </script>

package/app/components/vio/layout/VioLayoutProse.vue

@@ -14,8 +14,7 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { isFullWidth } = defineProps<{
   isFullWidth?: boolean
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 </script>

package/app/components/vio/layout/VioLayoutSpanList.vue

@@ -13,8 +13,7 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const { span } = defineProps<{
   span: (string | string[])[]
-}
-withDefaults(defineProps<Props>(), {})
+}>()
 </script>

package/app/components/vio/loader/VioLoader.vue

@@ -16,21 +16,21 @@
 <script setup lang="ts">
 import type { UnwrapRef } from 'vue'
 
-interface Props {
+const {
+  api,
+  errorPgIds = undefined,
+  classes = undefined,
+  indicator = undefined,
+} = defineProps<{
   api: UnwrapRef<ApiData>
   errorPgIds?: Record<string, string>
   classes?: string
   indicator?: string
-}
-const props = withDefaults(defineProps<Props>(), {
-  errorPgIds: undefined,
-  classes: undefined,
-  indicator: undefined,
-})
+}>()
 
 // computations
 const errorMessages = computed(() =>
-  getCombinedErrorMessages(props.api.errors, props.errorPgIds),
+  getCombinedErrorMessages(api.errors, errorPgIds),
 )
 </script>
 

package/app/components/vio/loader/VioLoaderImage.vue

@@ -19,18 +19,21 @@
 <script setup lang="ts">
 import { debounce } from 'lodash-es'
 
-interface Props {
+const {
+  alt,
+  aspect,
+  classes = undefined,
+  height,
+  src,
+  width,
+} = defineProps<{
   alt: string
   aspect: string
   classes?: string
   height: string
   src: string
   width: string
-}
-const props = withDefaults(defineProps<Props>(), {
-  classes: undefined,
-})
-const srcProp = toRef(() => props.src)
+}>()
 
 const { t } = useI18n()
 
@@ -40,7 +43,7 @@ const isError = ref(false)
 const isLoading = ref(false)
 const loadingId = Math.random()
 const loadingIds = useState('loadingIds', () => [] as number[])
-const srcWhenLoaded = ref<string | undefined>(srcProp.value)
+const srcWhenLoaded = ref<string | undefined>(src)
 
 // methods
 const loadOnClient = () => {
@@ -55,7 +58,7 @@ const loadOnClient = () => {
     loadingStop()
     isError.value = true
   }
-  img.value.src = props.src
+  img.value.src = src
 }
 const loadingStart = () => {
   srcWhenLoaded.value = undefined

package/app/components/vio/page/VioPagePrivacyPolicy.vue

@@ -442,7 +442,19 @@
 </template>
 
 <script setup lang="ts">
-interface Props {
+const {
+  isEnabled = {
+    summary: {
+      generalNotes: true,
+      dataCollection: {
+        liability: true,
+        method: true,
+        use: true,
+        rights: true,
+      },
+    },
+  },
+} = defineProps<{
   isEnabled?: {
     summary?: {
       generalNotes?: boolean
@@ -496,20 +508,7 @@ interface Props {
       googleReCaptcha?: boolean
     }
   }
-}
-withDefaults(defineProps<Props>(), {
-  isEnabled: () => ({
-    summary: {
-      generalNotes: true,
-      dataCollection: {
-        liability: true,
-        method: true,
-        use: true,
-        rights: true,
-      },
-    },
-  }),
-})
+}>()
 
 const appConfig = useAppConfig()
 const { t } = useI18n()

package/app/composables/dateTime.ts

@@ -9,7 +9,11 @@ export const useTimeZone = () =>
     ? Intl.DateTimeFormat().resolvedOptions().timeZone
     : undefined)
 
-export const useNow = () => useState(STATE_KEY_NOW, () => new Date())
+export const useNow = () => {
+  const isTesting = useIsTesting()
+
+  return useState(STATE_KEY_NOW, () => (isTesting ? new Date(0) : new Date()))
+}
 
 export const useFromNow = () => {
   const { locale } = useI18n()

package/nuxt.config.ts

@@ -1,12 +1,9 @@
-import { fileURLToPath } from 'node:url'
-import { dirname, join } from 'node:path'
-
 import tailwindcss from '@tailwindcss/vite'
 import { defu } from 'defu'
+import { createResolver } from 'nuxt/kit'
 
-import { IS_IN_STACK } from './node'
+import { IS_IN_STACK, SITE_URL } from './node/static'
 import {
-  SITE_URL,
   VIO_SITE_NAME,
   TIMEZONE_COOKIE_NAME,
   GTAG_COOKIE_ID,
@@ -14,7 +11,7 @@ import {
 } from './shared/utils/constants'
 import { VIO_NUXT_BASE_CONFIG } from './shared/utils/nuxt'
 
-const currentDir = dirname(fileURLToPath(import.meta.url))
+const { resolve } = createResolver(import.meta.url)
 
 export default defineNuxtConfig(
   defu(
@@ -35,8 +32,8 @@ export default defineNuxtConfig(
         : {
             devServer: {
               https: {
-                key: './.config/certificates/ssl.key',
-                cert: './.config/certificates/ssl.crt',
+                key: './.config/certificates/ssl-dev.key',
+                cert: './.config/certificates/ssl-dev.crt',
               },
             },
           }),
@@ -122,6 +119,9 @@ export default defineNuxtConfig(
         },
       },
       typescript: {
+        nodeTsConfig: {
+          include: [resolve('./node')],
+        },
         tsConfig: {
           vueCompilerOptions: {
             htmlAttributes: [], // https://github.com/johnsoncodehk/volar/issues/1970#issuecomment-1276994634
@@ -282,7 +282,7 @@ export default defineNuxtConfig(
       },
       shadcn: {
         prefix: '',
-        componentDir: join(currentDir, './app/components/scn'),
+        componentDir: resolve('./app/components/scn'),
       },
       site: {
         url: SITE_URL,

package/package.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
-    "@dargmuesli/nuxt-cookie-control": "9.1.14",
+    "@dargmuesli/nuxt-cookie-control": "9.1.15",
     "@eslint/compat": "2.0.2",
     "@heroicons/vue": "2.2.0",
     "@nuxtjs/turnstile": "1.1.1",
@@ -25,7 +25,7 @@
     "@vuelidate/validators": "2.0.4",
     "@vueuse/core": "14.2.0",
     "class-variance-authority": "0.7.1",
-    "clipboardy": "5.2.0",
+    "clipboardy": "5.2.1",
     "clsx": "2.1.1",
     "eslint": "9.39.2",
     "eslint-config-prettier": "10.1.8",
@@ -36,7 +36,7 @@
     "jiti": "2.6.1",
     "jose": "6.1.3",
     "lucide-vue-next": "0.563.0",
-    "nodemailer": "7.0.13",
+    "nodemailer": "8.0.0",
     "nuxt-gtag": "4.1.0",
     "nuxt-security": "2.5.1",
     "reka-ui": "2.8.0",
@@ -47,7 +47,7 @@
     "vue-tsc": "3.2.4"
   },
   "devDependencies": {
-    "@types/node": "24.10.9",
+    "@types/node": "24.10.10",
     "@urql/devtools": "2.0.3",
     "@urql/exchange-graphcache": "9.0.0",
     "@vueuse/core": "14.2.0",
@@ -61,10 +61,10 @@
     "prettier-plugin-tailwindcss": "0.7.2",
     "serve": "14.2.5",
     "sharp": "0.34.5",
-    "stylelint": "17.1.0",
+    "stylelint": "17.1.1",
     "stylelint-config-recommended-vue": "1.6.1",
     "stylelint-config-standard": "40.0.0",
-    "stylelint-no-unsupported-browser-features": "8.0.5",
+    "stylelint-no-unsupported-browser-features": "8.1.1",
     "tailwindcss": "4.1.18",
     "vue": "3.5.27",
     "vue-router": "4.6.4"
@@ -98,9 +98,9 @@
   },
   "scripts": {
     "build": "pnpm run build:node",
-    "build:node": "nuxt build playground",
-    "build:static": "nuxt generate playground",
-    "build:static:test": "NUXT_PUBLIC_SITE_URL=https://localhost:3002 pnpm run build:static",
+    "build:node": "NUXT_PUBLIC_SITE_URL=https://localhost:3001 nuxt build playground",
+    "build:static": "NUXT_PUBLIC_SITE_URL=https://localhost:3002 nuxt generate playground",
+    "certificates": ".config/certificates/mkcert.sh",
     "dev": "pnpm run start:dev",
     "generate": "pnpm run build:static",
     "lint": "pnpm run lint:js && pnpm run lint:ts && pnpm run lint:style",
@@ -109,13 +109,13 @@
     "lint:staged": "lint-staged",
     "lint:style": "stylelint --cache \"**/*.{vue,css}\" --ignore-path .gitignore",
     "lint:ts": "nuxt typecheck",
-    "prepare": "nuxt prepare && nuxt prepare playground && ./.config/certificates/mkcert.sh",
+    "postinstall": "nuxt prepare && nuxt prepare playground",
     "preview": "nuxt preview playground",
     "start": "pnpm run start:node",
-    "start:dev": "nuxt dev playground",
-    "start:node": "node playground/.output/server/index.mjs",
-    "start:static": "serve playground/.output/public --ssl-cert ./.config/certificates/ssl.crt --ssl-key ./.config/certificates/ssl.key"
+    "start:dev": "pnpm run certificates && NODE_EXTRA_CA_CERTS=\"$(mkcert -CAROOT)/rootCA.pem\" nuxt dev playground",
+    "start:node": "node scripts/server/node.mjs",
+    "start:static": "node scripts/server/static.mjs"
   },
   "type": "module",
-  "version": "20.5.2"
+  "version": "20.6.1"
 }

package/shared/utils/constants.ts

@@ -2,14 +2,11 @@ import { DEFAULTS } from '@dargmuesli/nuxt-cookie-control/runtime/types.js'
 import { helpers } from '@vuelidate/validators'
 import { defu } from 'defu'
 
-import { IS_IN_PRODUCTION, IS_IN_STACK } from '../../node'
+import { IS_IN_PRODUCTION, IS_IN_STACK } from '../../node/static'
 
 export const VIO_SITE_NAME = 'Vio'
 
 export const IS_IN_FRONTEND_DEVELOPMENT = !IS_IN_PRODUCTION && !IS_IN_STACK
-export const SITE_URL =
-  process.env.NUXT_PUBLIC_SITE_URL ||
-  `https://${process.env.HOST || 'localhost'}:${process.env.PORT || '3000'}`
 export const CACHE_VERSION = 'zeMtipb6C9'
 export const COOKIE_CONTROL_CONSENT_COOKIE_NAME =
   DEFAULTS.cookieNameIsConsentGiven

package/node.ts

@@ -1,2 +0,0 @@
-export const IS_IN_PRODUCTION = process.env.NODE_ENV === 'production'
-export const IS_IN_STACK = !!process.env.NUXT_PUBLIC_SITE_URL