<template>
  <fieldset>
    <linear-layout orientation="vertical" lwidth="match-parent">
      <base-heading>{{ label }}</base-heading>
      <slot />
    </linear-layout>
  </fieldset>
</template>

<script lang="ts">
import { Vue, Component, Prop } from 'vue-property-decorator'

import BaseHeading from '../content/BaseHeading.vue'
import LinearLayout from '../../layouts/LinearLayout.vue'

@Component({
  name: 'base-fieldset',
  components: {
    BaseHeading,
    LinearLayout
  }
})
export default class BaseFieldset extends Vue {
  @Prop({ default: '' }) label!: string
}
</script>

<style lang="scss" scoped>
@import "../../core/base/bulma.scss";
@import "bulma/sass/form/shared.sass";
@import "bulma/sass/form/tools.sass";
</style>
