Create new
Bindings
Transitions
Animations
Easing
Component composition
Context API
Special elements
Module context
Debugging
Miscellaneous
App.svelte
runes
This component is not in runes mode.
To enable runes mode, either start using runes in your code, or add the following to the top of your component:
<svelte:options runes />
99
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
›
⌄
⌄
⌄
⌄
⌄
⌄
⌄
<script>
import { spring } from 'svelte/motion';
let coords = spring(
{ x: 50, y: 50 },
{
stiffness: 0.1,
damping: 0.25
}
);
let size = spring(10);
</script>
<div style="position: absolute; right: 1em;">
<label>
<h3>stiffness ({coords.stiffness})</h3>
<input bind:value={coords.stiffness} type="range" min="0" max="1" step="0.01" />
</label>
<label>
<h3>damping ({coords.damping})</h3>
<input bind:value={coords.damping} type="range" min="0" max="1" step="0.01" />
</label>
</div>
<!-- svelte-ignore a11y_no_static_element_interactions -->
<svg
onmousemove={(e) => coords.set({ x: e.clientX, y: e.clientY })}
onmousedown={() => size.set(30)}
onmouseup={() => size.set(10)}
>
<circle cx={$coords.x} cy={$coords.y} r={$size} />
</svg>
<style>
Error compiling component
WebAssembly.instantiateStreaming(): value type opcode @+13
99
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
›
⌄
import 'svelte/internal/disclose-version';
import 'svelte/internal/flags/legacy';
import * as $ from 'svelte/internal/client';
import { spring } from 'svelte/motion';
var root = $.template(`<div style="position: absolute; right: 1em;"><label><h3> </h3> <input type="range" min="0" max="1" step="0.01"></label> <label><h3> </h3> <input type="range" min="0" max="1" step="0.01"></label></div> <svg class="svelte-spycy5"><circle class="svelte-spycy5"></circle></svg>`, 1);
export default function App($$anchor, $$props) {
$.push($$props, false);
const [$$stores, $$cleanup] = $.setup_stores();
const $coords = () => $.store_get($.get(coords), '$coords', $$stores);
const $size = () => $.store_get(size, '$size', $$stores);
let coords = $.mutable_state(spring({ x: 50, y: 50 }, { stiffness: 0.1, damping: 0.25 }));
let size = spring(10);
$.init();
var fragment = root();
var div = $.first_child(fragment);
var label = $.child(div);
var h3 = $.child(label);
var text = $.child(h3);
$.reset(h3);
var input = $.sibling(h3, 2);
$.remove_input_defaults(input);
$.reset(label);
var label_1 = $.sibling(label, 2);
var h3_1 = $.child(label_1);
var text_1 = $.child(h3_1);
$.reset(h3_1);
result = svelte.compile(source, {
generate: ,
});99
1
2
3
4
5
6
7
8
9
10
›
svg.svelte-spycy5 {
width: 100%;
height: 100%;
margin: -8px;
}
circle.svelte-spycy5 {
fill: #ff3e00;
}
Root {
css: StyleSheet {...}
- type: "StyleSheet"
- start: 771
- end: 874
- attributes: []
children: [...] (2)
Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 780
- end: 783
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 780
- end: 783
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
TypeSelector {...}
- type: "TypeSelector"
- name: "svg"
- start: 780
- end: 783
}
]- start: 780
- end: 783
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 784
- end: 835
children: [...] (3)
Declaration {...}
- type: "Declaration"
- start: 788
- end: 799
- property: "width"
- value: "100%"
} Declaration {...}
- type: "Declaration"
- start: 803
- end: 815
- property: "height"
- value: "100%"
} Declaration {...}
- type: "Declaration"
- start: 819
- end: 831
- property: "margin"
- value: "-8px"
}
]
}- start: 780
- end: 835
} Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 837
- end: 843
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 837
- end: 843
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
TypeSelector {...}
- type: "TypeSelector"
- name: "circle"
- start: 837
- end: 843
}
]- start: 837
- end: 843
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 844
- end: 865
children: [...] (1)
Declaration {...}
- type: "Declaration"
- start: 848
- end: 861
- property: "fill"
- value: "#ff3e00"
}
]
}- start: 837
- end: 865
}
]content: {...}
- start: 778
- end: 866
- styles: "\n\tsvg {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tmargin: -8px;\n\t}\n\tcircle {\n\t\tfill: #ff3e00;\n\t}\n"
- comment: null
}
}- js: []
- start: 177
- end: 769
- type: "Root"
fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (7)
Text {...}
- type: "Text"
- start: 175
- end: 177
- raw: "\n\n"
- data: "\n\n"
} RegularElement {...}
- type: "RegularElement"
- start: 177
- end: 512
- name: "div"
attributes: [...] (1)
Attribute {...}
- type: "Attribute"
- start: 182
- end: 221
- name: "style"
value: [...] (1)
Text {...}
- start: 189
- end: 220
- type: "Text"
- raw: "position: absolute; right: 1em;"
- data: "position: absolute; right: 1em;"
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (5)
Text {...}
- type: "Text"
- start: 222
- end: 224
- raw: "\n\t"
- data: "\n\t"
} RegularElement {...}
- type: "RegularElement"
- start: 224
- end: 366
- name: "label"
- attributes: []
fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (5)
Text {...}
- type: "Text"
- start: 231
- end: 234
- raw: "\n\t\t"
- data: "\n\t\t"
} RegularElement {...}
- type: "RegularElement"
- start: 234
- end: 273
- name: "h3"
- attributes: []
fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (3)
Text {...}
- type: "Text"
- start: 238
- end: 249
- raw: "stiffness ("
- data: "stiffness ("
} ExpressionTag {...}
- type: "ExpressionTag"
- start: 249
- end: 267
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 250
- end: 266
loc: {...}
start: {...}
- line: 17
- column: 18
}end: {...}
- line: 17
- column: 34
}
}object: Identifier {...}
- type: "Identifier"
- start: 250
- end: 256
loc: {...}
start: {...}
- line: 17
- column: 18
}end: {...}
- line: 17
- column: 24
}
}- name: "coords"
}property: Identifier {...}
- type: "Identifier"
- start: 257
- end: 266
loc: {...}
start: {...}
- line: 17
- column: 25
}end: {...}
- line: 17
- column: 34
}
}- name: "stiffness"
}- computed: false
- optional: false
}
} Text {...}
- type: "Text"
- start: 267
- end: 268
- raw: ")"
- data: ")"
}
]
}
} Text {...}
- type: "Text"
- start: 273
- end: 276
- raw: " "
- data: " "
} RegularElement {...}
- type: "RegularElement"
- start: 276
- end: 356
- name: "input"
attributes: [...] (5)
BindDirective {...}
- start: 283
- end: 312
- type: "BindDirective"
- name: "value"
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 295
- end: 311
loc: {...}
start: {...}
- line: 18
- column: 21
}end: {...}
- line: 18
- column: 37
}
}object: Identifier {...}
- type: "Identifier"
- start: 295
- end: 301
loc: {...}
start: {...}
- line: 18
- column: 21
}end: {...}
- line: 18
- column: 27
}
}- name: "coords"
}property: Identifier {...}
- type: "Identifier"
- start: 302
- end: 311
loc: {...}
start: {...}
- line: 18
- column: 28
}end: {...}
- line: 18
- column: 37
}
}- name: "stiffness"
}- computed: false
- optional: false
}- modifiers: []
} Attribute {...}
- type: "Attribute"
- start: 313
- end: 325
- name: "type"
value: [...] (1)
Text {...}
- start: 319
- end: 324
- type: "Text"
- raw: "range"
- data: "range"
}
]
} Attribute {...}
- type: "Attribute"
- start: 326
- end: 333
- name: "min"
value: [...] (1)
Text {...}
- start: 331
- end: 332
- type: "Text"
- raw: "0"
- data: "0"
}
]
} Attribute {...}
- type: "Attribute"
- start: 334
- end: 341
- name: "max"
value: [...] (1)
Text {...}
- start: 339
- end: 340
- type: "Text"
- raw: "1"
- data: "1"
}
]
} Attribute {...}
- type: "Attribute"
- start: 342
- end: 353
- name: "step"
value: [...] (1)
Text {...}
- start: 348
- end: 352
- type: "Text"
- raw: "0.01"
- data: "0.01"
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 356
- end: 358
- raw: "\n\t"
- data: "\n\t"
}
]
}
} Text {...}
- type: "Text"
- start: 366
- end: 369
- raw: " "
- data: " "
} RegularElement {...}
- type: "RegularElement"
- start: 369
- end: 505
- name: "label"
- attributes: []
fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (5)
Text {...}
- type: "Text"
- start: 376
- end: 379
- raw: "\n\t\t"
- data: "\n\t\t"
} RegularElement {...}
- type: "RegularElement"
- start: 379
- end: 414
- name: "h3"
- attributes: []
fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (3)
Text {...}
- type: "Text"
- start: 383
- end: 392
- raw: "damping ("
- data: "damping ("
} ExpressionTag {...}
- type: "ExpressionTag"
- start: 392
- end: 408
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 393
- end: 407
loc: {...}
start: {...}
- line: 22
- column: 16
}end: {...}
- line: 22
- column: 30
}
}object: Identifier {...}
- type: "Identifier"
- start: 393
- end: 399
loc: {...}
start: {...}
- line: 22
- column: 16
}end: {...}
- line: 22
- column: 22
}
}- name: "coords"
}property: Identifier {...}
- type: "Identifier"
- start: 400
- end: 407
loc: {...}
start: {...}
- line: 22
- column: 23
}end: {...}
- line: 22
- column: 30
}
}- name: "damping"
}- computed: false
- optional: false
}
} Text {...}
- type: "Text"
- start: 408
- end: 409
- raw: ")"
- data: ")"
}
]
}
} Text {...}
- type: "Text"
- start: 414
- end: 417
- raw: " "
- data: " "
} RegularElement {...}
- type: "RegularElement"
- start: 417
- end: 495
- name: "input"
attributes: [...] (5)
BindDirective {...}
- start: 424
- end: 451
- type: "BindDirective"
- name: "value"
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 436
- end: 450
loc: {...}
start: {...}
- line: 23
- column: 21
}end: {...}
- line: 23
- column: 35
}
}object: Identifier {...}
- type: "Identifier"
- start: 436
- end: 442
loc: {...}
start: {...}
- line: 23
- column: 21
}end: {...}
- line: 23
- column: 27
}
}- name: "coords"
}property: Identifier {...}
- type: "Identifier"
- start: 443
- end: 450
loc: {...}
start: {...}
- line: 23
- column: 28
}end: {...}
- line: 23
- column: 35
}
}- name: "damping"
}- computed: false
- optional: false
}- modifiers: []
} Attribute {...}
- type: "Attribute"
- start: 452
- end: 464
- name: "type"
value: [...] (1)
Text {...}
- start: 458
- end: 463
- type: "Text"
- raw: "range"
- data: "range"
}
]
} Attribute {...}
- type: "Attribute"
- start: 465
- end: 472
- name: "min"
value: [...] (1)
Text {...}
- start: 470
- end: 471
- type: "Text"
- raw: "0"
- data: "0"
}
]
} Attribute {...}
- type: "Attribute"
- start: 473
- end: 480
- name: "max"
value: [...] (1)
Text {...}
- start: 478
- end: 479
- type: "Text"
- raw: "1"
- data: "1"
}
]
} Attribute {...}
- type: "Attribute"
- start: 481
- end: 492
- name: "step"
value: [...] (1)
Text {...}
- start: 487
- end: 491
- type: "Text"
- raw: "0.01"
- data: "0.01"
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 495
- end: 497
- raw: "\n\t"
- data: "\n\t"
}
]
}
} Text {...}
- type: "Text"
- start: 505
- end: 506
- raw: "\n"
- data: "\n"
}
]
}
} Text {...}
- type: "Text"
- start: 512
- end: 514
- raw: " "
- data: " "
} Comment {...}
- type: "Comment"
- start: 514
- end: 572
- data: " svelte-ignore a11y_no_static_element_interactions "
} Text {...}
- type: "Text"
- start: 572
- end: 573
- raw: ""
- data: ""
} RegularElement {...}
- type: "RegularElement"
- start: 573
- end: 769
- name: "svg"
attributes: [...] (4)
Attribute {...}
- type: "Attribute"
- start: 579
- end: 642
- name: "onmousemove"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 591
- end: 642
expression: ArrowFunctionExpression {...}
- type: "ArrowFunctionExpression"
- start: 592
- end: 641
loc: {...}
start: {...}
- line: 29
- column: 14
}end: {...}
- line: 29
- column: 63
}
}- id: null
- expression: true
- generator: false
- async: false
params: [...] (1)
Identifier {...}
- type: "Identifier"
- start: 593
- end: 594
loc: {...}
start: {...}
- line: 29
- column: 15
}end: {...}
- line: 29
- column: 16
}
}- name: "e"
}
]body: CallExpression {...}
- type: "CallExpression"
- start: 599
- end: 641
loc: {...}
start: {...}
- line: 29
- column: 21
}end: {...}
- line: 29
- column: 63
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 599
- end: 609
loc: {...}
start: {...}
- line: 29
- column: 21
}end: {...}
- line: 29
- column: 31
}
}object: Identifier {...}
- type: "Identifier"
- start: 599
- end: 605
loc: {...}
start: {...}
- line: 29
- column: 21
}end: {...}
- line: 29
- column: 27
}
}- name: "coords"
}property: Identifier {...}
- type: "Identifier"
- start: 606
- end: 609
loc: {...}
start: {...}
- line: 29
- column: 28
}end: {...}
- line: 29
- column: 31
}
}- name: "set"
}- computed: false
- optional: false
}arguments: [...] (1)
ObjectExpression {...}
- type: "ObjectExpression"
- start: 610
- end: 640
loc: {...}
start: {...}
- line: 29
- column: 32
}end: {...}
- line: 29
- column: 62
}
}properties: [...] (2)
Property {...}
- type: "Property"
- start: 612
- end: 624
loc: {...}
start: {...}
- line: 29
- column: 34
}end: {...}
- line: 29
- column: 46
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 612
- end: 613
loc: {...}
start: {...}
- line: 29
- column: 34
}end: {...}
- line: 29
- column: 35
}
}- name: "x"
}value: MemberExpression {...}
- type: "MemberExpression"
- start: 615
- end: 624
loc: {...}
start: {...}
- line: 29
- column: 37
}end: {...}
- line: 29
- column: 46
}
}object: Identifier {...}
- type: "Identifier"
- start: 615
- end: 616
loc: {...}
start: {...}
- line: 29
- column: 37
}end: {...}
- line: 29
- column: 38
}
}- name: "e"
}property: Identifier {...}
- type: "Identifier"
- start: 617
- end: 624
loc: {...}
start: {...}
- line: 29
- column: 39
}end: {...}
- line: 29
- column: 46
}
}- name: "clientX"
}- computed: false
- optional: false
}- kind: "init"
} Property {...}
- type: "Property"
- start: 626
- end: 638
loc: {...}
start: {...}
- line: 29
- column: 48
}end: {...}
- line: 29
- column: 60
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 626
- end: 627
loc: {...}
start: {...}
- line: 29
- column: 48
}end: {...}
- line: 29
- column: 49
}
}- name: "y"
}value: MemberExpression {...}
- type: "MemberExpression"
- start: 629
- end: 638
loc: {...}
start: {...}
- line: 29
- column: 51
}end: {...}
- line: 29
- column: 60
}
}object: Identifier {...}
- type: "Identifier"
- start: 629
- end: 630
loc: {...}
start: {...}
- line: 29
- column: 51
}end: {...}
- line: 29
- column: 52
}
}- name: "e"
}property: Identifier {...}
- type: "Identifier"
- start: 631
- end: 638
loc: {...}
start: {...}
- line: 29
- column: 53
}end: {...}
- line: 29
- column: 60
}
}- name: "clientY"
}- computed: false
- optional: false
}- kind: "init"
}
]
}
]- optional: false
}
}
}
} Attribute {...}
- type: "Attribute"
- start: 644
- end: 676
- name: "onmousedown"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 656
- end: 676
expression: ArrowFunctionExpression {...}
- type: "ArrowFunctionExpression"
- start: 657
- end: 675
loc: {...}
start: {...}
- line: 30
- column: 14
}end: {...}
- line: 30
- column: 32
}
}- id: null
- expression: true
- generator: false
- async: false
- params: []
body: CallExpression {...}
- type: "CallExpression"
- start: 663
- end: 675
loc: {...}
start: {...}
- line: 30
- column: 20
}end: {...}
- line: 30
- column: 32
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 663
- end: 671
loc: {...}
start: {...}
- line: 30
- column: 20
}end: {...}
- line: 30
- column: 28
}
}object: Identifier {...}
- type: "Identifier"
- start: 663
- end: 667
loc: {...}
start: {...}
- line: 30
- column: 20
}end: {...}
- line: 30
- column: 24
}
}- name: "size"
}property: Identifier {...}
- type: "Identifier"
- start: 668
- end: 671
loc: {...}
start: {...}
- line: 30
- column: 25
}end: {...}
- line: 30
- column: 28
}
}- name: "set"
}- computed: false
- optional: false
}arguments: [...] (1)
Literal {...}
- type: "Literal"
- start: 672
- end: 674
loc: {...}
start: {...}
- line: 30
- column: 29
}end: {...}
- line: 30
- column: 31
}
}- value: 30
- raw: "30"
}
]- optional: false
}
}
}
} Attribute {...}
- type: "Attribute"
- start: 678
- end: 708
- name: "onmouseup"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 688
- end: 708
expression: ArrowFunctionExpression {...}
- type: "ArrowFunctionExpression"
- start: 689
- end: 707
loc: {...}
start: {...}
- line: 31
- column: 12
}end: {...}
- line: 31
- column: 30
}
}- id: null
- expression: true
- generator: false
- async: false
- params: []
body: CallExpression {...}
- type: "CallExpression"
- start: 695
- end: 707
loc: {...}
start: {...}
- line: 31
- column: 18
}end: {...}
- line: 31
- column: 30
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 695
- end: 703
loc: {...}
start: {...}
- line: 31
- column: 18
}end: {...}
- line: 31
- column: 26
}
}object: Identifier {...}
- type: "Identifier"
- start: 695
- end: 699
loc: {...}
start: {...}
- line: 31
- column: 18
}end: {...}
- line: 31
- column: 22
}
}- name: "size"
}property: Identifier {...}
- type: "Identifier"
- start: 700
- end: 703
loc: {...}
start: {...}
- line: 31
- column: 23
}end: {...}
- line: 31
- column: 26
}
}- name: "set"
}- computed: false
- optional: false
}arguments: [...] (1)
Literal {...}
- type: "Literal"
- start: 704
- end: 706
loc: {...}
start: {...}
- line: 31
- column: 27
}end: {...}
- line: 31
- column: 29
}
}- value: 10
- raw: "10"
}
]- optional: false
}
}
}
} Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-spycy5"
- raw: "svelte-spycy5"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (3)
Text {...}
- type: "Text"
- start: 710
- end: 712
- raw: "\n\t"
- data: "\n\t"
} RegularElement {...}
- type: "RegularElement"
- start: 712
- end: 762
- name: "circle"
attributes: [...] (4)
Attribute {...}
- type: "Attribute"
- start: 720
- end: 734
- name: "cx"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 723
- end: 734
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 724
- end: 733
loc: {...}
start: {...}
- line: 33
- column: 13
}end: {...}
- line: 33
- column: 22
}
}object: Identifier {...}
- type: "Identifier"
- start: 724
- end: 731
loc: {...}
start: {...}
- line: 33
- column: 13
}end: {...}
- line: 33
- column: 20
}
}- name: "$coords"
}property: Identifier {...}
- type: "Identifier"
- start: 732
- end: 733
loc: {...}
start: {...}
- line: 33
- column: 21
}end: {...}
- line: 33
- column: 22
}
}- name: "x"
}- computed: false
- optional: false
}
}
} Attribute {...}
- type: "Attribute"
- start: 735
- end: 749
- name: "cy"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 738
- end: 749
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 739
- end: 748
loc: {...}
start: {...}
- line: 33
- column: 28
}end: {...}
- line: 33
- column: 37
}
}object: Identifier {...}
- type: "Identifier"
- start: 739
- end: 746
loc: {...}
start: {...}
- line: 33
- column: 28
}end: {...}
- line: 33
- column: 35
}
}- name: "$coords"
}property: Identifier {...}
- type: "Identifier"
- start: 747
- end: 748
loc: {...}
start: {...}
- line: 33
- column: 36
}end: {...}
- line: 33
- column: 37
}
}- name: "y"
}- computed: false
- optional: false
}
}
} Attribute {...}
- type: "Attribute"
- start: 750
- end: 759
- name: "r"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 752
- end: 759
expression: Identifier {...}
- type: "Identifier"
- start: 753
- end: 758
loc: {...}
start: {...}
- line: 33
- column: 42
}end: {...}
- line: 33
- column: 47
}
}- name: "$size"
}
}
} Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-spycy5"
- raw: "svelte-spycy5"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 762
- end: 763
- raw: "\n"
- data: "\n"
}
]
}
} Text {...}
- type: "Text"
- start: 769
- end: 771
- raw: "\n\n"
- data: "\n\n"
}
]
}- options: null
instance: Script {...}
- type: "Script"
- start: 0
- end: 175
- context: "default"
content: Program {...}
- type: "Program"
- start: 8
- end: 166
loc: {...}
start: {...}
- line: 1
- column: 0
}end: {...}
- line: 13
- column: 0
}
}body: [...] (3)
ImportDeclaration {...}
- type: "ImportDeclaration"
- start: 10
- end: 49
loc: {...}
start: {...}
- line: 2
- column: 1
}end: {...}
- line: 2
- column: 40
}
}specifiers: [...] (1)
ImportSpecifier {...}
- type: "ImportSpecifier"
- start: 19
- end: 25
loc: {...}
start: {...}
- line: 2
- column: 10
}end: {...}
- line: 2
- column: 16
}
}imported: Identifier {...}
- type: "Identifier"
- start: 19
- end: 25
loc: {...}
start: {...}
- line: 2
- column: 10
}end: {...}
- line: 2
- column: 16
}
}- name: "spring"
}local: Identifier {...}
- type: "Identifier"
- start: 19
- end: 25
loc: {...}
start: {...}
- line: 2
- column: 10
}end: {...}
- line: 2
- column: 16
}
}- name: "spring"
}
}
]source: Literal {...}
- type: "Literal"
- start: 33
- end: 48
loc: {...}
start: {...}
- line: 2
- column: 24
}end: {...}
- line: 2
- column: 39
}
}- value: "svelte/motion"
- raw: "'svelte/motion'"
}
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 52
- end: 140
loc: {...}
start: {...}
- line: 4
- column: 1
}end: {...}
- line: 10
- column: 3
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 56
- end: 139
loc: {...}
start: {...}
- line: 4
- column: 5
}end: {...}
- line: 10
- column: 2
}
}id: Identifier {...}
- type: "Identifier"
- start: 56
- end: 62
loc: {...}
start: {...}
- line: 4
- column: 5
}end: {...}
- line: 4
- column: 11
}
}- name: "coords"
}init: CallExpression {...}
- type: "CallExpression"
- start: 65
- end: 139
loc: {...}
start: {...}
- line: 4
- column: 14
}end: {...}
- line: 10
- column: 2
}
}callee: Identifier {...}
- type: "Identifier"
- start: 65
- end: 71
loc: {...}
start: {...}
- line: 4
- column: 14
}end: {...}
- line: 4
- column: 20
}
}- name: "spring"
}arguments: [...] (2)
ObjectExpression {...}
- type: "ObjectExpression"
- start: 75
- end: 91
loc: {...}
start: {...}
- line: 5
- column: 2
}end: {...}
- line: 5
- column: 18
}
}properties: [...] (2)
Property {...}
- type: "Property"
- start: 77
- end: 82
loc: {...}
start: {...}
- line: 5
- column: 4
}end: {...}
- line: 5
- column: 9
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 77
- end: 78
loc: {...}
start: {...}
- line: 5
- column: 4
}end: {...}
- line: 5
- column: 5
}
}- name: "x"
}value: Literal {...}
- type: "Literal"
- start: 80
- end: 82
loc: {...}
start: {...}
- line: 5
- column: 7
}end: {...}
- line: 5
- column: 9
}
}- value: 50
- raw: "50"
}- kind: "init"
} Property {...}
- type: "Property"
- start: 84
- end: 89
loc: {...}
start: {...}
- line: 5
- column: 11
}end: {...}
- line: 5
- column: 16
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 84
- end: 85
loc: {...}
start: {...}
- line: 5
- column: 11
}end: {...}
- line: 5
- column: 12
}
}- name: "y"
}value: Literal {...}
- type: "Literal"
- start: 87
- end: 89
loc: {...}
start: {...}
- line: 5
- column: 14
}end: {...}
- line: 5
- column: 16
}
}- value: 50
- raw: "50"
}- kind: "init"
}
]
} ObjectExpression {...}
- type: "ObjectExpression"
- start: 95
- end: 136
loc: {...}
start: {...}
- line: 6
- column: 2
}end: {...}
- line: 9
- column: 3
}
}properties: [...] (2)
Property {...}
- type: "Property"
- start: 100
- end: 114
loc: {...}
start: {...}
- line: 7
- column: 3
}end: {...}
- line: 7
- column: 17
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 100
- end: 109
loc: {...}
start: {...}
- line: 7
- column: 3
}end: {...}
- line: 7
- column: 12
}
}- name: "stiffness"
}value: Literal {...}
- type: "Literal"
- start: 111
- end: 114
loc: {...}
start: {...}
- line: 7
- column: 14
}end: {...}
- line: 7
- column: 17
}
}- value: 0.1
- raw: "0.1"
}- kind: "init"
} Property {...}
- type: "Property"
- start: 119
- end: 132
loc: {...}
start: {...}
- line: 8
- column: 3
}end: {...}
- line: 8
- column: 16
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 119
- end: 126
loc: {...}
start: {...}
- line: 8
- column: 3
}end: {...}
- line: 8
- column: 10
}
}- name: "damping"
}value: Literal {...}
- type: "Literal"
- start: 128
- end: 132
loc: {...}
start: {...}
- line: 8
- column: 12
}end: {...}
- line: 8
- column: 16
}
}- value: 0.25
- raw: "0.25"
}- kind: "init"
}
]
}
]- optional: false
}
}
]- kind: "let"
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 143
- end: 165
loc: {...}
start: {...}
- line: 12
- column: 1
}end: {...}
- line: 12
- column: 23
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 147
- end: 164
loc: {...}
start: {...}
- line: 12
- column: 5
}end: {...}
- line: 12
- column: 22
}
}id: Identifier {...}
- type: "Identifier"
- start: 147
- end: 151
loc: {...}
start: {...}
- line: 12
- column: 5
}end: {...}
- line: 12
- column: 9
}
}- name: "size"
}init: CallExpression {...}
- type: "CallExpression"
- start: 154
- end: 164
loc: {...}
start: {...}
- line: 12
- column: 12
}end: {...}
- line: 12
- column: 22
}
}callee: Identifier {...}
- type: "Identifier"
- start: 154
- end: 160
loc: {...}
start: {...}
- line: 12
- column: 12
}end: {...}
- line: 12
- column: 18
}
}- name: "spring"
}arguments: [...] (1)
Literal {...}
- type: "Literal"
- start: 161
- end: 163
loc: {...}
start: {...}
- line: 12
- column: 19
}end: {...}
- line: 12
- column: 21
}
}- value: 10
- raw: "10"
}
]- optional: false
}
}
]- kind: "let"
}
]- sourceType: "module"
}- attributes: []
}
}
The AST is not public API and may change at any point in time