user selection of the nodes

app/modifiers/ui_select.js

@@ -53,23 +53,21 @@ class UISelect {
     if (this.select_div) {
 
       if (this.current_y <  this.start_y) {
-        this.select_div.top = `${this.current_y + 7}px`;
+        this.select_div.style.top = `${this.current_y + 7}px`;
         top = this.current_y + 7;
       } else {
-        this.select_div.top = `${this.start_y}px`;
+        this.select_div.style.top = `${this.start_y}px`;
         top = this.start_y;
       }
       if (this.current_x <  this.start_x) {
-        this.select_div.left = `${this.current_x + 7}px`;
+        this.select_div.style.left = `${this.current_x + 7}px`;
         left = this.current_x + 7;
       } else {
-        this.select_div.left = `${this.start_x}px`;
+        this.select_div.style.left = `${this.start_x}px`;
         left = this.start_x;
       }
-      this.select_div.width = `${width}px`;
-      this.select_div.height = `${height}px`;
-      console.log(`select_div.width = ${width}`);
-      console.log(`select_div.height = ${height}`);
+      this.select_div.style.width = `${width}px`;
+      this.select_div.style.height = `${height}px`;
     }
   }
 
@@ -126,8 +124,10 @@ export default class UISelectModifier extends Modifier {
 
   @action
   onMouseUp() {
-    this.ui_select.remove_div();
-    this.ui_select = undefined;
+    if (this.ui_select) {
+      this.ui_select.remove_div();
+      this.ui_select = undefined;
+    }
   }
 
   @action

app/styles/node.scss

 .node {
   display: flex;
   align-items: center;
+  // make node title text unselectable
+  user-select: none;
 
   .icon {
     width: 4rem;

app/styles/ui_select.scss

 #ui-select {
     background-color: #e6f5ff40;
-    border: 1px solid #e6f5ff;
+    border: 1px solid #A6DAFF;
 }
\ No newline at end of file