docs: replace $state.frozen docs with $state.raw (#12812)

Author: Rich-Harris

documentation/docs/03-runes/01-state.md

@@ -2,12 +2,6 @@
 title: State
 ---
 
-- `$state` (.frozen)
-- `$derived` (.by)
-- using classes
-- getters/setters (what to do to keep reactivity "alive")
-- universal reactivity
-
 Svelte 5 uses _runes_, a powerful set of primitives for controlling reactivity inside your Svelte components and inside `.svelte.js` and `.svelte.ts` modules.
 
 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.
@@ -68,12 +62,12 @@ 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.frozen`
+## `$state.raw`
 
-State declared with `$state.frozen` 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:
+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:
 
 ```js
-let person = $state.frozen({
+let person = $state.raw({
 	name: 'Heraclitus',
 	age: 49
 });
@@ -88,11 +82,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 frozen state can _contain_ reactive state (for example, a frozen array of reactive objects).
-
-In development mode, the argument to `$state.frozen` will be shallowly frozen with `Object.freeze()`, to make it obvious if you accidentally mutate it.
-
-> Objects and arrays passed to `$state.frozen` will have a `Symbol` property added to them to signal to Svelte that they are frozen. If you don't want this, pass in a clone of the object or array instead. The argument cannot be an existing state proxy created with `$state(...)`.
+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`
 

packages/svelte/src/compiler/phases/3-transform/client/utils.js

@@ -256,9 +256,10 @@ export function should_proxy(node, scope) {
 	) {
 		return false;
 	}
+
 	if (node.type === 'Identifier' && scope !== null) {
 		const binding = scope.get(node.name);
-		// Let's see if the reference is something that can be proxied or frozen
+		// Let's see if the reference is something that can be proxied
 		if (
 			binding !== null &&
 			!binding.reassigned &&
@@ -271,6 +272,7 @@ export function should_proxy(node, scope) {
 			return should_proxy(binding.initial, null);
 		}
 	}
+
 	return true;
 }
 

sites/svelte-5-preview/src/lib/autocomplete.js

@@ -68,7 +68,7 @@ function is_state(node) {
 
 /**
  * Returns `true` if we're already in a valid call expression, e.g.
- * changing an existing `$state()` to `$state.frozen()`
+ * changing an existing `$state()` to `$state.raw()`
  * @type {Test}
  */
 function is_state_call(node) {
@@ -113,8 +113,8 @@ const runes = [
 	{ snippet: '$derived.by', test: is_state_call },
 	{ snippet: '$effect(() => {\n\t${}\n});', test: is_statement },
 	{ snippet: '$effect.pre(() => {\n\t${}\n});', test: is_statement },
-	{ snippet: '$state.frozen(${});', test: is_state },
-	{ snippet: '$state.frozen', test: is_state_call },
+	{ snippet: '$state.raw(${});', test: is_state },
+	{ snippet: '$state.raw', test: is_state_call },
 	{ snippet: '$bindable()', test: is_bindable },
 	{ snippet: '$effect.root(() => {\n\t${}\n})' },
 	{ snippet: '$state.snapshot(${})' },

sites/svelte-5-preview/src/routes/docs/content/01-api/02-runes.md

@@ -64,14 +64,14 @@ Only plain objects and arrays [are made deeply reactive](/#H4sIAAAAAAAAE42QwWrDM
 
 In non-runes mode, a `let` declaration is treated as reactive state if it is updated at some point. Unlike `$state(...)`, which works anywhere in your app, `let` only behaves this way at the top level of a component.
 
-## `$state.frozen`
+## `$state.raw`
 
-State declared with `$state.frozen` 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:
+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:
 
 ```diff
 <script>
 -	let numbers = $state([1, 2, 3]);
-+	let numbers = $state.frozen([1, 2, 3]);
++	let numbers = $state.raw([1, 2, 3]);
 </script>
 
 -<button onclick={() => numbers.push(numbers.length + 1)}>
@@ -89,9 +89,7 @@ State declared with `$state.frozen` cannot be mutated; it can only be _reassigne
 </p>
 ```
 
-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 frozen state can _contain_ reactive state (for example, a frozen array of reactive objects).
-
-> Objects and arrays passed to `$state.frozen` will be shallowly frozen using `Object.freeze()`. If you don't want this, pass in a clone of the object or array instead.
+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`