<template>
  <div class="form-table tw-grid tw-items-start tw-gap-3">
    <slot />
  </div>
</template>

<script lang="ts" setup>
import { provide } from 'vue'

provide('formGroupClass', 'tw-contents')
</script>

<script lang="ts">
export default {
  compatConfig: {
    MODE: 3,
  },
}
</script>

<style scoped>
.form-table {
  grid-template-columns: fit-content(200px) minmax(0, 2fr);
}

.form-table:deep(.form-group-description) {
  @apply tw-flex-col;
}
</style>