<script setup lang="ts">
import type { Controls } from '../controls'
import Control from './Control.vue'

const {
  controls,
} = defineProps<{
  controls: Controls
}>()
</script>

<template>
  <div
    class="tw:w-full tw:grid tw:gap-x-2 tw:gap-y-1 tw:py-2 tw:items-baseline"
    style="grid-template-columns: 80px minmax(0, 1fr);"
  >
    <Control v-for="control in controls" :key="control.key" :control />
  </div>
</template>

<style scoped></style>
