document.register with classes

DOMImpl.js

// Create is defined in the latest ES6 spec. Foo[create]() is used to create the instance
// when you do "new Foo". This instance is then passed to Foo.call(instance, <args>)

import {create} from '@reflect';
Element[create] = function() {
  return documemt.createElementNS(this.prototype.namespaceURI, this.prototype.localName)
};

MyButton.js

class MyBytton extends HTMLButtonElement {
  constructor() {  // In this case the constructor is not needed since if you 
                   // leave it out you get a constructor that does the same thing.
    super();
  }
  
  get foo() { ... }
}

document.register('my-button', {
  class: MyButton  // property name TBD
});

X-MyButton-with-annotations.js

// With potential annotation syntax

class MyButton extends HTMLButtonElement {
  + customElement('my-button')  
}

// Or
@customElement('my-button')
class MyButton extends HTMLButtonElement {
  
}

// Where the annotation function could be defined as.
function customElement(tagName) {
  return function(klass) {
    return document.register(tagName, {
      class: klass
    });
  };
}