Static support for $state in .svelte.ts

[Bilge]

Describe the problem

I have a class that is entirely static (only static properties and methods). I cannot declare a $state property, either with a field initializer or in a static initialization block. In both cases, Svelte complains that:

_Error: CompileError: state_invalid_placement: $state(...) can only be used as a variable declaration initializer or a class field

Of course, this is a class field, it's just that it's a static field, which seems to be unsupported for some reason.

Describe the proposed solution

Support static class fields.

Importance

would make my life easier

[brunnerh]

Duplicate of:

• Svelte 5: Static class fields are transformed incorrectly #9547
• It is not possible to declare states in static fields of a class #11961
• Cannot use $state in static member variable #13357

Maybe this should be reconsidered? It seems quite inconsistent to not have this.

[Bilge]

Certainly, "My inclination" seems fairly hand-wavery. The implication of this is that merely upgrading from v4 -> v5 requires any (external) static class interfacing with any Svelte component must be changed to be an instance class, which is wrong if the class is intended to be single-instance only.

[7nik]

What is the point of defining it as a class, then? Why not just define is as an object with methods? Then you can wrap it into $state().

Also, a single instance can be created in IIFE-like way.

const instance = new (class MyClass {
  foo = $state(42);
  bar() {
    return this.foo;
  }
})();

[Bilge]

I like classes. Objects cannot have private properties. I also don't like a component framework forcing me to structure my (external) application in a particular way.

[Leonidaz]

I couldn't tell from the previous tickets why defining signals as static members were disallowed.

But for private class members Svelte no longer generates getters and setters (only for public members). So, I wonder if at least private static members can now be allowed?

[ThePaSch]

Also, a single instance can be created in IIFE-like way.

const instance = new (class MyClass {
  foo = $state(42);
  bar() {
    return this.foo;
  }
})();

This is usually a very bad idea, unless you're okay with a 95% drop in performance; and therefore not a viable alternative.

[7nik]

This is usually a very bad idea, unless you're okay with a 95% drop in performance; and therefore not a viable alternative.

Of course, it is slower because it also creates a new prototype chain for each instance. But it doesn't matter in the case of singleton.

[dummdidumm]

Leaving this open to collect use cases since this indeed seems to come up from time to time