Knot node switch pin

js/template/KnotNodeTemplate.js

@@ -1,5 +1,6 @@
 import { html } from "lit"
 import ISelectableDraggableTemplate from "./ISelectableDraggableTemplate"
+import KnotPinTemplate from "./KnotPinTemplate"
 import PinElement from "../element/PinElement"
 
 /** @typedef {import("../element/NodeElement").default} NodeElement */
@@ -7,6 +8,18 @@ import PinElement from "../element/PinElement"
 /** @extends {ISelectableDraggableTemplate<NodeElement>} */
 export default class KnotNodeTemplate extends ISelectableDraggableTemplate {
 
+    /** @type {PinElement} */
+    #inputPin
+    get inputPin() {
+        return this.#inputPin
+    }
+
+    /** @type {PinElement} */
+    #outputPin
+    get outputPin() {
+        return this.#outputPin
+    }
+
     render() {
         return html`
             <div class="ueb-node-border"></div>
@@ -28,4 +41,14 @@ export default class KnotNodeTemplate extends ISelectableDraggableTemplate {
     getPinElements(node) {
         return node.querySelectorAll("ueb-pin")
     }
+
+    createPinElements() {
+        const entities = this.element.getPinEntities().filter(v => !v.isHidden())
+        const inputEntity = entities[entities[0].isInput() ? 0 : 1]
+        const outputEntity = entities[entities[0].isOutput() ? 0 : 1]
+        return [
+            this.#inputPin = new PinElement(inputEntity, new KnotPinTemplate()),
+            this.#outputPin = new PinElement(outputEntity, new KnotPinTemplate()),
+        ]
+    }
 }