mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-21 12:49:20 +00:00
breaking(text-input): bind:value, support null type for value
This commit is contained in:
parent
4c1277d920
commit
173d416f14
1 changed files with 9 additions and 10 deletions
|
@ -6,14 +6,14 @@
|
||||||
export let size = undefined;
|
export let size = undefined;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Specify the input value
|
* Specify the input value.
|
||||||
* @type {number | string}
|
*
|
||||||
|
* `value` will be set to `null` if type="number"
|
||||||
|
* and the value is empty.
|
||||||
|
* @type {null | number | string}
|
||||||
*/
|
*/
|
||||||
export let value = "";
|
export let value = "";
|
||||||
|
|
||||||
/** Specify the input type */
|
|
||||||
export let type = "";
|
|
||||||
|
|
||||||
/** Specify the placeholder text */
|
/** Specify the placeholder text */
|
||||||
export let placeholder = "";
|
export let placeholder = "";
|
||||||
|
|
||||||
|
@ -75,6 +75,9 @@
|
||||||
$: isFluid = !!ctx && ctx.isFluid;
|
$: isFluid = !!ctx && ctx.isFluid;
|
||||||
$: errorId = `error-${id}`;
|
$: errorId = `error-${id}`;
|
||||||
$: warnId = `warn-${id}`;
|
$: warnId = `warn-${id}`;
|
||||||
|
$: if ($$restProps.type === "number" && value !== "") {
|
||||||
|
value = value === "" ? null : Number(value);
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- svelte-ignore a11y-mouse-events-have-key-events -->
|
<!-- svelte-ignore a11y-mouse-events-have-key-events -->
|
||||||
|
@ -162,8 +165,7 @@
|
||||||
id="{id}"
|
id="{id}"
|
||||||
name="{name}"
|
name="{name}"
|
||||||
placeholder="{placeholder}"
|
placeholder="{placeholder}"
|
||||||
type="{type}"
|
bind:value
|
||||||
value="{value ?? ''}"
|
|
||||||
required="{required}"
|
required="{required}"
|
||||||
readonly="{readonly}"
|
readonly="{readonly}"
|
||||||
class:bx--text-input="{true}"
|
class:bx--text-input="{true}"
|
||||||
|
@ -174,9 +176,6 @@
|
||||||
class="{size && `bx--text-input--${size}`}"
|
class="{size && `bx--text-input--${size}`}"
|
||||||
on:change
|
on:change
|
||||||
on:input
|
on:input
|
||||||
on:input="{({ target }) => {
|
|
||||||
value = type === 'number' ? Number(target.value) : target.value;
|
|
||||||
}}"
|
|
||||||
on:keydown
|
on:keydown
|
||||||
on:keyup
|
on:keyup
|
||||||
on:focus
|
on:focus
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue