Describe the problem

If you try to use a function or anything other than a simple identifier or a member expression in a bind: directive you get an error:

<input bind:value={foo().bar} />

Can only bind to an Identifier or MemberExpression or a `{get, set}` pair

Since svelte 5.9.0 it is possible to do the above using get/set function bindings like this:

<input bind:value={
    () => foo().bar,
    (v) => foo().bar = v
} />

For cases like this where you're just getting/setting the same property on some arbitrary expression, it would make sense to be able to use the default bind: syntax as a shortcut.

Describe the proposed solution

Arbitrary bind expressions like this:

<input bind:value={foo().bar} />

Should compile into get/set bindings like this:

<input bind:value={
    () => foo().bar,
    (v) => foo().bar = v
} />

The only constraint is that the expression be a property access of some kind, but the expression for the object and the expression for the property can both be arbitrary expressions.

In other words, these would all be valid:

<input bind:value={foo().bar} />
<input bind:value={foo[bar]} />
<input bind:value={foo[bar()]} />
<input bind:value={foo()[bar()]} />

But these would still result in an error:

<input bind:value={foo()} />
<input bind:value={foo.bar()} />

Importance

nice to have