<script setup lang="ts">
import ItNavigationProgress from "@/components/ui/ItNavigationProgress.vue";

const props = defineProps<{
  step: number;
}>();
</script>

<template>
  <div class="flex h-screen flex-col">
    <div class="flex-grow scroll-smooth p-16 lg:overflow-auto">
      <ItNavigationProgress :steps="3" :current-step="props.step" />
      <slot name="content"></slot>
    </div>

    <div
      class="flex flex-wrap justify-end gap-4 px-4 py-4 sm:px-6"
      :class="{ 'border border-t': $slots.footer }"
    >
      <slot name="footer"></slot>
    </div>
  </div>
</template>
