Allow on-* event handlers on <sky-element>.

sky/framework/sky-checkbox/sky-checkbox.sky

Index: sky/framework/sky-checkbox/sky-checkbox.sky
diff --git a/sky/framework/sky-checkbox/sky-checkbox.sky b/sky/framework/sky-checkbox/sky-checkbox.sky
index 803bc1e301f30e1e19268fc1861add431d440bda..14db2c6f0a8e8d3be8f64a4439f2ab10c38f0eb9 100644
--- a/sky/framework/sky-checkbox/sky-checkbox.sky
+++ b/sky/framework/sky-checkbox/sky-checkbox.sky
@@ -5,7 +5,10 @@
 -->
 <import src="/sky/framework/sky-button/sky-button.sky" as="SkyButton" />
 
-<sky-element name="sky-checkbox" attributes="checked:boolean">
+<sky-element
+    name="sky-checkbox"
+    attributes="checked:boolean"
+    on-mouseup="handleMouseUp">
 <template>
   <style>
     :host {
@@ -55,10 +58,6 @@ module.exports = class extends SkyButton {
 
     this.containerStyle = '';
     this.checkStyle = '';
-
-    this.addEventListener('mouseup', function() {
-      this.checked = !this.checked;
-    });
   }
   checkedChanged(oldValue, newValue) {
     this.checkStyle = newValue ? 'checked' : '';
@@ -66,6 +65,9 @@ module.exports = class extends SkyButton {
   highlightChanged(oldValue, newValue) {
     this.containerStyle = newValue ? 'highlight' : '';
   }
+  handleMouseUp() {
+    this.checked = !this.checked;
+  }
 }.register();
 </script>
 </sky-element>