add radio buttons to standard components options picker
This commit is contained in:
parent
b8d94c7cb5
commit
acd31618f2
|
@ -1841,6 +1841,22 @@
|
||||||
"key": "placeholder",
|
"key": "placeholder",
|
||||||
"placeholder": "Choose an option"
|
"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",
|
"type": "boolean",
|
||||||
"label": "Disabled",
|
"label": "Disabled",
|
||||||
|
|
|
@ -1,11 +1,12 @@
|
||||||
<script>
|
<script>
|
||||||
import { CoreSelect } from "@budibase/bbui"
|
import { CoreSelect, RadioGroup } from "@budibase/bbui"
|
||||||
import Field from "./Field.svelte"
|
import Field from "./Field.svelte"
|
||||||
|
|
||||||
export let field
|
export let field
|
||||||
export let label
|
export let label
|
||||||
export let placeholder
|
export let placeholder
|
||||||
export let disabled = false
|
export let disabled = false
|
||||||
|
export let optionsType = "select"
|
||||||
|
|
||||||
let fieldState
|
let fieldState
|
||||||
let fieldApi
|
let fieldApi
|
||||||
|
@ -22,6 +23,7 @@
|
||||||
bind:fieldSchema
|
bind:fieldSchema
|
||||||
>
|
>
|
||||||
{#if fieldState}
|
{#if fieldState}
|
||||||
|
{#if optionsType === 'select'}
|
||||||
<CoreSelect
|
<CoreSelect
|
||||||
value={$fieldState.value}
|
value={$fieldState.value}
|
||||||
id={$fieldState.fieldId}
|
id={$fieldState.fieldId}
|
||||||
|
@ -31,5 +33,15 @@
|
||||||
{placeholder}
|
{placeholder}
|
||||||
on:change={e => fieldApi.setValue(e.detail)}
|
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}
|
{/if}
|
||||||
</Field>
|
</Field>
|
||||||
|
|
Loading…
Reference in New Issue