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>
function clickOutside(node, { enabled: initialEnabled, cb }) {
const handleOutsideClick = ({ target }) => {
if (!node.contains(target)) {
cb();
}
};

function update({enabled}) {
if (enabled) {
window.addEventListener('click', handleOutsideClick);
} else {
window.removeEventListener('click', handleOutsideClick);
}
}

update({ enabled: initialEnabled });
return {
update,
destroy() {
window.removeEventListener( 'click', handleOutsideClick );
}
};
}

let open = true;
</script>

<div use:clickOutside={{ enabled: open, cb: () => open = false }} style="border:solid 1px;border-color:black;width:200px">
<button on:click={() => open = true}>Open</button>
{#if open}
<span>
Opened
</span>
{/if}
</div>
import 'svelte/internal/disclose-version';
import 'svelte/internal/flags/legacy';
import * as $ from 'svelte/internal/client';

var root_1 = $.template(`<span>Opened</span>`);
var root = $.template(`<div style="border:solid 1px;border-color:black;width:200px"><button>Open</button> <!></div> <p>Click outside the box to close!</p>`, 1);

export default function App($$anchor) {
function clickOutside(node, { enabled: initialEnabled, cb }) {
const handleOutsideClick = ({ target }) => {
if (!node.contains(target)) {
cb();
}
};

function update({ enabled }) {
if (enabled) {
window.addEventListener('click', handleOutsideClick);
} else {
window.removeEventListener('click', handleOutsideClick);
}
}

update({ enabled: initialEnabled });

return {
update,
destroy() {
window.removeEventListener('click', handleOutsideClick);
}
};
}

let open = $.mutable_state(true);
var fragment = root();
var div = $.first_child(fragment);
result = svelte.compile(source, {
generate: ,
});
/* Add a <style> tag to see the CSS output */
		
			
				
  • Root {
    • css: null
    • js: []
    • start: 601
    • end: 885
    • type: "Root"
    • fragment: Fragment {...}
      • type: "Fragment"
      • nodes: [...] (4)
        • Text {...}
          • type: "Text"
          • start: 599
          • end: 601
          • raw: "\n\n"
          • data: "\n\n"
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 601
          • end: 842
          • name: "div"
          • attributes: [...] (2)
            • UseDirective {...}
              • start: 606
              • end: 666
              • type: "UseDirective"
              • name: "clickOutside"
              • expression: ObjectExpression {...}
                • type: "ObjectExpression"
                • start: 624
                • end: 665
                • loc: {...}
                  • start: {...}
                    • line: 29
                    • column: 23
                    }
                  • end: {...}
                    • line: 29
                    • column: 64
                    }
                  }
                • properties: [...] (2)
                  • Property {...}
                    • type: "Property"
                    • start: 626
                    • end: 639
                    • loc: {...}
                      • start: {...}
                        • line: 29
                        • column: 25
                        }
                      • end: {...}
                        • line: 29
                        • column: 38
                        }
                      }
                    • method: false
                    • shorthand: false
                    • computed: false
                    • key: Identifier {...}
                      • type: "Identifier"
                      • start: 626
                      • end: 633
                      • loc: {...}
                        • start: {...}
                          • line: 29
                          • column: 25
                          }
                        • end: {...}
                          • line: 29
                          • column: 32
                          }
                        }
                      • name: "enabled"
                      }
                    • value: Identifier {...}
                      • type: "Identifier"
                      • start: 635
                      • end: 639
                      • loc: {...}
                        • start: {...}
                          • line: 29
                          • column: 34
                          }
                        • end: {...}
                          • line: 29
                          • column: 38
                          }
                        }
                      • name: "open"
                      }
                    • kind: "init"
                    }
                  • Property {...}
                    • type: "Property"
                    • start: 641
                    • end: 663
                    • loc: {...}
                      • start: {...}
                        • line: 29
                        • column: 40
                        }
                      • end: {...}
                        • line: 29
                        • column: 62
                        }
                      }
                    • method: false
                    • shorthand: false
                    • computed: false
                    • key: Identifier {...}
                      • type: "Identifier"
                      • start: 641
                      • end: 643
                      • loc: {...}
                        • start: {...}
                          • line: 29
                          • column: 40
                          }
                        • end: {...}
                          • line: 29
                          • column: 42
                          }
                        }
                      • name: "cb"
                      }
                    • value: ArrowFunctionExpression {...}
                      • type: "ArrowFunctionExpression"
                      • start: 645
                      • end: 663
                      • loc: {...}
                        • start: {...}
                          • line: 29
                          • column: 44
                          }
                        • end: {...}
                          • line: 29
                          • column: 62
                          }
                        }
                      • id: null
                      • expression: true
                      • generator: false
                      • async: false
                      • params: []
                      • body: AssignmentExpression {...}
                        • type: "AssignmentExpression"
                        • start: 651
                        • end: 663
                        • loc: {...}
                          • start: {...}
                            • line: 29
                            • column: 50
                            }
                          • end: {...}
                            • line: 29
                            • column: 62
                            }
                          }
                        • operator: "="
                        • left: Identifier {...}
                          • type: "Identifier"
                          • start: 651
                          • end: 655
                          • loc: {...}
                            • start: {...}
                              • line: 29
                              • column: 50
                              }
                            • end: {...}
                              • line: 29
                              • column: 54
                              }
                            }
                          • name: "open"
                          }
                        • right: Literal {...}
                          • type: "Literal"
                          • start: 658
                          • end: 663
                          • loc: {...}
                            • start: {...}
                              • line: 29
                              • column: 57
                              }
                            • end: {...}
                              • line: 29
                              • column: 62
                              }
                            }
                          • value: false
                          • raw: "false"
                          }
                        }
                      }
                    • kind: "init"
                    }
                  ]
                }
              • modifiers: []
              }
            • Attribute {...}
              • type: "Attribute"
              • start: 667
              • end: 722
              • name: "style"
              • value: [...] (1)
                • Text {...}
                  • start: 674
                  • end: 721
                  • type: "Text"
                  • raw: "border:solid 1px;border-color:black;width:200px"
                  • data: "border:solid 1px;border-color:black;width:200px"
                  }
                ]
              }
            ]
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (5)
              • Text {...}
                • type: "Text"
                • start: 723
                • end: 727
                • raw: "\n "
                • data: "\n "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 727
                • end: 777
                • name: "button"
                • attributes: [...] (1)
                  • OnDirective {...}
                    • start: 735
                    • end: 763
                    • type: "OnDirective"
                    • name: "click"
                    • expression: ArrowFunctionExpression {...}
                      • type: "ArrowFunctionExpression"
                      • start: 745
                      • end: 762
                      • loc: {...}
                        • start: {...}
                          • line: 30
                          • column: 21
                          }
                        • end: {...}
                          • line: 30
                          • column: 38
                          }
                        }
                      • id: null
                      • expression: true
                      • generator: false
                      • async: false
                      • params: []
                      • body: AssignmentExpression {...}
                        • type: "AssignmentExpression"
                        • start: 751
                        • end: 762
                        • loc: {...}
                          • start: {...}
                            • line: 30
                            • column: 27
                            }
                          • end: {...}
                            • line: 30
                            • column: 38
                            }
                          }
                        • operator: "="
                        • left: Identifier {...}
                          • type: "Identifier"
                          • start: 751
                          • end: 755
                          • loc: {...}
                            • start: {...}
                              • line: 30
                              • column: 27
                              }
                            • end: {...}
                              • line: 30
                              • column: 31
                              }
                            }
                          • name: "open"
                          }
                        • right: Literal {...}
                          • type: "Literal"
                          • start: 758
                          • end: 762
                          • loc: {...}
                            • start: {...}
                              • line: 30
                              • column: 34
                              }
                            • end: {...}
                              • line: 30
                              • column: 38
                              }
                            }
                          • value: true
                          • raw: "true"
                          }
                        }
                      }
                    • modifiers: []
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (1)
                    • Text {...}
                      • type: "Text"
                      • start: 764
                      • end: 768
                      • raw: "Open"
                      • data: "Open"
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 777
                • end: 781
                • raw: " "
                • data: " "
                }
              • IfBlock {...}
                • type: "IfBlock"
                • elseif: false
                • start: 781
                • end: 835
                • test: Identifier {...}
                  • type: "Identifier"
                  • start: 786
                  • end: 790
                  • loc: {...}
                    • start: {...}
                      • line: 31
                      • column: 8
                      }
                    • end: {...}
                      • line: 31
                      • column: 12
                      }
                    }
                  • name: "open"
                  }
                • consequent: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (3)
                    • Text {...}
                      • type: "Text"
                      • start: 791
                      • end: 796
                      • raw: "\n "
                      • data: "\n "
                      }
                    • RegularElement {...}
                      • type: "RegularElement"
                      • start: 796
                      • end: 827
                      • name: "span"
                      • attributes: []
                      • fragment: Fragment {...}
                        • type: "Fragment"
                        • nodes: [...] (1)
                          • Text {...}
                            • type: "Text"
                            • start: 802
                            • end: 820
                            • raw: "Opened"
                            • data: "Opened"
                            }
                          ]
                        }
                      }
                    • Text {...}
                      • type: "Text"
                      • start: 827
                      • end: 830
                      • raw: "\n "
                      • data: "\n "
                      }
                    ]
                  }
                • alternate: null
                }
              • Text {...}
                • type: "Text"
                • start: 835
                • end: 836
                • raw: "\n"
                • data: "\n"
                }
              ]
            }
          }
        • Text {...}
          • type: "Text"
          • start: 842
          • end: 844
          • raw: " "
          • data: " "
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 844
          • end: 885
          • name: "p"
          • attributes: []
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (1)
              • Text {...}
                • type: "Text"
                • start: 847
                • end: 881
                • raw: "Click outside the box to close!"
                • data: "Click outside the box to close!"
                }
              ]
            }
          }
        ]
      }
    • options: null
    • instance: Script {...}
      • type: "Script"
      • start: 0
      • end: 599
      • context: "default"
      • content: Program {...}
        • type: "Program"
        • start: 8
        • end: 590
        • loc: {...}
          • start: {...}
            • line: 1
            • column: 0
            }
          • end: {...}
            • line: 27
            • column: 0
            }
          }
        • body: [...] (2)
          • FunctionDeclaration {...}
            • type: "FunctionDeclaration"
            • start: 9
            • end: 569
            • loc: {...}
              • start: {...}
                • line: 2
                • column: 0
                }
              • end: {...}
                • line: 24
                • column: 3
                }
              }
            • id: Identifier {...}
              • type: "Identifier"
              • start: 18
              • end: 30
              • loc: {...}
                • start: {...}
                  • line: 2
                  • column: 9
                  }
                • end: {...}
                  • line: 2
                  • column: 21
                  }
                }
              • name: "clickOutside"
              }
            • expression: false
            • generator: false
            • async: false
            • params: [...] (2)
              • Identifier {...}
                • type: "Identifier"
                • start: 31
                • end: 35
                • loc: {...}
                  • start: {...}
                    • line: 2
                    • column: 22
                    }
                  • end: {...}
                    • line: 2
                    • column: 26
                    }
                  }
                • name: "node"
                }
              • ObjectPattern {...}
                • type: "ObjectPattern"
                • start: 37
                • end: 68
                • loc: {...}
                  • start: {...}
                    • line: 2
                    • column: 28
                    }
                  • end: {...}
                    • line: 2
                    • column: 59
                    }
                  }
                • properties: [...] (2)
                  • Property {...}
                    • type: "Property"
                    • start: 39
                    • end: 62
                    • loc: {...}
                      • start: {...}
                        • line: 2
                        • column: 30
                        }
                      • end: {...}
                        • line: 2
                        • column: 53
                        }
                      }
                    • method: false
                    • shorthand: false
                    • computed: false
                    • key: Identifier {...}
                      • type: "Identifier"
                      • start: 39
                      • end: 46
                      • loc: {...}
                        • start: {...}
                          • line: 2
                          • column: 30
                          }
                        • end: {...}
                          • line: 2
                          • column: 37
                          }
                        }
                      • name: "enabled"
                      }
                    • value: Identifier {...}
                      • type: "Identifier"
                      • start: 48
                      • end: 62
                      • loc: {...}
                        • start: {...}
                          • line: 2
                          • column: 39
                          }
                        • end: {...}
                          • line: 2
                          • column: 53
                          }
                        }
                      • name: "initialEnabled"
                      }
                    • kind: "init"
                    }
                  • Property {...}
                    • type: "Property"
                    • start: 64
                    • end: 66
                    • loc: {...}
                      • start: {...}
                        • line: 2
                        • column: 55
                        }
                      • end: {...}
                        • line: 2
                        • column: 57
                        }
                      }
                    • method: false
                    • shorthand: true
                    • computed: false
                    • key: Identifier {...}
                      • type: "Identifier"
                      • start: 64
                      • end: 66
                      • loc: {...}
                        • start: {...}
                          • line: 2
                          • column: 55
                          }
                        • end: {...}
                          • line: 2
                          • column: 57
                          }
                        }
                      • name: "cb"
                      }
                    • kind: "init"
                    • value: Identifier {...}
                      • type: "Identifier"
                      • start: 64
                      • end: 66
                      • loc: {...}
                        • start: {...}
                          • line: 2
                          • column: 55
                          }
                        • end: {...}
                          • line: 2
                          • column: 57
                          }
                        }
                      • name: "cb"
                      }
                    }
                  ]
                }
              ]
            • body: BlockStatement {...}
              • type: "BlockStatement"
              • start: 70
              • end: 569
              • loc: {...}
                • start: {...}
                  • line: 2
                  • column: 61
                  }
                • end: {...}
                  • line: 24
                  • column: 3
                  }
                }
              • body: [...] (4)
                • VariableDeclaration {...}
                  • type: "VariableDeclaration"
                  • start: 76
                  • end: 185
                  • loc: {...}
                    • start: {...}
                      • line: 3
                      • column: 4
                      }
                    • end: {...}
                      • line: 7
                      • column: 6
                      }
                    }
                  • declarations: [...] (1)
                    • VariableDeclarator {...}
                      • type: "VariableDeclarator"
                      • start: 82
                      • end: 184
                      • loc: {...}
                        • start: {...}
                          • line: 3
                          • column: 10
                          }
                        • end: {...}
                          • line: 7
                          • column: 5
                          }
                        }
                      • id: Identifier {...}
                        • type: "Identifier"
                        • start: 82
                        • end: 100
                        • loc: {...}
                          • start: {...}
                            • line: 3
                            • column: 10
                            }
                          • end: {...}
                            • line: 3
                            • column: 28
                            }
                          }
                        • name: "handleOutsideClick"
                        }
                      • init: ArrowFunctionExpression {...}
                        • type: "ArrowFunctionExpression"
                        • start: 103
                        • end: 184
                        • loc: {...}
                          • start: {...}
                            • line: 3
                            • column: 31
                            }
                          • end: {...}
                            • line: 7
                            • column: 5
                            }
                          }
                        • id: null
                        • expression: false
                        • generator: false
                        • async: false
                        • params: [...] (1)
                          • ObjectPattern {...}
                            • type: "ObjectPattern"
                            • start: 104
                            • end: 114
                            • loc: {...}
                              • start: {...}
                                • line: 3
                                • column: 32
                                }
                              • end: {...}
                                • line: 3
                                • column: 42
                                }
                              }
                            • properties: [...] (1)
                              • Property {...}
                                • type: "Property"
                                • start: 106
                                • end: 112
                                • loc: {...}
                                  • start: {...}
                                    • line: 3
                                    • column: 34
                                    }
                                  • end: {...}
                                    • line: 3
                                    • column: 40
                                    }
                                  }
                                • method: false
                                • shorthand: true
                                • computed: false
                                • key: Identifier {...}
                                  • type: "Identifier"
                                  • start: 106
                                  • end: 112
                                  • loc: {...}
                                    • start: {...}
                                      • line: 3
                                      • column: 34
                                      }
                                    • end: {...}
                                      • line: 3
                                      • column: 40
                                      }
                                    }
                                  • name: "target"
                                  }
                                • kind: "init"
                                • value: Identifier {...}
                                  • type: "Identifier"
                                  • start: 106
                                  • end: 112
                                  • loc: {...}
                                    • start: {...}
                                      • line: 3
                                      • column: 34
                                      }
                                    • end: {...}
                                      • line: 3
                                      • column: 40
                                      }
                                    }
                                  • name: "target"
                                  }
                                }
                              ]
                            }
                          ]
                        • body: BlockStatement {...}
                          • type: "BlockStatement"
                          • start: 119
                          • end: 184
                          • loc: {...}
                            • start: {...}
                              • line: 3
                              • column: 47
                              }
                            • end: {...}
                              • line: 7
                              • column: 5
                              }
                            }
                          • body: [...] (1)
                            • IfStatement {...}
                              • type: "IfStatement"
                              • start: 127
                              • end: 178
                              • loc: {...}
                                • start: {...}
                                  • line: 4
                                  • column: 6
                                  }
                                • end: {...}
                                  • line: 6
                                  • column: 7
                                  }
                                }
                              • test: UnaryExpression {...}
                                • type: "UnaryExpression"
                                • start: 131
                                • end: 153
                                • loc: {...}
                                  • start: {...}
                                    • line: 4
                                    • column: 10
                                    }
                                  • end: {...}
                                    • line: 4
                                    • column: 32
                                    }
                                  }
                                • operator: "!"
                                • prefix: true
                                • argument: CallExpression {...}
                                  • type: "CallExpression"
                                  • start: 132
                                  • end: 153
                                  • loc: {...}
                                    • start: {...}
                                      • line: 4
                                      • column: 11
                                      }
                                    • end: {...}
                                      • line: 4
                                      • column: 32
                                      }
                                    }
                                  • callee: MemberExpression {...}
                                    • type: "MemberExpression"
                                    • start: 132
                                    • end: 145
                                    • loc: {...}
                                      • start: {...}
                                        • line: 4
                                        • column: 11
                                        }
                                      • end: {...}
                                        • line: 4
                                        • column: 24
                                        }
                                      }
                                    • object: Identifier {...}
                                      • type: "Identifier"
                                      • start: 132
                                      • end: 136
                                      • loc: {...}
                                        • start: {...}
                                          • line: 4
                                          • column: 11
                                          }
                                        • end: {...}
                                          • line: 4
                                          • column: 15
                                          }
                                        }
                                      • name: "node"
                                      }
                                    • property: Identifier {...}
                                      • type: "Identifier"
                                      • start: 137
                                      • end: 145
                                      • loc: {...}
                                        • start: {...}
                                          • line: 4
                                          • column: 16
                                          }
                                        • end: {...}
                                          • line: 4
                                          • column: 24
                                          }
                                        }
                                      • name: "contains"
                                      }
                                    • computed: false
                                    • optional: false
                                    }
                                  • arguments: [...] (1)
                                    • Identifier {...}
                                      • type: "Identifier"
                                      • start: 146
                                      • end: 152
                                      • loc: {...}
                                        • start: {...}
                                          • line: 4
                                          • column: 25
                                          }
                                        • end: {...}
                                          • line: 4
                                          • column: 31
                                          }
                                        }
                                      • name: "target"
                                      }
                                    ]
                                  • optional: false
                                  }
                                }
                              • consequent: BlockStatement {...}
                                • type: "BlockStatement"
                                • start: 155
                                • end: 178
                                • loc: {...}
                                  • start: {...}
                                    • line: 4
                                    • column: 34
                                    }
                                  • end: {...}
                                    • line: 6
                                    • column: 7
                                    }
                                  }
                                • body: [...] (1)
                                  • ExpressionStatement {...}
                                    • type: "ExpressionStatement"
                                    • start: 165
                                    • end: 170
                                    • loc: {...}
                                      • start: {...}
                                        • line: 5
                                        • column: 8
                                        }
                                      • end: {...}
                                        • line: 5
                                        • column: 13
                                        }
                                      }
                                    • expression: CallExpression {...}
                                      • type: "CallExpression"
                                      • start: 165
                                      • end: 169
                                      • loc: {...}
                                        • start: {...}
                                          • line: 5
                                          • column: 8
                                          }
                                        • end: {...}
                                          • line: 5
                                          • column: 12
                                          }
                                        }
                                      • callee: Identifier {...}
                                        • type: "Identifier"
                                        • start: 165
                                        • end: 167
                                        • loc: {...}
                                          • start: {...}
                                            • line: 5
                                            • column: 8
                                            }
                                          • end: {...}
                                            • line: 5
                                            • column: 10
                                            }
                                          }
                                        • name: "cb"
                                        }
                                      • arguments: []
                                      • optional: false
                                      }
                                    }
                                  ]
                                }
                              • alternate: null
                              }
                            ]
                          }
                        }
                      }
                    ]
                  • kind: "const"
                  }
                • FunctionDeclaration {...}
                  • type: "FunctionDeclaration"
                  • start: 191
                  • end: 396
                  • loc: {...}
                    • start: {...}
                      • line: 9
                      • column: 4
                      }
                    • end: {...}
                      • line: 15
                      • column: 5
                      }
                    }
                  • id: Identifier {...}
                    • type: "Identifier"
                    • start: 200
                    • end: 206
                    • loc: {...}
                      • start: {...}
                        • line: 9
                        • column: 13
                        }
                      • end: {...}
                        • line: 9
                        • column: 19
                        }
                      }
                    • name: "update"
                    }
                  • expression: false
                  • generator: false
                  • async: false
                  • params: [...] (1)
                    • ObjectPattern {...}
                      • type: "ObjectPattern"
                      • start: 207
                      • end: 216
                      • loc: {...}
                        • start: {...}
                          • line: 9
                          • column: 20
                          }
                        • end: {...}
                          • line: 9
                          • column: 29
                          }
                        }
                      • properties: [...] (1)
                        • Property {...}
                          • type: "Property"
                          • start: 208
                          • end: 215
                          • loc: {...}
                            • start: {...}
                              • line: 9
                              • column: 21
                              }
                            • end: {...}
                              • line: 9
                              • column: 28
                              }
                            }
                          • method: false
                          • shorthand: true
                          • computed: false
                          • key: Identifier {...}
                            • type: "Identifier"
                            • start: 208
                            • end: 215
                            • loc: {...}
                              • start: {...}
                                • line: 9
                                • column: 21
                                }
                              • end: {...}
                                • line: 9
                                • column: 28
                                }
                              }
                            • name: "enabled"
                            }
                          • kind: "init"
                          • value: Identifier {...}
                            • type: "Identifier"
                            • start: 208
                            • end: 215
                            • loc: {...}
                              • start: {...}
                                • line: 9
                                • column: 21
                                }
                              • end: {...}
                                • line: 9
                                • column: 28
                                }
                              }
                            • name: "enabled"
                            }
                          }
                        ]
                      }
                    ]
                  • body: BlockStatement {...}
                    • type: "BlockStatement"
                    • start: 218
                    • end: 396
                    • loc: {...}
                      • start: {...}
                        • line: 9
                        • column: 31
                        }
                      • end: {...}
                        • line: 15
                        • column: 5
                        }
                      }
                    • body: [...] (1)
                      • IfStatement {...}
                        • type: "IfStatement"
                        • start: 226
                        • end: 390
                        • loc: {...}
                          • start: {...}
                            • line: 10
                            • column: 6
                            }
                          • end: {...}
                            • line: 14
                            • column: 7
                            }
                          }
                        • test: Identifier {...}
                          • type: "Identifier"
                          • start: 230
                          • end: 237
                          • loc: {...}
                            • start: {...}
                              • line: 10
                              • column: 10
                              }
                            • end: {...}
                              • line: 10
                              • column: 17
                              }
                            }
                          • name: "enabled"
                          }
                        • consequent: BlockStatement {...}
                          • type: "BlockStatement"
                          • start: 239
                          • end: 310
                          • loc: {...}
                            • start: {...}
                              • line: 10
                              • column: 19
                              }
                            • end: {...}
                              • line: 12
                              • column: 7
                              }
                            }
                          • body: [...] (1)
                            • ExpressionStatement {...}
                              • type: "ExpressionStatement"
                              • start: 249
                              • end: 302
                              • loc: {...}
                                • start: {...}
                                  • line: 11
                                  • column: 8
                                  }
                                • end: {...}
                                  • line: 11
                                  • column: 61
                                  }
                                }
                              • expression: CallExpression {...}
                                • type: "CallExpression"
                                • start: 249
                                • end: 301
                                • loc: {...}
                                  • start: {...}
                                    • line: 11
                                    • column: 8
                                    }
                                  • end: {...}
                                    • line: 11
                                    • column: 60
                                    }
                                  }
                                • callee: MemberExpression {...}
                                  • type: "MemberExpression"
                                  • start: 249
                                  • end: 272
                                  • loc: {...}
                                    • start: {...}
                                      • line: 11
                                      • column: 8
                                      }
                                    • end: {...}
                                      • line: 11
                                      • column: 31
                                      }
                                    }
                                  • object: Identifier {...}
                                    • type: "Identifier"
                                    • start: 249
                                    • end: 255
                                    • loc: {...}
                                      • start: {...}
                                        • line: 11
                                        • column: 8
                                        }
                                      • end: {...}
                                        • line: 11
                                        • column: 14
                                        }
                                      }
                                    • name: "window"
                                    }
                                  • property: Identifier {...}
                                    • type: "Identifier"
                                    • start: 256
                                    • end: 272
                                    • loc: {...}
                                      • start: {...}
                                        • line: 11
                                        • column: 15
                                        }
                                      • end: {...}
                                        • line: 11
                                        • column: 31
                                        }
                                      }
                                    • name: "addEventListener"
                                    }
                                  • computed: false
                                  • optional: false
                                  }
                                • arguments: [...] (2)
                                  • Literal {...}
                                    • type: "Literal"
                                    • start: 273
                                    • end: 280
                                    • loc: {...}
                                      • start: {...}
                                        • line: 11
                                        • column: 32
                                        }
                                      • end: {...}
                                        • line: 11
                                        • column: 39
                                        }
                                      }
                                    • value: "click"
                                    • raw: "'click'"
                                    }
                                  • Identifier {...}
                                    • type: "Identifier"
                                    • start: 282
                                    • end: 300
                                    • loc: {...}
                                      • start: {...}
                                        • line: 11
                                        • column: 41
                                        }
                                      • end: {...}
                                        • line: 11
                                        • column: 59
                                        }
                                      }
                                    • name: "handleOutsideClick"
                                    }
                                  ]
                                • optional: false
                                }
                              }
                            ]
                          }
                        • alternate: BlockStatement {...}
                          • type: "BlockStatement"
                          • start: 316
                          • end: 390
                          • loc: {...}
                            • start: {...}
                              • line: 12
                              • column: 13
                              }
                            • end: {...}
                              • line: 14
                              • column: 7
                              }
                            }
                          • body: [...] (1)
                            • ExpressionStatement {...}
                              • type: "ExpressionStatement"
                              • start: 326
                              • end: 382
                              • loc: {...}
                                • start: {...}
                                  • line: 13
                                  • column: 8
                                  }
                                • end: {...}
                                  • line: 13
                                  • column: 64
                                  }
                                }
                              • expression: CallExpression {...}
                                • type: "CallExpression"
                                • start: 326
                                • end: 381
                                • loc: {...}
                                  • start: {...}
                                    • line: 13
                                    • column: 8
                                    }
                                  • end: {...}
                                    • line: 13
                                    • column: 63
                                    }
                                  }
                                • callee: MemberExpression {...}
                                  • type: "MemberExpression"
                                  • start: 326
                                  • end: 352
                                  • loc: {...}
                                    • start: {...}
                                      • line: 13
                                      • column: 8
                                      }
                                    • end: {...}
                                      • line: 13
                                      • column: 34
                                      }
                                    }
                                  • object: Identifier {...}
                                    • type: "Identifier"
                                    • start: 326
                                    • end: 332
                                    • loc: {...}
                                      • start: {...}
                                        • line: 13
                                        • column: 8
                                        }
                                      • end: {...}
                                        • line: 13
                                        • column: 14
                                        }
                                      }
                                    • name: "window"
                                    }
                                  • property: Identifier {...}
                                    • type: "Identifier"
                                    • start: 333
                                    • end: 352
                                    • loc: {...}
                                      • start: {...}
                                        • line: 13
                                        • column: 15
                                        }
                                      • end: {...}
                                        • line: 13
                                        • column: 34
                                        }
                                      }
                                    • name: "removeEventListener"
                                    }
                                  • computed: false
                                  • optional: false
                                  }
                                • arguments: [...] (2)
                                  • Literal {...}
                                    • type: "Literal"
                                    • start: 353
                                    • end: 360
                                    • loc: {...}
                                      • start: {...}
                                        • line: 13
                                        • column: 35
                                        }
                                      • end: {...}
                                        • line: 13
                                        • column: 42
                                        }
                                      }
                                    • value: "click"
                                    • raw: "'click'"
                                    }
                                  • Identifier {...}
                                    • type: "Identifier"
                                    • start: 362
                                    • end: 380
                                    • loc: {...}
                                      • start: {...}
                                        • line: 13
                                        • column: 44
                                        }
                                      • end: {...}
                                        • line: 13
                                        • column: 62
                                        }
                                      }
                                    • name: "handleOutsideClick"
                                    }
                                  ]
                                • optional: false
                                }
                              }
                            ]
                          }
                        }
                      ]
                    }
                  }
                • ExpressionStatement {...}
                  • type: "ExpressionStatement"
                  • start: 402
                  • end: 438
                  • loc: {...}
                    • start: {...}
                      • line: 17
                      • column: 4
                      }
                    • end: {...}
                      • line: 17
                      • column: 40
                      }
                    }
                  • expression: CallExpression {...}
                    • type: "CallExpression"
                    • start: 402
                    • end: 437
                    • loc: {...}
                      • start: {...}
                        • line: 17
                        • column: 4
                        }
                      • end: {...}
                        • line: 17
                        • column: 39
                        }
                      }
                    • callee: Identifier {...}
                      • type: "Identifier"
                      • start: 402
                      • end: 408
                      • loc: {...}
                        • start: {...}
                          • line: 17
                          • column: 4
                          }
                        • end: {...}
                          • line: 17
                          • column: 10
                          }
                        }
                      • name: "update"
                      }
                    • arguments: [...] (1)
                      • ObjectExpression {...}
                        • type: "ObjectExpression"
                        • start: 409
                        • end: 436
                        • loc: {...}
                          • start: {...}
                            • line: 17
                            • column: 11
                            }
                          • end: {...}
                            • line: 17
                            • column: 38
                            }
                          }
                        • properties: [...] (1)
                          • Property {...}
                            • type: "Property"
                            • start: 411
                            • end: 434
                            • loc: {...}
                              • start: {...}
                                • line: 17
                                • column: 13
                                }
                              • end: {...}
                                • line: 17
                                • column: 36
                                }
                              }
                            • method: false
                            • shorthand: false
                            • computed: false
                            • key: Identifier {...}
                              • type: "Identifier"
                              • start: 411
                              • end: 418
                              • loc: {...}
                                • start: {...}
                                  • line: 17
                                  • column: 13
                                  }
                                • end: {...}
                                  • line: 17
                                  • column: 20
                                  }
                                }
                              • name: "enabled"
                              }
                            • value: Identifier {...}
                              • type: "Identifier"
                              • start: 420
                              • end: 434
                              • loc: {...}
                                • start: {...}
                                  • line: 17
                                  • column: 22
                                  }
                                • end: {...}
                                  • line: 17
                                  • column: 36
                                  }
                                }
                              • name: "initialEnabled"
                              }
                            • kind: "init"
                            }
                          ]
                        }
                      ]
                    • optional: false
                    }
                  }
                • ReturnStatement {...}
                  • type: "ReturnStatement"
                  • start: 443
                  • end: 565
                  • loc: {...}
                    • start: {...}
                      • line: 18
                      • column: 4
                      }
                    • end: {...}
                      • line: 23
                      • column: 6
                      }
                    }
                  • argument: ObjectExpression {...}
                    • type: "ObjectExpression"
                    • start: 450
                    • end: 564
                    • loc: {...}
                      • start: {...}
                        • line: 18
                        • column: 11
                        }
                      • end: {...}
                        • line: 23
                        • column: 5
                        }
                      }
                    • properties: [...] (2)
                      • Property {...}
                        • type: "Property"
                        • start: 458
                        • end: 464
                        • loc: {...}
                          • start: {...}
                            • line: 19
                            • column: 6
                            }
                          • end: {...}
                            • line: 19
                            • column: 12
                            }
                          }
                        • method: false
                        • shorthand: true
                        • computed: false
                        • key: Identifier {...}
                          • type: "Identifier"
                          • start: 458
                          • end: 464
                          • loc: {...}
                            • start: {...}
                              • line: 19
                              • column: 6
                              }
                            • end: {...}
                              • line: 19
                              • column: 12
                              }
                            }
                          • name: "update"
                          }
                        • kind: "init"
                        • value: Identifier {...}
                          • type: "Identifier"
                          • start: 458
                          • end: 464
                          • loc: {...}
                            • start: {...}
                              • line: 19
                              • column: 6
                              }
                            • end: {...}
                              • line: 19
                              • column: 12
                              }
                            }
                          • name: "update"
                          }
                        }
                      • Property {...}
                        • type: "Property"
                        • start: 472
                        • end: 558
                        • loc: {...}
                          • start: {...}
                            • line: 20
                            • column: 6
                            }
                          • end: {...}
                            • line: 22
                            • column: 7
                            }
                          }
                        • method: true
                        • shorthand: false
                        • computed: false
                        • key: Identifier {...}
                          • type: "Identifier"
                          • start: 472
                          • end: 479
                          • loc: {...}
                            • start: {...}
                              • line: 20
                              • column: 6
                              }
                            • end: {...}
                              • line: 20
                              • column: 13
                              }
                            }
                          • name: "destroy"
                          }
                        • kind: "init"
                        • value: FunctionExpression {...}
                          • type: "FunctionExpression"
                          • start: 479
                          • end: 558
                          • loc: {...}
                            • start: {...}
                              • line: 20
                              • column: 13
                              }
                            • end: {...}
                              • line: 22
                              • column: 7
                              }
                            }
                          • id: null
                          • expression: false
                          • generator: false
                          • async: false
                          • params: []
                          • body: BlockStatement {...}
                            • type: "BlockStatement"
                            • start: 482
                            • end: 558
                            • loc: {...}
                              • start: {...}
                                • line: 20
                                • column: 16
                                }
                              • end: {...}
                                • line: 22
                                • column: 7
                                }
                              }
                            • body: [...] (1)
                              • ExpressionStatement {...}
                                • type: "ExpressionStatement"
                                • start: 492
                                • end: 550
                                • loc: {...}
                                  • start: {...}
                                    • line: 21
                                    • column: 8
                                    }
                                  • end: {...}
                                    • line: 21
                                    • column: 66
                                    }
                                  }
                                • expression: CallExpression {...}
                                  • type: "CallExpression"
                                  • start: 492
                                  • end: 549
                                  • loc: {...}
                                    • start: {...}
                                      • line: 21
                                      • column: 8
                                      }
                                    • end: {...}
                                      • line: 21
                                      • column: 65
                                      }
                                    }
                                  • callee: MemberExpression {...}
                                    • type: "MemberExpression"
                                    • start: 492
                                    • end: 518
                                    • loc: {...}
                                      • start: {...}
                                        • line: 21
                                        • column: 8
                                        }
                                      • end: {...}
                                        • line: 21
                                        • column: 34
                                        }
                                      }
                                    • object: Identifier {...}
                                      • type: "Identifier"
                                      • start: 492
                                      • end: 498
                                      • loc: {...}
                                        • start: {...}
                                          • line: 21
                                          • column: 8
                                          }
                                        • end: {...}
                                          • line: 21
                                          • column: 14
                                          }
                                        }
                                      • name: "window"
                                      }
                                    • property: Identifier {...}
                                      • type: "Identifier"
                                      • start: 499
                                      • end: 518
                                      • loc: {...}
                                        • start: {...}
                                          • line: 21
                                          • column: 15
                                          }
                                        • end: {...}
                                          • line: 21
                                          • column: 34
                                          }
                                        }
                                      • name: "removeEventListener"
                                      }
                                    • computed: false
                                    • optional: false
                                    }
                                  • arguments: [...] (2)
                                    • Literal {...}
                                      • type: "Literal"
                                      • start: 520
                                      • end: 527
                                      • loc: {...}
                                        • start: {...}
                                          • line: 21
                                          • column: 36
                                          }
                                        • end: {...}
                                          • line: 21
                                          • column: 43
                                          }
                                        }
                                      • value: "click"
                                      • raw: "'click'"
                                      }
                                    • Identifier {...}
                                      • type: "Identifier"
                                      • start: 529
                                      • end: 547
                                      • loc: {...}
                                        • start: {...}
                                          • line: 21
                                          • column: 45
                                          }
                                        • end: {...}
                                          • line: 21
                                          • column: 63
                                          }
                                        }
                                      • name: "handleOutsideClick"
                                      }
                                    ]
                                  • optional: false
                                  }
                                }
                              ]
                            }
                          }
                        }
                      ]
                    }
                  }
                ]
              }
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 573
            • end: 589
            • loc: {...}
              • start: {...}
                • line: 26
                • column: 2
                }
              • end: {...}
                • line: 26
                • column: 18
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 577
                • end: 588
                • loc: {...}
                  • start: {...}
                    • line: 26
                    • column: 6
                    }
                  • end: {...}
                    • line: 26
                    • column: 17
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 577
                  • end: 581
                  • loc: {...}
                    • start: {...}
                      • line: 26
                      • column: 6
                      }
                    • end: {...}
                      • line: 26
                      • column: 10
                      }
                    }
                  • name: "open"
                  }
                • init: Literal {...}
                  • type: "Literal"
                  • start: 584
                  • end: 588
                  • loc: {...}
                    • start: {...}
                      • line: 26
                      • column: 13
                      }
                    • end: {...}
                      • line: 26
                      • column: 17
                      }
                    }
                  • value: true
                  • raw: "true"
                  }
                }
              ]
            • kind: "let"
            }
          ]
        • sourceType: "module"
        }
      • attributes: []
      }
    }
The AST is not public API and may change at any point in time
Click Outside • Playground • Svelte