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 number = $state(0);
let currentValue = $derived(number * 2);
const addByOne = () => number += 1;
const decreaseByOne = () => number > 0 ? number -= 1: 0;
const reset = () => number = 0;
const multiplyByTwo = () => number *= 2;
</script>

<div class="container">
<h1>Multiplied By Two: {currentValue}</h1>
<button class="addBtn" onclick = {addByOne}>Add By One</button>
<button class="decreaseBtn" onclick = {decreaseByOne}>Decrease By One</button>
<button onclick = {reset}>Reset</button>
<button onclick = {multiplyByTwo}>Multiply By Two</button>
<p>Current Value is: {number}</p>
</div>


<style>
:root {
--backgound_color: #1e293b;;
--font_family: fantasy;
--btn_color: #18181b;
--btn_add_color: #047857;
--btn_decrease_color: #dc2626;
}
.container {
background-color: var(--backgound_color);
font-family: var(--font_family);
text-align: center;
max-width: 100%;
height: 100vh;
resolving https://unpkg.com/svelte@5.2.3/src/internal/client/dev/console-log.js
import "svelte/internal/disclose-version";
import * as $ from "svelte/internal/client";

const addByOne = (_, number) => $.set(number, $.get(number) + 1);
const decreaseByOne = (__1, number) => $.get(number) > 0 ? $.set(number, $.get(number) - 1) : 0;
const reset = (__2, number) => $.set(number, 0);
const multiplyByTwo = (__3, number) => $.set(number, $.get(number) * 2);
var root = $.template(`<div class="container svelte-3hnaup"><h1 class="svelte-3hnaup"> </h1> <button class="addBtn svelte-3hnaup">Add By One</button> <button class="decreaseBtn svelte-3hnaup">Decrease By One</button> <button class="svelte-3hnaup">Reset</button> <button class="svelte-3hnaup">Multiply By Two</button> <p class="svelte-3hnaup"> </p></div>`);

export default function App($$anchor) {
let number = $.state(0);
let currentValue = $.derived(() => $.get(number) * 2);
var div = root();
var h1 = $.child(div);
var text = $.child(h1);

$.reset(h1);

var button = $.sibling(h1, 2);

button.__click = [addByOne, number];

var button_1 = $.sibling(button, 2);

button_1.__click = [decreaseByOne, number];

var button_2 = $.sibling(button_1, 2);

button_2.__click = [reset, number];

var button_3 = $.sibling(button_2, 2);

button_3.__click = [multiplyByTwo, number];

var p = $.sibling(button_3, 2);
var text_1 = $.child(p);
result = svelte.compile(source, {
generate: ,
});

:root {
--backgound_color: #1e293b;;
--font_family: fantasy;
--btn_color: #18181b;
--btn_add_color: #047857;
--btn_decrease_color: #dc2626;
}
.container.svelte-3hnaup {
background-color: var(--backgound_color);
font-family: var(--font_family);
text-align: center;
max-width: 100%;
height: 100vh;
padding: 3rem;
}

h1.svelte-3hnaup {
font-size: 3rem;
}

button.svelte-3hnaup {
background-color: var(--btn_color);
border: none;
border-radius: 5px;
font-family: var(--font_family);
font-size: 18px;
padding: 10px;
}

.addBtn.svelte-3hnaup {
background-color: var(--btn_add_color)
}

		
			
				
  • Root {
    • css: StyleSheet {...}
      • type: "StyleSheet"
      • start: 622
      • end: 1313
      • attributes: []
      • children: [...] (7)
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 631
            • end: 636
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 631
                • end: 636
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • PseudoClassSelector {...}
                        • type: "PseudoClassSelector"
                        • name: "root"
                        • args: null
                        • start: 631
                        • end: 636
                        }
                      ]
                    • start: 631
                    • end: 636
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 637
            • end: 783
            • children: [...] (5)
              • Declaration {...}
                • type: "Declaration"
                • start: 641
                • end: 667
                • property: "--backgound_color"
                • value: "#1e293b"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 668
                • end: 694
                • property: ";"
                • value: "--font_family: fantasy"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 698
                • end: 718
                • property: "--btn_color"
                • value: "#18181b"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 722
                • end: 746
                • property: "--btn_add_color"
                • value: "#047857"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 750
                • end: 779
                • property: "--btn_decrease_color"
                • value: "#dc2626"
                }
              ]
            }
          • start: 631
          • end: 783
          }
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 787
            • end: 797
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 787
                • end: 797
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • ClassSelector {...}
                        • type: "ClassSelector"
                        • name: "container"
                        • start: 787
                        • end: 797
                        }
                      ]
                    • start: 787
                    • end: 797
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 798
            • end: 956
            • children: [...] (6)
              • Declaration {...}
                • type: "Declaration"
                • start: 802
                • end: 842
                • property: "background-color"
                • value: "var(--backgound_color)"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 846
                • end: 877
                • property: "font-family"
                • value: "var(--font_family)"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 881
                • end: 899
                • property: "text-align"
                • value: "center"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 903
                • end: 918
                • property: "max-width"
                • value: "100%"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 922
                • end: 935
                • property: "height"
                • value: "100vh"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 939
                • end: 952
                • property: "padding"
                • value: "3rem"
                }
              ]
            }
          • start: 787
          • end: 956
          }
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 960
            • end: 962
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 960
                • end: 962
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • TypeSelector {...}
                        • type: "TypeSelector"
                        • name: "h1"
                        • start: 960
                        • end: 962
                        }
                      ]
                    • start: 960
                    • end: 962
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 963
            • end: 986
            • children: [...] (1)
              • Declaration {...}
                • type: "Declaration"
                • start: 967
                • end: 982
                • property: "font-size"
                • value: "3rem"
                }
              ]
            }
          • start: 960
          • end: 986
          }
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 989
            • end: 995
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 989
                • end: 995
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • TypeSelector {...}
                        • type: "TypeSelector"
                        • name: "button"
                        • start: 989
                        • end: 995
                        }
                      ]
                    • start: 989
                    • end: 995
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 996
            • end: 1150
            • children: [...] (6)
              • Declaration {...}
                • type: "Declaration"
                • start: 1000
                • end: 1034
                • property: "background-color"
                • value: "var(--btn_color)"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 1038
                • end: 1050
                • property: "border"
                • value: "none"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 1054
                • end: 1072
                • property: "border-radius"
                • value: "5px"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 1076
                • end: 1107
                • property: "font-family"
                • value: "var(--font_family)"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 1111
                • end: 1126
                • property: "font-size"
                • value: "18px"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 1130
                • end: 1143
                • property: "padding"
                • value: "10px"
                }
              ]
            }
          • start: 989
          • end: 1150
          }
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 1153
            • end: 1160
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 1153
                • end: 1160
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • ClassSelector {...}
                        • type: "ClassSelector"
                        • name: "addBtn"
                        • start: 1153
                        • end: 1160
                        }
                      ]
                    • start: 1153
                    • end: 1160
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 1161
            • end: 1206
            • children: [...] (1)
              • Declaration {...}
                • type: "Declaration"
                • start: 1165
                • end: 1205
                • property: "background-color"
                • value: "var(--btn_add_color)"
                }
              ]
            }
          • start: 1153
          • end: 1206
          }
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 1209
            • end: 1221
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 1209
                • end: 1221
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • ClassSelector {...}
                        • type: "ClassSelector"
                        • name: "decreaseBtn"
                        • start: 1209
                        • end: 1221
                        }
                      ]
                    • start: 1209
                    • end: 1221
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 1222
            • end: 1273
            • children: [...] (1)
              • Declaration {...}
                • type: "Declaration"
                • start: 1226
                • end: 1269
                • property: "background-color"
                • value: "var(--btn_decrease_color)"
                }
              ]
            }
          • start: 1209
          • end: 1273
          }
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 1276
            • end: 1277
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 1276
                • end: 1277
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • TypeSelector {...}
                        • type: "TypeSelector"
                        • name: "p"
                        • start: 1276
                        • end: 1277
                        }
                      ]
                    • start: 1276
                    • end: 1277
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 1278
            • end: 1301
            • children: [...] (1)
              • Declaration {...}
                • type: "Declaration"
                • start: 1282
                • end: 1297
                • property: "font-size"
                • value: "2rem"
                }
              ]
            }
          • start: 1276
          • end: 1301
          }
        ]
      • content: {...}
        • start: 629
        • end: 1305
        • styles: "\n\t:root {\n\t\t--backgound_color: #1e293b;;\n\t\t--font_family: fantasy;\n\t\t--btn_color: #18181b;\n\t\t--btn_add_color: #047857;\n\t\t--btn_decrease_color: #dc2626;\n\t}\n\t\n\t.container {\n\t\tbackground-color: var(--backgound_color);\n\t\tfont-family: var(--font_family);\n\t\ttext-align: center;\n\t\tmax-width: 100%;\n\t\theight: 100vh;\n\t\tpadding: 3rem;\n\t}\n\n h1 {\n\t\tfont-size: 3rem;\n\t}\n\n\tbutton {\n\t\tbackground-color: var(--btn_color);\n\t\tborder: none;\n\t\tborder-radius: 5px;\n\t\tfont-family: var(--font_family);\n\t\tfont-size: 18px;\n\t\tpadding: 10px;\n\t\t\n\t}\n\n\t.addBtn {\n\t\tbackground-color: var(--btn_add_color)\n\t}\n\n\t.decreaseBtn {\n\t\tbackground-color: var(--btn_decrease_color);\n\t}\n\n\tp {\n\t\tfont-size: 2rem;\n\t}\n\n\t\n"
        • comment: null
        }
      }
    • js: []
    • start: 262
    • end: 619
    • type: "Root"
    • fragment: Fragment {...}
      • type: "Fragment"
      • nodes: [...] (3)
        • Text {...}
          • type: "Text"
          • start: 259
          • end: 262
          • raw: "\n\n "
          • data: "\n\n "
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 262
          • end: 619
          • name: "div"
          • attributes: [...] (1)
            • Attribute {...}
              • type: "Attribute"
              • start: 267
              • end: 284
              • name: "class"
              • value: [...] (1)
                • Text {...}
                  • start: 274
                  • end: 283
                  • type: "Text"
                  • raw: "container"
                  • data: "container svelte-3hnaup"
                  }
                ]
              }
            ]
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (13)
              • Text {...}
                • type: "Text"
                • start: 285
                • end: 287
                • raw: "\n "
                • data: "\n "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 287
                • end: 329
                • name: "h1"
                • attributes: [...] (1)
                  • Attribute {...}
                    • type: "Attribute"
                    • start: -1
                    • end: -1
                    • name: "class"
                    • value: [...] (1)
                      • Text {...}
                        • type: "Text"
                        • data: "svelte-3hnaup"
                        • raw: "svelte-3hnaup"
                        • start: -1
                        • end: -1
                        }
                      ]
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (2)
                    • Text {...}
                      • type: "Text"
                      • start: 291
                      • end: 310
                      • raw: "Multiplied By Two: "
                      • data: "Multiplied By Two: "
                      }
                    • ExpressionTag {...}
                      • type: "ExpressionTag"
                      • start: 310
                      • end: 324
                      • expression: Identifier {...}
                        • type: "Identifier"
                        • start: 311
                        • end: 323
                        • loc: {...}
                          • start: {...}
                            • line: 13
                            • column: 25
                            }
                          • end: {...}
                            • line: 13
                            • column: 37
                            }
                          }
                        • name: "currentValue"
                        }
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 329
                • end: 331
                • raw: " "
                • data: " "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 331
                • end: 394
                • name: "button"
                • attributes: [...] (2)
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 339
                    • end: 353
                    • name: "class"
                    • value: [...] (1)
                      • Text {...}
                        • start: 346
                        • end: 352
                        • type: "Text"
                        • raw: "addBtn"
                        • data: "addBtn svelte-3hnaup"
                        }
                      ]
                    }
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 354
                    • end: 374
                    • name: "onclick"
                    • value: ExpressionTag {...}
                      • type: "ExpressionTag"
                      • start: 364
                      • end: 374
                      • expression: Identifier {...}
                        • type: "Identifier"
                        • start: 365
                        • end: 373
                        • loc: {...}
                          • start: {...}
                            • line: 14
                            • column: 35
                            }
                          • end: {...}
                            • line: 14
                            • column: 43
                            }
                          }
                        • name: "addByOne"
                        }
                      }
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (1)
                    • Text {...}
                      • type: "Text"
                      • start: 375
                      • end: 385
                      • raw: "Add By One"
                      • data: "Add By One"
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 394
                • end: 396
                • raw: " "
                • data: " "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 396
                • end: 474
                • name: "button"
                • attributes: [...] (2)
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 404
                    • end: 423
                    • name: "class"
                    • value: [...] (1)
                      • Text {...}
                        • start: 411
                        • end: 422
                        • type: "Text"
                        • raw: "decreaseBtn"
                        • data: "decreaseBtn svelte-3hnaup"
                        }
                      ]
                    }
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 424
                    • end: 449
                    • name: "onclick"
                    • value: ExpressionTag {...}
                      • type: "ExpressionTag"
                      • start: 434
                      • end: 449
                      • expression: Identifier {...}
                        • type: "Identifier"
                        • start: 435
                        • end: 448
                        • loc: {...}
                          • start: {...}
                            • line: 15
                            • column: 40
                            }
                          • end: {...}
                            • line: 15
                            • column: 53
                            }
                          }
                        • name: "decreaseByOne"
                        }
                      }
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (1)
                    • Text {...}
                      • type: "Text"
                      • start: 450
                      • end: 465
                      • raw: "Decrease By One"
                      • data: "Decrease By One"
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 474
                • end: 476
                • raw: " "
                • data: " "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 476
                • end: 516
                • name: "button"
                • attributes: [...] (2)
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 484
                    • end: 501
                    • name: "onclick"
                    • value: ExpressionTag {...}
                      • type: "ExpressionTag"
                      • start: 494
                      • end: 501
                      • expression: Identifier {...}
                        • type: "Identifier"
                        • start: 495
                        • end: 500
                        • loc: {...}
                          • start: {...}
                            • line: 16
                            • column: 20
                            }
                          • end: {...}
                            • line: 16
                            • column: 25
                            }
                          }
                        • name: "reset"
                        }
                      }
                    }
                  • Attribute {...}
                    • type: "Attribute"
                    • start: -1
                    • end: -1
                    • name: "class"
                    • value: [...] (1)
                      • Text {...}
                        • type: "Text"
                        • data: "svelte-3hnaup"
                        • raw: "svelte-3hnaup"
                        • start: -1
                        • end: -1
                        }
                      ]
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (1)
                    • Text {...}
                      • type: "Text"
                      • start: 502
                      • end: 507
                      • raw: "Reset"
                      • data: "Reset"
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 516
                • end: 518
                • raw: " "
                • data: " "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 518
                • end: 576
                • name: "button"
                • attributes: [...] (2)
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 526
                    • end: 551
                    • name: "onclick"
                    • value: ExpressionTag {...}
                      • type: "ExpressionTag"
                      • start: 536
                      • end: 551
                      • expression: Identifier {...}
                        • type: "Identifier"
                        • start: 537
                        • end: 550
                        • loc: {...}
                          • start: {...}
                            • line: 17
                            • column: 20
                            }
                          • end: {...}
                            • line: 17
                            • column: 33
                            }
                          }
                        • name: "multiplyByTwo"
                        }
                      }
                    }
                  • Attribute {...}
                    • type: "Attribute"
                    • start: -1
                    • end: -1
                    • name: "class"
                    • value: [...] (1)
                      • Text {...}
                        • type: "Text"
                        • data: "svelte-3hnaup"
                        • raw: "svelte-3hnaup"
                        • start: -1
                        • end: -1
                        }
                      ]
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (1)
                    • Text {...}
                      • type: "Text"
                      • start: 552
                      • end: 567
                      • raw: "Multiply By Two"
                      • data: "Multiply By Two"
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 576
                • end: 579
                • raw: " "
                • data: " "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 579
                • end: 612
                • name: "p"
                • attributes: [...] (1)
                  • Attribute {...}
                    • type: "Attribute"
                    • start: -1
                    • end: -1
                    • name: "class"
                    • value: [...] (1)
                      • Text {...}
                        • type: "Text"
                        • data: "svelte-3hnaup"
                        • raw: "svelte-3hnaup"
                        • start: -1
                        • end: -1
                        }
                      ]
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (2)
                    • Text {...}
                      • type: "Text"
                      • start: 582
                      • end: 600
                      • raw: "Current Value is: "
                      • data: "Current Value is: "
                      }
                    • ExpressionTag {...}
                      • type: "ExpressionTag"
                      • start: 600
                      • end: 608
                      • expression: Identifier {...}
                        • type: "Identifier"
                        • start: 601
                        • end: 607
                        • loc: {...}
                          • start: {...}
                            • line: 18
                            • column: 23
                            }
                          • end: {...}
                            • line: 18
                            • column: 29
                            }
                          }
                        • name: "number"
                        }
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 612
                • end: 613
                • raw: "\n"
                • data: "\n"
                }
              ]
            }
          }
        • Text {...}
          • type: "Text"
          • start: 619
          • end: 622
          • raw: "\n\n\n"
          • data: "\n\n\n"
          }
        ]
      }
    • options: null
    • instance: Script {...}
      • type: "Script"
      • start: 0
      • end: 259
      • context: "default"
      • content: Program {...}
        • type: "Program"
        • start: 8
        • end: 250
        • loc: {...}
          • start: {...}
            • line: 1
            • column: 0
            }
          • end: {...}
            • line: 10
            • column: 0
            }
          }
        • body: [...] (6)
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 10
            • end: 33
            • loc: {...}
              • start: {...}
                • line: 2
                • column: 1
                }
              • end: {...}
                • line: 2
                • column: 24
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 14
                • end: 32
                • loc: {...}
                  • start: {...}
                    • line: 2
                    • column: 5
                    }
                  • end: {...}
                    • line: 2
                    • column: 23
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 14
                  • end: 20
                  • loc: {...}
                    • start: {...}
                      • line: 2
                      • column: 5
                      }
                    • end: {...}
                      • line: 2
                      • column: 11
                      }
                    }
                  • name: "number"
                  }
                • init: CallExpression {...}
                  • type: "CallExpression"
                  • start: 23
                  • end: 32
                  • loc: {...}
                    • start: {...}
                      • line: 2
                      • column: 14
                      }
                    • end: {...}
                      • line: 2
                      • column: 23
                      }
                    }
                  • callee: Identifier {...}
                    • type: "Identifier"
                    • start: 23
                    • end: 29
                    • loc: {...}
                      • start: {...}
                        • line: 2
                        • column: 14
                        }
                      • end: {...}
                        • line: 2
                        • column: 20
                        }
                      }
                    • name: "$state"
                    }
                  • arguments: [...] (1)
                    • Literal {...}
                      • type: "Literal"
                      • start: 30
                      • end: 31
                      • loc: {...}
                        • start: {...}
                          • line: 2
                          • column: 21
                          }
                        • end: {...}
                          • line: 2
                          • column: 22
                          }
                        }
                      • value: 0
                      • raw: "0"
                      }
                    ]
                  • optional: false
                  }
                }
              ]
            • kind: "let"
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 35
            • end: 75
            • loc: {...}
              • start: {...}
                • line: 3
                • column: 1
                }
              • end: {...}
                • line: 3
                • column: 41
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 39
                • end: 74
                • loc: {...}
                  • start: {...}
                    • line: 3
                    • column: 5
                    }
                  • end: {...}
                    • line: 3
                    • column: 40
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 39
                  • end: 51
                  • loc: {...}
                    • start: {...}
                      • line: 3
                      • column: 5
                      }
                    • end: {...}
                      • line: 3
                      • column: 17
                      }
                    }
                  • name: "currentValue"
                  }
                • init: CallExpression {...}
                  • type: "CallExpression"
                  • start: 54
                  • end: 74
                  • loc: {...}
                    • start: {...}
                      • line: 3
                      • column: 20
                      }
                    • end: {...}
                      • line: 3
                      • column: 40
                      }
                    }
                  • callee: Identifier {...}
                    • type: "Identifier"
                    • start: 54
                    • end: 62
                    • loc: {...}
                      • start: {...}
                        • line: 3
                        • column: 20
                        }
                      • end: {...}
                        • line: 3
                        • column: 28
                        }
                      }
                    • name: "$derived"
                    }
                  • arguments: [...] (1)
                    • BinaryExpression {...}
                      • type: "BinaryExpression"
                      • start: 63
                      • end: 73
                      • loc: {...}
                        • start: {...}
                          • line: 3
                          • column: 29
                          }
                        • end: {...}
                          • line: 3
                          • column: 39
                          }
                        }
                      • left: Identifier {...}
                        • type: "Identifier"
                        • start: 63
                        • end: 69
                        • loc: {...}
                          • start: {...}
                            • line: 3
                            • column: 29
                            }
                          • end: {...}
                            • line: 3
                            • column: 35
                            }
                          }
                        • name: "number"
                        }
                      • operator: "*"
                      • right: Literal {...}
                        • type: "Literal"
                        • start: 72
                        • end: 73
                        • loc: {...}
                          • start: {...}
                            • line: 3
                            • column: 38
                            }
                          • end: {...}
                            • line: 3
                            • column: 39
                            }
                          }
                        • value: 2
                        • raw: "2"
                        }
                      }
                    ]
                  • optional: false
                  }
                }
              ]
            • kind: "let"
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 79
            • end: 114
            • loc: {...}
              • start: {...}
                • line: 5
                • column: 1
                }
              • end: {...}
                • line: 5
                • column: 36
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 85
                • end: 113
                • loc: {...}
                  • start: {...}
                    • line: 5
                    • column: 7
                    }
                  • end: {...}
                    • line: 5
                    • column: 35
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 85
                  • end: 93
                  • loc: {...}
                    • start: {...}
                      • line: 5
                      • column: 7
                      }
                    • end: {...}
                      • line: 5
                      • column: 15
                      }
                    }
                  • name: "addByOne"
                  }
                • init: ArrowFunctionExpression {...}
                  • type: "ArrowFunctionExpression"
                  • start: 96
                  • end: 113
                  • loc: {...}
                    • start: {...}
                      • line: 5
                      • column: 18
                      }
                    • end: {...}
                      • line: 5
                      • column: 35
                      }
                    }
                  • id: null
                  • expression: true
                  • generator: false
                  • async: false
                  • params: []
                  • body: AssignmentExpression {...}
                    • type: "AssignmentExpression"
                    • start: 102
                    • end: 113
                    • loc: {...}
                      • start: {...}
                        • line: 5
                        • column: 24
                        }
                      • end: {...}
                        • line: 5
                        • column: 35
                        }
                      }
                    • operator: "+="
                    • left: Identifier {...}
                      • type: "Identifier"
                      • start: 102
                      • end: 108
                      • loc: {...}
                        • start: {...}
                          • line: 5
                          • column: 24
                          }
                        • end: {...}
                          • line: 5
                          • column: 30
                          }
                        }
                      • name: "number"
                      }
                    • right: Literal {...}
                      • type: "Literal"
                      • start: 112
                      • end: 113
                      • loc: {...}
                        • start: {...}
                          • line: 5
                          • column: 34
                          }
                        • end: {...}
                          • line: 5
                          • column: 35
                          }
                        }
                      • value: 1
                      • raw: "1"
                      }
                    }
                  }
                }
              ]
            • kind: "const"
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 116
            • end: 172
            • loc: {...}
              • start: {...}
                • line: 6
                • column: 1
                }
              • end: {...}
                • line: 6
                • column: 57
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 122
                • end: 171
                • loc: {...}
                  • start: {...}
                    • line: 6
                    • column: 7
                    }
                  • end: {...}
                    • line: 6
                    • column: 56
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 122
                  • end: 135
                  • loc: {...}
                    • start: {...}
                      • line: 6
                      • column: 7
                      }
                    • end: {...}
                      • line: 6
                      • column: 20
                      }
                    }
                  • name: "decreaseByOne"
                  }
                • init: ArrowFunctionExpression {...}
                  • type: "ArrowFunctionExpression"
                  • start: 138
                  • end: 171
                  • loc: {...}
                    • start: {...}
                      • line: 6
                      • column: 23
                      }
                    • end: {...}
                      • line: 6
                      • column: 56
                      }
                    }
                  • id: null
                  • expression: true
                  • generator: false
                  • async: false
                  • params: []
                  • body: ConditionalExpression {...}
                    • type: "ConditionalExpression"
                    • start: 144
                    • end: 171
                    • loc: {...}
                      • start: {...}
                        • line: 6
                        • column: 29
                        }
                      • end: {...}
                        • line: 6
                        • column: 56
                        }
                      }
                    • test: BinaryExpression {...}
                      • type: "BinaryExpression"
                      • start: 144
                      • end: 154
                      • loc: {...}
                        • start: {...}
                          • line: 6
                          • column: 29
                          }
                        • end: {...}
                          • line: 6
                          • column: 39
                          }
                        }
                      • left: Identifier {...}
                        • type: "Identifier"
                        • start: 144
                        • end: 150
                        • loc: {...}
                          • start: {...}
                            • line: 6
                            • column: 29
                            }
                          • end: {...}
                            • line: 6
                            • column: 35
                            }
                          }
                        • name: "number"
                        }
                      • operator: ">"
                      • right: Literal {...}
                        • type: "Literal"
                        • start: 153
                        • end: 154
                        • loc: {...}
                          • start: {...}
                            • line: 6
                            • column: 38
                            }
                          • end: {...}
                            • line: 6
                            • column: 39
                            }
                          }
                        • value: 0
                        • raw: "0"
                        }
                      }
                    • consequent: AssignmentExpression {...}
                      • type: "AssignmentExpression"
                      • start: 157
                      • end: 168
                      • loc: {...}
                        • start: {...}
                          • line: 6
                          • column: 42
                          }
                        • end: {...}
                          • line: 6
                          • column: 53
                          }
                        }
                      • operator: "-="
                      • left: Identifier {...}
                        • type: "Identifier"
                        • start: 157
                        • end: 163
                        • loc: {...}
                          • start: {...}
                            • line: 6
                            • column: 42
                            }
                          • end: {...}
                            • line: 6
                            • column: 48
                            }
                          }
                        • name: "number"
                        }
                      • right: Literal {...}
                        • type: "Literal"
                        • start: 167
                        • end: 168
                        • loc: {...}
                          • start: {...}
                            • line: 6
                            • column: 52
                            }
                          • end: {...}
                            • line: 6
                            • column: 53
                            }
                          }
                        • value: 1
                        • raw: "1"
                        }
                      }
                    • alternate: Literal {...}
                      • type: "Literal"
                      • start: 170
                      • end: 171
                      • loc: {...}
                        • start: {...}
                          • line: 6
                          • column: 55
                          }
                        • end: {...}
                          • line: 6
                          • column: 56
                          }
                        }
                      • value: 0
                      • raw: "0"
                      }
                    }
                  }
                }
              ]
            • kind: "const"
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 174
            • end: 205
            • loc: {...}
              • start: {...}
                • line: 7
                • column: 1
                }
              • end: {...}
                • line: 7
                • column: 32
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 180
                • end: 204
                • loc: {...}
                  • start: {...}
                    • line: 7
                    • column: 7
                    }
                  • end: {...}
                    • line: 7
                    • column: 31
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 180
                  • end: 185
                  • loc: {...}
                    • start: {...}
                      • line: 7
                      • column: 7
                      }
                    • end: {...}
                      • line: 7
                      • column: 12
                      }
                    }
                  • name: "reset"
                  }
                • init: ArrowFunctionExpression {...}
                  • type: "ArrowFunctionExpression"
                  • start: 188
                  • end: 204
                  • loc: {...}
                    • start: {...}
                      • line: 7
                      • column: 15
                      }
                    • end: {...}
                      • line: 7
                      • column: 31
                      }
                    }
                  • id: null
                  • expression: true
                  • generator: false
                  • async: false
                  • params: []
                  • body: AssignmentExpression {...}
                    • type: "AssignmentExpression"
                    • start: 194
                    • end: 204
                    • loc: {...}
                      • start: {...}
                        • line: 7
                        • column: 21
                        }
                      • end: {...}
                        • line: 7
                        • column: 31
                        }
                      }
                    • operator: "="
                    • left: Identifier {...}
                      • type: "Identifier"
                      • start: 194
                      • end: 200
                      • loc: {...}
                        • start: {...}
                          • line: 7
                          • column: 21
                          }
                        • end: {...}
                          • line: 7
                          • column: 27
                          }
                        }
                      • name: "number"
                      }
                    • right: Literal {...}
                      • type: "Literal"
                      • start: 203
                      • end: 204
                      • loc: {...}
                        • start: {...}
                          • line: 7
                          • column: 30
                          }
                        • end: {...}
                          • line: 7
                          • column: 31
                          }
                        }
                      • value: 0
                      • raw: "0"
                      }
                    }
                  }
                }
              ]
            • kind: "const"
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 207
            • end: 247
            • loc: {...}
              • start: {...}
                • line: 8
                • column: 1
                }
              • end: {...}
                • line: 8
                • column: 41
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 213
                • end: 246
                • loc: {...}
                  • start: {...}
                    • line: 8
                    • column: 7
                    }
                  • end: {...}
                    • line: 8
                    • column: 40
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 213
                  • end: 226
                  • loc: {...}
                    • start: {...}
                      • line: 8
                      • column: 7
                      }
                    • end: {...}
                      • line: 8
                      • column: 20
                      }
                    }
                  • name: "multiplyByTwo"
                  }
                • init: ArrowFunctionExpression {...}
                  • type: "ArrowFunctionExpression"
                  • start: 229
                  • end: 246
                  • loc: {...}
                    • start: {...}
                      • line: 8
                      • column: 23
                      }
                    • end: {...}
                      • line: 8
                      • column: 40
                      }
                    }
                  • id: null
                  • expression: true
                  • generator: false
                  • async: false
                  • params: []
                  • body: AssignmentExpression {...}
                    • type: "AssignmentExpression"
                    • start: 235
                    • end: 246
                    • loc: {...}
                      • start: {...}
                        • line: 8
                        • column: 29
                        }
                      • end: {...}
                        • line: 8
                        • column: 40
                        }
                      }
                    • operator: "*="
                    • left: Identifier {...}
                      • type: "Identifier"
                      • start: 235
                      • end: 241
                      • loc: {...}
                        • start: {...}
                          • line: 8
                          • column: 29
                          }
                        • end: {...}
                          • line: 8
                          • column: 35
                          }
                        }
                      • name: "number"
                      }
                    • right: Literal {...}
                      • type: "Literal"
                      • start: 245
                      • end: 246
                      • loc: {...}
                        • start: {...}
                          • line: 8
                          • column: 39
                          }
                        • end: {...}
                          • line: 8
                          • column: 40
                          }
                        }
                      • value: 2
                      • raw: "2"
                      }
                    }
                  }
                }
              ]
            • kind: "const"
            }
          ]
        • sourceType: "module"
        }
      • attributes: []
      }
    }
The AST is not public API and may change at any point in time