<script setup lang="ts">
import { procedureRoomTypeCodes } from '~/const/key-val/clinical'

const model = defineModel()
model.value = 'procedure'

const emit = defineEmits<{
  pick: [type_code: string]
}>()

function pick(type_code: string) {
  model.value = type_code
  emit('pick', type_code)
}

</script>

<template>
  <div class="mb-5">
    <div class="font-semibold text-sm 2xl:text-base mb-2">
      Jenis Ruang Tindakan
    </div>
    <div class="-mx-1 [&_button]:mx-1 ">
      <Button v-for="item, key in procedureRoomTypeCodes" :variant="model === key ? 'default' : 'outline'" @click="pick(key)">
        {{ item }}
      </Button>
    </div>
  </div>
</template>
