add radio buttons to standard components options picker

This commit is contained in:
Maurits Lourens 2021-08-03 21:30:06 +02:00
parent b8d94c7cb5
commit acd31618f2
2 changed files with 38 additions and 10 deletions

View File

@ -1841,6 +1841,22 @@
"key": "placeholder",
"placeholder": "Choose an option"
},
{
"type": "select",
"label": "Type",
"key": "optionsType",
"placeholder": "Pick an options type",
"options": [
{
"label": "Select",
"value": "select"
},
{
"label": "Radio buttons",
"value": "radio"
}
]
},
{
"type": "boolean",
"label": "Disabled",

View File

@ -1,11 +1,12 @@
<script>
import { CoreSelect } from "@budibase/bbui"
import { CoreSelect, RadioGroup } from "@budibase/bbui"
import Field from "./Field.svelte"
export let field
export let label
export let placeholder
export let disabled = false
export let optionsType = "select"
let fieldState
let fieldApi
@ -22,6 +23,7 @@
bind:fieldSchema
>
{#if fieldState}
{#if optionsType === 'select'}
<CoreSelect
value={$fieldState.value}
id={$fieldState.fieldId}
@ -31,5 +33,15 @@
{placeholder}
on:change={e => fieldApi.setValue(e.detail)}
/>
{:else if optionsType === 'radio'}
<RadioGroup
value={$fieldState.value}
id={$fieldState.fieldId}
disabled={$fieldState.disabled}
error={$fieldState.error}
options={fieldSchema?.constraints?.inclusion ?? []}
on:change={e => fieldApi.setValue(e.detail)}
/>
{/if}
{/if}
</Field>