Browse Source

Add readonly prop to combobox

pull/4089/head
Andrew Kingston 5 years ago
parent
commit
24a700f391
  1. 2
      packages/bbui/src/Form/Combobox.svelte
  2. 2
      packages/bbui/src/Form/Core/Combobox.svelte
  3. 8
      packages/bbui/src/Form/Core/TextField.svelte

2
packages/bbui/src/Form/Combobox.svelte

@ -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}

2
packages/bbui/src/Form/Core/Combobox.svelte

@ -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>

8
packages/bbui/src/Form/Core/TextField.svelte

@ -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 = () => {

Loading…
Cancel
Save