Error when binding to a prop that is also an exported identifier

[kran6a]

Describe the bug

If you have a component like this you cannot bind the prop open

<script lang="ts">
    let {open: is_open = $bindable(false)}: Props = $props();
    export const open = ()=>{
        console.log("open export called");
    }
</script>

<div>AAA</div>

We should be able to bind to the open prop even if we cannot bind to the open export

Reproduction

Remove the comment to see the error

https://svelte.dev/playground/untitled?version=5.15.0#H4sIAAAAAAAACo1R0WrDMAz8FU0MmkLSvKdJINsP7H0ew2nUzODKJnZLR8i_D6XNWMsGw2AknXTWnUdkfSAs8MlwZ7gHzR3Q2bshQnvsMcW9sRSweB0xfnrplAKmy1zj_SacyEaptTrQb_Wd40gcAxZYht1gfASrua8UxqCwVgxgDvObzx_GdrAf3AFWm3zOrjSrrWIVLUVwnhgqeAxRR0r22gZabxWX-YW6Vqy4vBBJazXKPeW14vIhy-AKtYa74gaHLKsxxUjniEUcjjSlf4j-udet7DvkH8IBRNO8QwEmvC_qZD_d2kXgVMDL4HwQyEuQiGYZv_7WznH49iZZV_UofskRxFnaWNcnCueOZUZbS53ChWq6d7Ezp7ppmjKX4Nabt-kLXnLCnjwCAAA=

Logs

bind_invalid_export Component Child.svelte has an export named `open` that a consumer component is trying to access using `bind:open`, which is disallowed. Instead, use `bind:this` (e.g. `<Child bind:this={component} />`) and then access the property on the bound component instance (e.g. `component.open`) https://svelte.dev/e/bind_invalid_export

System Info

Does not matter

Severity

annoyance

[webJose]

Is there a strong reason to not choose a different name for the property or the export? Why must they be named the same?

[kran6a]

No, in this case it was a modal component that allows setting and optionally binding an open prop and also exports an open method.

I don't think there is any reason to disallow this as you cannot use the prop in place of the method or the method in place of the prop.

It is also unexpected behavior as it works when passing the prop without binding it but the moment you bind it it throws.