feat(customization): allow for CE class extension and customization #151

Changes to be committed:
modified:   demo/index.html
modified:   src/define.js
deleted:    src/defineCustom.js
modified:   test/auro-hyperlink.test.js

demo/index.html

@@ -40,9 +40,7 @@
           Prism.highlightAll();
         });
     </script>
-    <script type="module" src="../src/auro-hyperlink.js"></script>
-    <script type="module" src="../src/define.js"></script>
-    <script type="module" src="../src/defineCustom.js"></script>
+    <script type="module" src="./../src/define.js"></script>
 
     <!-- If additional elements are needed for the demo, add them here. -->
     <script src="https://unpkg.com/@alaskaairux/auro-accordion@latest/dist/auro-accordion__bundled.js" type="module"></script>

src/define.js

@@ -1,5 +1,10 @@
 import { AuroHyperlink } from './auro-hyperlink.js';
 
-if (!customElements.get("auro-hyperlink")) {
-  customElements.define("auro-hyperlink", AuroHyperlink);
+export function registerComponent(name = 'custom-hyperlink') {
+  // alias definition
+  if (!customElements.get(name)) {
+    customElements.define(name, class extends AuroHyperlink {});
+  }
 }
+
+registerComponent('auro-hyperlink');

test/auro-hyperlink.test.js

@@ -1,5 +1,5 @@
 import { fixture, html, expect } from '@open-wc/testing';
-import '../src/auro-hyperlink.js';
+import './../src/define.js';
 
 describe('auro-hyperlink', () => {