Refactoring: fix most of the custom input elements, support right click/long tap/double click to add a new element

test.ts

@@ -3,6 +3,12 @@ import * as theme from "./assets/generated/themes/shops.json"
 import ThemeViewState from "./Models/ThemeViewState"
 import Combine from "./UI/Base/Combine"
 import SpecialVisualizations from "./UI/SpecialVisualizations"
+import InputHelpers from "./UI/InputElement/InputHelpers"
+import BaseUIElement from "./UI/BaseUIElement"
+import { UIEventSource } from "./Logic/UIEventSource"
+import { VariableUiElement } from "./UI/Base/VariableUIElement"
+import { FixedUiElement } from "./UI/Base/FixedUiElement"
+import Title from "./UI/Base/Title"
 
 function testspecial() {
     const layout = new LayoutConfig(<any>theme, true) // qp.data === "" ?  : new AllKnownLayoutsLazy().get(qp.data)
@@ -14,4 +20,26 @@ function testspecial() {
     new Combine(all).AttachTo("maindiv")
 }
 
-testspecial()
+function testinput() {
+    const els: BaseUIElement[] = []
+    for (const key in InputHelpers.AvailableInputHelpers) {
+        const value = new UIEventSource<string>(undefined)
+        const helper = InputHelpers.AvailableInputHelpers[key](value, {
+            mapProperties: {
+                zoom: new UIEventSource(16),
+                location: new UIEventSource({ lat: 51.1, lon: 3.2 }),
+            },
+        })
+
+        els.push(
+            new Combine([
+                new Title(key),
+                helper,
+                new VariableUiElement(value.map((v) => new FixedUiElement(v))),
+            ]).SetClass("flex flex-col p-1 border-3 border-gray-500")
+        )
+    }
+    new Combine(els).SetClass("flex flex-col").AttachTo("maindiv")
+}
+testinput()
+// testspecial()