@pzerelles/headlessui-svelte 2.1.2-next.41 → 2.1.2-next.43

package/dist/hooks/use-controllable.svelte.js

@@ -1,7 +1,7 @@
 export function useControllable(input, onchange, defaultValue) {
     let internalValue = $state(defaultValue);
     const isControlled = $derived(input.controlledValue !== undefined);
-    let wasControlled = isControlled;
+    let wasControlled = (() => isControlled)();
     let didWarnOnUncontrolledToControlled = false;
     let didWarnOnControlledToUncontrolled = false;
     $effect(() => {

package/dist/hooks/use-element-size.svelte.js

@@ -10,7 +10,7 @@ export function useElementSize(options) {
     // compute the correct size as soon as possible. However, once the element is
     // stable, we also want to watch for changes to the element. The `identity`
     // state can be used to recompute the size.
-    let size = $state(computeSize(element));
+    let size = $state((() => computeSize(element))());
     const observeSize = (element) => {
         if (!element)
             return;

package/dist/hooks/use-focus-ring.svelte.js

@@ -2,7 +2,7 @@ import { isFocusVisible, useFocusVisibleListener } from "../utils/focusVisible.s
 export const useFocusRing = (options = {}) => {
     const { autofocus, within } = $derived(options);
     let focused = $state(false);
-    let _isFocusVisible = $state(autofocus || isFocusVisible());
+    let _isFocusVisible = $state((() => autofocus || isFocusVisible())());
     useFocusVisibleListener((isFocusVisible) => {
         _isFocusVisible = isFocusVisible;
     });

package/dist/hooks/use-is-top-layer.svelte.js

@@ -44,9 +44,9 @@ let hierarchyStores = new DefaultMap(() => createStore(() => [], {
  */
 export function useIsTopLayer(options) {
     const { enabled, scope } = $derived(options);
-    const hierarchyStore = hierarchyStores.get(scope);
+    const hierarchyStore = $derived(hierarchyStores.get(scope));
     const id = useId();
-    let hierarchy = $state(hierarchyStore.getSnapshot());
+    let hierarchy = $state((() => hierarchyStore.getSnapshot())());
     $effect(() => {
         const unsubscribe = hierarchyStore.subscribe(() => {
             hierarchy = hierarchyStore.getSnapshot();

package/dist/hooks/use-transition.svelte.js

@@ -37,8 +37,8 @@ export function transitionDataAttributes(data) {
 }
 export function useTransition(options) {
     const { enabled, element, show, events } = $derived(options);
-    let visible = $state(show);
-    let flags = $state(enabled && visible ? TransitionState.Enter | TransitionState.Closed : TransitionState.None);
+    let visible = $state((() => show)());
+    let flags = $state((() => (enabled && visible ? TransitionState.Enter | TransitionState.Closed : TransitionState.None))());
     let inFlight = $state(false);
     let cancelled = $state(false);
     const d = useDisposables();

package/dist/internal/frozen.svelte.js

@@ -1,7 +1,7 @@
 import { untrack } from "svelte";
 export function useFrozenData(options) {
     const { freeze, data } = $derived(options);
-    let frozenValue = $state(data);
+    let frozenValue = $state((() => data)());
     $effect(() => {
         // We should keep updating the frozen value, as long as we shouldn't freeze
         // the value yet. The moment we should freeze the value we stop updating it

package/dist/listbox/ListboxOptions.svelte

@@ -329,6 +329,7 @@
       "aria-multiselectable": data.mode === ValueMode.Multi ? true : undefined,
       "aria-labelledby": labelledby,
       "aria-orientation": data.orientation,
+      onkeydown: handleKeyDown,
       role: "listbox",
       // When the `Listbox` is closed, it should not be focusable. This allows us
       // to skip focusing the `ListboxOptions` when pressing the tab key on an

package/dist/popover/Popover.svelte

@@ -114,7 +114,10 @@
     )
   }
 
-  $effect(() => registerPopover?.(registerBag))
+  $effect(() => {
+    registerBag
+    untrack(() => registerPopover?.(registerBag))
+  })
 
   const nestedPortals = useNestedPortals()
   const { portals } = $derived(nestedPortals)

package/dist/radio-group/RadioGroup.svelte

@@ -97,7 +97,6 @@
   }
 
   const handleKeyDown = (event: KeyboardEvent) => {
-    console.log("handleKeyDown", event, element)
     let container = element
     if (!container) return
 

package/dist/utils/floating-ui/svelte/inner.svelte.js

@@ -90,7 +90,7 @@ export function useInnerOffset(options) {
     const { context, props } = $derived(options);
     const { open, elements } = $derived(context);
     const { enabled = true, overflowRef, scrollRef, onChange: unstable_onChange } = $derived(props);
-    const onChange = unstable_onChange;
+    const onChange = (() => unstable_onChange)();
     const controlledScrollingRef = $state({ current: false });
     const prevScrollTopRef = $state({ current: null });
     const initialOverflowRef = $state({ current: null });

package/dist/utils/floating-ui/svelte-dom/useFloating.svelte.js

@@ -12,16 +12,16 @@ import { stylePropsToString } from "../../style.js";
 export function useFloating(options = {}) {
     const { placement = "bottom", strategy = "absolute", middleware = [], platform, elements: externalElements = {}, transform = true, whileElementsMounted, open, } = $derived(options);
     const { reference: externalReference, floating: externalFloating } = $derived(externalElements);
-    let data = $state({
+    let data = $state((() => ({
         x: 0,
         y: 0,
         strategy,
         placement,
         middlewareData: {},
         isPositioned: false,
-    });
+    }))());
     const setData = (value) => (data = value);
-    let latestMiddleware = $state(middleware);
+    let latestMiddleware = $state((() => middleware)());
     $effect(() => {
         if (!deepEqual(latestMiddleware, middleware)) {
             latestMiddleware = middleware;
@@ -45,8 +45,8 @@ export function useFloating(options = {}) {
     const floatingEl = $derived(externalFloating || _floating);
     const referenceRef = $state({ current: null });
     const floatingRef = $state({ current: null });
-    const dataRef = $state({ current: data });
-    const hasWhileElementsMounted = whileElementsMounted != null;
+    const dataRef = $state((() => ({ current: data }))());
+    const hasWhileElementsMounted = $derived(whileElementsMounted != null);
     const whileElementsMountedRef = useLatestRef({
         get value() {
             return whileElementsMounted;
@@ -107,6 +107,7 @@ export function useFloating(options = {}) {
         };
     });
     $effect(() => {
+        hasWhileElementsMounted;
         if (referenceEl)
             referenceRef.current = referenceEl;
         if (floatingEl)

package/package.json

@@ -1,6 +1,22 @@
 {
   "name": "@pzerelles/headlessui-svelte",
-  "version": "2.1.2-next.41",
+  "version": "2.1.2-next.43",
+  "scripts": {
+    "dev": "vite dev",
+    "build": "vite build && npm run package",
+    "preview": "vite preview",
+    "package": "svelte-kit sync && svelte-package && publint",
+    "package:watch": "svelte-package --watch",
+    "prepublishOnly": "bun run package",
+    "test": "bun run test:integration && npm run test:unit",
+    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+    "lint": "prettier --check . && eslint .",
+    "format": "prettier --write .",
+    "test:integration": "playwright test",
+    "test:unit": "vitest",
+    "release": "bun run package && changeset publish"
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -16,38 +32,38 @@
     "svelte": "^5.0.0"
   },
   "devDependencies": {
-    "@changesets/cli": "^2.27.11",
-    "@changesets/types": "^6.0.0",
-    "@playwright/test": "^1.49.1",
-    "@pzerelles/heroicons-svelte": "^2.1.5",
+    "@changesets/cli": "^2.28.1",
+    "@changesets/types": "^6.1.0",
+    "@playwright/test": "^1.50.1",
+    "@pzerelles/heroicons-svelte": "^2.2.0",
     "@sveltejs/adapter-auto": "^3.3.1",
-    "@sveltejs/kit": "^2.15.3",
-    "@sveltejs/package": "^2.3.7",
-    "@sveltejs/vite-plugin-svelte": "^4.0.4",
+    "@sveltejs/kit": "^2.17.2",
+    "@sveltejs/package": "^2.3.10",
+    "@sveltejs/vite-plugin-svelte": "^5.0.3",
     "@testing-library/jest-dom": "^6.6.3",
-    "@testing-library/svelte": "^5.2.6",
+    "@testing-library/svelte": "^5.2.7",
     "@types/eslint": "^9.6.1",
-    "@types/node": "^20.17.13",
+    "@types/node": "^22.13.5",
     "autoprefixer": "^10.4.20",
-    "eslint": "^9.18.0",
+    "eslint": "^9.21.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-svelte": "^2.46.1",
-    "globals": "^15.14.0",
+    "globals": "^16.0.0",
     "jsdom": "^25.0.1",
     "outdent": "^0.8.0",
-    "postcss": "^8.5.1",
-    "prettier": "^3.4.2",
+    "postcss": "^8.5.3",
+    "prettier": "^3.5.2",
     "prettier-plugin-svelte": "^3.3.3",
-    "prettier-plugin-tailwindcss": "^0.6.9",
-    "publint": "^0.3.2",
-    "svelte": "^5.18.0",
+    "prettier-plugin-tailwindcss": "^0.6.11",
+    "publint": "^0.3.6",
+    "svelte": "^5.20.2",
     "svelte-check": "^4.1.4",
     "tailwindcss": "^3.4.17",
     "tslib": "^2.8.1",
     "typescript": "^5.7.3",
-    "typescript-eslint": "^8.20.0",
-    "vite": "^5.4.11",
-    "vitest": "^2.1.8"
+    "typescript-eslint": "^8.24.1",
+    "vite": "^6.1.1",
+    "vitest": "^3.0.6"
   },
   "dependencies": {
     "@floating-ui/core": "^1.6.9",
@@ -55,24 +71,9 @@
     "@floating-ui/utils": "^0.2.9",
     "clsx": "^2.1.1",
     "esm-env": "^1.2.2",
-    "nanoid": "^5.0.9"
+    "nanoid": "^5.1.0"
   },
   "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",
-  "type": "module",
-  "scripts": {
-    "dev": "vite dev",
-    "build": "vite build && npm run package",
-    "preview": "vite preview",
-    "package": "svelte-kit sync && svelte-package && publint",
-    "package:watch": "svelte-package --watch",
-    "test": "npm run test:integration && npm run test:unit",
-    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
-    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
-    "lint": "prettier --check . && eslint .",
-    "format": "prettier --write .",
-    "test:integration": "playwright test",
-    "test:unit": "vitest",
-    "release": "pnpm package && changeset publish"
-  }
-}
+  "type": "module"
+}