Add readonly prop to combobox

This commit is contained in:
Andrew Kingston 2021-11-23 16:40:31 +00:00
parent 4145f6eccc
commit 24a700f391
3 changed files with 8 additions and 4 deletions

View File

@ -6,6 +6,7 @@
export let value = null export let value = null
export let label = undefined export let label = undefined
export let disabled = false export let disabled = false
export let readonly = false
export let labelPosition = "above" export let labelPosition = "above"
export let error = null export let error = null
export let placeholder = "Choose an option or type" export let placeholder = "Choose an option or type"
@ -33,6 +34,7 @@
{value} {value}
{options} {options}
{placeholder} {placeholder}
{readonly}
{getOptionLabel} {getOptionLabel}
{getOptionValue} {getOptionValue}
on:change={onChange} on:change={onChange}

View File

@ -9,6 +9,7 @@
export let id = null export let id = null
export let placeholder = "Choose an option or type" export let placeholder = "Choose an option or type"
export let disabled = false export let disabled = false
export let readonly = false
export let error = null export let error = null
export let options = [] export let options = []
export let getOptionLabel = option => option export let getOptionLabel = option => option
@ -73,6 +74,7 @@
value={value || ""} value={value || ""}
placeholder={placeholder || ""} placeholder={placeholder || ""}
{disabled} {disabled}
{readonly}
class="spectrum-Textfield-input spectrum-InputGroup-input" class="spectrum-Textfield-input spectrum-InputGroup-input"
/> />
</div> </div>

View File

@ -16,15 +16,15 @@
const dispatch = createEventDispatcher() const dispatch = createEventDispatcher()
let focus = false let focus = false
const updateValue = value => { const updateValue = newValue => {
if (readonly) { if (readonly) {
return return
} }
if (type === "number") { if (type === "number") {
const float = parseFloat(value) const float = parseFloat(newValue)
value = isNaN(float) ? null : float newValue = isNaN(float) ? null : float
} }
dispatch("change", value) dispatch("change", newValue)
} }
const onFocus = () => { const onFocus = () => {