bits-ui 1.4.7 → 1.4.8

package/dist/bits/checkbox/checkbox.svelte.js

@@ -16,8 +16,9 @@ class CheckboxGroupState {
         if (!checkboxValue)
             return;
         if (!this.opts.value.current.includes(checkboxValue)) {
-            this.opts.value.current.push(checkboxValue);
-            this.opts.onValueChange.current(this.opts.value.current);
+            const newValue = [...$state.snapshot(this.opts.value.current), checkboxValue];
+            this.opts.value.current = newValue;
+            this.opts.onValueChange.current(newValue);
         }
     }
     removeValue(checkboxValue) {
@@ -26,8 +27,9 @@ class CheckboxGroupState {
         const index = this.opts.value.current.indexOf(checkboxValue);
         if (index === -1)
             return;
-        this.opts.value.current.splice(index, 1);
-        this.opts.onValueChange.current(this.opts.value.current);
+        const newValue = this.opts.value.current.filter((v) => v !== checkboxValue);
+        this.opts.value.current = newValue;
+        this.opts.onValueChange.current(newValue);
     }
     props = $derived.by(() => ({
         id: this.opts.id.current,

package/dist/bits/checkbox/components/checkbox-group.svelte

@@ -28,9 +28,9 @@
 		required: box.with(() => Boolean(required)),
 		name: box.with(() => name),
 		value: box.with(
-			() => value,
+			() => $state.snapshot(value),
 			(v) => {
-				value = v;
+				value = $state.snapshot(v);
 				onValueChange(v);
 			}
 		),

package/dist/bits/checkbox/components/checkbox.svelte

@@ -4,6 +4,7 @@
 	import { CheckboxGroupContext, useCheckboxRoot } from "../checkbox.svelte.js";
 	import CheckboxInput from "./checkbox-input.svelte";
 	import { useId } from "../../../internal/use-id.js";
+	import { watch } from "runed";
 
 	let {
 		checked = $bindable(false),
@@ -32,6 +33,19 @@
 		}
 	}
 
+	watch.pre(
+		() => value,
+		() => {
+			if (group && value) {
+				if (group.opts.value.current.includes(value)) {
+					checked = true;
+				} else {
+					checked = false;
+				}
+			}
+		}
+	);
+
 	const rootState = useCheckboxRoot(
 		{
 			checked: box.with(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bits-ui",
-  "version": "1.4.7",
+  "version": "1.4.8",
   "license": "MIT",
   "repository": "github:huntabyte/bits-ui",
   "funding": "https://github.com/sponsors/huntabyte",