@pzerelles/headlessui-svelte 2.1.2-next.42 → 2.1.2-next.43
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/hooks/use-controllable.svelte.js +1 -1
- package/dist/hooks/use-element-size.svelte.js +1 -1
- package/dist/hooks/use-focus-ring.svelte.js +1 -1
- package/dist/hooks/use-is-top-layer.svelte.js +2 -2
- package/dist/hooks/use-transition.svelte.js +2 -2
- package/dist/internal/frozen.svelte.js +1 -1
- package/dist/popover/Popover.svelte +4 -1
- package/dist/radio-group/RadioGroup.svelte +0 -1
- package/dist/utils/floating-ui/svelte/inner.svelte.js +1 -1
- package/dist/utils/floating-ui/svelte-dom/useFloating.svelte.js +6 -5
- package/package.json +38 -37
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export function useControllable(input, onchange, defaultValue) {
|
|
2
2
|
let internalValue = $state(defaultValue);
|
|
3
3
|
const isControlled = $derived(input.controlledValue !== undefined);
|
|
4
|
-
let wasControlled = isControlled;
|
|
4
|
+
let wasControlled = (() => isControlled)();
|
|
5
5
|
let didWarnOnUncontrolledToControlled = false;
|
|
6
6
|
let didWarnOnControlledToUncontrolled = false;
|
|
7
7
|
$effect(() => {
|
|
@@ -10,7 +10,7 @@ export function useElementSize(options) {
|
|
|
10
10
|
// compute the correct size as soon as possible. However, once the element is
|
|
11
11
|
// stable, we also want to watch for changes to the element. The `identity`
|
|
12
12
|
// state can be used to recompute the size.
|
|
13
|
-
let size = $state(computeSize(element));
|
|
13
|
+
let size = $state((() => computeSize(element))());
|
|
14
14
|
const observeSize = (element) => {
|
|
15
15
|
if (!element)
|
|
16
16
|
return;
|
|
@@ -2,7 +2,7 @@ import { isFocusVisible, useFocusVisibleListener } from "../utils/focusVisible.s
|
|
|
2
2
|
export const useFocusRing = (options = {}) => {
|
|
3
3
|
const { autofocus, within } = $derived(options);
|
|
4
4
|
let focused = $state(false);
|
|
5
|
-
let _isFocusVisible = $state(autofocus || isFocusVisible());
|
|
5
|
+
let _isFocusVisible = $state((() => autofocus || isFocusVisible())());
|
|
6
6
|
useFocusVisibleListener((isFocusVisible) => {
|
|
7
7
|
_isFocusVisible = isFocusVisible;
|
|
8
8
|
});
|
|
@@ -44,9 +44,9 @@ let hierarchyStores = new DefaultMap(() => createStore(() => [], {
|
|
|
44
44
|
*/
|
|
45
45
|
export function useIsTopLayer(options) {
|
|
46
46
|
const { enabled, scope } = $derived(options);
|
|
47
|
-
const hierarchyStore = hierarchyStores.get(scope);
|
|
47
|
+
const hierarchyStore = $derived(hierarchyStores.get(scope));
|
|
48
48
|
const id = useId();
|
|
49
|
-
let hierarchy = $state(hierarchyStore.getSnapshot());
|
|
49
|
+
let hierarchy = $state((() => hierarchyStore.getSnapshot())());
|
|
50
50
|
$effect(() => {
|
|
51
51
|
const unsubscribe = hierarchyStore.subscribe(() => {
|
|
52
52
|
hierarchy = hierarchyStore.getSnapshot();
|
|
@@ -37,8 +37,8 @@ export function transitionDataAttributes(data) {
|
|
|
37
37
|
}
|
|
38
38
|
export function useTransition(options) {
|
|
39
39
|
const { enabled, element, show, events } = $derived(options);
|
|
40
|
-
let visible = $state(show);
|
|
41
|
-
let flags = $state(enabled && visible ? TransitionState.Enter | TransitionState.Closed : TransitionState.None);
|
|
40
|
+
let visible = $state((() => show)());
|
|
41
|
+
let flags = $state((() => (enabled && visible ? TransitionState.Enter | TransitionState.Closed : TransitionState.None))());
|
|
42
42
|
let inFlight = $state(false);
|
|
43
43
|
let cancelled = $state(false);
|
|
44
44
|
const d = useDisposables();
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { untrack } from "svelte";
|
|
2
2
|
export function useFrozenData(options) {
|
|
3
3
|
const { freeze, data } = $derived(options);
|
|
4
|
-
let frozenValue = $state(data);
|
|
4
|
+
let frozenValue = $state((() => data)());
|
|
5
5
|
$effect(() => {
|
|
6
6
|
// We should keep updating the frozen value, as long as we shouldn't freeze
|
|
7
7
|
// the value yet. The moment we should freeze the value we stop updating it
|
|
@@ -114,7 +114,10 @@
|
|
|
114
114
|
)
|
|
115
115
|
}
|
|
116
116
|
|
|
117
|
-
$effect(() =>
|
|
117
|
+
$effect(() => {
|
|
118
|
+
registerBag
|
|
119
|
+
untrack(() => registerPopover?.(registerBag))
|
|
120
|
+
})
|
|
118
121
|
|
|
119
122
|
const nestedPortals = useNestedPortals()
|
|
120
123
|
const { portals } = $derived(nestedPortals)
|
|
@@ -90,7 +90,7 @@ export function useInnerOffset(options) {
|
|
|
90
90
|
const { context, props } = $derived(options);
|
|
91
91
|
const { open, elements } = $derived(context);
|
|
92
92
|
const { enabled = true, overflowRef, scrollRef, onChange: unstable_onChange } = $derived(props);
|
|
93
|
-
const onChange = unstable_onChange;
|
|
93
|
+
const onChange = (() => unstable_onChange)();
|
|
94
94
|
const controlledScrollingRef = $state({ current: false });
|
|
95
95
|
const prevScrollTopRef = $state({ current: null });
|
|
96
96
|
const initialOverflowRef = $state({ current: null });
|
|
@@ -12,16 +12,16 @@ import { stylePropsToString } from "../../style.js";
|
|
|
12
12
|
export function useFloating(options = {}) {
|
|
13
13
|
const { placement = "bottom", strategy = "absolute", middleware = [], platform, elements: externalElements = {}, transform = true, whileElementsMounted, open, } = $derived(options);
|
|
14
14
|
const { reference: externalReference, floating: externalFloating } = $derived(externalElements);
|
|
15
|
-
let data = $state({
|
|
15
|
+
let data = $state((() => ({
|
|
16
16
|
x: 0,
|
|
17
17
|
y: 0,
|
|
18
18
|
strategy,
|
|
19
19
|
placement,
|
|
20
20
|
middlewareData: {},
|
|
21
21
|
isPositioned: false,
|
|
22
|
-
});
|
|
22
|
+
}))());
|
|
23
23
|
const setData = (value) => (data = value);
|
|
24
|
-
let latestMiddleware = $state(middleware);
|
|
24
|
+
let latestMiddleware = $state((() => middleware)());
|
|
25
25
|
$effect(() => {
|
|
26
26
|
if (!deepEqual(latestMiddleware, middleware)) {
|
|
27
27
|
latestMiddleware = middleware;
|
|
@@ -45,8 +45,8 @@ export function useFloating(options = {}) {
|
|
|
45
45
|
const floatingEl = $derived(externalFloating || _floating);
|
|
46
46
|
const referenceRef = $state({ current: null });
|
|
47
47
|
const floatingRef = $state({ current: null });
|
|
48
|
-
const dataRef = $state({ current: data });
|
|
49
|
-
const hasWhileElementsMounted = whileElementsMounted != null;
|
|
48
|
+
const dataRef = $state((() => ({ current: data }))());
|
|
49
|
+
const hasWhileElementsMounted = $derived(whileElementsMounted != null);
|
|
50
50
|
const whileElementsMountedRef = useLatestRef({
|
|
51
51
|
get value() {
|
|
52
52
|
return whileElementsMounted;
|
|
@@ -107,6 +107,7 @@ export function useFloating(options = {}) {
|
|
|
107
107
|
};
|
|
108
108
|
});
|
|
109
109
|
$effect(() => {
|
|
110
|
+
hasWhileElementsMounted;
|
|
110
111
|
if (referenceEl)
|
|
111
112
|
referenceRef.current = referenceEl;
|
|
112
113
|
if (floatingEl)
|
package/package.json
CHANGED
|
@@ -1,6 +1,22 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pzerelles/headlessui-svelte",
|
|
3
|
-
"version": "2.1.2-next.
|
|
3
|
+
"version": "2.1.2-next.43",
|
|
4
|
+
"scripts": {
|
|
5
|
+
"dev": "vite dev",
|
|
6
|
+
"build": "vite build && npm run package",
|
|
7
|
+
"preview": "vite preview",
|
|
8
|
+
"package": "svelte-kit sync && svelte-package && publint",
|
|
9
|
+
"package:watch": "svelte-package --watch",
|
|
10
|
+
"prepublishOnly": "bun run package",
|
|
11
|
+
"test": "bun run test:integration && npm run test:unit",
|
|
12
|
+
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
|
|
13
|
+
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
|
|
14
|
+
"lint": "prettier --check . && eslint .",
|
|
15
|
+
"format": "prettier --write .",
|
|
16
|
+
"test:integration": "playwright test",
|
|
17
|
+
"test:unit": "vitest",
|
|
18
|
+
"release": "bun run package && changeset publish"
|
|
19
|
+
},
|
|
4
20
|
"exports": {
|
|
5
21
|
".": {
|
|
6
22
|
"types": "./dist/index.d.ts",
|
|
@@ -16,38 +32,38 @@
|
|
|
16
32
|
"svelte": "^5.0.0"
|
|
17
33
|
},
|
|
18
34
|
"devDependencies": {
|
|
19
|
-
"@changesets/cli": "^2.
|
|
20
|
-
"@changesets/types": "^6.
|
|
21
|
-
"@playwright/test": "^1.50.
|
|
22
|
-
"@pzerelles/heroicons-svelte": "^2.
|
|
35
|
+
"@changesets/cli": "^2.28.1",
|
|
36
|
+
"@changesets/types": "^6.1.0",
|
|
37
|
+
"@playwright/test": "^1.50.1",
|
|
38
|
+
"@pzerelles/heroicons-svelte": "^2.2.0",
|
|
23
39
|
"@sveltejs/adapter-auto": "^3.3.1",
|
|
24
|
-
"@sveltejs/kit": "^2.
|
|
25
|
-
"@sveltejs/package": "^2.3.
|
|
26
|
-
"@sveltejs/vite-plugin-svelte": "^
|
|
40
|
+
"@sveltejs/kit": "^2.17.2",
|
|
41
|
+
"@sveltejs/package": "^2.3.10",
|
|
42
|
+
"@sveltejs/vite-plugin-svelte": "^5.0.3",
|
|
27
43
|
"@testing-library/jest-dom": "^6.6.3",
|
|
28
|
-
"@testing-library/svelte": "^5.2.
|
|
44
|
+
"@testing-library/svelte": "^5.2.7",
|
|
29
45
|
"@types/eslint": "^9.6.1",
|
|
30
|
-
"@types/node": "^
|
|
46
|
+
"@types/node": "^22.13.5",
|
|
31
47
|
"autoprefixer": "^10.4.20",
|
|
32
|
-
"eslint": "^9.
|
|
48
|
+
"eslint": "^9.21.0",
|
|
33
49
|
"eslint-config-prettier": "^9.1.0",
|
|
34
50
|
"eslint-plugin-svelte": "^2.46.1",
|
|
35
|
-
"globals": "^
|
|
51
|
+
"globals": "^16.0.0",
|
|
36
52
|
"jsdom": "^25.0.1",
|
|
37
53
|
"outdent": "^0.8.0",
|
|
38
|
-
"postcss": "^8.5.
|
|
39
|
-
"prettier": "^3.
|
|
54
|
+
"postcss": "^8.5.3",
|
|
55
|
+
"prettier": "^3.5.2",
|
|
40
56
|
"prettier-plugin-svelte": "^3.3.3",
|
|
41
57
|
"prettier-plugin-tailwindcss": "^0.6.11",
|
|
42
|
-
"publint": "^0.3.
|
|
43
|
-
"svelte": "^5.
|
|
58
|
+
"publint": "^0.3.6",
|
|
59
|
+
"svelte": "^5.20.2",
|
|
44
60
|
"svelte-check": "^4.1.4",
|
|
45
61
|
"tailwindcss": "^3.4.17",
|
|
46
62
|
"tslib": "^2.8.1",
|
|
47
63
|
"typescript": "^5.7.3",
|
|
48
|
-
"typescript-eslint": "^8.
|
|
49
|
-
"vite": "^
|
|
50
|
-
"vitest": "^
|
|
64
|
+
"typescript-eslint": "^8.24.1",
|
|
65
|
+
"vite": "^6.1.1",
|
|
66
|
+
"vitest": "^3.0.6"
|
|
51
67
|
},
|
|
52
68
|
"dependencies": {
|
|
53
69
|
"@floating-ui/core": "^1.6.9",
|
|
@@ -55,24 +71,9 @@
|
|
|
55
71
|
"@floating-ui/utils": "^0.2.9",
|
|
56
72
|
"clsx": "^2.1.1",
|
|
57
73
|
"esm-env": "^1.2.2",
|
|
58
|
-
"nanoid": "^5.0
|
|
74
|
+
"nanoid": "^5.1.0"
|
|
59
75
|
},
|
|
60
76
|
"svelte": "./dist/index.js",
|
|
61
77
|
"types": "./dist/index.d.ts",
|
|
62
|
-
"type": "module"
|
|
63
|
-
|
|
64
|
-
"dev": "vite dev",
|
|
65
|
-
"build": "vite build && npm run package",
|
|
66
|
-
"preview": "vite preview",
|
|
67
|
-
"package": "svelte-kit sync && svelte-package && publint",
|
|
68
|
-
"package:watch": "svelte-package --watch",
|
|
69
|
-
"test": "npm run test:integration && npm run test:unit",
|
|
70
|
-
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
|
|
71
|
-
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
|
|
72
|
-
"lint": "prettier --check . && eslint .",
|
|
73
|
-
"format": "prettier --write .",
|
|
74
|
-
"test:integration": "playwright test",
|
|
75
|
-
"test:unit": "vitest",
|
|
76
|
-
"release": "pnpm package && changeset publish"
|
|
77
|
-
}
|
|
78
|
-
}
|
|
78
|
+
"type": "module"
|
|
79
|
+
}
|