Skip to main content
Create new
Introduction
Reactivity
Props
Logic
Events
Bindings
Lifecycle
Stores
Motion
Transitions
Animations
Easing
SVG
Actions
Classes
Component composition
Context API
Special elements
Module context
Debugging
7GUIs
Miscellaneous
App.svelte
<script>
let todos = $state([
{ done: false, text: 'finish Svelte tutorial' },
{ done: false, text: 'build an app' },
{ done: false, text: 'world domination' }
]);

function add() {
todos = todos.concat({ done: false, text: '' });
}

function clear() {
todos = todos.filter((t) => !t.done);
}

let remaining = $derived(todos.filter((t) => !t.done).length);
</script>

<h1>Todos</h1>

{#each todos as todo}
<div>
<input type="checkbox" bind:checked={todo.done} />

<input placeholder="What needs to be done?" bind:value={todo.text} disabled={todo.done} />
</div>
{/each}

<p>{remaining} remaining</p>

<button onclick={add}> Add new </button>

<button onclick={clear}> Clear completed </button>

Error compiling component

WebAssembly.instantiateStreaming(): value type opcode @+13
import 'svelte/internal/disclose-version';
import * as $ from 'svelte/internal/client';

function add(_, todos) {
$.set(todos, $.proxy($.get(todos).concat({ done: false, text: '' })));
}

function clear(__1, todos) {
$.set(todos, $.proxy($.get(todos).filter((t) => !t.done)));
}

var root_1 = $.template(`<div><input type="checkbox"> <input placeholder="What needs to be done?"></div>`);
var root = $.template(`<h1>Todos</h1> <!> <p> </p> <button>Add new</button> <button>Clear completed</button>`, 1);

export default function App($$anchor, $$props) {
$.push($$props, true);

let todos = $.state($.proxy([
{ done: false, text: 'finish Svelte tutorial' },
{ done: false, text: 'build an app' },
{ done: false, text: 'world domination' }
]));

let remaining = $.derived(() => $.get(todos).filter((t) => !t.done).length);
var fragment = root();
var node = $.sibling($.first_child(fragment), 2);

$.each(node, 17, () => $.get(todos), $.index, ($$anchor, todo, $$index) => {
var div = root_1();
var input = $.child(div);

$.remove_input_defaults(input);

var input_1 = $.sibling(input, 2);

$.remove_input_defaults(input_1);
result = svelte.compile(source, {
generate: ,
});
/* Add a <style> tag to see the CSS output */
		
			
				
  • Root {
    • css: null
    • js: []
    • start: 385
    • end: 716
    • type: "Root"
    • fragment: Fragment {...}
      • type: "Fragment"
      • nodes: [...] (10)
        • Text {...}
          • type: "Text"
          • start: 383
          • end: 385
          • raw: "\n\n"
          • data: "\n\n"
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 385
          • end: 399
          • name: "h1"
          • attributes: []
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (1)
              • Text {...}
                • type: "Text"
                • start: 389
                • end: 394
                • raw: "Todos"
                • data: "Todos"
                }
              ]
            }
          }
        • Text {...}
          • type: "Text"
          • start: 399
          • end: 401
          • raw: " "
          • data: " "
          }
        • EachBlock {...}
          • type: "EachBlock"
          • start: 401
          • end: 592
          • expression: Identifier {...}
            • type: "Identifier"
            • start: 408
            • end: 413
            • loc: {...}
              • start: {...}
                • line: 21
                • column: 7
                }
              • end: {...}
                • line: 21
                • column: 12
                }
              }
            • name: "todos"
            }
          • body: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (3)
              • Text {...}
                • type: "Text"
                • start: 422
                • end: 424
                • raw: "\n\t"
                • data: "\n\t"
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 424
                • end: 584
                • name: "div"
                • attributes: []
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (5)
                    • Text {...}
                      • type: "Text"
                      • start: 429
                      • end: 432
                      • raw: "\n\t\t"
                      • data: "\n\t\t"
                      }
                    • RegularElement {...}
                      • type: "RegularElement"
                      • start: 432
                      • end: 482
                      • name: "input"
                      • attributes: [...] (2)
                        • Attribute {...}
                          • type: "Attribute"
                          • start: 439
                          • end: 454
                          • name: "type"
                          • value: [...] (1)
                            • Text {...}
                              • start: 445
                              • end: 453
                              • type: "Text"
                              • raw: "checkbox"
                              • data: "checkbox"
                              }
                            ]
                          }
                        • BindDirective {...}
                          • start: 455
                          • end: 479
                          • type: "BindDirective"
                          • name: "checked"
                          • expression: MemberExpression {...}
                            • type: "MemberExpression"
                            • start: 469
                            • end: 478
                            • loc: {...}
                              • start: {...}
                                • line: 23
                                • column: 39
                                }
                              • end: {...}
                                • line: 23
                                • column: 48
                                }
                              }
                            • object: Identifier {...}
                              • type: "Identifier"
                              • start: 469
                              • end: 473
                              • loc: {...}
                                • start: {...}
                                  • line: 23
                                  • column: 39
                                  }
                                • end: {...}
                                  • line: 23
                                  • column: 43
                                  }
                                }
                              • name: "todo"
                              }
                            • property: Identifier {...}
                              • type: "Identifier"
                              • start: 474
                              • end: 478
                              • loc: {...}
                                • start: {...}
                                  • line: 23
                                  • column: 44
                                  }
                                • end: {...}
                                  • line: 23
                                  • column: 48
                                  }
                                }
                              • name: "done"
                              }
                            • computed: false
                            • optional: false
                            }
                          • modifiers: []
                          }
                        ]
                      • fragment: Fragment {...}
                        • type: "Fragment"
                        • nodes: []
                        }
                      }
                    • Text {...}
                      • type: "Text"
                      • start: 482
                      • end: 486
                      • raw: " "
                      • data: " "
                      }
                    • RegularElement {...}
                      • type: "RegularElement"
                      • start: 486
                      • end: 576
                      • name: "input"
                      • attributes: [...] (3)
                        • Attribute {...}
                          • type: "Attribute"
                          • start: 493
                          • end: 529
                          • name: "placeholder"
                          • value: [...] (1)
                            • Text {...}
                              • start: 506
                              • end: 528
                              • type: "Text"
                              • raw: "What needs to be done?"
                              • data: "What needs to be done?"
                              }
                            ]
                          }
                        • BindDirective {...}
                          • start: 530
                          • end: 552
                          • type: "BindDirective"
                          • name: "value"
                          • expression: MemberExpression {...}
                            • type: "MemberExpression"
                            • start: 542
                            • end: 551
                            • loc: {...}
                              • start: {...}
                                • line: 25
                                • column: 58
                                }
                              • end: {...}
                                • line: 25
                                • column: 67
                                }
                              }
                            • object: Identifier {...}
                              • type: "Identifier"
                              • start: 542
                              • end: 546
                              • loc: {...}
                                • start: {...}
                                  • line: 25
                                  • column: 58
                                  }
                                • end: {...}
                                  • line: 25
                                  • column: 62
                                  }
                                }
                              • name: "todo"
                              }
                            • property: Identifier {...}
                              • type: "Identifier"
                              • start: 547
                              • end: 551
                              • loc: {...}
                                • start: {...}
                                  • line: 25
                                  • column: 63
                                  }
                                • end: {...}
                                  • line: 25
                                  • column: 67
                                  }
                                }
                              • name: "text"
                              }
                            • computed: false
                            • optional: false
                            }
                          • modifiers: []
                          }
                        • Attribute {...}
                          • type: "Attribute"
                          • start: 553
                          • end: 573
                          • name: "disabled"
                          • value: ExpressionTag {...}
                            • type: "ExpressionTag"
                            • start: 562
                            • end: 573
                            • expression: MemberExpression {...}
                              • type: "MemberExpression"
                              • start: 563
                              • end: 572
                              • loc: {...}
                                • start: {...}
                                  • line: 25
                                  • column: 79
                                  }
                                • end: {...}
                                  • line: 25
                                  • column: 88
                                  }
                                }
                              • object: Identifier {...}
                                • type: "Identifier"
                                • start: 563
                                • end: 567
                                • loc: {...}
                                  • start: {...}
                                    • line: 25
                                    • column: 79
                                    }
                                  • end: {...}
                                    • line: 25
                                    • column: 83
                                    }
                                  }
                                • name: "todo"
                                }
                              • property: Identifier {...}
                                • type: "Identifier"
                                • start: 568
                                • end: 572
                                • loc: {...}
                                  • start: {...}
                                    • line: 25
                                    • column: 84
                                    }
                                  • end: {...}
                                    • line: 25
                                    • column: 88
                                    }
                                  }
                                • name: "done"
                                }
                              • computed: false
                              • optional: false
                              }
                            }
                          }
                        ]
                      • fragment: Fragment {...}
                        • type: "Fragment"
                        • nodes: []
                        }
                      }
                    • Text {...}
                      • type: "Text"
                      • start: 576
                      • end: 578
                      • raw: "\n\t"
                      • data: "\n\t"
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 584
                • end: 585
                • raw: "\n"
                • data: "\n"
                }
              ]
            }
          • context: Identifier {...}
            • type: "Identifier"
            • name: "todo"
            • start: 417
            • loc: {...}
              • start: {...}
                • line: 21
                • column: 16
                • character: 417
                }
              • end: {...}
                • line: 21
                • column: 20
                • character: 421
                }
              }
            • end: 421
            • typeAnnotation: undefined
            }
          • index: undefined
          • key: undefined
          }
        • Text {...}
          • type: "Text"
          • start: 592
          • end: 594
          • raw: " "
          • data: " "
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 594
          • end: 622
          • name: "p"
          • attributes: []
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (2)
              • ExpressionTag {...}
                • type: "ExpressionTag"
                • start: 597
                • end: 608
                • expression: Identifier {...}
                  • type: "Identifier"
                  • start: 598
                  • end: 607
                  • loc: {...}
                    • start: {...}
                      • line: 29
                      • column: 4
                      }
                    • end: {...}
                      • line: 29
                      • column: 13
                      }
                    }
                  • name: "remaining"
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 608
                • end: 618
                • raw: " remaining"
                • data: " remaining"
                }
              ]
            }
          }
        • Text {...}
          • type: "Text"
          • start: 622
          • end: 624
          • raw: " "
          • data: " "
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 624
          • end: 664
          • name: "button"
          • attributes: [...] (1)
            • Attribute {...}
              • type: "Attribute"
              • start: 632
              • end: 645
              • name: "onclick"
              • value: ExpressionTag {...}
                • type: "ExpressionTag"
                • start: 640
                • end: 645
                • expression: Identifier {...}
                  • type: "Identifier"
                  • start: 641
                  • end: 644
                  • loc: {...}
                    • start: {...}
                      • line: 31
                      • column: 17
                      }
                    • end: {...}
                      • line: 31
                      • column: 20
                      }
                    }
                  • name: "add"
                  }
                }
              }
            ]
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (1)
              • Text {...}
                • type: "Text"
                • start: 646
                • end: 655
                • raw: "Add new"
                • data: "Add new"
                }
              ]
            }
          }
        • Text {...}
          • type: "Text"
          • start: 664
          • end: 666
          • raw: " "
          • data: " "
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 666
          • end: 716
          • name: "button"
          • attributes: [...] (1)
            • Attribute {...}
              • type: "Attribute"
              • start: 674
              • end: 689
              • name: "onclick"
              • value: ExpressionTag {...}
                • type: "ExpressionTag"
                • start: 682
                • end: 689
                • expression: Identifier {...}
                  • type: "Identifier"
                  • start: 683
                  • end: 688
                  • loc: {...}
                    • start: {...}
                      • line: 33
                      • column: 17
                      }
                    • end: {...}
                      • line: 33
                      • column: 22
                      }
                    }
                  • name: "clear"
                  }
                }
              }
            ]
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (1)
              • Text {...}
                • type: "Text"
                • start: 690
                • end: 707
                • raw: "Clear completed"
                • data: "Clear completed"
                }
              ]
            }
          }
        ]
      }
    • options: null
    • instance: Script {...}
      • type: "Script"
      • start: 0
      • end: 383
      • context: "default"
      • content: Program {...}
        • type: "Program"
        • start: 8
        • end: 374
        • loc: {...}
          • start: {...}
            • line: 1
            • column: 0
            }
          • end: {...}
            • line: 17
            • column: 0
            }
          }
        • body: [...] (4)
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 10
            • end: 171
            • loc: {...}
              • start: {...}
                • line: 2
                • column: 1
                }
              • end: {...}
                • line: 6
                • column: 4
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 14
                • end: 170
                • loc: {...}
                  • start: {...}
                    • line: 2
                    • column: 5
                    }
                  • end: {...}
                    • line: 6
                    • column: 3
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 14
                  • end: 19
                  • loc: {...}
                    • start: {...}
                      • line: 2
                      • column: 5
                      }
                    • end: {...}
                      • line: 2
                      • column: 10
                      }
                    }
                  • name: "todos"
                  }
                • init: CallExpression {...}
                  • type: "CallExpression"
                  • start: 22
                  • end: 170
                  • loc: {...}
                    • start: {...}
                      • line: 2
                      • column: 13
                      }
                    • end: {...}
                      • line: 6
                      • column: 3
                      }
                    }
                  • callee: Identifier {...}
                    • type: "Identifier"
                    • start: 22
                    • end: 28
                    • loc: {...}
                      • start: {...}
                        • line: 2
                        • column: 13
                        }
                      • end: {...}
                        • line: 2
                        • column: 19
                        }
                      }
                    • name: "$state"
                    }
                  • arguments: [...] (1)
                    • ArrayExpression {...}
                      • type: "ArrayExpression"
                      • start: 29
                      • end: 169
                      • loc: {...}
                        • start: {...}
                          • line: 2
                          • column: 20
                          }
                        • end: {...}
                          • line: 6
                          • column: 2
                          }
                        }
                      • elements: [...] (3)
                        • ObjectExpression {...}
                          • type: "ObjectExpression"
                          • start: 33
                          • end: 80
                          • loc: {...}
                            • start: {...}
                              • line: 3
                              • column: 2
                              }
                            • end: {...}
                              • line: 3
                              • column: 49
                              }
                            }
                          • properties: [...] (2)
                            • Property {...}
                              • type: "Property"
                              • start: 35
                              • end: 46
                              • loc: {...}
                                • start: {...}
                                  • line: 3
                                  • column: 4
                                  }
                                • end: {...}
                                  • line: 3
                                  • column: 15
                                  }
                                }
                              • method: false
                              • shorthand: false
                              • computed: false
                              • key: Identifier {...}
                                • type: "Identifier"
                                • start: 35
                                • end: 39
                                • loc: {...}
                                  • start: {...}
                                    • line: 3
                                    • column: 4
                                    }
                                  • end: {...}
                                    • line: 3
                                    • column: 8
                                    }
                                  }
                                • name: "done"
                                }
                              • value: Literal {...}
                                • type: "Literal"
                                • start: 41
                                • end: 46
                                • loc: {...}
                                  • start: {...}
                                    • line: 3
                                    • column: 10
                                    }
                                  • end: {...}
                                    • line: 3
                                    • column: 15
                                    }
                                  }
                                • value: false
                                • raw: "false"
                                }
                              • kind: "init"
                              }
                            • Property {...}
                              • type: "Property"
                              • start: 48
                              • end: 78
                              • loc: {...}
                                • start: {...}
                                  • line: 3
                                  • column: 17
                                  }
                                • end: {...}
                                  • line: 3
                                  • column: 47
                                  }
                                }
                              • method: false
                              • shorthand: false
                              • computed: false
                              • key: Identifier {...}
                                • type: "Identifier"
                                • start: 48
                                • end: 52
                                • loc: {...}
                                  • start: {...}
                                    • line: 3
                                    • column: 17
                                    }
                                  • end: {...}
                                    • line: 3
                                    • column: 21
                                    }
                                  }
                                • name: "text"
                                }
                              • value: Literal {...}
                                • type: "Literal"
                                • start: 54
                                • end: 78
                                • loc: {...}
                                  • start: {...}
                                    • line: 3
                                    • column: 23
                                    }
                                  • end: {...}
                                    • line: 3
                                    • column: 47
                                    }
                                  }
                                • value: "finish Svelte tutorial"
                                • raw: "'finish Svelte tutorial'"
                                }
                              • kind: "init"
                              }
                            ]
                          }
                        • ObjectExpression {...}
                          • type: "ObjectExpression"
                          • start: 84
                          • end: 121
                          • loc: {...}
                            • start: {...}
                              • line: 4
                              • column: 2
                              }
                            • end: {...}
                              • line: 4
                              • column: 39
                              }
                            }
                          • properties: [...] (2)
                            • Property {...}
                              • type: "Property"
                              • start: 86
                              • end: 97
                              • loc: {...}
                                • start: {...}
                                  • line: 4
                                  • column: 4
                                  }
                                • end: {...}
                                  • line: 4
                                  • column: 15
                                  }
                                }
                              • method: false
                              • shorthand: false
                              • computed: false
                              • key: Identifier {...}
                                • type: "Identifier"
                                • start: 86
                                • end: 90
                                • loc: {...}
                                  • start: {...}
                                    • line: 4
                                    • column: 4
                                    }
                                  • end: {...}
                                    • line: 4
                                    • column: 8
                                    }
                                  }
                                • name: "done"
                                }
                              • value: Literal {...}
                                • type: "Literal"
                                • start: 92
                                • end: 97
                                • loc: {...}
                                  • start: {...}
                                    • line: 4
                                    • column: 10
                                    }
                                  • end: {...}
                                    • line: 4
                                    • column: 15
                                    }
                                  }
                                • value: false
                                • raw: "false"
                                }
                              • kind: "init"
                              }
                            • Property {...}
                              • type: "Property"
                              • start: 99
                              • end: 119
                              • loc: {...}
                                • start: {...}
                                  • line: 4
                                  • column: 17
                                  }
                                • end: {...}
                                  • line: 4
                                  • column: 37
                                  }
                                }
                              • method: false
                              • shorthand: false
                              • computed: false
                              • key: Identifier {...}
                                • type: "Identifier"
                                • start: 99
                                • end: 103
                                • loc: {...}
                                  • start: {...}
                                    • line: 4
                                    • column: 17
                                    }
                                  • end: {...}
                                    • line: 4
                                    • column: 21
                                    }
                                  }
                                • name: "text"
                                }
                              • value: Literal {...}
                                • type: "Literal"
                                • start: 105
                                • end: 119
                                • loc: {...}
                                  • start: {...}
                                    • line: 4
                                    • column: 23
                                    }
                                  • end: {...}
                                    • line: 4
                                    • column: 37
                                    }
                                  }
                                • value: "build an app"
                                • raw: "'build an app'"
                                }
                              • kind: "init"
                              }
                            ]
                          }
                        • ObjectExpression {...}
                          • type: "ObjectExpression"
                          • start: 125
                          • end: 166
                          • loc: {...}
                            • start: {...}
                              • line: 5
                              • column: 2
                              }
                            • end: {...}
                              • line: 5
                              • column: 43
                              }
                            }
                          • properties: [...] (2)
                            • Property {...}
                              • type: "Property"
                              • start: 127
                              • end: 138
                              • loc: {...}
                                • start: {...}
                                  • line: 5
                                  • column: 4
                                  }
                                • end: {...}
                                  • line: 5
                                  • column: 15
                                  }
                                }
                              • method: false
                              • shorthand: false
                              • computed: false
                              • key: Identifier {...}
                                • type: "Identifier"
                                • start: 127
                                • end: 131
                                • loc: {...}
                                  • start: {...}
                                    • line: 5
                                    • column: 4
                                    }
                                  • end: {...}
                                    • line: 5
                                    • column: 8
                                    }
                                  }
                                • name: "done"
                                }
                              • value: Literal {...}
                                • type: "Literal"
                                • start: 133
                                • end: 138
                                • loc: {...}
                                  • start: {...}
                                    • line: 5
                                    • column: 10
                                    }
                                  • end: {...}
                                    • line: 5
                                    • column: 15
                                    }
                                  }
                                • value: false
                                • raw: "false"
                                }
                              • kind: "init"
                              }
                            • Property {...}
                              • type: "Property"
                              • start: 140
                              • end: 164
                              • loc: {...}
                                • start: {...}
                                  • line: 5
                                  • column: 17
                                  }
                                • end: {...}
                                  • line: 5
                                  • column: 41
                                  }
                                }
                              • method: false
                              • shorthand: false
                              • computed: false
                              • key: Identifier {...}
                                • type: "Identifier"
                                • start: 140
                                • end: 144
                                • loc: {...}
                                  • start: {...}
                                    • line: 5
                                    • column: 17
                                    }
                                  • end: {...}
                                    • line: 5
                                    • column: 21
                                    }
                                  }
                                • name: "text"
                                }
                              • value: Literal {...}
                                • type: "Literal"
                                • start: 146
                                • end: 164
                                • loc: {...}
                                  • start: {...}
                                    • line: 5
                                    • column: 23
                                    }
                                  • end: {...}
                                    • line: 5
                                    • column: 41
                                    }
                                  }
                                • value: "world domination"
                                • raw: "'world domination'"
                                }
                              • kind: "init"
                              }
                            ]
                          }
                        ]
                      }
                    ]
                  • optional: false
                  }
                }
              ]
            • kind: "let"
            }
          • FunctionDeclaration {...}
            • type: "FunctionDeclaration"
            • start: 174
            • end: 244
            • loc: {...}
              • start: {...}
                • line: 8
                • column: 1
                }
              • end: {...}
                • line: 10
                • column: 2
                }
              }
            • id: Identifier {...}
              • type: "Identifier"
              • start: 183
              • end: 186
              • loc: {...}
                • start: {...}
                  • line: 8
                  • column: 10
                  }
                • end: {...}
                  • line: 8
                  • column: 13
                  }
                }
              • name: "add"
              }
            • expression: false
            • generator: false
            • async: false
            • params: []
            • body: BlockStatement {...}
              • type: "BlockStatement"
              • start: 189
              • end: 244
              • loc: {...}
                • start: {...}
                  • line: 8
                  • column: 16
                  }
                • end: {...}
                  • line: 10
                  • column: 2
                  }
                }
              • body: [...] (1)
                • ExpressionStatement {...}
                  • type: "ExpressionStatement"
                  • start: 193
                  • end: 241
                  • loc: {...}
                    • start: {...}
                      • line: 9
                      • column: 2
                      }
                    • end: {...}
                      • line: 9
                      • column: 50
                      }
                    }
                  • expression: AssignmentExpression {...}
                    • type: "AssignmentExpression"
                    • start: 193
                    • end: 240
                    • loc: {...}
                      • start: {...}
                        • line: 9
                        • column: 2
                        }
                      • end: {...}
                        • line: 9
                        • column: 49
                        }
                      }
                    • operator: "="
                    • left: Identifier {...}
                      • type: "Identifier"
                      • start: 193
                      • end: 198
                      • loc: {...}
                        • start: {...}
                          • line: 9
                          • column: 2
                          }
                        • end: {...}
                          • line: 9
                          • column: 7
                          }
                        }
                      • name: "todos"
                      }
                    • right: CallExpression {...}
                      • type: "CallExpression"
                      • start: 201
                      • end: 240
                      • loc: {...}
                        • start: {...}
                          • line: 9
                          • column: 10
                          }
                        • end: {...}
                          • line: 9
                          • column: 49
                          }
                        }
                      • callee: MemberExpression {...}
                        • type: "MemberExpression"
                        • start: 201
                        • end: 213
                        • loc: {...}
                          • start: {...}
                            • line: 9
                            • column: 10
                            }
                          • end: {...}
                            • line: 9
                            • column: 22
                            }
                          }
                        • object: Identifier {...}
                          • type: "Identifier"
                          • start: 201
                          • end: 206
                          • loc: {...}
                            • start: {...}
                              • line: 9
                              • column: 10
                              }
                            • end: {...}
                              • line: 9
                              • column: 15
                              }
                            }
                          • name: "todos"
                          }
                        • property: Identifier {...}
                          • type: "Identifier"
                          • start: 207
                          • end: 213
                          • loc: {...}
                            • start: {...}
                              • line: 9
                              • column: 16
                              }
                            • end: {...}
                              • line: 9
                              • column: 22
                              }
                            }
                          • name: "concat"
                          }
                        • computed: false
                        • optional: false
                        }
                      • arguments: [...] (1)
                        • ObjectExpression {...}
                          • type: "ObjectExpression"
                          • start: 214
                          • end: 239
                          • loc: {...}
                            • start: {...}
                              • line: 9
                              • column: 23
                              }
                            • end: {...}
                              • line: 9
                              • column: 48
                              }
                            }
                          • properties: [...] (2)
                            • Property {...}
                              • type: "Property"
                              • start: 216
                              • end: 227
                              • loc: {...}
                                • start: {...}
                                  • line: 9
                                  • column: 25
                                  }
                                • end: {...}
                                  • line: 9
                                  • column: 36
                                  }
                                }
                              • method: false
                              • shorthand: false
                              • computed: false
                              • key: Identifier {...}
                                • type: "Identifier"
                                • start: 216
                                • end: 220
                                • loc: {...}
                                  • start: {...}
                                    • line: 9
                                    • column: 25
                                    }
                                  • end: {...}
                                    • line: 9
                                    • column: 29
                                    }
                                  }
                                • name: "done"
                                }
                              • value: Literal {...}
                                • type: "Literal"
                                • start: 222
                                • end: 227
                                • loc: {...}
                                  • start: {...}
                                    • line: 9
                                    • column: 31
                                    }
                                  • end: {...}
                                    • line: 9
                                    • column: 36
                                    }
                                  }
                                • value: false
                                • raw: "false"
                                }
                              • kind: "init"
                              }
                            • Property {...}
                              • type: "Property"
                              • start: 229
                              • end: 237
                              • loc: {...}
                                • start: {...}
                                  • line: 9
                                  • column: 38
                                  }
                                • end: {...}
                                  • line: 9
                                  • column: 46
                                  }
                                }
                              • method: false
                              • shorthand: false
                              • computed: false
                              • key: Identifier {...}
                                • type: "Identifier"
                                • start: 229
                                • end: 233
                                • loc: {...}
                                  • start: {...}
                                    • line: 9
                                    • column: 38
                                    }
                                  • end: {...}
                                    • line: 9
                                    • column: 42
                                    }
                                  }
                                • name: "text"
                                }
                              • value: Literal {...}
                                • type: "Literal"
                                • start: 235
                                • end: 237
                                • loc: {...}
                                  • start: {...}
                                    • line: 9
                                    • column: 44
                                    }
                                  • end: {...}
                                    • line: 9
                                    • column: 46
                                    }
                                  }
                                • value: ""
                                • raw: "''"
                                }
                              • kind: "init"
                              }
                            ]
                          }
                        ]
                      • optional: false
                      }
                    }
                  }
                ]
              }
            }
          • FunctionDeclaration {...}
            • type: "FunctionDeclaration"
            • start: 247
            • end: 308
            • loc: {...}
              • start: {...}
                • line: 12
                • column: 1
                }
              • end: {...}
                • line: 14
                • column: 2
                }
              }
            • id: Identifier {...}
              • type: "Identifier"
              • start: 256
              • end: 261
              • loc: {...}
                • start: {...}
                  • line: 12
                  • column: 10
                  }
                • end: {...}
                  • line: 12
                  • column: 15
                  }
                }
              • name: "clear"
              }
            • expression: false
            • generator: false
            • async: false
            • params: []
            • body: BlockStatement {...}
              • type: "BlockStatement"
              • start: 264
              • end: 308
              • loc: {...}
                • start: {...}
                  • line: 12
                  • column: 18
                  }
                • end: {...}
                  • line: 14
                  • column: 2
                  }
                }
              • body: [...] (1)
                • ExpressionStatement {...}
                  • type: "ExpressionStatement"
                  • start: 268
                  • end: 305
                  • loc: {...}
                    • start: {...}
                      • line: 13
                      • column: 2
                      }
                    • end: {...}
                      • line: 13
                      • column: 39
                      }
                    }
                  • expression: AssignmentExpression {...}
                    • type: "AssignmentExpression"
                    • start: 268
                    • end: 304
                    • loc: {...}
                      • start: {...}
                        • line: 13
                        • column: 2
                        }
                      • end: {...}
                        • line: 13
                        • column: 38
                        }
                      }
                    • operator: "="
                    • left: Identifier {...}
                      • type: "Identifier"
                      • start: 268
                      • end: 273
                      • loc: {...}
                        • start: {...}
                          • line: 13
                          • column: 2
                          }
                        • end: {...}
                          • line: 13
                          • column: 7
                          }
                        }
                      • name: "todos"
                      }
                    • right: CallExpression {...}
                      • type: "CallExpression"
                      • start: 276
                      • end: 304
                      • loc: {...}
                        • start: {...}
                          • line: 13
                          • column: 10
                          }
                        • end: {...}
                          • line: 13
                          • column: 38
                          }
                        }
                      • callee: MemberExpression {...}
                        • type: "MemberExpression"
                        • start: 276
                        • end: 288
                        • loc: {...}
                          • start: {...}
                            • line: 13
                            • column: 10
                            }
                          • end: {...}
                            • line: 13
                            • column: 22
                            }
                          }
                        • object: Identifier {...}
                          • type: "Identifier"
                          • start: 276
                          • end: 281
                          • loc: {...}
                            • start: {...}
                              • line: 13
                              • column: 10
                              }
                            • end: {...}
                              • line: 13
                              • column: 15
                              }
                            }
                          • name: "todos"
                          }
                        • property: Identifier {...}
                          • type: "Identifier"
                          • start: 282
                          • end: 288
                          • loc: {...}
                            • start: {...}
                              • line: 13
                              • column: 16
                              }
                            • end: {...}
                              • line: 13
                              • column: 22
                              }
                            }
                          • name: "filter"
                          }
                        • computed: false
                        • optional: false
                        }
                      • arguments: [...] (1)
                        • ArrowFunctionExpression {...}
                          • type: "ArrowFunctionExpression"
                          • start: 289
                          • end: 303
                          • loc: {...}
                            • start: {...}
                              • line: 13
                              • column: 23
                              }
                            • end: {...}
                              • line: 13
                              • column: 37
                              }
                            }
                          • id: null
                          • expression: true
                          • generator: false
                          • async: false
                          • params: [...] (1)
                            • Identifier {...}
                              • type: "Identifier"
                              • start: 290
                              • end: 291
                              • loc: {...}
                                • start: {...}
                                  • line: 13
                                  • column: 24
                                  }
                                • end: {...}
                                  • line: 13
                                  • column: 25
                                  }
                                }
                              • name: "t"
                              }
                            ]
                          • body: UnaryExpression {...}
                            • type: "UnaryExpression"
                            • start: 296
                            • end: 303
                            • loc: {...}
                              • start: {...}
                                • line: 13
                                • column: 30
                                }
                              • end: {...}
                                • line: 13
                                • column: 37
                                }
                              }
                            • operator: "!"
                            • prefix: true
                            • argument: MemberExpression {...}
                              • type: "MemberExpression"
                              • start: 297
                              • end: 303
                              • loc: {...}
                                • start: {...}
                                  • line: 13
                                  • column: 31
                                  }
                                • end: {...}
                                  • line: 13
                                  • column: 37
                                  }
                                }
                              • object: Identifier {...}
                                • type: "Identifier"
                                • start: 297
                                • end: 298
                                • loc: {...}
                                  • start: {...}
                                    • line: 13
                                    • column: 31
                                    }
                                  • end: {...}
                                    • line: 13
                                    • column: 32
                                    }
                                  }
                                • name: "t"
                                }
                              • property: Identifier {...}
                                • type: "Identifier"
                                • start: 299
                                • end: 303
                                • loc: {...}
                                  • start: {...}
                                    • line: 13
                                    • column: 33
                                    }
                                  • end: {...}
                                    • line: 13
                                    • column: 37
                                    }
                                  }
                                • name: "done"
                                }
                              • computed: false
                              • optional: false
                              }
                            }
                          }
                        ]
                      • optional: false
                      }
                    }
                  }
                ]
              }
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 311
            • end: 373
            • loc: {...}
              • start: {...}
                • line: 16
                • column: 1
                }
              • end: {...}
                • line: 16
                • column: 63
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 315
                • end: 372
                • loc: {...}
                  • start: {...}
                    • line: 16
                    • column: 5
                    }
                  • end: {...}
                    • line: 16
                    • column: 62
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 315
                  • end: 324
                  • loc: {...}
                    • start: {...}
                      • line: 16
                      • column: 5
                      }
                    • end: {...}
                      • line: 16
                      • column: 14
                      }
                    }
                  • name: "remaining"
                  }
                • init: CallExpression {...}
                  • type: "CallExpression"
                  • start: 327
                  • end: 372
                  • loc: {...}
                    • start: {...}
                      • line: 16
                      • column: 17
                      }
                    • end: {...}
                      • line: 16
                      • column: 62
                      }
                    }
                  • callee: Identifier {...}
                    • type: "Identifier"
                    • start: 327
                    • end: 335
                    • loc: {...}
                      • start: {...}
                        • line: 16
                        • column: 17
                        }
                      • end: {...}
                        • line: 16
                        • column: 25
                        }
                      }
                    • name: "$derived"
                    }
                  • arguments: [...] (1)
                    • MemberExpression {...}
                      • type: "MemberExpression"
                      • start: 336
                      • end: 371
                      • loc: {...}
                        • start: {...}
                          • line: 16
                          • column: 26
                          }
                        • end: {...}
                          • line: 16
                          • column: 61
                          }
                        }
                      • object: CallExpression {...}
                        • type: "CallExpression"
                        • start: 336
                        • end: 364
                        • loc: {...}
                          • start: {...}
                            • line: 16
                            • column: 26
                            }
                          • end: {...}
                            • line: 16
                            • column: 54
                            }
                          }
                        • callee: MemberExpression {...}
                          • type: "MemberExpression"
                          • start: 336
                          • end: 348
                          • loc: {...}
                            • start: {...}
                              • line: 16
                              • column: 26
                              }
                            • end: {...}
                              • line: 16
                              • column: 38
                              }
                            }
                          • object: Identifier {...}
                            • type: "Identifier"
                            • start: 336
                            • end: 341
                            • loc: {...}
                              • start: {...}
                                • line: 16
                                • column: 26
                                }
                              • end: {...}
                                • line: 16
                                • column: 31
                                }
                              }
                            • name: "todos"
                            }
                          • property: Identifier {...}
                            • type: "Identifier"
                            • start: 342
                            • end: 348
                            • loc: {...}
                              • start: {...}
                                • line: 16
                                • column: 32
                                }
                              • end: {...}
                                • line: 16
                                • column: 38
                                }
                              }
                            • name: "filter"
                            }
                          • computed: false
                          • optional: false
                          }
                        • arguments: [...] (1)
                          • ArrowFunctionExpression {...}
                            • type: "ArrowFunctionExpression"
                            • start: 349
                            • end: 363
                            • loc: {...}
                              • start: {...}
                                • line: 16
                                • column: 39
                                }
                              • end: {...}
                                • line: 16
                                • column: 53
                                }
                              }
                            • id: null
                            • expression: true
                            • generator: false
                            • async: false
                            • params: [...] (1)
                              • Identifier {...}
                                • type: "Identifier"
                                • start: 350
                                • end: 351
                                • loc: {...}
                                  • start: {...}
                                    • line: 16
                                    • column: 40
                                    }
                                  • end: {...}
                                    • line: 16
                                    • column: 41
                                    }
                                  }
                                • name: "t"
                                }
                              ]
                            • body: UnaryExpression {...}
                              • type: "UnaryExpression"
                              • start: 356
                              • end: 363
                              • loc: {...}
                                • start: {...}
                                  • line: 16
                                  • column: 46
                                  }
                                • end: {...}
                                  • line: 16
                                  • column: 53
                                  }
                                }
                              • operator: "!"
                              • prefix: true
                              • argument: MemberExpression {...}
                                • type: "MemberExpression"
                                • start: 357
                                • end: 363
                                • loc: {...}
                                  • start: {...}
                                    • line: 16
                                    • column: 47
                                    }
                                  • end: {...}
                                    • line: 16
                                    • column: 53
                                    }
                                  }
                                • object: Identifier {...}
                                  • type: "Identifier"
                                  • start: 357
                                  • end: 358
                                  • loc: {...}
                                    • start: {...}
                                      • line: 16
                                      • column: 47
                                      }
                                    • end: {...}
                                      • line: 16
                                      • column: 48
                                      }
                                    }
                                  • name: "t"
                                  }
                                • property: Identifier {...}
                                  • type: "Identifier"
                                  • start: 359
                                  • end: 363
                                  • loc: {...}
                                    • start: {...}
                                      • line: 16
                                      • column: 49
                                      }
                                    • end: {...}
                                      • line: 16
                                      • column: 53
                                      }
                                    }
                                  • name: "done"
                                  }
                                • computed: false
                                • optional: false
                                }
                              }
                            }
                          ]
                        • optional: false
                        }
                      • property: Identifier {...}
                        • type: "Identifier"
                        • start: 365
                        • end: 371
                        • loc: {...}
                          • start: {...}
                            • line: 16
                            • column: 55
                            }
                          • end: {...}
                            • line: 16
                            • column: 61
                            }
                          }
                        • name: "length"
                        }
                      • computed: false
                      • optional: false
                      }
                    ]
                  • optional: false
                  }
                }
              ]
            • kind: "let"
            }
          ]
        • sourceType: "module"
        }
      • attributes: []
      }
    }
The AST is not public API and may change at any point in time
Each block bindings • Playground • Svelte