From 6ad6eb1bbf5bce809eb8e2f4495b422fc7c60c51 Mon Sep 17 00:00:00 2001 From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com> Date: Sat, 7 Feb 2026 00:38:22 +0100 Subject: [PATCH] docs: add section on conditional attachments (#17599) --- documentation/docs/03-template-syntax/09-@attach.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/documentation/docs/03-template-syntax/09-@attach.md b/documentation/docs/03-template-syntax/09-@attach.md index b25fbb32a6..8814ead487 100644 --- a/documentation/docs/03-template-syntax/09-@attach.md +++ b/documentation/docs/03-template-syntax/09-@attach.md @@ -82,6 +82,14 @@ Attachments can also be created inline ([demo](/playground/untitled#H4sIAAAAAAAA > [!NOTE] > The nested effect runs whenever `color` changes, while the outer effect (where `canvas.getContext(...)` is called) only runs once, since it doesn't read any reactive state. +## Conditional attachments + +Falsy values like `false` or `undefined` are treated as no attachment, enabling conditional usage: + +```svelte +
...
+``` + ## Passing attachments to components When used on a component, `{@attach ...}` will create a prop whose key is a [`Symbol`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol). If the component then [spreads](/tutorial/svelte/spread-props) props onto an element, the element will receive those attachments.