<script setup lang="ts">
import Block from '~/components/pub/form/block.vue'
import FieldGroup from '~/components/pub/form/field-group.vue'
import Field from '~/components/pub/form/field.vue'
import Label from '~/components/pub/form/label.vue'
</script>

<template>
  <form id="entry-form">
    <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
      <Icon name="i-lucide-user" class="me-2" />
      <span class="font-semibold">Tambah</span> Pasien
    </div>

    <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
      <Block>
        <FieldGroup :column="3">
          <Label>Nama</Label>
          <Field>
            <Input type="text" name="name" />
          </Field>
        </FieldGroup>
        <FieldGroup :column="3">
          <Label>Nama</Label>
          <Field>
            <Input type="text" name="name" />
          </Field>
        </FieldGroup>
        <FieldGroup :column="3">
          <Label>Nomor RM</Label>
          <Field>
            <Input type="text" name="name" />
          </Field>
        </FieldGroup>
        <FieldGroup>
          <Label dynamic>Alamat</Label>
          <Field>
            <Input type="text" name="name" />
          </Field>
        </FieldGroup>
      </Block>
    </div>
    <div class="my-2 flex justify-end py-2">
      <PubNavFooterCsd />
    </div>
  </form>
</template>
