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

Use custom logic

Browse source
This commit is contained in:
Gregor Wassmann 2021-12-28 22:57:42 +01:00
commit 1aa22d2522
2 changed files with 12 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/Checkbox/Checkbox.svelte
View file

@ -57,6 +57,16 @@
const dispatch = createEventDispatcher(); const dispatch = createEventDispatcher();
$: dispatch("check", checked); $: dispatch("check", checked);
$: checked = group.indexOf(value) >= 0;
const updateGroup = () => {
if (checked) {
group = [...group, value];
} else {
group.splice(group.indexOf(value), 1);
group = group;
}
};
</script> </script>
<!-- svelte-ignore a11y-mouse-events-have-key-events --> <!-- svelte-ignore a11y-mouse-events-have-key-events -->
@ -80,7 +90,6 @@
> >
<input <input
bind:this="{ref}" bind:this="{ref}"
bind:group
type="checkbox" type="checkbox"
value="{value}" value="{value}"
checked="{checked}" checked="{checked}"
@ -94,6 +103,7 @@
on:change="{() => { on:change="{() => {
checked = !checked; checked = !checked;
}}" }}"
on:change="{updateGroup}"
on:blur on:blur
/> />
<label for="{id}" title="{title}" class:bx--checkbox-label="{true}"> <label for="{id}" title="{title}" class:bx--checkbox-label="{true}">