frontend: Use typescript over javascript

internal/component/static/dist/control/index.js

@@ -1 +1 @@
-(()=>{const e=e=>{const t=document.getElementsByTagName("h"+e);Array.from(t).forEach((e=>{void 0!==e.id&&""!==e.id&&e.appendChild((e=>{const t=document.createElement("a");return t.className="header-link",t.href="#"+e,t.innerHTML="#",t})(e.id))}))};new Array(6).fill(0).forEach(((t,n)=>e(n+1)));const t={date:e=>new Date(e.innerText).toISOString(),path:e=>{const t=e.innerText.split("/");return t[t.length-1]},pathbuilders:e=>{const t=window.pathbuilders,o=document.createElement("span");let r=!1;if(Object.keys(t).forEach((e=>{r=!0;const a=e+".xml",c=t[e];o.append(n(a,e,c,"application/xml")),o.append(document.createTextNode(" "))})),!r)return"(none)";const a=document.createElement("small");return a.append(document.createTextNode("(click to download)")),o.append(a),o}},n=(e,t,n,o)=>{const r=new Blob([n],{type:o??"text/plain"}),a=document.createElement("a");return a.target="_blank",a.download=e,a.href=URL.createObjectURL(r),a.append(document.createTextNode(t)),a};Object.keys(t).forEach((e=>{const n=t[e];document.querySelectorAll("code."+e).forEach((e=>{const t=n(e);if("string"==typeof t)return e.innerHTML="",void e.appendChild(document.createTextNode(t));e.parentNode.replaceChild(t,e)}))}))})();
+(()=>{const e=e=>{const t=document.getElementsByTagName("h"+e);Array.from(t).forEach((e=>{void 0!==e.id&&""!==e.id&&e.appendChild((e=>{const t=document.createElement("a");return t.className="header-link",t.href="#"+e,t.innerHTML="#",t})(e.id))}))};new Array(6).fill(0).forEach(((t,n)=>e(n+1)));const t={date:e=>new Date(e.innerText).toISOString(),path:e=>{const t=e.innerText.split("/");return t[t.length-1]},pathbuilders:()=>{const e=window.pathbuilders,t=document.createElement("span");let o=!1;if(Object.keys(e).forEach((r=>{o=!0;const a=r+".xml",c=e[r];t.append(n(a,r,c,"application/xml")),t.append(document.createTextNode(" "))})),!o)return"(none)";const r=document.createElement("small");return r.append(document.createTextNode("(click to download)")),t.append(r),t}},n=(e,t,n,o)=>{const r=new Blob([n],{type:o??"text/plain"}),a=document.createElement("a");return a.target="_blank",a.download=e,a.href=URL.createObjectURL(r),a.append(document.createTextNode(t)),a};Object.keys(t).forEach((e=>{const n=t[e];document.querySelectorAll("code."+e).forEach((e=>{const t=n(e);if("string"==typeof t)return e.innerHTML="",void e.appendChild(document.createTextNode(t));e.parentNode.replaceChild(t,e)}))}))})();

internal/component/static/package.json

@@ -13,8 +13,8 @@
   "targets": {
     "default": {
       "source": [
-        "src/control/index.js",
-        "src/home/index.js"
+        "src/control/index.ts",
+        "src/home/index.ts"
       ]
     }
   }

internal/component/static/src/control/index.d.ts

@@ -0,0 +1,3 @@
+declare interface Window {
+    readonly pathbuilders: {[name: string]: string}
+}

internal/component/static/src/control/index.ts

@@ -1,7 +1,8 @@
-import '../global.js';
+import '../global.ts';
 import './index.css';
 
-const types = {
+
+const types: Record<string, (element: HTMLElement) => HTMLElement | string> = {
     "date": (element) => {
         return (new Date(element.innerText)).toISOString()
     },
@@ -9,7 +10,7 @@ const types = {
         const text = element.innerText.split("/");
         return text[text.length - 1];
     },
-    "pathbuilders": (element) => {
+    "pathbuilders": () => {
         const pathbuilders = window.pathbuilders; // read from context!
         const wrapper = document.createElement("span");
 
@@ -34,7 +35,7 @@ const types = {
     }
 }
 
-const make_download_link = (filename, title, content, type) => {
+const make_download_link = (filename: string, title: string, content: string, type: string) => {
     const blob = new Blob(
         [content],
         {
@@ -53,7 +54,7 @@ const make_download_link = (filename, title, content, type) => {
 
 Object.keys(types).forEach(key => {
     const f = types[key];
-    const elements = document.querySelectorAll("code." + key)
+    const elements = document.querySelectorAll("code." + key) as NodeListOf<HTMLElement>
     elements.forEach(element => {
         const newElement = f(element)
         if (typeof newElement === 'string') {
@@ -62,6 +63,6 @@ Object.keys(types).forEach(key => {
             return
         }
 
-        element.parentNode.replaceChild(newElement, element)
+        element.parentNode!.replaceChild(newElement, element)
     })
 })

internal/component/static/src/global.js

@@ -1,2 +0,0 @@
-import './base/base.js';
-import './autolink/autolink.js';

internal/component/static/src/global.ts

@@ -0,0 +1,2 @@
+import './base/base.ts';
+import './autolink/autolink.ts';

internal/component/static/src/home/index.js

@@ -1,2 +0,0 @@
-import '../global.js';
-import './index.css';

internal/component/static/src/home/index.ts

@@ -0,0 +1,2 @@
+import '../global.ts';
+import './index.css';