Skip to content

Commit 38fcfde

Browse files
Sync svelte docs (#1158)
sync svelte docs Co-authored-by: svelte-docs-bot[bot] <196124396+svelte-docs-bot[bot]@users.noreply.github.com>
1 parent c8b83c6 commit 38fcfde

File tree

4 files changed

+35
-17
lines changed

4 files changed

+35
-17
lines changed

apps/svelte.dev/content/docs/svelte/02-runes/05-$props.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -200,3 +200,24 @@ You can, of course, separate the type declaration from the annotation:
200200
> [!NOTE] Interfaces for native DOM elements are provided in the `svelte/elements` module (see [Typing wrapper components](typescript#Typing-wrapper-components))
201201
202202
Adding types is recommended, as it ensures that people using your component can easily discover which props they should provide.
203+
204+
205+
## `$props.id()`
206+
207+
This rune, added in version 5.20.0, generates an ID that is unique to the current component instance. When hydrating a server-rendered component, the value will be consistent between server and client.
208+
209+
This is useful for linking elements via attributes like `for` and `aria-labelledby`.
210+
211+
```svelte
212+
<script>
213+
const uid = $props.id();
214+
</script>
215+
216+
<form>
217+
<label for="{uid}-firstname">First Name: </label>
218+
<input id="{uid}-firstname" type="text" />
219+
220+
<label for="{uid}-lastname">Last Name: </label>
221+
<input id="{uid}-lastname" type="text" />
222+
</form>
223+
```

apps/svelte.dev/content/docs/svelte/06-runtime/03-lifecycle-hooks.md

Lines changed: 0 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -46,21 +46,6 @@ If a function is returned from `onMount`, it will be called when the component i
4646
4747
## `onDestroy`
4848

49-
Schedules a callback to run immediately before the component is unmounted.
50-
51-
Out of `onMount`, `beforeUpdate`, `afterUpdate` and `onDestroy`, this is the
52-
only one that runs inside a server-side component.
53-
54-
<div class="ts-block">
55-
56-
```dts
57-
function onDestroy(fn: () => any): void;
58-
```
59-
60-
</div>
61-
62-
63-
6449
Schedules a callback to run immediately before the component is unmounted.
6550

6651
Out of `onMount`, `beforeUpdate`, `afterUpdate` and `onDestroy`, this is the only one that runs inside a server-side component.

apps/svelte.dev/content/docs/svelte/98-reference/.generated/compile-errors.md

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -573,7 +573,13 @@ Unrecognised compiler option %keypath%
573573
### props_duplicate
574574

575575
```
576-
Cannot use `$props()` more than once
576+
Cannot use `%rune%()` more than once
577+
```
578+
579+
### props_id_invalid_placement
580+
581+
```
582+
`$props.id()` can only be used at the top level of components as a variable declaration initializer
577583
```
578584

579585
### props_illegal_name

apps/svelte.dev/content/docs/svelte/98-reference/30-compiler-errors.md

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -578,7 +578,13 @@ Unrecognised compiler option %keypath%
578578
### props_duplicate
579579

580580
```
581-
Cannot use `$props()` more than once
581+
Cannot use `%rune%()` more than once
582+
```
583+
584+
### props_id_invalid_placement
585+
586+
```
587+
`$props.id()` can only be used at the top level of components as a variable declaration initializer
582588
```
583589

584590
### props_illegal_name

0 commit comments

Comments
 (0)