mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 10:21:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(checkbox): fix two-way binding (#1042)

Browse source 
Fixes #967
This commit is contained in:
metonym 2022-01-26 19:04:32 -08:00 • committed by GitHub
commit 048ebc7b81
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 13 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/Checkbox/Checkbox.svelte
View file

@ -16,7 +16,7 @@
* Specify the bound group
* @type {any[]}
*/
export let group = [];
export let group = undefined;
/** Specify whether the checkbox is indeterminate */
export let indeterminate = false;
@ -59,6 +59,8 @@
const dispatch = createEventDispatcher();
$: useGroup = Array.isArray(group);
$: checked = useGroup ? group.includes(value) : checked;
$: dispatch("check", checked);
</script>
@ -85,7 +87,7 @@
bind:this="{ref}"
type="checkbox"
value="{value}"
checked="{checked || group.includes(value)}"
checked="{checked}"
disabled="{disabled}"
id="{id}"
indeterminate="{indeterminate}"
@ -94,10 +96,13 @@
readonly="{readonly}"
class:bx--checkbox="{true}"
on:change="{() => {
checked = !checked;
group = group.includes(value)
? group.filter((_value) => _value !== value)
: [...group, value];
if (useGroup) {
group = group.includes(value)
? group.filter((_value) => _value !== value)
: [...group, value];
} else {
checked = !checked;
}
}}"
on:change
on:blur