feat(sveltekit): Update docs for SDK setup with SvelteKit builtin Observability (#14770)

## DESCRIBE YOUR PR

This PR updates our SvelteKit docs to instruct users to set up the SDK
so that it takes advantage of Sveltekit's new builtin [observability
feature](https://svelte.dev/docs/kit/observability).

Specific updates:
- Getting Started page now recommends Kit@^2.31.0 
- Getting Started page includes Expandable with information for anyone
on an older Kit version (we of course still support older versions but
we still recommend upgrading)
- Added versioned Manual Setup page containing the old, hooks-based
setup. This has the version range `9.x-10.7.0` because support for Kit
observability was introduced in SDK version `10.8.0`
- Adjusted `latest` Manual Setup page to show instructions for Kit-o11y
setup and requiring Kit@^2.31.0 (again with note and link to versioned
page for anyone on older kit versions)
- Adjusted a bunch of highlight line segments which were outdated (how
does this keep happening 😭)

closes #14761

## IS YOUR CHANGE URGENT?  

Help us prioritize incoming PRs by letting us know when the change needs
to go live.
- [x] Urgent deadline (GA date, etc.): Ideally today lol (monday/tuesday
next week also fine)
- [ ] Other deadline: Some time week ending Sept 5th
- [ ] None: Not urgent, can wait up to 1 week+

## SLA

- Teamwork makes the dream work, so please add a reviewer to your PRs.
- Please give the docs team up to 1 week to review your PR unless you've
added an urgent due date to it.
Thanks in advance for your help!

## PRE-MERGE CHECKLIST

*Make sure you've checked the following before merging your changes:*

- [x] Checked Vercel preview for correctness, including links
- [ ] PR was reviewed and approved by any necessary SMEs (subject matter
experts)
- [ ] PR was reviewed and approved by a member of the [Sentry docs
team](https://github.com/orgs/getsentry/teams/docs)

Author: Lms24

docs/platforms/javascript/guides/sveltekit/index.mdx

@@ -29,7 +29,10 @@ This guide assumes that you enable all features and allow the wizard to create a
 
 - Creates or updates `hooks.(client|server).js` to initialize the SDK and instrument [SvelteKit's hooks](https://kit.svelte.dev/docs/hooks)
 - Creates or updates `vite.config.js` to add source maps upload and auto-instrumentation via Vite plugins
-- Creates `.sentryclirc` with an auth token to upload source maps (this file is automatically added to `.gitignore`)
+- If you're on SvelteKit `2.31.0` or higher:
+  - Creates `instrumentation.server.js` to initialize the server-side SDK
+  - Enables server-side instrumentation and tracing in `svelte.config.js`
+- Creates `.env.sentry-build-plugin` with an auth token to upload source maps (this file is automatically added to `.gitignore`)
 - Adds an example page to your application to help verify your Sentry setup
 
 </Expandable>

docs/platforms/javascript/guides/sveltekit/manual-setup.mdx

@@ -9,7 +9,46 @@ description: "Learn how to manually set up Sentry in your SvelteKit app and capt
   installer](/platforms/javascript/guides/sveltekit).
 </Alert>
 
-<PlatformContent includePath="getting-started-prerequisites" />
+## Prerequisites
+
+You need:
+
+- A Sentry [account](https://sentry.io/signup/) and [project](/product/projects/)
+- Your application up and running
+- SvelteKit version `2.31.0` or newer (see Note below)
+- Vite version `4.2` or newer
+
+<Expandable title="I'm on an older SvelteKit version than 2.31.0">
+
+Version `2.31.0` of SvelteKit, introduces [official support for observability and tracing](https://svelte.dev/docs/kit/observability). This means that Sentry can now follow the official best practise for how the SDK should be set up.
+For you this means:
+- The Sentry SDK will be initialized at the correct, earliest possible time on the server, allowing for all its auto instrumentation to work correctly.
+- The Sentry SDK picks up spans emitted from SvelteKit directly. You'll get more accurate insights into the performance of your handlers, server actions, `load` and remote functions.
+
+SvelteKit observability is still an experimental feature in SvelteKit 2.x but we recommend giving it a try. 
+The Sentry wizard, as well as this guide, will use it as the default way of setting up the SDK.
+
+If you've already set up the SDK and don't want to migrate to the new setup, or don't want to upgrade to SvelteKit `2.31.0` or higher, that's fine too. Just follow [this guide](../manual-setup__v10.7.0) instead.   
+
+</Expandable>
+
+
+<Expandable title="Notes on SvelteKit adapter compatibility">
+The SvelteKit Sentry SDK is designed to work out of the box with several SvelteKit adapters and their underlying server runtimes.
+Here's an overview of the current support:
+
+- **Fully supported Node.js runtimes**
+  - [Adapter-auto](https://kit.svelte.dev/docs/adapter-auto) for Vercel; other Node.js-based platforms might work, but we don't guarantee compatibility at this time
+  - [Adapter-vercel](https://kit.svelte.dev/docs/adapter-vercel) when used with Vercel's Node.js Lambda runtime
+  - [Adapter-node](https://kit.svelte.dev/docs/adapter-node)
+- **Supported non-Node.js runtimes**
+  - [Adapter-cloudflare](https://kit.svelte.dev/docs/adapter-cloudflare) requires [additional setup](/platforms/javascript/guides/cloudflare/frameworks/sveltekit/)
+- **Currently not supported**
+  - Non-Node.js server runtimes, such as Vercel's edge runtime, are not yet supported.
+- **Other adapters**
+  - Other SvelteKit adapters might work, but they're not currently officially supported. We're looking into extending first-class support to more adapters in the future.
+
+</Expandable>
 
 ## Step 1: Install
 
@@ -53,7 +92,7 @@ You need to initialize and configure the Sentry SDK in three places: the client
 
 Create a client hooks file `src/hooks.client.(js|ts)` in the `src` folder of your project if you don't have one already. In this file, import and initialize the Sentry SDK and add the `handleErrorWithSentry` function to the [`handleError` hook](https://svelte.dev/docs/kit/hooks#Shared-hooks-handleError).
 
-```javascript {filename:hooks.client.(js|ts)} {1, 3-28, 34}
+```javascript {filename:src/hooks.client.(js|ts)} {1, 3-43, 49}
 import * as Sentry from "@sentry/sveltekit";
 
 Sentry.init({
@@ -110,9 +149,32 @@ export const handleError = Sentry.handleErrorWithSentry(myErrorHandler);
 
 ### Configure Server-Side Sentry
 
-Create a server hooks file `src/hooks.server.(js|ts)` in the `src` folder of your project if you don't have one already. In this file, import and initialize the Sentry SDK and add the `handleErrorWithSentry` function to the [`handleError` hook](https://svelte.dev/docs/kit/hooks#Shared-hooks-handleError) and the Sentry request handler to the [`handle` hook](https://kit.svelte.dev/docs/hooks#server-hooks-handle).
+_Requires SvelteKit `2.31.0` or higher and `@sentry/sveltekit` `10.8.0` or higher._ If you're using older versions, check out [this guide](../manual-setup__v10.7.0#configure-server-side-sentry) instead.
 
-```javascript {filename:hooks.server.(js|ts)} {1, 3-18, 24, 28}
+Configure server-side instrumentation and tracing in your `svelte.config.js` file:
+
+```js {filename:svelte.config.js} {3-12}
+const config = {
+  kit: {
+    experimental: {
+      instrumentation: {
+        server: true
+      },
+      // ___PRODUCT_OPTION_START___ performance
+      tracing: {
+        server: true
+      },
+      // ___PRODUCT_OPTION_END___ performance
+    }
+  }
+};
+
+export default config;
+```
+
+Create an `src/instrumentation.server.(js|ts)` file (if you don't have one already) to initialize the server-side SDK:
+
+```js {filename:src/instrumentation.server.(js|ts)} {1, 3-23}
 import * as Sentry from "@sentry/sveltekit";
 
 Sentry.init({
@@ -136,6 +198,12 @@ Sentry.init({
   enableLogs: true,
   // ___PRODUCT_OPTION_END___ logs
 });
+```
+
+Create a server hooks file `src/hooks.server.(js|ts)` in the `src` folder of your project if you don't have one already. In this file, add the `handleErrorWithSentry` function to the [`handleError` hook](https://svelte.dev/docs/kit/hooks#Shared-hooks-handleError) and the Sentry request handler to the [`handle` hook](https://kit.svelte.dev/docs/hooks#server-hooks-handle).
+
+```javascript {filename:src/hooks.server.(js|ts)} {1,7,11}
+import * as Sentry from "@sentry/sveltekit";
 
 const myErrorHandler = ({ error, event }) => {
   console.error("An error occurred on the server side:", error, event);
@@ -175,7 +243,7 @@ export default defineConfig({
 
 To upload source maps for clear error stack traces, add your Sentry auth token, organization, and project slug in your `vite.config.(js|ts)` file:
 
-```javascript {filename:vite.config.(js|ts)} {6-11}
+```javascript {filename:vite.config.(js|ts)} {6-13}
 import { sveltekit } from "@sveltejs/kit/vite";
 import { sentrySvelteKit } from "@sentry/sveltekit";