<template>
  <q-card flat class="full-width q-pa-none">
    <q-card-section class="full-width">
      <div class="row items-center">
        <div class="col">
          <div class="text-h5">{{ t("WEL") }}</div>
        </div>
        <div class="col-auto">
          <q-btn color="primary" label="Avanti" @click="goNext" />
        </div>
        </div>
        <q-separator class="q-my-sm" />
     <pre>{{ JSON.stringify(step, null, 2) }}</pre>
    </q-card-section>


  </q-card>
</template>

<script setup lang="ts">
import { useI18n } from 'vue-i18n'
import type { StepDescriptor } from '../../types/types'

const props = defineProps<{ step: StepDescriptor }>()
const emit = defineEmits(['next'])

const step = props.step
const { t } = useI18n()

function goNext() {
  emit('next', step?.next)
}
</script>
<style scoped>
.q-card { width: 100%; margin: 0; }
</style>
