chore: replace useId with $props.id() (#80)

Author: huntabyte

.changeset/unlucky-horses-wait.md

@@ -0,0 +1,5 @@
+---
+"paneforge": patch
+---
+
+replace `useId` with `$props.id()`

packages/paneforge/src/lib/components/pane-group.svelte

@@ -2,13 +2,14 @@
 	import { box, mergeProps } from "svelte-toolbelt";
 	import type { PaneGroupProps } from "./types.js";
 	import { noop } from "$lib/internal/helpers.js";
-	import { useId } from "$lib/internal/utils/useId.js";
 	import { defaultStorage, PaneGroupState } from "$lib/paneforge.svelte.js";
 
+	const uid = $props.id();
+
 	let {
 		autoSaveId = null,
 		direction,
-		id = useId(),
+		id = uid,
 		keyboardResizeBy = null,
 		onLayoutChange = noop,
 		storage = defaultStorage,
@@ -19,7 +20,7 @@
 	}: PaneGroupProps = $props();
 
 	const paneGroupState = PaneGroupState.create({
-		id: box.with(() => id ?? useId()),
+		id: box.with(() => id ?? uid),
 		ref: box.with(
 			() => ref,
 			(v) => (ref = v)

packages/paneforge/src/lib/components/pane-resizer.svelte

@@ -2,11 +2,12 @@
 	import { box, mergeProps } from "svelte-toolbelt";
 	import type { PaneResizerProps } from "./types.js";
 	import { noop } from "$lib/internal/helpers.js";
-	import { useId } from "$lib/internal/utils/useId.js";
 	import { PaneResizerState } from "$lib/paneforge.svelte.js";
 
+	const uid = $props.id();
+
 	let {
-		id = useId(),
+		id = uid,
 		ref = $bindable(null),
 		disabled = false,
 		onDraggingChange = noop,

packages/paneforge/src/lib/components/pane.svelte

@@ -2,11 +2,12 @@
 	import { box, mergeProps } from "svelte-toolbelt";
 	import type { PaneProps } from "./types.js";
 	import { noop } from "$lib/internal/helpers.js";
-	import { useId } from "$lib/internal/utils/useId.js";
 	import { PaneState } from "$lib/paneforge.svelte.js";
 
+	const uid = $props.id();
+
 	let {
-		id = useId(),
+		id = uid,
 		ref = $bindable(null),
 		collapsedSize,
 		collapsible,