{"record":{"id":"5ccc581a5d87ae47","repo":"sveltejs/svelte","slug":"bind-not-bindable","errorCode":"bind_not_bindable","errorMessage":"bind_not_bindable\nA component is attempting to bind to a non-bindable property `${key}` belonging to ${component} (i.e. `<${name} bind:${key}={...}>`). To mark a property as bindable: `let { ${key} = $bindable() } = $props()`\nhttps://svelte.dev/e/bind_not_bindable","messagePattern":"bind_not_bindable\nA component is attempting to bind to a non-bindable property `(.+?)` belonging to (.+?) \\(i\\.e\\. `<(.+?) bind:(.+?)=(.+?)>`\\)\\. To mark a property as bindable: `let (.+?) = \\$props\\(\\)`\nhttps://svelte\\.dev/e/bind_not_bindable","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/svelte/src/internal/client/errors.js","lineNumber":71,"sourceCode":"\t} else {\n\t\tthrow new Error(`https://svelte.dev/e/bind_invalid_export`);\n\t}\n}\n\n/**\n * A component is attempting to bind to a non-bindable property `%key%` belonging to %component% (i.e. `<%name% bind:%key%={...}>`). To mark a property as bindable: `let { %key% = $bindable() } = $props()`\n * @param {string} key\n * @param {string} component\n * @param {string} name\n * @returns {never}\n */\nexport function bind_not_bindable(key, component, name) {\n\tif (DEV) {\n\t\tconst error = new Error(`bind_not_bindable\\nA component is attempting to bind to a non-bindable property \\`${key}\\` belonging to ${component} (i.e. \\`<${name} bind:${key}={...}>\\`). To mark a property as bindable: \\`let { ${key} = $bindable() } = $props()\\`\\nhttps://svelte.dev/e/bind_not_bindable`);\n\n\t\terror.name = 'Svelte error';\n\n\t\tthrow error;\n\t} else {\n\t\tthrow new Error(`https://svelte.dev/e/bind_not_bindable`);\n\t}\n}\n\n/**\n * Calling `%method%` on a component instance (of %component%) is no longer valid in Svelte 5\n * @param {string} method\n * @param {string} component\n * @returns {never}\n */\nexport function component_api_changed(method, component) {\n\tif (DEV) {\n\t\tconst error = new Error(`component_api_changed\\nCalling \\`${method}\\` on a component instance (of ${component}) is no longer valid in Svelte 5\\nhttps://svelte.dev/e/component_api_changed`);\n\n\t\terror.name = 'Svelte error';\n\n\t\tthrow error;","sourceCodeStart":53,"sourceCodeEnd":89,"githubUrl":"https://github.com/sveltejs/svelte/blob/20b341f10048cf1016a2028ac7eee5595cfef6a5/packages/svelte/src/internal/client/errors.js#L53-L89","documentation":"Runtime error `bind_not_bindable`: similar to `bind_invalid_export` but raised when binding to a property that is not declared as a prop at all (not just not bindable). The message includes a hint showing exactly how to declare it bindable: `let { key = $bindable() } = $props()`.","triggerScenarios":"At runtime (DEV) when a consumer does `<Comp bind:foo={...}/>` and `Comp` does not expose `foo` as a bindable prop (either not declared, or declared without `$bindable()`).","commonSituations":"Binding to a prop that was renamed or removed during migration; binding to internal state that was never intended to be a public prop; typos in the bound key.","solutions":["Declare the prop as bindable in the target component: `let { foo = $bindable() } = $props()`.","Verify the bound key name matches a declared prop (check for typos / renames).","If binding is unintended, remove `bind:` and pass the prop one-way."],"exampleFix":"// before\n<!-- consumer -->\n<Slider bind:value={v} />\n<!-- Slider.svelte -->\n<script>\n  let { value } = $props();\n</script>\n\n// after\n<script>\n  let { value = $bindable() } = $props();\n</script>","handlingStrategy":"validation","validationCode":"// Verify the bound key exists as a $bindable prop in the target component.\nfunction assertBindable(targetSource, key) {\n  const re = new RegExp(`\\\\b(?:let|const)\\\\s*\\\\{[^}]*\\\\b${key}\\\\b[^}]*=\\\\s*\\\\$bindable`);\n  if (!re.test(targetSource)) {\n    throw new Error(`${key} is not a bindable prop on the target component`);\n  }\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Declare every two-way-bound prop with `$bindable()` in the child.","Double-check bound key spelling against the child's declared props.","Reserve `bind:` for props you actually need to mutate from the parent."],"tags":["svelte5","runtime","binding","props","bindable"],"backgroundTag":null,"analyzedSha":"20b341f10048cf1016a2028ac7eee5595cfef6a5","analyzedAt":"2026-08-12T23:37:30.399Z","schemaVersion":2},"datasetVersion":"2026-08-13T04:17:16.726Z"}