bits-ui 2.8.2 → 2.8.3

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

@@ -56,7 +56,11 @@ export class CheckboxGroupLabelState {
     constructor(opts, group) {
         this.opts = opts;
         this.group = group;
-        this.attachment = attachRef(this.opts.ref, (v) => (this.group.labelId = v?.id));
+        this.group.labelId = this.opts.id.current;
+        this.attachment = attachRef(this.opts.ref);
+        watch.pre(() => this.opts.id.current, (id) => {
+            this.group.labelId = id;
+        });
     }
     props = $derived.by(() => ({
         id: this.opts.id.current,

package/dist/bits/collapsible/collapsible.svelte.d.ts

@@ -12,6 +12,7 @@ export declare class CollapsibleRootState {
     readonly opts: CollapsibleRootStateOpts;
     readonly attachment: RefAttachment;
     contentNode: HTMLElement | null;
+    contentId: string | undefined;
     constructor(opts: CollapsibleRootStateOpts);
     toggleOpen(): void;
     readonly props: {

package/dist/bits/collapsible/collapsible.svelte.js

@@ -15,6 +15,7 @@ export class CollapsibleRootState {
     opts;
     attachment;
     contentNode = $state(null);
+    contentId = $state(undefined);
     constructor(opts) {
         this.opts = opts;
         this.toggleOpen = this.toggleOpen.bind(this);
@@ -54,7 +55,11 @@ export class CollapsibleContentState {
         this.opts = opts;
         this.root = root;
         this.#isMountAnimationPrevented = root.opts.open.current;
+        this.root.contentId = this.opts.id.current;
         this.attachment = attachRef(this.opts.ref, (v) => (this.root.contentNode = v));
+        watch.pre(() => this.opts.id.current, (id) => {
+            this.root.contentId = id;
+        });
         $effect.pre(() => {
             const rAF = requestAnimationFrame(() => {
                 this.#isMountAnimationPrevented = false;
@@ -142,7 +147,7 @@ export class CollapsibleTriggerState {
         id: this.opts.id.current,
         type: "button",
         disabled: this.#isDisabled,
-        "aria-controls": this.root.contentNode?.id,
+        "aria-controls": this.root.contentId,
         "aria-expanded": getAriaExpanded(this.root.opts.open.current),
         "data-state": getDataOpenClosed(this.root.opts.open.current),
         "data-disabled": getDataDisabled(this.#isDisabled),

package/dist/bits/dialog/dialog.svelte.js

@@ -1,5 +1,5 @@
 import { attachRef, box, } from "svelte-toolbelt";
-import { Context } from "runed";
+import { Context, watch } from "runed";
 import { createBitsAttrs, getAriaExpanded, getDataOpenClosed } from "../../internal/attrs.js";
 import { kbd } from "../../internal/kbd.js";
 import { OpenChangeComplete } from "../../internal/open-change-complete.js";
@@ -165,7 +165,11 @@ export class DialogTitleState {
     constructor(opts, root) {
         this.opts = opts;
         this.root = root;
-        this.attachment = attachRef(this.opts.ref, (v) => (this.root.titleId = v?.id));
+        this.root.titleId = this.opts.id.current;
+        this.attachment = attachRef(this.opts.ref);
+        watch.pre(() => this.opts.id.current, (id) => {
+            this.root.titleId = id;
+        });
     }
     props = $derived.by(() => ({
         id: this.opts.id.current,
@@ -186,9 +190,12 @@ export class DialogDescriptionState {
     constructor(opts, root) {
         this.opts = opts;
         this.root = root;
+        this.root.descriptionId = this.opts.id.current;
         this.attachment = attachRef(this.opts.ref, (v) => {
             this.root.descriptionNode = v;
-            this.root.descriptionId = v?.id;
+        });
+        watch.pre(() => this.opts.id.current, (id) => {
+            this.root.descriptionId = id;
         });
     }
     props = $derived.by(() => ({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bits-ui",
-  "version": "2.8.2",
+  "version": "2.8.3",
   "license": "MIT",
   "repository": "github:huntabyte/bits-ui",
   "funding": "https://github.com/sponsors/huntabyte",
@@ -19,30 +19,28 @@
     "!dist/**/*.spec.*"
   ],
   "devDependencies": {
-    "@internationalized/date": "^3.8.1",
-    "@sveltejs/kit": "^2.21.1",
+    "@internationalized/date": "^3.8.2",
+    "@sveltejs/kit": "^2.21.5",
     "@sveltejs/package": "^2.3.11",
-    "@sveltejs/vite-plugin-svelte": "5.0.3",
+    "@sveltejs/vite-plugin-svelte": "^5.1.0",
     "@types/css.escape": "^1.5.2",
     "@types/node": "^20.17.6",
     "@types/resize-observer-browser": "^0.1.11",
     "csstype": "^3.1.3",
-    "jest-axe": "^9.0.0",
     "jsdom": "^24.1.3",
     "publint": "^0.2.12",
-    "svelte": "^5.33.2",
-    "svelte-check": "^4.2.1",
-    "tslib": "^2.8.1",
+    "svelte": "5.33.2",
+    "svelte-check": "^4.2.2",
     "typescript": "^5.8.3",
     "vite": "^6.3.5",
-    "vitest": "^3.1.4"
+    "vitest": "3.2.3"
   },
   "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "type": "module",
   "dependencies": {
-    "@floating-ui/core": "^1.7.0",
-    "@floating-ui/dom": "^1.7.0",
+    "@floating-ui/core": "^1.7.1",
+    "@floating-ui/dom": "^1.7.1",
     "css.escape": "^1.5.1",
     "esm-env": "^1.1.2",
     "runed": "^0.28.0",
@@ -54,7 +52,6 @@
     "svelte": "^5.33.0"
   },
   "engines": {
-    "pnpm": ">=8.7.0",
     "node": ">=20"
   },
   "sideEffects": false,