Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion documentation/docs/03-template-syntax/01-basic-markup.md
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,7 @@ Timing-wise, event attributes always fire after events from bindings (e.g. `onin

When using `ontouchstart` and `ontouchmove` event attributes, the handlers are [passive](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#using_passive_listeners) for better performance. This greatly improves responsiveness by allowing the browser to scroll the document immediately, rather than waiting to see if the event handler calls `event.preventDefault()`.

In the very rare cases that you need to prevent these event defaults, you should use [`on`](https://svelte-5-preview.vercel.app/docs/imports#svelte-events) instead (for example inside an action).
In the very rare cases that you need to prevent these event defaults, you should use [`on`](svelte-events#on) instead (for example inside an action).

### Event delegation

Expand Down
2 changes: 1 addition & 1 deletion documentation/docs/07-misc/07-v5-migration-guide.md
Original file line number Diff line number Diff line change
Expand Up @@ -727,7 +727,7 @@ This is no longer true in Svelte 5:

When using `onwheel`, `onmousewheel`, `ontouchstart` and `ontouchmove` event attributes, the handlers are [passive](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#using_passive_listeners) to align with browser defaults. This greatly improves responsiveness by allowing the browser to scroll the document immediately, rather than waiting to see if the event handler calls `event.preventDefault()`.

In the very rare cases that you need to prevent these event defaults, you should use [`on`](/docs/svelte/svelte-events#on) instead (for example inside an action).
In the very rare cases that you need to prevent these event defaults, you should use [`on`](svelte-events#on) instead (for example inside an action).

### Attribute/prop syntax is stricter

Expand Down
4 changes: 2 additions & 2 deletions documentation/docs/98-reference/.generated/client-errors.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,13 +19,13 @@ A component is attempting to bind to a non-bindable property `%key%` belonging t
### component_api_changed

```
%parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
%parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information
```

### component_api_invalid_new

```
Attempted to instantiate %component% with `new %name%`, which is no longer valid in Svelte 5. If this component is not under your control, set the `compatibility.componentApi` compiler option to `4` to keep it working. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
Attempted to instantiate %component% with `new %name%`, which is no longer valid in Svelte 5. If this component is not under your control, set the `compatibility.componentApi` compiler option to `4` to keep it working. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information
```

### derived_references_self
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ Your `console.%method%` contained `$state` proxies. Consider using `$inspect(...

When logging a [proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy), browser devtools will log the proxy itself rather than the value it represents. In the case of Svelte, the 'target' of a `$state` proxy might not resemble its current value, which can be confusing.

The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte-5-preview.vercel.app/docs/runes#$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte-5-preview.vercel.app/docs/runes#$state-snapshot) to take a snapshot of the current value.
The easiest way to log a value as it changes over time is to use the [`$inspect`]($inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`]($state#$state.snapshot) to take a snapshot of the current value.

### event_handler_invalid

Expand Down
4 changes: 2 additions & 2 deletions packages/svelte/messages/client-errors/errors.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,11 @@

## component_api_changed

> %parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
> %parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information

## component_api_invalid_new

> Attempted to instantiate %component% with `new %name%`, which is no longer valid in Svelte 5. If this component is not under your control, set the `compatibility.componentApi` compiler option to `4` to keep it working. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
> Attempted to instantiate %component% with `new %name%`, which is no longer valid in Svelte 5. If this component is not under your control, set the `compatibility.componentApi` compiler option to `4` to keep it working. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information

## derived_references_self

Expand Down
2 changes: 1 addition & 1 deletion packages/svelte/messages/client-warnings/warnings.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@

When logging a [proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy), browser devtools will log the proxy itself rather than the value it represents. In the case of Svelte, the 'target' of a `$state` proxy might not resemble its current value, which can be confusing.

The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte-5-preview.vercel.app/docs/runes#$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte-5-preview.vercel.app/docs/runes#$state-snapshot) to take a snapshot of the current value.
The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte.dev/docs/svelte/$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte.dev/docs/svelte/$state#$state.snapshot) to take a snapshot of the current value.

## event_handler_invalid

Expand Down
26 changes: 13 additions & 13 deletions packages/svelte/src/ambient.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ declare module '*.svelte' {
* let count = $state(0);
* ```
*
* https://svelte-5-preview.vercel.app/docs/runes#$state
* https://svelte.dev/docs/svelte/$state
*
* @param initial The initial value
*/
Expand Down Expand Up @@ -120,7 +120,7 @@ declare namespace $state {
* </button>
* ```
*
* https://svelte-5-preview.vercel.app/docs/runes#$state-raw
* https://svelte.dev/docs/svelte/$state#$state.raw
*
* @param initial The initial value
*/
Expand All @@ -141,7 +141,7 @@ declare namespace $state {
* </script>
* ```
*
* https://svelte-5-preview.vercel.app/docs/runes#$state.snapshot
* https://svelte.dev/docs/svelte/$state#$state.snapshot
*
* @param state The value to snapshot
*/
Expand Down Expand Up @@ -178,7 +178,7 @@ declare namespace $state {
* let double = $derived(count * 2);
* ```
*
* https://svelte-5-preview.vercel.app/docs/runes#$derived
* https://svelte.dev/docs/svelte/$derived
*
* @param expression The derived state expression
*/
Expand All @@ -200,7 +200,7 @@ declare namespace $derived {
* });
* ```
*
* https://svelte-5-preview.vercel.app/docs/runes#$derived-by
* https://svelte.dev/docs/svelte/$derived#$derived.by
*/
export function by<T>(fn: () => T): T;

Expand Down Expand Up @@ -239,7 +239,7 @@ declare namespace $derived {
*
* Does not run during server side rendering.
*
* https://svelte-5-preview.vercel.app/docs/runes#$effect
* https://svelte.dev/docs/svelte/$effect
* @param fn The function to execute
*/
declare function $effect(fn: () => void | (() => void)): void;
Expand All @@ -258,7 +258,7 @@ declare namespace $effect {
*
* Does not run during server side rendering.
*
* https://svelte-5-preview.vercel.app/docs/runes#$effect-pre
* https://svelte.dev/docs/svelte/$effect#$effect.pre
* @param fn The function to execute
*/
export function pre(fn: () => void | (() => void)): void;
Expand All @@ -281,7 +281,7 @@ declare namespace $effect {
*
* This allows you to (for example) add things like subscriptions without causing memory leaks, by putting them in child effects.
*
* https://svelte-5-preview.vercel.app/docs/runes#$effect-tracking
* https://svelte.dev/docs/svelte/$effect#$effect.tracking
*/
export function tracking(): boolean;

Expand Down Expand Up @@ -309,7 +309,7 @@ declare namespace $effect {
* <button onclick={() => cleanup()}>cleanup</button>
* ```
*
* https://svelte-5-preview.vercel.app/docs/runes#$effect-root
* https://svelte.dev/docs/svelte/$effect#$effect.root
*/
export function root(fn: () => void | (() => void)): () => void;

Expand Down Expand Up @@ -342,7 +342,7 @@ declare namespace $effect {
* let { optionalProp = 42, requiredProp, bindableProp = $bindable() }: { optionalProp?: number; requiredProps: string; bindableProp: boolean } = $props();
* ```
*
* https://svelte-5-preview.vercel.app/docs/runes#$props
* https://svelte.dev/docs/svelte/$props
*/
declare function $props(): any;

Expand All @@ -353,7 +353,7 @@ declare function $props(): any;
* let { propName = $bindable() }: { propName: boolean } = $props();
* ```
*
* https://svelte-5-preview.vercel.app/docs/runes#$bindable
* https://svelte.dev/docs/svelte/$bindable
*/
declare function $bindable<T>(fallback?: T): T;

Expand All @@ -373,7 +373,7 @@ declare function $bindable<T>(fallback?: T): T;
* $inspect(x, y).with(() => { debugger; });
* ```
*
* https://svelte-5-preview.vercel.app/docs/runes#$inspect
* https://svelte.dev/docs/svelte/$inspect
*/
declare function $inspect<T extends any[]>(
...values: T
Expand All @@ -396,6 +396,6 @@ declare function $inspect<T extends any[]>(
*
* Only available inside custom element components, and only on the client-side.
*
* https://svelte-5-preview.vercel.app/docs/runes#$host
* https://svelte.dev/docs/svelte/$host
*/
declare function $host<El extends HTMLElement = HTMLElement>(): El;
Original file line number Diff line number Diff line change
Expand Up @@ -344,7 +344,7 @@ export function server_component(analysis, options) {
b.block([
b.throw_error(
`Component.render(...) is no longer valid in Svelte 5. ` +
'See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information'
'See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information'
)
])
)
Expand Down
6 changes: 3 additions & 3 deletions packages/svelte/src/index-client.js
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ function create_custom_event(type, detail, { bubbles = false, cancelable = false
* }>();
* ```
*
* @deprecated Use callback props and/or the `$host()` rune instead — see https://svelte-5-preview.vercel.app/docs/deprecations#createeventdispatcher
* @deprecated Use callback props and/or the `$host()` rune instead — see https://svelte.dev/docs/svelte/v5-migration-guide#Event-changes-Component-events
* @template {Record<string, any>} [EventMap = any]
* @returns {EventDispatcher<EventMap>}
*/
Expand Down Expand Up @@ -121,7 +121,7 @@ export function createEventDispatcher() {
*
* In runes mode use `$effect.pre` instead.
*
* @deprecated Use `$effect.pre` instead — see https://svelte-5-preview.vercel.app/docs/deprecations#beforeupdate-and-afterupdate
* @deprecated Use `$effect.pre` instead — see https://svelte.dev/docs/svelte/v5-migration-guide#Other-breaking-changes-beforeUpdate-afterUpdate-changes
* @param {() => void} fn
* @returns {void}
*/
Expand All @@ -144,7 +144,7 @@ export function beforeUpdate(fn) {
*
* In runes mode use `$effect` instead.
*
* @deprecated Use `$effect` instead — see https://svelte-5-preview.vercel.app/docs/deprecations#beforeupdate-and-afterupdate
* @deprecated Use `$effect` instead — see https://svelte.dev/docs/svelte/v5-migration-guide#Other-breaking-changes-beforeUpdate-afterUpdate-changes
* @param {() => void} fn
* @returns {void}
*/
Expand Down
20 changes: 10 additions & 10 deletions packages/svelte/src/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import './ambient.js';
/**
* @deprecated In Svelte 4, components are classes. In Svelte 5, they are functions.
* Use `mount` instead to instantiate components.
* See [breaking changes](https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes)
* See [breaking changes](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
* for more info.
*/
export interface ComponentConstructorOptions<
Expand Down Expand Up @@ -39,7 +39,7 @@ type Properties<Props, Slots> = Props &
* This was the base class for Svelte components in Svelte 4. Svelte 5+ components
* are completely different under the hood. For typing, use `Component` instead.
* To instantiate components, use `mount` instead`.
* See [breaking changes documentation](https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes) for more info.
* See [breaking changes documentation](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more info.
*/
export class SvelteComponent<
Props extends Record<string, any> = Record<string, any>,
Expand All @@ -53,7 +53,7 @@ export class SvelteComponent<
/**
* @deprecated This constructor only exists when using the `asClassComponent` compatibility helper, which
* is a stop-gap solution. Migrate towards using `mount` instead. See
* https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more info.
* https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more info.
*/
constructor(options: ComponentConstructorOptions<Properties<Props, Slots>>);
/**
Expand Down Expand Up @@ -83,14 +83,14 @@ export class SvelteComponent<

/**
* @deprecated This method only exists when using one of the legacy compatibility helpers, which
* is a stop-gap solution. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
* is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
* for more info.
*/
$destroy(): void;

/**
* @deprecated This method only exists when using one of the legacy compatibility helpers, which
* is a stop-gap solution. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
* is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
* for more info.
*/
$on<K extends Extract<keyof Events, string>>(
Expand All @@ -100,7 +100,7 @@ export class SvelteComponent<

/**
* @deprecated This method only exists when using one of the legacy compatibility helpers, which
* is a stop-gap solution. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
* is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
* for more info.
*/
$set(props: Partial<Props>): void;
Expand Down Expand Up @@ -153,13 +153,13 @@ export interface Component<
): {
/**
* @deprecated This method only exists when using one of the legacy compatibility helpers, which
* is a stop-gap solution. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
* is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
* for more info.
*/
$on?(type: string, callback: (e: any) => void): () => void;
/**
* @deprecated This method only exists when using one of the legacy compatibility helpers, which
* is a stop-gap solution. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
* is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
* for more info.
*/
$set?(props: Partial<Props>): void;
Expand All @@ -171,7 +171,7 @@ export interface Component<
}

/**
* @deprecated Use `Component` instead. See [breaking changes documentation](https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes) for more information.
* @deprecated Use `Component` instead. See [breaking changes documentation](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more information.
*/
export class SvelteComponentTyped<
Props extends Record<string, any> = Record<string, any>,
Expand Down Expand Up @@ -278,7 +278,7 @@ declare const SnippetReturn: unique symbol;
* ```
* You can only call a snippet through the `{@render ...}` tag.
*
* https://svelte-5-preview.vercel.app/docs/snippets
* https://svelte.dev/docs/svelte/snippet
*
* @template Parameters the parameters that the snippet expects (if any) as a tuple.
*/
Expand Down
8 changes: 4 additions & 4 deletions packages/svelte/src/internal/client/errors.js
Original file line number Diff line number Diff line change
Expand Up @@ -57,15 +57,15 @@ export function bind_not_bindable(key, component, name) {
}

/**
* %parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
* %parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information
* @param {string} parent
* @param {string} method
* @param {string} component
* @returns {never}
*/
export function component_api_changed(parent, method, component) {
if (DEV) {
const error = new Error(`component_api_changed\n${parent} called \`${method}\` on an instance of ${component}, which is no longer valid in Svelte 5. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information`);
const error = new Error(`component_api_changed\n${parent} called \`${method}\` on an instance of ${component}, which is no longer valid in Svelte 5. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information`);

error.name = 'Svelte error';
throw error;
Expand All @@ -76,14 +76,14 @@ export function component_api_changed(parent, method, component) {
}

/**
* Attempted to instantiate %component% with `new %name%`, which is no longer valid in Svelte 5. If this component is not under your control, set the `compatibility.componentApi` compiler option to `4` to keep it working. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
* Attempted to instantiate %component% with `new %name%`, which is no longer valid in Svelte 5. If this component is not under your control, set the `compatibility.componentApi` compiler option to `4` to keep it working. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information
* @param {string} component
* @param {string} name
* @returns {never}
*/
export function component_api_invalid_new(component, name) {
if (DEV) {
const error = new Error(`component_api_invalid_new\nAttempted to instantiate ${component} with \`new ${name}\`, which is no longer valid in Svelte 5. If this component is not under your control, set the \`compatibility.componentApi\` compiler option to \`4\` to keep it working. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information`);
const error = new Error(`component_api_invalid_new\nAttempted to instantiate ${component} with \`new ${name}\`, which is no longer valid in Svelte 5. If this component is not under your control, set the \`compatibility.componentApi\` compiler option to \`4\` to keep it working. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information`);

error.name = 'Svelte error';
throw error;
Expand Down
2 changes: 1 addition & 1 deletion packages/svelte/src/internal/client/runtime.js
Original file line number Diff line number Diff line change
Expand Up @@ -833,7 +833,7 @@ export function invalidate_inner_signals(fn) {
/**
* Use `untrack` to prevent something from being treated as an `$effect`/`$derived` dependency.
*
* https://svelte-5-preview.vercel.app/docs/functions#untrack
* https://svelte.dev/docs/svelte/svelte#untrack
* @template T
* @param {() => T} fn
* @returns {T}
Expand Down
Loading