aeria-options

This component renders a group of checkboxes (or radio inputs) depending on the property type.

Example

A radio-style option list.

a

b

c

Single choice

a

<script setup lang="ts">
const choice = ref('')
</script>

<template>
  <aeria-options
    v-model="choice"
    :property="{
      enum: [
        'a',
        'b',
        'c',
      ]
    }"
  ></aeria-options>
  <pre>Single choice: {{ choice }}</pre>
</template>

---

A select-style option list. Picked options will be appended to the beggining of the choice array.

a

b

c

Multiple choice

[]

<script setup lang="ts">
const choice = ref([])
</script>

<template>
  <aeria-options
    v-model="choice"
    :property="{
      type: 'array',
      items: {
        enum: [
          'a',
          'b',
          'c',
        ]
      }
    }"
  ></aeria-options>
  <pre>Multiple choice: {{ choice }}</pre>
</template>