From 0ac66b485779d681978535c4572e3925978754da Mon Sep 17 00:00:00 2001
From: Eric Liu <ericyl.us@gmail.com>
Date: Tue, 25 Jan 2022 21:10:48 -0800
Subject: [PATCH] breaking(checkbox): use group to determine if checked only if
 type is an array

Potential solution to #967
---
 src/Checkbox/Checkbox.svelte | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/Checkbox/Checkbox.svelte b/src/Checkbox/Checkbox.svelte
index 224da129..5f6c74c7 100644
--- a/src/Checkbox/Checkbox.svelte
+++ b/src/Checkbox/Checkbox.svelte
@@ -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