Fix: cleanup various typing mistakes, remove unused variables, add error handling in opening hours related special visualisations

src/UI/Base/SvelteUIElement.ts

@@ -38,7 +38,6 @@ export default class SvelteUIElement<
         this._props = props ?? <Props>{}
         this._events = events
         this._slots = slots
-        console.trace("Constructing a special stack element")
     }
 
     public setSpan() {

src/UI/Base/ToSvelte.svelte

@@ -9,19 +9,27 @@
   let isSvelte = false
   let uiElement: BaseUIElement | SvelteUIElement | undefined
   let svelteElem: SvelteUIElement
+  let err = false
   onMount(() => {
-    uiElement = typeof construct === "function" ? construct() : construct
+    try {
 
-    if (uiElement?.["isSvelte"]) {
-      isSvelte = true
-      svelteElem = <SvelteUIElement>uiElement
-      return
-    }
+      uiElement = typeof construct === "function" ? construct() : construct
 
-    html = uiElement?.ConstructElement()
+      if (uiElement?.["isSvelte"]) {
+        isSvelte = true
+        svelteElem = <SvelteUIElement>uiElement
+        return
+      }
 
-    if (html !== undefined) {
-      elem?.replaceWith(html)
+      html = uiElement?.ConstructElement()
+
+      if (html !== undefined) {
+        elem?.replaceWith(html)
+      }
+
+    } catch (e) {
+      console.error("Could not construct a ToSvelte:", e)
+      err = true
     }
   })
 
@@ -30,17 +38,20 @@
     uiElement?.Destroy()
   })
 </script>
-
-{#if svelteElem?._svelteComponent}
-  {#if svelteElem.getClass() || svelteElem.getStyle()}
-    <svelte:component
-      this={svelteElem?._svelteComponent}
-      {...svelteElem._props}
-      class={svelteElem.getClass()}
-      style={svelteElem.getStyle()}
-    />
-  {:else}
-    <svelte:component this={svelteElem?._svelteComponent} {...svelteElem._props} />
+{#if err}
+  <div class="alert">Something went wrong</div>
+{:else if isSvelte}
+  {#if svelteElem?._svelteComponent}
+    {#if svelteElem.getClass() || svelteElem.getStyle()}
+      <svelte:component
+        this={svelteElem?._svelteComponent}
+        {...svelteElem._props}
+        class={svelteElem.getClass()}
+        style={svelteElem.getStyle()}
+      />
+    {:else}
+      <svelte:component this={svelteElem?._svelteComponent} {...svelteElem._props} />
+    {/if}
   {/if}
 {:else}
   <span bind:this={elem} />