From c2952818488267e900f060d2eab58b354f97524b Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 10 Oct 2024 17:19:56 -0400
Subject: [PATCH] remove backticks from headers, now that they are getting
 rendered

---
 .../03-reactivity-fundamentals.md                |  6 +++---
 .../docs/02-template-syntax/08-bindings.md       |  2 +-
 .../02-template-syntax/09-special-elements.md    | 16 ++++++++--------
 documentation/docs/03-runes/01-state.md          | 10 +++++-----
 documentation/docs/03-runes/02-side-effects.md   | 12 ++++++------
 documentation/docs/04-runtime/01-stores.md       | 10 +++++-----
 .../docs/04-runtime/03-lifecycle-hooks.md        |  8 ++++----
 .../04-runtime/04-imperative-component-api.md    |  8 ++++----
 documentation/docs/05-misc/01-debugging.md       |  2 +-
 documentation/docs/05-misc/03-typescript.md      | 10 +++++-----
 10 files changed, 42 insertions(+), 42 deletions(-)

diff --git a/documentation/docs/01-introduction/03-reactivity-fundamentals.md b/documentation/docs/01-introduction/03-reactivity-fundamentals.md
index fd884d22dc..e2038fade5 100644
--- a/documentation/docs/01-introduction/03-reactivity-fundamentals.md
+++ b/documentation/docs/01-introduction/03-reactivity-fundamentals.md
@@ -12,7 +12,7 @@ Runes are function-like symbols that provide instructions to the Svelte compiler
 
 The following sections introduce the most important runes for declare state, derived state and side effects at a high level. For more details refer to the later sections on [state](state) and [side effects](side-effects).
 
-## `$state`
+## $state
 
 Reactive state is declared with the `$state` rune:
 
@@ -53,7 +53,7 @@ class Todo {
 > </button>
 > ```
 
-## `$derived`
+## $derived
 
 Derived state is declared with the `$derived` rune:
 
@@ -92,7 +92,7 @@ As with `$state`, you can mark class fields as `$derived`.
 >
 > This only worked at the top level of a component.
 
-## `$effect`
+## $effect
 
 To run _side-effects_ when the component is mounted to the DOM, and when values change, we can use the `$effect` rune ([demo](/#H4sIAAAAAAAAE31T24rbMBD9lUG7kAQ2sbdlX7xOYNk_aB_rQhRpbAsU2UiTW0P-vbrYubSlYGzmzMzROTPymdVKo2PFjzMzfIusYB99z14YnfoQuD1qQh-7bmdFQEonrOppVZmKNBI49QthCc-OOOH0LZ-9jxnR6c7eUpOnuv6KeT5JFdcqbvbcBcgDz1jXKGg6ncFyBedYR6IzLrAZwiN5vtSxaJA-EzadfJEjKw11C6GR22-BLH8B_wxdByWpvUYtqqal2XB6RVkG1CoHB6U1WJzbnYFDiwb3aGEdDa3Bm1oH12sQLTcNPp7r56m_00mHocSG97_zd7ICUXonA5fwKbPbkE2ZtMJGGVkEdctzQi4QzSwr9prnFYNk5hpmqVuqPQjNnfOJoMF22lUsrq_UfIN6lfSVyvQ7grB3X2mjMZYO3XO9w-U5iLx42qg29md3BP_ni5P4gy9ikTBlHxjLzAtPDlyYZmRdjAbGq7HprEQ7p64v4LU_guu0kvAkhBim3nMplWl8FreQD-CW20aZR0wq12t-KqDWeBywhvexKC3memmDwlHAv9q4Vo2ZK8KtK0CgX7u9J8wXbzdKv-nRnfF_2baTqlYoWUF2h5efl9-n0O6koAMAAA==)):
 
diff --git a/documentation/docs/02-template-syntax/08-bindings.md b/documentation/docs/02-template-syntax/08-bindings.md
index cabbc45969..7bac2ea560 100644
--- a/documentation/docs/02-template-syntax/08-bindings.md
+++ b/documentation/docs/02-template-syntax/08-bindings.md
@@ -74,7 +74,7 @@ If you're using `bind:` directives together with `on` event attributes, the bind
 
 Here we were binding to the value of a text input, which uses the `input` event. Bindings on other elements may use different events such as `change`.
 
-## Binding `<select>` value
+## Binding <select> value
 
 A `<select>` value binding corresponds to the `value` property on the selected `<option>`, which can be any value (not just strings, as is normally the case in the DOM).
 
diff --git a/documentation/docs/02-template-syntax/09-special-elements.md b/documentation/docs/02-template-syntax/09-special-elements.md
index 2b41d55fe4..e6735c0efe 100644
--- a/documentation/docs/02-template-syntax/09-special-elements.md
+++ b/documentation/docs/02-template-syntax/09-special-elements.md
@@ -6,7 +6,7 @@ title: Special elements
 
 Some of Svelte's concepts need special elements. Those are prefixed with `svelte:` and listed here.
 
-## `<svelte:self>`
+## <svelte:self>
 
 The `<svelte:self>` element allows a component to include itself, recursively.
 
@@ -25,7 +25,7 @@ It cannot appear at the top level of your markup; it must be inside an if or eac
 {/if}
 ```
 
-## `<svelte:component>`
+## <svelte:component>
 
 ```svelte
 <svelte:component this={expression} />
@@ -39,7 +39,7 @@ If `this` is falsy, no component is rendered.
 <svelte:component this={currentSelection.component} foo={bar} />
 ```
 
-## `<svelte:element>`
+## <svelte:element>
 
 ```svelte
 <svelte:element this={expression} />
@@ -69,7 +69,7 @@ Svelte tries its best to infer the correct namespace from the element's surround
 <svelte:element this={tag} xmlns="http://www.w3.org/2000/svg" />
 ```
 
-## `<svelte:window>`
+## <svelte:window>
 
 ```svelte
 <svelte:window onevent={handler} />
@@ -112,7 +112,7 @@ All except `scrollX` and `scrollY` are readonly.
 
 > Note that the page will not be scrolled to the initial value to avoid accessibility issues. Only subsequent changes to the bound variable of `scrollX` and `scrollY` will cause scrolling. However, if the scrolling behaviour is desired, call `scrollTo()` in `onMount()`.
 
-## `<svelte:document>`
+## <svelte:document>
 
 ```svelte
 <svelte:document onevent={handler} />
@@ -139,7 +139,7 @@ You can also bind to the following properties:
 
 All are readonly.
 
-## `<svelte:body>`
+## <svelte:body>
 
 ```svelte
 <svelte:body onevent={handler} />
@@ -153,7 +153,7 @@ As with `<svelte:window>` and `<svelte:document>`, this element may only appear
 <svelte:body onmouseenter={handleMouseenter} onmouseleave={handleMouseleave} use:someAction />
 ```
 
-## `<svelte:head>`
+## <svelte:head>
 
 ```svelte
 <svelte:head>...</svelte:head>
@@ -170,7 +170,7 @@ As with `<svelte:window>`, `<svelte:document>` and `<svelte:body>`, this element
 </svelte:head>
 ```
 
-## `<svelte:options>`
+## <svelte:options>
 
 ```svelte
 <svelte:options option={value} />
diff --git a/documentation/docs/03-runes/01-state.md b/documentation/docs/03-runes/01-state.md
index 7bcff2c968..79c64cdf78 100644
--- a/documentation/docs/03-runes/01-state.md
+++ b/documentation/docs/03-runes/01-state.md
@@ -6,7 +6,7 @@ Svelte 5 uses _runes_, a powerful set of primitives for controlling reactivity i
 
 Runes are function-like symbols that provide instructions to the Svelte compiler. You don't need to import them from anywhere — when you use Svelte, they're part of the language. This page describes the runes that are concerned with managing state in your application.
 
-## `$state`
+## $state
 
 The `$state` rune is the at the heart of the runes API. It is used to declare reactive state:
 
@@ -62,7 +62,7 @@ Objects and arrays are made deeply reactive by wrapping them with [`Proxies`](ht
 
 > Only POJOs (plain old JavaScript objects) are made deeply reactive. Reactivity will stop at class boundaries and leave those alone
 
-## `$state.raw`
+## $state.raw
 
 State declared with `$state.raw` cannot be mutated; it can only be _reassigned_. In other words, rather than assigning to a property of an object, or using an array method like `push`, replace the object or array altogether if you'd like to update it:
 
@@ -84,7 +84,7 @@ person = {
 
 This can improve performance with large arrays and objects that you weren't planning to mutate anyway, since it avoids the cost of making them reactive. Note that raw state can _contain_ reactive state (for example, a raw array of reactive objects).
 
-## `$state.snapshot`
+## $state.snapshot
 
 To take a static snapshot of a deeply reactive `$state` proxy, use `$state.snapshot`:
 
@@ -101,7 +101,7 @@ To take a static snapshot of a deeply reactive `$state` proxy, use `$state.snaps
 
 This is handy when you want to pass some state to an external library or API that doesn't expect a proxy, such as `structuredClone`.
 
-## `$derived`
+## $derived
 
 Derived state is declared with the `$derived` rune:
 
@@ -122,7 +122,7 @@ The expression inside `$derived(...)` should be free of side-effects. Svelte wil
 
 As with `$state`, you can mark class fields as `$derived`.
 
-## `$derived.by`
+## $derived.by
 
 Sometimes you need to create complex derivations that don't fit inside a short expression. In these cases, you can use `$derived.by` which accepts a function as its argument.
 
diff --git a/documentation/docs/03-runes/02-side-effects.md b/documentation/docs/03-runes/02-side-effects.md
index 3d425f8ee3..560955e7ff 100644
--- a/documentation/docs/03-runes/02-side-effects.md
+++ b/documentation/docs/03-runes/02-side-effects.md
@@ -7,7 +7,7 @@ title: Side effects
 
 Side effects play a crucial role in applications. They are triggered by state changes and can then interact with external systems, like logging something, setting up a server connection or synchronize with a third-party library that has no knowledge of Svelte's reactivity model.
 
-## `$effect` fundamentals
+## $effect fundamentals
 
 To run _side-effects_ when the component is mounted to the DOM, and when values change, we can use the `$effect` rune ([demo](/#H4sIAAAAAAAAE31T24rbMBD9lUG7kAQ2sbdlX7xOYNk_aB_rQhRpbAsU2UiTW0P-vbrYubSlYGzmzMzROTPymdVKo2PFjzMzfIusYB99z14YnfoQuD1qQh-7bmdFQEonrOppVZmKNBI49QthCc-OOOH0LZ-9jxnR6c7eUpOnuv6KeT5JFdcqbvbcBcgDz1jXKGg6ncFyBedYR6IzLrAZwiN5vtSxaJA-EzadfJEjKw11C6GR22-BLH8B_wxdByWpvUYtqqal2XB6RVkG1CoHB6U1WJzbnYFDiwb3aGEdDa3Bm1oH12sQLTcNPp7r56m_00mHocSG97_zd7ICUXonA5fwKbPbkE2ZtMJGGVkEdctzQi4QzSwr9prnFYNk5hpmqVuqPQjNnfOJoMF22lUsrq_UfIN6lfSVyvQ7grB3X2mjMZYO3XO9w-U5iLx42qg29md3BP_ni5P4gy9ikTBlHxjLzAtPDlyYZmRdjAbGq7HprEQ7p64v4LU_guu0kvAkhBim3nMplWl8FreQD-CW20aZR0wq12t-KqDWeBywhvexKC3memmDwlHAv9q4Vo2ZK8KtK0CgX7u9J8wXbzdKv-nRnfF_2baTqlYoWUF2h5efl9-n0O6koAMAAA==)):
 
@@ -63,7 +63,7 @@ You can return a function from `$effect`, which will run immediately before the
 <button onclick={() => (milliseconds /= 2)}>faster</button>
 ```
 
-## `$effect` dependencies
+## $effect dependencies
 
 `$effect` automatically picks up any reactivy values (`$state`, `$derived`, `$props`) that are _synchronously_ read inside its function body and registers them as dependencies. When those dependencies change, the `$effect` schedules a rerun.
 
@@ -139,7 +139,7 @@ $effect(() => {
 });
 ```
 
-## When not to use `$effect`
+## When not to use $effect
 
 In general, `$effect` is best considered something of an escape hatch — useful for things like analytics and direct DOM manipulation — rather than a tool you should use frequently. In particular, avoid using it to synchronise state. Instead of this...
 
@@ -254,7 +254,7 @@ If you need to use bindings, for whatever reason (for example when you want some
 
 If you absolutely have to update `$state` within an effect and run into an infinite loop because you read and write to the same `$state`, use [untrack](svelte#untrack).
 
-## `$effect.pre`
+## $effect.pre
 
 In rare cases, you may need to run code _before_ the DOM updates. For this we can use the `$effect.pre` rune:
 
@@ -291,7 +291,7 @@ In rare cases, you may need to run code _before_ the DOM updates. For this we ca
 
 Apart from the timing, `$effect.pre` works exactly like [`$effect`](#$effect) — refer to its documentation for more info.
 
-## `$effect.tracking`
+## $effect.tracking
 
 The `$effect.tracking` rune is an advanced feature that tells you whether or not the code is running inside a tracking context, such as an effect or inside your template ([demo](/#H4sIAAAAAAAAE3XP0QrCMAwF0F-JRXAD595rLfgdzodRUyl0bVgzQcb-3VYFQfExl5tDMgvrPCYhT7MI_YBCiiOR2Aq-UxnSDT1jnlOcRlMSlczoiHUXOjYxpOhx5-O12rgAJg4UAwaGhDyR3Gxhjdai4V1v2N2wqus9tC3Y3ifMQjbehaqq4aBhLtEv_Or893icCsdLve-Caj8nBkU67zMO5HtGCfM3sKiWNKhV0zwVaBqd3x3ixVmHFyFLuJyXB-moOe8pAQAA)):
 
@@ -355,7 +355,7 @@ export default function readable<T>(
 }
 ```
 
-## `$effect.root`
+## $effect.root
 
 The `$effect.root` rune is an advanced feature that creates a non-tracked scope that doesn't auto-cleanup. This is useful for
 nested effects that you want to manually control. This rune also allows for creation of effects outside of the component initialisation phase.
diff --git a/documentation/docs/04-runtime/01-stores.md b/documentation/docs/04-runtime/01-stores.md
index a6c3be06c3..4bef3423d0 100644
--- a/documentation/docs/04-runtime/01-stores.md
+++ b/documentation/docs/04-runtime/01-stores.md
@@ -44,7 +44,7 @@ Stores are still a good solution when you have complex asynchronous data streams
 
 The `svelte/store` module contains a minimal store implementation which fulfil the store contract. It provides methods for creating stores that you can update from the outside, stores you can only update from the inside, and for combining and deriving stores.
 
-### `writable`
+### writable
 
 Function that creates a store which has values that can be set from 'outside' components. It gets created as an object with additional `set` and `update` methods.
 
@@ -89,7 +89,7 @@ unsubscribe(); // logs 'no more subscribers'
 
 Note that the value of a `writable` is lost when it is destroyed, for example when the page is refreshed. However, you can write your own logic to sync the value to for example the `localStorage`.
 
-### `readable`
+### readable
 
 Creates a store whose value cannot be set from 'outside', the first argument is the store's initial value, and the second argument to `readable` is the same as the second argument to `writable`.
 
@@ -115,7 +115,7 @@ const ticktock = readable('tick', (set, update) => {
 });
 ```
 
-### `derived`
+### derived
 
 Derives a store from one or more other stores. The callback runs initially when the first subscriber subscribes and then whenever the store dependencies change.
 
@@ -229,7 +229,7 @@ const delayed = derived([a, b], ([$a, $b], set) => {
 });
 ```
 
-### `readonly`
+### readonly
 
 This simple helper function makes a store readonly. You can still subscribe to the changes from the original one using this new readable store.
 
@@ -246,7 +246,7 @@ writableStore.set(2); // console: 2
 readableStore.set(2); // ERROR
 ```
 
-### `get`
+### get
 
 Generally, you should read the value of a store by subscribing to it and using the value as it changes over time. Occasionally, you may need to retrieve the value of a store to which you're not subscribed. `get` allows you to do so.
 
diff --git a/documentation/docs/04-runtime/03-lifecycle-hooks.md b/documentation/docs/04-runtime/03-lifecycle-hooks.md
index b4af4e5df7..cfb9990c3f 100644
--- a/documentation/docs/04-runtime/03-lifecycle-hooks.md
+++ b/documentation/docs/04-runtime/03-lifecycle-hooks.md
@@ -9,7 +9,7 @@ title: Lifecycle hooks
 
 In Svelte 5, the component lifecycle consists of only two parts: Its creation and its destruction. Everything in-between - when certain state is updated - is not related to the component as a whole, only the parts that need to react to the state change are notified. This is because under the hood the smallest unit of change is actually not a component, it's the (render) effects that the component sets up upon component initialization. Consequently, there's no such thing as a "before update"/"after update" hook.
 
-## `onMount`
+## onMount
 
 The `onMount` function schedules a callback to run as soon as the component has been mounted to the DOM. It must be called during the component's initialisation (but doesn't need to live _inside_ the component; it can be called from an external module).
 
@@ -43,7 +43,7 @@ If a function is returned from `onMount`, it will be called when the component i
 
 > This behaviour will only work when the function passed to `onMount` _synchronously_ returns a value. `async` functions always return a `Promise`, and as such cannot _synchronously_ return a function.
 
-## `onDestroy`
+## onDestroy
 
 > EXPORT_SNIPPET: svelte#onDestroy
 
@@ -61,7 +61,7 @@ Out of `onMount`, `beforeUpdate`, `afterUpdate` and `onDestroy`, this is the onl
 </script>
 ```
 
-## `tick`
+## tick
 
 While there's no "after update" hook, you can use `tick` to ensure that the UI is updated before continuing. `tick` returns a promise that resolves once any pending state changes have been applied, or in the next microtask if there are none.
 
@@ -77,7 +77,7 @@ While there's no "after update" hook, you can use `tick` to ensure that the UI i
 </script>
 ```
 
-## Deprecated: `beforeUpdate` / `afterUpdate`
+## Deprecated: beforeUpdate/afterUpdate
 
 Svelte 4 contained hooks that ran before and after the component as a whole was updated. For backwards compatibility, these hooks were shimmed in Svelte 5 but not available inside components that use runes.
 
diff --git a/documentation/docs/04-runtime/04-imperative-component-api.md b/documentation/docs/04-runtime/04-imperative-component-api.md
index b4517bd34f..1594ae9e2d 100644
--- a/documentation/docs/04-runtime/04-imperative-component-api.md
+++ b/documentation/docs/04-runtime/04-imperative-component-api.md
@@ -12,7 +12,7 @@ better title needed?
 
 Every Svelte application starts by imperatively creating a root component. On the client this component is mounted to a specific element. On the server, you want to get back a string of HTML instead which you can render. The following functions help you achieve those tasks.
 
-## `mount`
+## mount
 
 Instantiates a component and mounts it to the given target:
 
@@ -31,7 +31,7 @@ You can mount multiple components per page, and you can also mount from within y
 
 Note that unlike calling `new App(...)` in Svelte 4, things like effects (including `onMount` callbacks, and action functions) will not run during `mount`. If you need to force pending effects to run (in the context of a test, for example) you can do so with `flushSync()`.
 
-## `unmount`
+## unmount
 
 Unmounts a component created with [`mount`](#mount) or [`hydrate`](#hydrate):
 
@@ -46,7 +46,7 @@ const app = mount(App, {...});
 unmount(app);
 ```
 
-## `render`
+## render
 
 Only available on the server and when compiling with the `server` option. Takes a component and returns an object with `body` and `head` properties on it, which you can use to populate the HTML when server-rendering your app:
 
@@ -62,7 +62,7 @@ result.body; // HTML for somewhere in this <body> tag
 result.head; // HTML for somewhere in this <head> tag
 ```
 
-## `hydrate`
+## hydrate
 
 Like `mount`, but will reuse up any HTML rendered by Svelte's SSR output (from the [`render`](#server-render) function) inside the target and make it interactive:
 
diff --git a/documentation/docs/05-misc/01-debugging.md b/documentation/docs/05-misc/01-debugging.md
index f07baa13fd..428cd066af 100644
--- a/documentation/docs/05-misc/01-debugging.md
+++ b/documentation/docs/05-misc/01-debugging.md
@@ -7,7 +7,7 @@ title: Debugging
 
 Svelte provides two built-in ways to debug your application.
 
-## `$inspect`
+## $inspect
 
 The `$inspect` rune is roughly equivalent to `console.log`, with the exception that it will re-run whenever its
 argument changes. `$inspect` tracks reactive state deeply, meaning that updating something inside an object
diff --git a/documentation/docs/05-misc/03-typescript.md b/documentation/docs/05-misc/03-typescript.md
index 10f0dd30eb..1d95c36984 100644
--- a/documentation/docs/05-misc/03-typescript.md
+++ b/documentation/docs/05-misc/03-typescript.md
@@ -10,7 +10,7 @@ title: TypeScript
 
 You can use TypeScript within Svelte components. IDE extensions like the [Svelte VS Code extension](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode) will help you catch errors right in your editor, and [`svelte-check`](https://www.npmjs.com/package/svelte-check) does the same on the command line, which you can integrate into your CI.
 
-## `<script lang="ts">`
+## <script lang="ts">
 
 To use TypeScript inside your Svelte components, add `lang="ts"` to your `script` tags:
 
@@ -77,7 +77,7 @@ If you're using tools like Rollup or Webpack instead, install their respective S
 
 > If you're starting a new project, we recommend using SvelteKit or Vite instead
 
-## Typing `$props`
+## Typing $props
 
 Type `$props` just like a regular object with certain properties.
 
@@ -107,7 +107,7 @@ Type `$props` just like a regular object with certain properties.
 </button>
 ```
 
-## Generic `$props`
+## Generic $props
 
 Components can declare a generic relationship between their properties. One example is a generic list component that receives a list of items and a callback property that reveives an item from the list. To declare that the `items` property and the `select` callback operate on the same types, add the `generics` attribute to the `script` tag:
 
@@ -130,7 +130,7 @@ Components can declare a generic relationship between their properties. One exam
 
 The content of `generics` is what you would put between the `<...>` tags of a generic function. In other words, you can use multiple generics, `extends` and fallback types.
 
-## Typing `$state`
+## Typing $state
 
 You can type `$state` like any other variable.
 
@@ -157,7 +157,7 @@ class Counter {
 }
 ```
 
-## The `Component` type
+## The Component type
 
 Svelte components or of type `Component`. You can use it and its related types to express a variety of constraints.