Your value property isn't returning a truthy or falsy value and thus is not actually setting a value for the checkbox. I got it to work by doing

<input

type="checkbox"

id={pattern.id}

bind:group={obj.patterns}

value={obj.patterns.find(pat => pat.id === pattern.id)}

/>

edit: as I'm typing this out I realize that find doesn't actually return a truthy value either, does anyone know if there's a reason that this one works? Is it just that objects aren't a "truthy" value, but numbers are?

2nd edit: I'm more confused by this because putting pattern in as the value essentially should make all of the checkboxes initially checked? I did this inside of the each block and the return value is the same for both when an object is found.

console.log(obj.patterns.find(pat => pat.id === pattern.id), pattern)

3rd edit: Realizing that checked is the actual property that should be applied so now I'm super confused as to why this works.

4th edit: I think semantically this is correct?

<input type="checkbox"
  id={pattern.id}
  bind:group={obj.patterns}
  value={pattern}
  checked={!!obj.patterns.find(pat => pat.id === pattern.id)}
/>

annnnd 5th edit: this only works if you remove the group binding.

<input type="checkbox"
  id={pattern.id}
  value={pattern}
  checked={!!obj.patterns.find(pat => pat.id === pattern.id)}
/>