<template>
<form method="post" @submit.prevent="create">
  <h1>Create your character</h1>
  <div>
    <label for="name">Name</label>
    <input v-model="name" type="text" name="name" id="name">
  </div>
  <div>
    <button>Create</button>
  </div>
</form>
</template>

<script setup lang="ts">
import { useSocketStore } from '@/stores/socket'
import { ref, defineEmits } from 'vue'

const socket = useSocketStore();

// const emit = defineEmits(['character:create']);
let name: any = ref('');

function create() {
  socket.getConnection.emit('character:create', { name: name.value });
  // emit('character:create');
  name.value = '';
}
</script>