<template lang="pug">
.wrapper(v-if="state.loaded")
    h1 {{ msg }}

    p
        a(href="https://vitejs.dev/guide/features.html" target="_blank") Vite Documentation |
        a(href="https://v3.vuejs.org/" target="_blank") Vue 3 Documentation

    button(@click="state.count++") count is: {{ state.count }}

    p Edit
    code components/HelloWorld.vue
    p to test hot module replacement.
</template>

<script setup>
import { defineProps, reactive } from 'vue'

import { api } from '@/utils'
import { Profile } from '@/entities/profile'

defineProps({
    msg: String
})
const state = reactive({
    count: 0,
    loaded: false,
    profile: null
})

state.profile = new Profile({
    email: 'donot@disturb.org',
    street: '123 strawberry ln',
    apt: 2,
    city: 'candyland',
    state: 'lollipop',
    zip: 90002
})
console.log(state.profile)
console.log(state.profile.isValid())
</script>

<style lang="postcss">
a
    color: #42b983
</style>
