@fmsim/board 0.0.62 → 0.0.63

package/custom-elements.json

@@ -2,69 +2,6 @@
   "schemaVersion": "1.0.0",
   "readme": "",
   "modules": [
-    {
-      "kind": "javascript-module",
-      "path": "stories/index.stories.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "Regular"
-        },
-        {
-          "kind": "variable",
-          "name": "CustomTitle"
-        },
-        {
-          "kind": "variable",
-          "name": "CustomCounter"
-        },
-        {
-          "kind": "variable",
-          "name": "SlottedContent"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "module": "stories/index.stories.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "Regular",
-          "declaration": {
-            "name": "Regular",
-            "module": "stories/index.stories.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "CustomTitle",
-          "declaration": {
-            "name": "CustomTitle",
-            "module": "stories/index.stories.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "CustomCounter",
-          "declaration": {
-            "name": "CustomCounter",
-            "module": "stories/index.stories.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "SlottedContent",
-          "declaration": {
-            "name": "SlottedContent",
-            "module": "stories/index.stories.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/index.ts",
@@ -120,6 +57,143 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/ox-board-component-info.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "BoardComponentInfo",
+          "members": [
+            {
+              "kind": "field",
+              "name": "component",
+              "type": {
+                "text": "any | undefined"
+              },
+              "attribute": "component"
+            },
+            {
+              "kind": "field",
+              "name": "detailInfo",
+              "type": {
+                "text": "any | undefined"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "dragStart",
+              "type": {
+                "text": "{ x: number; y: number } | undefined"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "dragEndHandler",
+              "privacy": "private",
+              "default": "this.onDragEnd.bind(this)"
+            },
+            {
+              "kind": "field",
+              "name": "dragMoveHandler",
+              "privacy": "private",
+              "default": "this.onDragMove.bind(this)"
+            },
+            {
+              "kind": "method",
+              "name": "onWheel",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "WheelEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onDragStart",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onDragMove",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onDragEnd",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            }
+          ],
+          "events": [
+            {
+              "name": "close",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "component",
+              "type": {
+                "text": "any | undefined"
+              },
+              "fieldName": "component"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "ox-board-component-info",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BoardComponentInfo",
+          "declaration": {
+            "name": "BoardComponentInfo",
+            "module": "src/ox-board-component-info.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "ox-board-component-info",
+          "declaration": {
+            "name": "BoardComponentInfo",
+            "module": "src/ox-board-component-info.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/ox-board-list.ts",
@@ -901,6 +975,14 @@
                 "text": "HTMLElement"
               }
             },
+            {
+              "kind": "field",
+              "name": "popup",
+              "type": {
+                "text": "BoardComponentInfo | undefined"
+              },
+              "privacy": "private"
+            },
             {
               "kind": "method",
               "name": "initSceneAsync"
@@ -1132,6 +1214,28 @@
             {
               "kind": "method",
               "name": "getSceneValues"
+            },
+            {
+              "kind": "method",
+              "name": "onClickEvent",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
+                },
+                {
+                  "name": "hint",
+                  "type": {
+                    "text": "any"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "hidePopup"
             }
           ],
           "events": [
@@ -1487,56 +1591,119 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/component/etc.ts",
+      "path": "stories/index.stories.ts",
       "declarations": [
         {
           "kind": "variable",
-          "name": "etc",
-          "type": {
-            "text": "ComponentGroup"
-          },
-          "default": "{\n  name: 'etc',\n  description: 'a group of components that have not yet been defined.',\n  icon,\n  templates: [\n    {\n      type: 'rect',\n      description: 'rectangle shape',\n      icon: rect,\n      group: 'shape',\n      model: {\n        type: 'rect',\n        left: 100,\n        top: 100,\n        width: 100,\n        height: 100,\n        fillStyle: '#fff',\n        strokeStyle: '#000',\n        alpha: 1,\n        hidden: false,\n        lineWidth: 1,\n        lineDash: 'solid',\n        lineCap: 'butt'\n      }\n    },\n    {\n      type: 'ellipse',\n      description: 'ellipse shape',\n      icon: ellipse,\n      group: 'shape',\n      model: {\n        type: 'ellipse',\n        rx: 50,\n        ry: 50,\n        cx: 150,\n        cy: 150,\n        fillStyle: '#fff',\n        strokeStyle: '#000',\n        alpha: 1,\n        hidden: false,\n        lineWidth: 1,\n        lineDash: 'solid',\n        lineCap: 'butt'\n      }\n    },\n    {\n      type: 'line',\n      description: 'simple line',\n      icon: lineIcon,\n      group: 'line',\n      model: {\n        type: 'line',\n        x1: 100,\n        y1: 100,\n        x2: 200,\n        y2: 200,\n        fillStyle: '#fff',\n        strokeStyle: '#000',\n        alpha: 1,\n        hidden: false,\n        lineWidth: 3,\n        lineDash: 'solid',\n        lineCap: 'butt'\n      }\n    },\n    {\n      type: 'dash',\n      description: 'dash line',\n      icon: dash,\n      group: 'line',\n      model: {\n        type: 'line',\n        x1: 100,\n        y1: 100,\n        x2: 200,\n        y2: 200,\n        fillStyle: '#fff',\n        strokeStyle: '#000',\n        alpha: 1,\n        hidden: false,\n        lineWidth: 3,\n        lineDash: 'round-dot',\n        lineCap: 'butt'\n      }\n    }\n  ]\n}"
+          "name": "Regular"
+        },
+        {
+          "kind": "variable",
+          "name": "CustomTitle"
+        },
+        {
+          "kind": "variable",
+          "name": "CustomCounter"
+        },
+        {
+          "kind": "variable",
+          "name": "SlottedContent"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "etc",
+          "name": "default",
           "declaration": {
-            "name": "etc",
-            "module": "src/component/etc.ts"
+            "module": "stories/index.stories.ts"
           }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/component/index.ts",
-      "declarations": [],
-      "exports": [
+        },
         {
           "kind": "js",
-          "name": "*",
+          "name": "Regular",
           "declaration": {
-            "name": "*",
-            "package": "./etc"
+            "name": "Regular",
+            "module": "stories/index.stories.ts"
           }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/component/register-default-groups.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "registerDefaultGroups"
-        }
-      ],
-      "exports": [
+        },
         {
           "kind": "js",
-          "name": "registerDefaultGroups",
+          "name": "CustomTitle",
+          "declaration": {
+            "name": "CustomTitle",
+            "module": "stories/index.stories.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "CustomCounter",
+          "declaration": {
+            "name": "CustomCounter",
+            "module": "stories/index.stories.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "SlottedContent",
+          "declaration": {
+            "name": "SlottedContent",
+            "module": "stories/index.stories.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/component/etc.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "etc",
+          "type": {
+            "text": "ComponentGroup"
+          },
+          "default": "{\n  name: 'etc',\n  description: 'a group of components that have not yet been defined.',\n  icon,\n  templates: [\n    {\n      type: 'rect',\n      description: 'rectangle shape',\n      icon: rect,\n      group: 'shape',\n      model: {\n        type: 'rect',\n        left: 100,\n        top: 100,\n        width: 100,\n        height: 100,\n        fillStyle: '#fff',\n        strokeStyle: '#000',\n        alpha: 1,\n        hidden: false,\n        lineWidth: 1,\n        lineDash: 'solid',\n        lineCap: 'butt'\n      }\n    },\n    {\n      type: 'ellipse',\n      description: 'ellipse shape',\n      icon: ellipse,\n      group: 'shape',\n      model: {\n        type: 'ellipse',\n        rx: 50,\n        ry: 50,\n        cx: 150,\n        cy: 150,\n        fillStyle: '#fff',\n        strokeStyle: '#000',\n        alpha: 1,\n        hidden: false,\n        lineWidth: 1,\n        lineDash: 'solid',\n        lineCap: 'butt'\n      }\n    },\n    {\n      type: 'line',\n      description: 'simple line',\n      icon: lineIcon,\n      group: 'line',\n      model: {\n        type: 'line',\n        x1: 100,\n        y1: 100,\n        x2: 200,\n        y2: 200,\n        fillStyle: '#fff',\n        strokeStyle: '#000',\n        alpha: 1,\n        hidden: false,\n        lineWidth: 3,\n        lineDash: 'solid',\n        lineCap: 'butt'\n      }\n    },\n    {\n      type: 'dash',\n      description: 'dash line',\n      icon: dash,\n      group: 'line',\n      model: {\n        type: 'line',\n        x1: 100,\n        y1: 100,\n        x2: 200,\n        y2: 200,\n        fillStyle: '#fff',\n        strokeStyle: '#000',\n        alpha: 1,\n        hidden: false,\n        lineWidth: 3,\n        lineDash: 'round-dot',\n        lineCap: 'butt'\n      }\n    }\n  ]\n}"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "etc",
+          "declaration": {
+            "name": "etc",
+            "module": "src/component/etc.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/component/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./etc"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/component/register-default-groups.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "registerDefaultGroups"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "registerDefaultGroups",
           "declaration": {
             "name": "registerDefaultGroups",
             "module": "src/component/register-default-groups.ts"
@@ -1638,92 +1805,183 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/layers/mcs-event-handlers.ts",
-      "declarations": [],
-      "exports": []
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/layers/movement-layer.ts",
+      "path": "src/layers/mcs-mouse-event-layer.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "MovementLayer",
+          "name": "MCSMouseEventLayer",
           "members": [
             {
               "kind": "field",
-              "name": "capturable",
-              "readonly": true
+              "name": "_anim_alpha",
+              "type": {
+                "text": "number"
+              },
+              "privacy": "private",
+              "default": "1"
+            },
+            {
+              "kind": "field",
+              "name": "_lastTargets",
+              "type": {
+                "text": "Component[]"
+              },
+              "privacy": "private",
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "_decoTargets",
+              "type": {
+                "text": "Component[]"
+              },
+              "privacy": "private",
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "_animate",
+              "type": {
+                "text": "any"
+              },
+              "privacy": "private"
             },
             {
               "kind": "method",
-              "name": "drawArrow",
+              "name": "animOnTargetChange",
               "parameters": [
                 {
-                  "name": "ctx",
+                  "name": "decoTargets",
                   "type": {
-                    "text": "CanvasRenderingContext2D"
+                    "text": "Component[]"
                   }
-                },
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "decorate",
+              "parameters": [
                 {
-                  "name": "p0",
+                  "name": "component",
                   "type": {
-                    "text": "POINT"
+                    "text": "Component"
                   }
                 },
                 {
-                  "name": "p1",
+                  "name": "context",
                   "type": {
-                    "text": "POINT"
+                    "text": "CanvasRenderingContext2D"
                   }
                 },
                 {
-                  "name": "headLength",
-                  "default": "10",
+                  "name": "delta",
                   "type": {
                     "text": "number"
                   }
                 }
               ]
             },
+            {
+              "kind": "field",
+              "name": "decoTargets",
+              "type": {
+                "text": "Component[]"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "eventMap",
+              "readonly": true
+            },
             {
               "kind": "method",
-              "name": "findSourceAndTarget",
-              "return": {
-                "type": {
-                  "text": "[Component?, Component?]"
+              "name": "onmouseclick",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
+                },
+                {
+                  "name": "hint",
+                  "type": {
+                    "text": "any"
+                  }
                 }
-              },
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onmouseenter",
               "parameters": [
                 {
-                  "name": "path",
+                  "name": "e",
                   "type": {
-                    "text": "PATH"
+                    "text": "MouseEvent"
+                  }
+                },
+                {
+                  "name": "hint",
+                  "type": {
+                    "text": "any"
                   }
                 }
               ]
             },
             {
-              "kind": "field",
-              "name": "eventMap",
-              "readonly": true
+              "kind": "method",
+              "name": "onmouseleave",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
+                },
+                {
+                  "name": "hint",
+                  "type": {
+                    "text": "any"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "onchangeModelLayer",
+              "name": "onhoverreset",
               "parameters": [
                 {
-                  "name": "after",
+                  "name": "hint",
                   "type": {
                     "text": "any"
                   }
-                },
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onhover",
+              "parameters": [
                 {
-                  "name": "before",
+                  "name": "hint",
                   "type": {
                     "text": "any"
                   }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "offhover",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
                 },
                 {
                   "name": "hint",
@@ -1735,23 +1993,40 @@
             },
             {
               "kind": "method",
-              "name": "onchangeData",
-              "return": {
-                "type": {
-                  "text": "void"
+              "name": "_onhover",
+              "parameters": [
+                {
+                  "name": "target",
+                  "type": {
+                    "text": "Component"
+                  }
                 }
-              },
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_offhover",
               "parameters": [
                 {
-                  "name": "after",
+                  "name": "target",
                   "type": {
-                    "text": "Properties"
+                    "text": "Component"
                   }
-                },
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_hoverreset"
+            },
+            {
+              "kind": "method",
+              "name": "_onpopup",
+              "parameters": [
                 {
-                  "name": "before",
+                  "name": "unit",
                   "type": {
-                    "text": "Properties"
+                    "text": "Component"
                   }
                 }
               ]
@@ -1768,481 +2043,661 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "MovementLayer",
-            "module": "src/layers/movement-layer.ts"
+            "name": "MCSMouseEventLayer",
+            "module": "src/layers/mcs-mouse-event-layer.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/selector/board-creation-popup.ts",
+      "path": "src/layers/movement-layer.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "BoardCreationPopup",
+          "name": "MovementLayer",
           "members": [
             {
               "kind": "field",
-              "name": "defaultGroup",
-              "type": {
-                "text": "string | undefined"
+              "name": "capturable",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "drawArrow",
+              "parameters": [
+                {
+                  "name": "ctx",
+                  "type": {
+                    "text": "CanvasRenderingContext2D"
+                  }
+                },
+                {
+                  "name": "p0",
+                  "type": {
+                    "text": "POINT"
+                  }
+                },
+                {
+                  "name": "p1",
+                  "type": {
+                    "text": "POINT"
+                  }
+                },
+                {
+                  "name": "headLength",
+                  "default": "10",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "findSourceAndTarget",
+              "return": {
+                "type": {
+                  "text": "[Component?, Component?]"
+                }
               },
-              "attribute": "defaultGroup"
+              "parameters": [
+                {
+                  "name": "path",
+                  "type": {
+                    "text": "PATH"
+                  }
+                }
+              ]
             },
             {
               "kind": "field",
-              "name": "groups",
-              "type": {
-                "text": "{ id: string; name: string }[] | undefined"
-              },
-              "attribute": "groups"
+              "name": "eventMap",
+              "readonly": true
             },
             {
               "kind": "method",
-              "name": "onClickSubmit"
+              "name": "onchangeModelLayer",
+              "parameters": [
+                {
+                  "name": "after",
+                  "type": {
+                    "text": "any"
+                  }
+                },
+                {
+                  "name": "before",
+                  "type": {
+                    "text": "any"
+                  }
+                },
+                {
+                  "name": "hint",
+                  "type": {
+                    "text": "any"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onchangeData",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "after",
+                  "type": {
+                    "text": "Properties"
+                  }
+                },
+                {
+                  "name": "before",
+                  "type": {
+                    "text": "Properties"
+                  }
+                }
+              ]
             }
           ],
-          "events": [
+          "superclass": {
+            "name": "Layer",
+            "package": "@hatiolab/things-scene"
+          }
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "MovementLayer",
+            "module": "src/layers/movement-layer.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/layers/tooltip-decorator.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "tooltipDecorator",
+          "parameters": [
             {
-              "name": "create-board",
+              "name": "component",
               "type": {
-                "text": "CustomEvent"
+                "text": "Component"
               }
-            }
-          ],
-          "attributes": [
+            },
             {
-              "name": "defaultGroup",
+              "name": "context",
               "type": {
-                "text": "string | undefined"
-              },
-              "fieldName": "defaultGroup"
+                "text": "CanvasRenderingContext2D"
+              }
             },
             {
-              "name": "groups",
+              "name": "delta",
               "type": {
-                "text": "{ id: string; name: string }[] | undefined"
-              },
-              "fieldName": "groups"
-            }
-          ],
-          "mixins": [
-            {
-              "name": "localize(i18next)",
-              "module": "src/selector/board-creation-popup.ts"
+                "text": "number"
+              }
             }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "board-creation-popup",
-          "customElement": true
+          ]
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "BoardCreationPopup",
+          "name": "default",
           "declaration": {
-            "name": "BoardCreationPopup",
-            "module": "src/selector/board-creation-popup.ts"
+            "name": "tooltipDecorator",
+            "module": "src/layers/tooltip-decorator.ts"
           }
-        },
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/edit-toolbar-style.ts",
+      "declarations": [
         {
-          "kind": "custom-element-definition",
-          "name": "board-creation-popup",
+          "kind": "variable",
+          "name": "style",
+          "default": "css`\n  :host {\n    background-color: var(--edit-toolbar-background-color, #394e64);\n\n    overflow-x: hidden;\n  }\n\n  [tools] {\n    display: flex;\n    align-items: center;\n    overflow: none;\n    padding: 0px 10px;\n  }\n\n  [tools] > * {\n    padding: 0px;\n  }\n\n  [tools] > span[button] {\n    min-width: 30px;\n  }\n\n  [tools] > span[padding] {\n    flex: 1;\n  }\n\n  [tools] > .vline {\n    display: block;\n    flex: none;\n    border-left: 1px solid rgba(255, 255, 255, 0.2);\n    border-right: 1px solid rgba(0, 0, 0, 0.15);\n    width: 0px;\n    height: 18px;\n    margin: 0 3px;\n  }\n\n  span[button] {\n    min-height: 35px;\n\n    background: var(--url-icon-htoolbar) no-repeat;\n    background-position-x: 50%;\n    opacity: 0.8;\n  }\n  span[button]:hover {\n    opacity: 1;\n    background-color: rgba(0, 0, 0, 0.1);\n    cursor: pointer;\n  }\n\n  #fullscreen,\n  #toggle-property {\n    flex: none;\n  }\n\n  #align-left {\n    background-position-y: 8px;\n  }\n\n  #align-center {\n    background-position-y: -42px;\n  }\n\n  #align-right {\n    background-position-y: -92px;\n  }\n\n  #align-top {\n    background-position-y: -142px;\n  }\n\n  #align-middle {\n    background-position-y: -192px;\n  }\n\n  #align-bottom {\n    background-position-y: -242px;\n  }\n\n  #undo {\n    background-position-y: -592px;\n  }\n\n  #redo {\n    background-position-y: -642px;\n  }\n\n  #front {\n    background-position-y: -292px;\n  }\n\n  #back {\n    background-position-y: -342px;\n  }\n\n  #forward {\n    background-position-y: -392px;\n  }\n\n  #backward {\n    background-position-y: -442px;\n  }\n\n  #symmetry-x {\n    background-position-y: -492px;\n  }\n\n  #symmetry-y {\n    background-position-y: -542px;\n  }\n\n  #group {\n    background-position-y: -492px;\n  }\n\n  #ungroup {\n    background-position-y: -542px;\n  }\n\n  #fullscreen {\n    background-position-y: -692px;\n  }\n\n  #toggle-property {\n    background-position-y: -692px;\n    float: right;\n  }\n\n  #zoomin {\n    background-position-y: -742px;\n  }\n\n  #zoomout {\n    background-position-y: -792px;\n  }\n\n  #fit-scene {\n    background-position-y: -1492px;\n  }\n\n  #cut {\n    background-position-y: -842px;\n  }\n\n  #copy {\n    background-position-y: -892px;\n  }\n\n  #paste {\n    background-position-y: -942px;\n  }\n\n  #delete {\n    background-position-y: -992px;\n  }\n\n  #font-increase {\n    background-position-y: -1042px;\n  }\n\n  #font-decrease {\n    background-position-y: -1092px;\n  }\n\n  #style-copy {\n    background-position-y: -1142px;\n  }\n\n  #context-menu {\n    background-position-y: -692px;\n  }\n\n  #symmetry-x {\n    background-position-y: -1192px;\n  }\n\n  #symmetry-y {\n    background-position-y: -1242px;\n  }\n\n  #rotate-cw {\n    background-position-y: -1292px;\n  }\n\n  #rotate-ccw {\n    background-position-y: -1342px;\n  }\n\n  #distribute-horizontal {\n    background-position-y: -1542px;\n  }\n\n  #distribute-vertical {\n    background-position-y: -1593px;\n  }\n\n  #toggle-property {\n    background-position-y: -1392px;\n  }\n\n  #preview {\n    background-position-y: -1640px;\n  }\n\n  /* bigger buttons */\n  #fullscreen {\n    background: var(--url-icon-fullscreen) 50% 10px no-repeat;\n    width: var(--edit-toolbar-bigger-icon-size);\n    height: var(--edit-toolbar-bigger-icon-size);\n    border-left: var(--edit-toolbar-bigger-icon-line);\n  }\n\n  #toggle-property {\n    background: var(--url-icon-collapse) 80% 10px no-repeat;\n    width: var(--edit-toolbar-bigger-icon-size);\n    height: var(--edit-toolbar-bigger-icon-size);\n    border-left: var(--edit-toolbar-bigger-icon-line);\n  }\n\n  #toggle-property[active] {\n    background: var(--url-icon-collapse-active) 80% 10px no-repeat;\n  }\n`"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "style",
           "declaration": {
-            "name": "BoardCreationPopup",
-            "module": "src/selector/board-creation-popup.ts"
+            "name": "style",
+            "module": "src/modeller/edit-toolbar-style.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/selector/board-thumbnail-card.ts",
+      "path": "src/modeller/edit-toolbar.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "BoardThumbnailCard",
+          "name": "EditToolbar",
           "members": [
             {
               "kind": "field",
-              "name": "defaultGroup",
+              "name": "scene",
               "type": {
-                "text": "string | undefined"
+                "text": "Scene | undefined"
               },
-              "attribute": "defaultGroup"
+              "attribute": "scene"
             },
             {
               "kind": "field",
-              "name": "groups",
+              "name": "selected",
               "type": {
-                "text": "{ id: string; name: string }[] | undefined"
+                "text": "any[]"
               },
-              "attribute": "groups"
-            },
-            {
-              "kind": "method",
-              "name": "onClickFlip",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "onClickSubmit",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
+              "default": "[]",
+              "attribute": "selected"
             },
             {
-              "kind": "method",
-              "name": "reset"
-            }
-          ],
-          "events": [
-            {
-              "name": "create-board",
+              "kind": "field",
+              "name": "hideProperty",
               "type": {
-                "text": "CustomEvent"
-              }
-            }
-          ],
-          "attributes": [
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "hideProperty"
+            },
             {
-              "name": "defaultGroup",
+              "kind": "field",
+              "name": "cliped",
               "type": {
                 "text": "string | undefined"
               },
-              "fieldName": "defaultGroup"
+              "privacy": "private"
             },
             {
-              "name": "groups",
+              "kind": "field",
+              "name": "redo",
               "type": {
-                "text": "{ id: string; name: string }[] | undefined"
+                "text": "HTMLElement"
               },
-              "fieldName": "groups"
-            }
-          ],
-          "mixins": [
-            {
-              "name": "localize(i18next)",
-              "module": "src/selector/board-thumbnail-card.ts"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "board-thumbnail-card",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BoardThumbnailCard",
-          "declaration": {
-            "name": "BoardThumbnailCard",
-            "module": "src/selector/board-thumbnail-card.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "board-thumbnail-card",
-          "declaration": {
-            "name": "BoardThumbnailCard",
-            "module": "src/selector/board-thumbnail-card.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/selector/ox-board-creation-card.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "BoardCreationCard",
-          "members": [
+              "privacy": "private"
+            },
             {
               "kind": "field",
-              "name": "defaultGroup",
+              "name": "undo",
               "type": {
-                "text": "string | undefined"
+                "text": "HTMLElement"
               },
-              "attribute": "defaultGroup"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "groups",
+              "name": "fullscreen",
               "type": {
-                "text": "any"
+                "text": "HTMLElement"
               },
-              "attribute": "groups"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "popup",
+              "name": "cut",
               "type": {
-                "text": "any"
+                "text": "HTMLElement"
               },
               "privacy": "private"
             },
             {
-              "kind": "method",
-              "name": "onClick"
-            },
-            {
-              "kind": "method",
-              "name": "reset"
-            }
-          ],
-          "events": [
-            {
-              "name": "create-board",
-              "type": {
-                "text": "CustomEvent"
-              }
-            }
-          ],
-          "attributes": [
-            {
-              "name": "defaultGroup",
+              "kind": "field",
+              "name": "copy",
               "type": {
-                "text": "string | undefined"
+                "text": "HTMLElement"
               },
-              "fieldName": "defaultGroup"
+              "privacy": "private"
             },
-            {
-              "name": "groups",
-              "type": {
-                "text": "any"
-              },
-              "fieldName": "groups"
-            }
-          ],
-          "mixins": [
-            {
-              "name": "localize(i18next)",
-              "module": "src/selector/ox-board-creation-card.ts"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "ox-board-creation-card",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BoardCreationCard",
-          "declaration": {
-            "name": "BoardCreationCard",
-            "module": "src/selector/ox-board-creation-card.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "ox-board-creation-card",
-          "declaration": {
-            "name": "BoardCreationCard",
-            "module": "src/selector/ox-board-creation-card.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/selector/ox-board-selector.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "BoardSelector",
-          "members": [
             {
               "kind": "field",
-              "name": "groups",
+              "name": "paste",
               "type": {
-                "text": "{ id: string; name: string; description: string }[]"
+                "text": "HTMLElement"
               },
-              "default": "[]",
-              "attribute": "groups"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "boards",
+              "name": "delete",
               "type": {
-                "text": "any[]"
+                "text": "HTMLElement"
               },
-              "default": "[]",
-              "attribute": "boards"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "group",
+              "name": "forward",
               "type": {
-                "text": "string | undefined"
+                "text": "HTMLElement"
               },
-              "attribute": "group"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "inherited",
+              "name": "backward",
               "type": {
-                "text": "InheritedValueType | undefined"
+                "text": "HTMLElement"
               },
-              "attribute": "inherited"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "creatable",
+              "name": "front",
               "type": {
-                "text": "boolean"
+                "text": "HTMLElement"
               },
-              "default": "false",
-              "attribute": "creatable"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "value",
+              "name": "back",
               "type": {
-                "text": "string | undefined"
+                "text": "HTMLElement"
               },
-              "attribute": "value"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "_page",
+              "name": "aligners",
               "type": {
-                "text": "number"
+                "text": "NodeListOf<HTMLSpanElement>"
               },
-              "privacy": "private",
-              "default": "1"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "_total",
+              "name": "zorders",
               "type": {
-                "text": "number"
+                "text": "NodeListOf<HTMLSpanElement>"
               },
-              "privacy": "private",
-              "default": "0"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "scrollTargetEl",
+              "name": "distributes",
               "type": {
-                "text": "HTMLElement | null"
+                "text": "NodeListOf<HTMLSpanElement>"
               },
-              "readonly": true
-            },
-            {
-              "kind": "method",
-              "name": "scrollAction"
+              "privacy": "private"
             },
             {
               "kind": "method",
-              "name": "onClickSelect",
+              "name": "onWheelEvent",
               "parameters": [
                 {
-                  "name": "board",
+                  "name": "e",
                   "type": {
-                    "text": "any"
+                    "text": "Event"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "onCreateBoard",
+              "name": "getSymbol",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "key",
                   "type": {
-                    "text": "CustomEvent"
+                    "text": "string"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "refreshGroups"
-            },
-            {
-              "kind": "method",
-              "name": "refreshBoards"
-            },
-            {
-              "kind": "method",
-              "name": "appendBoards"
+              "name": "getShortcutString",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "keys",
+                  "type": {
+                    "text": "string[]"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "getBoards",
+              "name": "onShortcut",
               "parameters": [
                 {
-                  "name": "{ page = 1, limit = this._infiniteScrollOptions.limit }",
-                  "default": "{}"
+                  "name": "e",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "createBoard",
+              "name": "onExecute",
               "parameters": [
                 {
-                  "name": "name",
+                  "name": "command",
                   "type": {
                     "text": "string"
                   }
                 },
                 {
-                  "name": "description",
+                  "name": "undoable",
                   "type": {
-                    "text": "string"
+                    "text": "boolean"
                   }
                 },
                 {
-                  "name": "groupId",
+                  "name": "redoable",
                   "type": {
-                    "text": "string"
+                    "text": "boolean"
                   }
                 }
               ]
             },
             {
-              "kind": "field",
-              "name": "limit",
-              "type": {
-                "text": "number"
-              },
-              "default": "50"
+              "kind": "method",
+              "name": "onUndo",
+              "parameters": [
+                {
+                  "name": "undoable",
+                  "type": {
+                    "text": "boolean"
+                  }
+                },
+                {
+                  "name": "redoable",
+                  "type": {
+                    "text": "boolean"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onRedo",
+              "parameters": [
+                {
+                  "name": "undoable",
+                  "type": {
+                    "text": "boolean"
+                  }
+                },
+                {
+                  "name": "redoable",
+                  "type": {
+                    "text": "boolean"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onSceneChanged",
+              "parameters": [
+                {
+                  "name": "after",
+                  "optional": true,
+                  "type": {
+                    "text": "Scene"
+                  }
+                },
+                {
+                  "name": "before",
+                  "optional": true,
+                  "type": {
+                    "text": "Scene"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onSelectedChanged",
+              "parameters": [
+                {
+                  "name": "after",
+                  "type": {
+                    "text": "Component[]"
+                  }
+                },
+                {
+                  "name": "before",
+                  "type": {
+                    "text": "Component[]"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onTapUndo"
+            },
+            {
+              "kind": "method",
+              "name": "onTapRedo"
+            },
+            {
+              "kind": "method",
+              "name": "onTapCut"
+            },
+            {
+              "kind": "method",
+              "name": "onTapCopy"
+            },
+            {
+              "kind": "method",
+              "name": "onTapPaste"
+            },
+            {
+              "kind": "method",
+              "name": "onTapDelete"
+            },
+            {
+              "kind": "method",
+              "name": "onTapSelectAll"
+            },
+            {
+              "kind": "method",
+              "name": "onTapFontIncrease",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "TouchEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onTapFontDecrease",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "TouchEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onTapAlign",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "TouchEvent | string"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onTapZorder",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "TouchEvent | string"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onTapSymmetryX"
+            },
+            {
+              "kind": "method",
+              "name": "onTapSymmetryY"
+            },
+            {
+              "kind": "method",
+              "name": "onTapRotateCW"
+            },
+            {
+              "kind": "method",
+              "name": "onTapRotateCCW"
+            },
+            {
+              "kind": "method",
+              "name": "onTapGroup"
+            },
+            {
+              "kind": "method",
+              "name": "onTapUngroup"
+            },
+            {
+              "kind": "method",
+              "name": "onTapFullscreen"
+            },
+            {
+              "kind": "method",
+              "name": "onTapToggle"
+            },
+            {
+              "kind": "method",
+              "name": "onTapFitScene"
+            },
+            {
+              "kind": "method",
+              "name": "onTapPreview"
+            },
+            {
+              "kind": "method",
+              "name": "onTapDownloadModel"
+            },
+            {
+              "kind": "method",
+              "name": "onTapDistribute",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "TouchEvent | string"
+                  }
+                }
+              ]
             }
           ],
           "events": [
             {
-              "name": "board-selected",
+              "name": "modeller-fullscreen",
+              "type": {
+                "text": "CustomEvent"
+              }
+            },
+            {
+              "name": "hide-property-changed",
+              "type": {
+                "text": "CustomEvent"
+              }
+            },
+            {
+              "name": "open-preview",
+              "type": {
+                "text": "CustomEvent"
+              }
+            },
+            {
+              "name": "download-model",
               "type": {
                 "text": "CustomEvent"
               }
@@ -2250,539 +2705,947 @@
           ],
           "attributes": [
             {
-              "name": "groups",
+              "name": "scene",
               "type": {
-                "text": "{ id: string; name: string; description: string }[]"
+                "text": "Scene | undefined"
               },
-              "default": "[]",
-              "fieldName": "groups"
+              "fieldName": "scene"
             },
             {
-              "name": "boards",
+              "name": "selected",
               "type": {
                 "text": "any[]"
               },
               "default": "[]",
-              "fieldName": "boards"
+              "fieldName": "selected"
             },
             {
-              "name": "group",
+              "name": "hideProperty",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "hideProperty"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "EditToolbar",
+          "declaration": {
+            "name": "EditToolbar",
+            "module": "src/modeller/edit-toolbar.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/selector/board-creation-popup.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "BoardCreationPopup",
+          "members": [
+            {
+              "kind": "field",
+              "name": "defaultGroup",
               "type": {
                 "text": "string | undefined"
               },
-              "fieldName": "group"
+              "attribute": "defaultGroup"
             },
             {
-              "name": "inherited",
+              "kind": "field",
+              "name": "groups",
               "type": {
-                "text": "InheritedValueType | undefined"
+                "text": "{ id: string; name: string }[] | undefined"
               },
-              "fieldName": "inherited"
+              "attribute": "groups"
             },
             {
-              "name": "creatable",
+              "kind": "method",
+              "name": "onClickSubmit"
+            }
+          ],
+          "events": [
+            {
+              "name": "create-board",
               "type": {
-                "text": "boolean"
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "defaultGroup",
+              "type": {
+                "text": "string | undefined"
               },
-              "default": "false",
-              "fieldName": "creatable"
+              "fieldName": "defaultGroup"
             },
             {
-              "name": "value",
+              "name": "groups",
               "type": {
-                "text": "string | undefined"
+                "text": "{ id: string; name: string }[] | undefined"
               },
-              "fieldName": "value"
+              "fieldName": "groups"
             }
           ],
           "mixins": [
-            {
-              "name": "InfiniteScrollable",
-              "package": "@operato/utils/mixins/infinite-scrollable.js"
-            },
             {
               "name": "localize(i18next)",
-              "module": "src/selector/ox-board-selector.ts"
+              "module": "src/selector/board-creation-popup.ts"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "ox-editor-board-selector",
+          "tagName": "board-creation-popup",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "BoardSelector",
+          "name": "BoardCreationPopup",
           "declaration": {
-            "name": "BoardSelector",
-            "module": "src/selector/ox-board-selector.ts"
+            "name": "BoardCreationPopup",
+            "module": "src/selector/board-creation-popup.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "ox-board-selector",
+          "name": "board-creation-popup",
           "declaration": {
-            "name": "BoardSelector",
-            "module": "src/selector/ox-board-selector.ts"
+            "name": "BoardCreationPopup",
+            "module": "src/selector/board-creation-popup.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/edit-toolbar-style.ts",
+      "path": "src/selector/board-thumbnail-card.ts",
       "declarations": [
         {
-          "kind": "variable",
-          "name": "style",
-          "default": "css`\n  :host {\n    background-color: var(--edit-toolbar-background-color, #394e64);\n\n    overflow-x: hidden;\n  }\n\n  [tools] {\n    display: flex;\n    align-items: center;\n    overflow: none;\n    padding: 0px 10px;\n  }\n\n  [tools] > * {\n    padding: 0px;\n  }\n\n  [tools] > span[button] {\n    min-width: 30px;\n  }\n\n  [tools] > span[padding] {\n    flex: 1;\n  }\n\n  [tools] > .vline {\n    display: block;\n    flex: none;\n    border-left: 1px solid rgba(255, 255, 255, 0.2);\n    border-right: 1px solid rgba(0, 0, 0, 0.15);\n    width: 0px;\n    height: 18px;\n    margin: 0 3px;\n  }\n\n  span[button] {\n    min-height: 35px;\n\n    background: var(--url-icon-htoolbar) no-repeat;\n    background-position-x: 50%;\n    opacity: 0.8;\n  }\n  span[button]:hover {\n    opacity: 1;\n    background-color: rgba(0, 0, 0, 0.1);\n    cursor: pointer;\n  }\n\n  #fullscreen,\n  #toggle-property {\n    flex: none;\n  }\n\n  #align-left {\n    background-position-y: 8px;\n  }\n\n  #align-center {\n    background-position-y: -42px;\n  }\n\n  #align-right {\n    background-position-y: -92px;\n  }\n\n  #align-top {\n    background-position-y: -142px;\n  }\n\n  #align-middle {\n    background-position-y: -192px;\n  }\n\n  #align-bottom {\n    background-position-y: -242px;\n  }\n\n  #undo {\n    background-position-y: -592px;\n  }\n\n  #redo {\n    background-position-y: -642px;\n  }\n\n  #front {\n    background-position-y: -292px;\n  }\n\n  #back {\n    background-position-y: -342px;\n  }\n\n  #forward {\n    background-position-y: -392px;\n  }\n\n  #backward {\n    background-position-y: -442px;\n  }\n\n  #symmetry-x {\n    background-position-y: -492px;\n  }\n\n  #symmetry-y {\n    background-position-y: -542px;\n  }\n\n  #group {\n    background-position-y: -492px;\n  }\n\n  #ungroup {\n    background-position-y: -542px;\n  }\n\n  #fullscreen {\n    background-position-y: -692px;\n  }\n\n  #toggle-property {\n    background-position-y: -692px;\n    float: right;\n  }\n\n  #zoomin {\n    background-position-y: -742px;\n  }\n\n  #zoomout {\n    background-position-y: -792px;\n  }\n\n  #fit-scene {\n    background-position-y: -1492px;\n  }\n\n  #cut {\n    background-position-y: -842px;\n  }\n\n  #copy {\n    background-position-y: -892px;\n  }\n\n  #paste {\n    background-position-y: -942px;\n  }\n\n  #delete {\n    background-position-y: -992px;\n  }\n\n  #font-increase {\n    background-position-y: -1042px;\n  }\n\n  #font-decrease {\n    background-position-y: -1092px;\n  }\n\n  #style-copy {\n    background-position-y: -1142px;\n  }\n\n  #context-menu {\n    background-position-y: -692px;\n  }\n\n  #symmetry-x {\n    background-position-y: -1192px;\n  }\n\n  #symmetry-y {\n    background-position-y: -1242px;\n  }\n\n  #rotate-cw {\n    background-position-y: -1292px;\n  }\n\n  #rotate-ccw {\n    background-position-y: -1342px;\n  }\n\n  #distribute-horizontal {\n    background-position-y: -1542px;\n  }\n\n  #distribute-vertical {\n    background-position-y: -1593px;\n  }\n\n  #toggle-property {\n    background-position-y: -1392px;\n  }\n\n  #preview {\n    background-position-y: -1640px;\n  }\n\n  /* bigger buttons */\n  #fullscreen {\n    background: var(--url-icon-fullscreen) 50% 10px no-repeat;\n    width: var(--edit-toolbar-bigger-icon-size);\n    height: var(--edit-toolbar-bigger-icon-size);\n    border-left: var(--edit-toolbar-bigger-icon-line);\n  }\n\n  #toggle-property {\n    background: var(--url-icon-collapse) 80% 10px no-repeat;\n    width: var(--edit-toolbar-bigger-icon-size);\n    height: var(--edit-toolbar-bigger-icon-size);\n    border-left: var(--edit-toolbar-bigger-icon-line);\n  }\n\n  #toggle-property[active] {\n    background: var(--url-icon-collapse-active) 80% 10px no-repeat;\n  }\n`"
+          "kind": "class",
+          "description": "",
+          "name": "BoardThumbnailCard",
+          "members": [
+            {
+              "kind": "field",
+              "name": "defaultGroup",
+              "type": {
+                "text": "string | undefined"
+              },
+              "attribute": "defaultGroup"
+            },
+            {
+              "kind": "field",
+              "name": "groups",
+              "type": {
+                "text": "{ id: string; name: string }[] | undefined"
+              },
+              "attribute": "groups"
+            },
+            {
+              "kind": "method",
+              "name": "onClickFlip",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onClickSubmit",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "reset"
+            }
+          ],
+          "events": [
+            {
+              "name": "create-board",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "defaultGroup",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "defaultGroup"
+            },
+            {
+              "name": "groups",
+              "type": {
+                "text": "{ id: string; name: string }[] | undefined"
+              },
+              "fieldName": "groups"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "localize(i18next)",
+              "module": "src/selector/board-thumbnail-card.ts"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "board-thumbnail-card",
+          "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "style",
+          "name": "BoardThumbnailCard",
           "declaration": {
-            "name": "style",
-            "module": "src/modeller/edit-toolbar-style.ts"
+            "name": "BoardThumbnailCard",
+            "module": "src/selector/board-thumbnail-card.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "board-thumbnail-card",
+          "declaration": {
+            "name": "BoardThumbnailCard",
+            "module": "src/selector/board-thumbnail-card.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/edit-toolbar.ts",
+      "path": "src/selector/ox-board-creation-card.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "",
-          "name": "EditToolbar",
-          "members": [
-            {
-              "kind": "field",
-              "name": "scene",
-              "type": {
-                "text": "Scene | undefined"
-              },
-              "attribute": "scene"
-            },
-            {
-              "kind": "field",
-              "name": "selected",
-              "type": {
-                "text": "any[]"
-              },
-              "default": "[]",
-              "attribute": "selected"
-            },
+          "description": "",
+          "name": "BoardCreationCard",
+          "members": [
             {
               "kind": "field",
-              "name": "hideProperty",
+              "name": "defaultGroup",
               "type": {
-                "text": "boolean"
+                "text": "string | undefined"
               },
-              "default": "false",
-              "attribute": "hideProperty"
+              "attribute": "defaultGroup"
             },
             {
               "kind": "field",
-              "name": "cliped",
+              "name": "groups",
               "type": {
-                "text": "string | undefined"
+                "text": "any"
               },
-              "privacy": "private"
+              "attribute": "groups"
             },
             {
               "kind": "field",
-              "name": "redo",
+              "name": "popup",
               "type": {
-                "text": "HTMLElement"
+                "text": "any"
               },
               "privacy": "private"
             },
             {
-              "kind": "field",
-              "name": "undo",
-              "type": {
-                "text": "HTMLElement"
-              },
-              "privacy": "private"
+              "kind": "method",
+              "name": "onClick"
             },
             {
-              "kind": "field",
-              "name": "fullscreen",
+              "kind": "method",
+              "name": "reset"
+            }
+          ],
+          "events": [
+            {
+              "name": "create-board",
               "type": {
-                "text": "HTMLElement"
-              },
-              "privacy": "private"
-            },
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
             {
-              "kind": "field",
-              "name": "cut",
+              "name": "defaultGroup",
               "type": {
-                "text": "HTMLElement"
+                "text": "string | undefined"
               },
-              "privacy": "private"
+              "fieldName": "defaultGroup"
             },
             {
-              "kind": "field",
-              "name": "copy",
+              "name": "groups",
               "type": {
-                "text": "HTMLElement"
+                "text": "any"
               },
-              "privacy": "private"
-            },
+              "fieldName": "groups"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "localize(i18next)",
+              "module": "src/selector/ox-board-creation-card.ts"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "ox-board-creation-card",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BoardCreationCard",
+          "declaration": {
+            "name": "BoardCreationCard",
+            "module": "src/selector/ox-board-creation-card.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "ox-board-creation-card",
+          "declaration": {
+            "name": "BoardCreationCard",
+            "module": "src/selector/ox-board-creation-card.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/selector/ox-board-selector.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "BoardSelector",
+          "members": [
             {
               "kind": "field",
-              "name": "paste",
+              "name": "groups",
               "type": {
-                "text": "HTMLElement"
+                "text": "{ id: string; name: string; description: string }[]"
               },
-              "privacy": "private"
+              "default": "[]",
+              "attribute": "groups"
             },
             {
               "kind": "field",
-              "name": "delete",
+              "name": "boards",
               "type": {
-                "text": "HTMLElement"
+                "text": "any[]"
               },
-              "privacy": "private"
+              "default": "[]",
+              "attribute": "boards"
             },
             {
               "kind": "field",
-              "name": "forward",
+              "name": "group",
               "type": {
-                "text": "HTMLElement"
+                "text": "string | undefined"
               },
-              "privacy": "private"
+              "attribute": "group"
             },
             {
               "kind": "field",
-              "name": "backward",
+              "name": "inherited",
               "type": {
-                "text": "HTMLElement"
+                "text": "InheritedValueType | undefined"
               },
-              "privacy": "private"
+              "attribute": "inherited"
             },
             {
               "kind": "field",
-              "name": "front",
+              "name": "creatable",
               "type": {
-                "text": "HTMLElement"
+                "text": "boolean"
               },
-              "privacy": "private"
+              "default": "false",
+              "attribute": "creatable"
             },
             {
               "kind": "field",
-              "name": "back",
+              "name": "value",
               "type": {
-                "text": "HTMLElement"
+                "text": "string | undefined"
               },
-              "privacy": "private"
+              "attribute": "value"
             },
             {
               "kind": "field",
-              "name": "aligners",
+              "name": "_page",
               "type": {
-                "text": "NodeListOf<HTMLSpanElement>"
+                "text": "number"
               },
-              "privacy": "private"
+              "privacy": "private",
+              "default": "1"
             },
             {
               "kind": "field",
-              "name": "zorders",
+              "name": "_total",
               "type": {
-                "text": "NodeListOf<HTMLSpanElement>"
+                "text": "number"
               },
-              "privacy": "private"
+              "privacy": "private",
+              "default": "0"
             },
             {
               "kind": "field",
-              "name": "distributes",
+              "name": "scrollTargetEl",
               "type": {
-                "text": "NodeListOf<HTMLSpanElement>"
+                "text": "HTMLElement | null"
               },
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "onWheelEvent",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "getSymbol",
-              "parameters": [
-                {
-                  "name": "key",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "getShortcutString",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "keys",
-                  "type": {
-                    "text": "string[]"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "onShortcut",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  }
-                }
-              ]
+              "readonly": true
             },
             {
               "kind": "method",
-              "name": "onExecute",
-              "parameters": [
-                {
-                  "name": "command",
-                  "type": {
-                    "text": "string"
-                  }
-                },
-                {
-                  "name": "undoable",
-                  "type": {
-                    "text": "boolean"
-                  }
-                },
-                {
-                  "name": "redoable",
-                  "type": {
-                    "text": "boolean"
-                  }
-                }
-              ]
+              "name": "scrollAction"
             },
             {
               "kind": "method",
-              "name": "onUndo",
+              "name": "onClickSelect",
               "parameters": [
                 {
-                  "name": "undoable",
-                  "type": {
-                    "text": "boolean"
-                  }
-                },
-                {
-                  "name": "redoable",
+                  "name": "board",
                   "type": {
-                    "text": "boolean"
+                    "text": "any"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "onRedo",
-              "parameters": [
-                {
-                  "name": "undoable",
-                  "type": {
-                    "text": "boolean"
-                  }
-                },
+              "name": "onCreateBoard",
+              "parameters": [
                 {
-                  "name": "redoable",
+                  "name": "e",
                   "type": {
-                    "text": "boolean"
+                    "text": "CustomEvent"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "onSceneChanged",
+              "name": "refreshGroups"
+            },
+            {
+              "kind": "method",
+              "name": "refreshBoards"
+            },
+            {
+              "kind": "method",
+              "name": "appendBoards"
+            },
+            {
+              "kind": "method",
+              "name": "getBoards",
               "parameters": [
                 {
-                  "name": "after",
-                  "optional": true,
-                  "type": {
-                    "text": "Scene"
-                  }
-                },
-                {
-                  "name": "before",
-                  "optional": true,
-                  "type": {
-                    "text": "Scene"
-                  }
+                  "name": "{ page = 1, limit = this._infiniteScrollOptions.limit }",
+                  "default": "{}"
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "onSelectedChanged",
+              "name": "createBoard",
               "parameters": [
                 {
-                  "name": "after",
+                  "name": "name",
                   "type": {
-                    "text": "Component[]"
+                    "text": "string"
                   }
                 },
                 {
-                  "name": "before",
+                  "name": "description",
                   "type": {
-                    "text": "Component[]"
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "groupId",
+                  "type": {
+                    "text": "string"
                   }
                 }
               ]
             },
             {
-              "kind": "method",
-              "name": "onTapUndo"
+              "kind": "field",
+              "name": "limit",
+              "type": {
+                "text": "number"
+              },
+              "default": "50"
+            }
+          ],
+          "events": [
+            {
+              "name": "board-selected",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "groups",
+              "type": {
+                "text": "{ id: string; name: string; description: string }[]"
+              },
+              "default": "[]",
+              "fieldName": "groups"
             },
             {
-              "kind": "method",
-              "name": "onTapRedo"
+              "name": "boards",
+              "type": {
+                "text": "any[]"
+              },
+              "default": "[]",
+              "fieldName": "boards"
             },
             {
-              "kind": "method",
-              "name": "onTapCut"
+              "name": "group",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "group"
             },
             {
-              "kind": "method",
-              "name": "onTapCopy"
+              "name": "inherited",
+              "type": {
+                "text": "InheritedValueType | undefined"
+              },
+              "fieldName": "inherited"
             },
             {
-              "kind": "method",
-              "name": "onTapPaste"
+              "name": "creatable",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "creatable"
             },
             {
-              "kind": "method",
-              "name": "onTapDelete"
+              "name": "value",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "value"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "InfiniteScrollable",
+              "package": "@operato/utils/mixins/infinite-scrollable.js"
             },
             {
-              "kind": "method",
-              "name": "onTapSelectAll"
+              "name": "localize(i18next)",
+              "module": "src/selector/ox-board-selector.ts"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "ox-editor-board-selector",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BoardSelector",
+          "declaration": {
+            "name": "BoardSelector",
+            "module": "src/selector/ox-board-selector.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "ox-board-selector",
+          "declaration": {
+            "name": "BoardSelector",
+            "module": "src/selector/ox-board-selector.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/component-toolbar/component-detail.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "ComponentDetail",
+          "members": [
+            {
+              "kind": "field",
+              "name": "template",
+              "type": {
+                "text": "{ about: string } | null"
+              },
+              "default": "null",
+              "attribute": "template"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "template",
+              "type": {
+                "text": "{ about: string } | null"
+              },
+              "default": "null",
+              "fieldName": "template"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "ComponentDetail",
+          "declaration": {
+            "name": "ComponentDetail",
+            "module": "src/modeller/component-toolbar/component-detail.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/component-toolbar/component-menu.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "ComponentMenu",
+          "members": [
+            {
+              "kind": "field",
+              "name": "groups",
+              "type": {
+                "text": "Pallet[]"
+              },
+              "default": "[]",
+              "attribute": "groups"
+            },
+            {
+              "kind": "field",
+              "name": "scene",
+              "type": {
+                "text": "Scene | null"
+              },
+              "default": "null",
+              "attribute": "scene"
+            },
+            {
+              "kind": "field",
+              "name": "group",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "''",
+              "attribute": "group"
+            },
+            {
+              "kind": "field",
+              "name": "templates",
+              "type": {
+                "text": "PalletItem[]"
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "template",
+              "type": {
+                "text": "PalletItem | any"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "detail",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "scopedElements",
+              "static": true,
+              "readonly": true
             },
             {
               "kind": "method",
-              "name": "onTapFontIncrease",
+              "name": "findTemplate",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "type",
                   "type": {
-                    "text": "TouchEvent"
+                    "text": "string | null | undefined"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "onTapFontDecrease",
+              "name": "onHoverComponent",
               "parameters": [
                 {
                   "name": "e",
                   "type": {
-                    "text": "TouchEvent"
+                    "text": "MouseEvent"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "onTapAlign",
+              "name": "onClickTemplate",
               "parameters": [
                 {
                   "name": "e",
                   "type": {
-                    "text": "TouchEvent | string"
+                    "text": "MouseEvent"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "onTapZorder",
+              "name": "templateIcon",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "template",
                   "type": {
-                    "text": "TouchEvent | string"
+                    "text": "PalletItem"
                   }
                 }
               ]
+            }
+          ],
+          "attributes": [
+            {
+              "name": "groups",
+              "type": {
+                "text": "Pallet[]"
+              },
+              "default": "[]",
+              "fieldName": "groups"
             },
             {
-              "kind": "method",
-              "name": "onTapSymmetryX"
+              "name": "scene",
+              "type": {
+                "text": "Scene | null"
+              },
+              "default": "null",
+              "fieldName": "scene"
             },
             {
-              "kind": "method",
-              "name": "onTapSymmetryY"
+              "name": "group",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "''",
+              "fieldName": "group"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "ScopedElementsMixin",
+              "package": "@open-wc/scoped-elements"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "ComponentMenu",
+          "declaration": {
+            "name": "ComponentMenu",
+            "module": "src/modeller/component-toolbar/component-menu.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/component-toolbar/component-toolbar.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "ComponentToolbar",
+          "members": [
+            {
+              "kind": "field",
+              "name": "componentGroupList",
+              "type": {
+                "text": "ComponentGroup[]"
+              },
+              "default": "[]",
+              "attribute": "componentGroupList"
             },
             {
-              "kind": "method",
-              "name": "onTapRotateCW"
+              "kind": "field",
+              "name": "group",
+              "type": {
+                "text": "string | null | undefined"
+              },
+              "attribute": "group"
             },
             {
-              "kind": "method",
-              "name": "onTapRotateCCW"
+              "kind": "field",
+              "name": "scene",
+              "type": {
+                "text": "Scene"
+              },
+              "attribute": "scene"
             },
             {
-              "kind": "method",
-              "name": "onTapGroup"
+              "kind": "field",
+              "name": "mode",
+              "type": {
+                "text": "SCENE_MODE"
+              },
+              "attribute": "mode"
             },
             {
-              "kind": "method",
-              "name": "onTapUngroup"
+              "kind": "field",
+              "name": "shift",
+              "type": {
+                "text": "HTMLImageElement"
+              }
             },
             {
-              "kind": "method",
-              "name": "onTapFullscreen"
+              "kind": "field",
+              "name": "menu",
+              "type": {
+                "text": "HTMLElement"
+              },
+              "privacy": "private"
             },
             {
-              "kind": "method",
-              "name": "onTapToggle"
+              "kind": "field",
+              "name": "componentsContainer",
+              "type": {
+                "text": "HTMLElement"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "groups",
+              "type": {
+                "text": "NodeListOf<HTMLElement>"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "icons",
+              "type": {
+                "text": "{ [name: string]: string }"
+              },
+              "privacy": "private",
+              "default": "{}"
+            },
+            {
+              "kind": "field",
+              "name": "scopedElements",
+              "static": true,
+              "readonly": true
             },
             {
               "kind": "method",
-              "name": "onTapFitScene"
+              "name": "onWheelEvent",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "onTapPreview"
+              "name": "_setMode",
+              "parameters": [
+                {
+                  "name": "mode",
+                  "type": {
+                    "text": "SCENE_MODE"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "onTapDownloadModel"
+              "name": "_onClickShift",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "onTapDistribute",
+              "name": "_onClickGroup",
               "parameters": [
                 {
                   "name": "e",
                   "type": {
-                    "text": "TouchEvent | string"
+                    "text": "MouseEvent"
                   }
                 }
               ]
@@ -2790,53 +3653,47 @@
           ],
           "events": [
             {
-              "name": "modeller-fullscreen",
+              "name": "mode-changed",
               "type": {
                 "text": "CustomEvent"
               }
-            },
+            }
+          ],
+          "attributes": [
             {
-              "name": "hide-property-changed",
+              "name": "componentGroupList",
               "type": {
-                "text": "CustomEvent"
-              }
+                "text": "ComponentGroup[]"
+              },
+              "default": "[]",
+              "fieldName": "componentGroupList"
             },
             {
-              "name": "open-preview",
+              "name": "group",
               "type": {
-                "text": "CustomEvent"
-              }
+                "text": "string | null | undefined"
+              },
+              "fieldName": "group"
             },
-            {
-              "name": "download-model",
-              "type": {
-                "text": "CustomEvent"
-              }
-            }
-          ],
-          "attributes": [
             {
               "name": "scene",
               "type": {
-                "text": "Scene | undefined"
+                "text": "Scene"
               },
               "fieldName": "scene"
             },
             {
-              "name": "selected",
+              "name": "mode",
               "type": {
-                "text": "any[]"
+                "text": "SCENE_MODE"
               },
-              "default": "[]",
-              "fieldName": "selected"
-            },
+              "fieldName": "mode"
+            }
+          ],
+          "mixins": [
             {
-              "name": "hideProperty",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "fieldName": "hideProperty"
+              "name": "ScopedElementsMixin",
+              "package": "@open-wc/scoped-elements"
             }
           ],
           "superclass": {
@@ -2849,10 +3706,44 @@
       "exports": [
         {
           "kind": "js",
-          "name": "EditToolbar",
+          "name": "ComponentToolbar",
+          "declaration": {
+            "name": "ComponentToolbar",
+            "module": "src/modeller/component-toolbar/component-toolbar.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/component-toolbar/mode-icons.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "ICON_EDIT_MODE",
+          "default": "`\n  <svg\n    version=\"1.1\"\n    id=\"Layer_1\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n    x=\"0px\"\n    y=\"0px\"\n    viewBox=\"0 0 30 30\"\n    style=\"enable-background:new 0 0 30 30;\"\n    xml:space=\"preserve\"\n  >\n    <style type=\"text/css\">\n      .st0 {\n        fill: {{strokeColor}};\n      }\n      .st1 {\n        fill: none;\n        stroke: {{strokeColor}};\n        stroke-width: 0.75;\n        stroke-linejoin: round;\n        stroke-miterlimit: 10;\n      }\n    </style>\n    <g>\n      <polygon class=\"st0\" points=\"2.7,3.9 2.7,22.8 7.8,17.2 16.1,16.9 \t\" />\n      <path\n        class=\"st1\"\n        d=\"M27.7,20.1L26.1,19c-0.1,0-0.2,0-0.2,0c0,0.1,0,0.2,0,0.2l1.2,0.9h-4.9v-5l0.9,1.2c0,0,0.1,0.1,0.1,0.1\n      c0,0,0.1,0,0.1,0c0.1,0,0.1-0.1,0-0.2l-1.1-1.6c-0.1-0.1-0.2-0.1-0.2,0L20.8,16c0,0.1,0,0.2,0,0.2s0.2,0,0.2,0l0.9-1.2v5h-5\n      l1.2-0.9c0.1,0,0.1-0.1,0-0.2c0-0.1-0.1-0.1-0.2,0l-1.6,1.1c0,0-0.1,0.1-0.1,0.1c0,0,0,0.1,0.1,0.1l1.6,1.1c0,0,0.1,0,0.1,0\n      c0,0,0.1,0,0.1-0.1c0-0.1,0-0.2,0-0.2l-1.2-0.9h5v5L21,24.2c0-0.1-0.1-0.1-0.2,0c-0.1,0-0.1,0.1,0,0.2l1.1,1.6c0,0,0.1,0.1,0.1,0.1\n      s0.1,0,0.1-0.1l1.1-1.6c0-0.1,0-0.2,0-0.2c-0.1,0-0.2,0-0.2,0l-0.9,1.2v-5h4.9l-1.2,0.9c-0.1,0-0.1,0.1,0,0.2c0,0,0.1,0.1,0.1,0.1\n      c0,0,0.1,0,0.1,0l1.6-1.1c0,0,0.1-0.1,0.1-0.1C27.7,20.2,27.7,20.1,27.7,20.1z\"\n      />\n    </g>\n  </svg>\n`"
+        },
+        {
+          "kind": "variable",
+          "name": "ICON_SHIFT_MODE",
+          "default": "`\n  <svg\n    version=\"1.1\"\n    id=\"Layer_1\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n    x=\"0px\"\n    y=\"0px\"\n    viewBox=\"0 0 30 30\"\n    style=\"enable-background:new 0 0 30 30;\"\n    xml:space=\"preserve\"\n  >\n    <style type=\"text/css\">\n      .st0 {\n        fill-rule: evenodd;\n        clip-rule: evenodd;\n      }\n      .st1 {\n        fill: {{strokeColor}};\n        stroke: {{strokeColor}};\n        stroke-width: 0.75;\n        stroke-linejoin: round;\n        stroke-miterlimit: 10;\n      }\n    </style>\n    <g>\n      <path\n        class=\"st0\"\n        d=\"M7.8,23.2c1.6,0,3.8,0,5.7,0c0.8,0,1.3-0.3,1.6-1.2c0.4-2.9,1.5-4.9,2.4-6.9s1.4-2.5,1.6-3.4\n      c0.1-0.5,0.2-1.6-0.4-1.9c-0.6-0.3-1.2,0.1-1.9,1.3c-0.8,1.6-1,2-1.4,2c-0.3,0-0.1-4,0-5.4c0.1-1.3-0.6-1.8-1.3-1.8\n      c-0.8-0.1-1.5,0.4-1.5,1.5c0,1.5-0.2,5.2-0.7,5.2c-0.4,0-0.3-4.3-0.6-6.7c-0.1-1-0.6-1.8-1.5-1.8C9.1,4.2,8.4,4.7,8.3,5.8\n      c-0.1,1.3,1,6.7,0.5,6.7c-0.4,0-1.4-3.3-2.3-5.1C6,6.5,5.6,6,4.6,6.4C3.9,6.7,3.5,7.6,3.8,8.5c0.5,1.2,2.7,6.8,2.2,6.8\n      c-0.4,0-1.4-1.4-2.7-2.1c-1.1-0.6-1.8-0.4-2.1-0.1c-0.4,0.3-0.7,1,0.9,2.8c0.6,0.6,3.1,2.3,3.7,3.2c0.7,1.3,0.6,1,0.8,2.8\n      C6.7,22.7,7,23.2,7.8,23.2z\"\n      />\n      <path\n        class=\"st1\"\n        d=\"M28.7,20.1L27.1,19c-0.1,0-0.2,0-0.2,0c0,0.1,0,0.2,0,0.2l1.2,0.9h-4.9v-5l0.9,1.2c0,0,0.1,0.1,0.1,0.1\n      c0,0,0.1,0,0.1,0c0.1,0,0.1-0.1,0-0.2l-1.1-1.6c-0.1-0.1-0.2-0.1-0.2,0L21.8,16c0,0.1,0,0.2,0,0.2s0.2,0,0.2,0l0.9-1.2v5h-5\n      l1.2-0.9c0.1,0,0.1-0.1,0-0.2c0-0.1-0.1-0.1-0.2,0l-1.6,1.1c0,0-0.1,0.1-0.1,0.1c0,0,0,0.1,0.1,0.1l1.6,1.1c0,0,0.1,0,0.1,0\n      c0,0,0.1,0,0.1-0.1c0-0.1,0-0.2,0-0.2l-1.2-0.9h5v5L22,24.2c0-0.1-0.1-0.1-0.2,0c-0.1,0-0.1,0.1,0,0.2l1.1,1.6c0,0,0.1,0.1,0.1,0.1\n      s0.1,0,0.1-0.1l1.1-1.6c0-0.1,0-0.2,0-0.2c-0.1,0-0.2,0-0.2,0l-0.9,1.2v-5h4.9l-1.2,0.9c-0.1,0-0.1,0.1,0,0.2c0,0,0.1,0.1,0.1,0.1\n      c0,0,0.1,0,0.1,0l1.6-1.1c0,0,0.1-0.1,0.1-0.1C28.7,20.2,28.7,20.1,28.7,20.1z\"\n      />\n    </g>\n  </svg>\n`"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "ICON_EDIT_MODE",
           "declaration": {
-            "name": "EditToolbar",
-            "module": "src/modeller/edit-toolbar.ts"
+            "name": "ICON_EDIT_MODE",
+            "module": "src/modeller/component-toolbar/mode-icons.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "ICON_SHIFT_MODE",
+          "declaration": {
+            "name": "ICON_SHIFT_MODE",
+            "module": "src/modeller/component-toolbar/mode-icons.ts"
           }
         }
       ]
@@ -3385,1034 +4276,590 @@
               "type": {
                 "text": "String | undefined"
               },
-              "fieldName": "type"
-            },
-            {
-              "name": "text",
-              "type": {
-                "text": "String | undefined"
-              },
-              "fieldName": "text"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "ox-scene-layer",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "OxSceneLayer",
-            "module": "src/modeller/scene-viewer/ox-scene-layer.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "ox-scene-layer",
-          "declaration": {
-            "name": "OxSceneLayer",
-            "module": "src/modeller/scene-viewer/ox-scene-layer.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/modeller/scene-viewer/ox-scene-property.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "OxSceneProperty",
-          "members": [
-            {
-              "kind": "field",
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "attribute": "name"
-            },
-            {
-              "kind": "field",
-              "name": "value",
-              "type": {
-                "text": "string"
-              },
-              "attribute": "value"
-            },
-            {
-              "kind": "field",
-              "name": "type",
-              "type": {
-                "text": "string"
-              },
-              "attribute": "type"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "fieldName": "name"
-            },
-            {
-              "name": "value",
-              "type": {
-                "text": "string"
-              },
-              "fieldName": "value"
-            },
-            {
-              "name": "type",
-              "type": {
-                "text": "string"
-              },
-              "fieldName": "type"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "ox-scene-property",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "OxSceneProperty",
-            "module": "src/modeller/scene-viewer/ox-scene-property.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "ox-scene-property",
-          "declaration": {
-            "name": "OxSceneProperty",
-            "module": "src/modeller/scene-viewer/ox-scene-property.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/modeller/scene-viewer/ox-scene-viewer.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "OxSceneViewer",
-          "members": [
-            {
-              "kind": "field",
-              "name": "scene",
-              "type": {
-                "text": "Scene | null"
-              },
-              "default": "null",
-              "attribute": "scene"
-            },
-            {
-              "kind": "field",
-              "name": "model",
-              "type": {
-                "text": "Model | undefined"
-              },
-              "attribute": "model"
-            },
-            {
-              "kind": "field",
-              "name": "mode",
-              "type": {
-                "text": "SCENE_MODE"
-              },
-              "attribute": "mode"
-            },
-            {
-              "kind": "field",
-              "name": "screenSize",
-              "type": {
-                "text": "number"
-              },
-              "default": "13.3",
-              "attribute": "screenSize"
-            },
-            {
-              "kind": "field",
-              "name": "variables",
-              "type": {
-                "text": "Properties"
-              },
-              "default": "{}",
-              "attribute": "variables"
-            },
-            {
-              "kind": "field",
-              "name": "data",
-              "type": {
-                "text": "any"
-              },
-              "attribute": "data"
-            },
-            {
-              "kind": "field",
-              "name": "themes",
-              "type": {
-                "text": "any | undefined"
-              },
-              "attribute": "themes"
-            },
-            {
-              "kind": "field",
-              "name": "fit",
-              "type": {
-                "text": "FITMODE"
-              },
-              "default": "'none'",
-              "attribute": "fit"
-            },
-            {
-              "kind": "field",
-              "name": "selected",
-              "type": {
-                "text": "Component[]"
-              },
-              "default": "[]",
-              "attribute": "selected"
-            },
-            {
-              "kind": "field",
-              "name": "disposeWhenDetached",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "attribute": "disposeWhenDetached"
-            },
-            {
-              "kind": "field",
-              "name": "baseUrl",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "attribute": "baseUrl"
+              "fieldName": "type"
             },
             {
-              "kind": "field",
-              "name": "provider",
+              "name": "text",
               "type": {
-                "text": "any"
+                "text": "String | undefined"
               },
-              "attribute": "provider"
-            },
+              "fieldName": "text"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "ox-scene-layer",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "OxSceneLayer",
+            "module": "src/modeller/scene-viewer/ox-scene-layer.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "ox-scene-layer",
+          "declaration": {
+            "name": "OxSceneLayer",
+            "module": "src/modeller/scene-viewer/ox-scene-layer.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/scene-viewer/ox-scene-property.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "OxSceneProperty",
+          "members": [
             {
               "kind": "field",
               "name": "name",
               "type": {
                 "text": "string"
               },
-              "default": "'noname'",
               "attribute": "name"
             },
             {
               "kind": "field",
-              "name": "enableInspector",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "true",
-              "attribute": "enableInspector"
-            },
-            {
-              "kind": "field",
-              "name": "showInspector",
+              "name": "value",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "attribute": "showInspector"
+              "attribute": "value"
             },
             {
               "kind": "field",
-              "name": "lastOffsetWidth",
+              "name": "type",
               "type": {
-                "text": "number | undefined"
+                "text": "string"
               },
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "_setScene",
-              "parameters": [
-                {
-                  "name": "scene",
-                  "type": {
-                    "text": "Scene | null"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_setMode",
-              "parameters": [
-                {
-                  "name": "mode",
-                  "type": {
-                    "text": "SCENE_MODE"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_setVariables",
-              "parameters": [
-                {
-                  "name": "variables",
-                  "type": {
-                    "text": "Properties"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_setSelected",
-              "parameters": [
-                {
-                  "name": "selected",
-                  "type": {
-                    "text": "Component[]"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_disposeScene"
-            },
-            {
-              "kind": "method",
-              "name": "resize",
-              "parameters": [
-                {
-                  "name": "force",
-                  "type": {
-                    "text": "boolean"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_onModelChanged",
-              "parameters": [
-                {
-                  "name": "model",
-                  "optional": true,
-                  "type": {
-                    "text": "Model"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_onDisplayChanged",
-              "parameters": [
-                {
-                  "name": "screenSize",
-                  "type": {
-                    "text": "string | number"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_onModeChanged",
-              "parameters": [
-                {
-                  "name": "mode",
-                  "type": {
-                    "text": "SCENE_MODE"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_onDataChanged",
-              "parameters": [
-                {
-                  "name": "data",
-                  "type": {
-                    "text": "any"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_onSelectedChanged",
-              "parameters": [
-                {
-                  "name": "after",
-                  "type": {
-                    "text": "Component[]"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_onSceneModeChanged",
-              "parameters": [
-                {
-                  "name": "after",
-                  "type": {
-                    "text": "SCENE_MODE"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_onBaseUrlChanged",
-              "parameters": [
-                {
-                  "name": "after",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ]
+              "attribute": "type"
             }
           ],
-          "events": [
-            {
-              "name": "scene-changed",
-              "type": {
-                "text": "CustomEvent"
-              }
-            },
+          "attributes": [
             {
-              "name": "mode-changed",
+              "name": "name",
               "type": {
-                "text": "CustomEvent"
-              }
+                "text": "string"
+              },
+              "fieldName": "name"
             },
             {
-              "name": "variables-changed",
+              "name": "value",
               "type": {
-                "text": "CustomEvent"
-              }
+                "text": "string"
+              },
+              "fieldName": "value"
             },
             {
-              "name": "selected-changed",
+              "name": "type",
               "type": {
-                "text": "CustomEvent"
-              }
+                "text": "string"
+              },
+              "fieldName": "type"
             }
           ],
-          "attributes": [
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "ox-scene-property",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "OxSceneProperty",
+            "module": "src/modeller/scene-viewer/ox-scene-property.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "ox-scene-property",
+          "declaration": {
+            "name": "OxSceneProperty",
+            "module": "src/modeller/scene-viewer/ox-scene-property.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/scene-viewer/ox-scene-viewer.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "OxSceneViewer",
+          "members": [
             {
+              "kind": "field",
               "name": "scene",
               "type": {
                 "text": "Scene | null"
               },
               "default": "null",
-              "fieldName": "scene"
+              "attribute": "scene"
             },
             {
+              "kind": "field",
               "name": "model",
               "type": {
                 "text": "Model | undefined"
               },
-              "fieldName": "model"
+              "attribute": "model"
             },
             {
+              "kind": "field",
               "name": "mode",
               "type": {
                 "text": "SCENE_MODE"
               },
-              "fieldName": "mode"
+              "attribute": "mode"
             },
             {
+              "kind": "field",
               "name": "screenSize",
               "type": {
                 "text": "number"
               },
               "default": "13.3",
-              "fieldName": "screenSize"
+              "attribute": "screenSize"
             },
             {
+              "kind": "field",
               "name": "variables",
               "type": {
                 "text": "Properties"
               },
               "default": "{}",
-              "fieldName": "variables"
+              "attribute": "variables"
             },
             {
+              "kind": "field",
               "name": "data",
               "type": {
                 "text": "any"
               },
-              "fieldName": "data"
+              "attribute": "data"
             },
             {
+              "kind": "field",
               "name": "themes",
               "type": {
                 "text": "any | undefined"
               },
-              "fieldName": "themes"
+              "attribute": "themes"
             },
             {
+              "kind": "field",
               "name": "fit",
               "type": {
                 "text": "FITMODE"
               },
               "default": "'none'",
-              "fieldName": "fit"
+              "attribute": "fit"
             },
             {
+              "kind": "field",
               "name": "selected",
               "type": {
                 "text": "Component[]"
               },
               "default": "[]",
-              "fieldName": "selected"
+              "attribute": "selected"
             },
             {
+              "kind": "field",
               "name": "disposeWhenDetached",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "fieldName": "disposeWhenDetached"
+              "attribute": "disposeWhenDetached"
             },
             {
+              "kind": "field",
               "name": "baseUrl",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "fieldName": "baseUrl"
+              "attribute": "baseUrl"
             },
             {
+              "kind": "field",
               "name": "provider",
               "type": {
                 "text": "any"
               },
-              "fieldName": "provider"
+              "attribute": "provider"
             },
             {
+              "kind": "field",
               "name": "name",
               "type": {
                 "text": "string"
               },
               "default": "'noname'",
-              "fieldName": "name"
+              "attribute": "name"
             },
             {
+              "kind": "field",
               "name": "enableInspector",
               "type": {
                 "text": "boolean"
               },
               "default": "true",
-              "fieldName": "enableInspector"
+              "attribute": "enableInspector"
             },
             {
+              "kind": "field",
               "name": "showInspector",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "fieldName": "showInspector"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "ox-scene-viewer",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "OxSceneViewer",
-            "module": "src/modeller/scene-viewer/ox-scene-viewer.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "ox-scene-viewer",
-          "declaration": {
-            "name": "OxSceneViewer",
-            "module": "src/modeller/scene-viewer/ox-scene-viewer.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/modeller/component-toolbar/component-detail.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "ComponentDetail",
-          "members": [
+              "attribute": "showInspector"
+            },
             {
               "kind": "field",
-              "name": "template",
+              "name": "lastOffsetWidth",
               "type": {
-                "text": "{ about: string } | null"
+                "text": "number | undefined"
               },
-              "default": "null",
-              "attribute": "template"
-            }
-          ],
-          "attributes": [
+              "privacy": "private"
+            },
             {
-              "name": "template",
-              "type": {
-                "text": "{ about: string } | null"
-              },
-              "default": "null",
-              "fieldName": "template"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "ComponentDetail",
-          "declaration": {
-            "name": "ComponentDetail",
-            "module": "src/modeller/component-toolbar/component-detail.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/modeller/component-toolbar/component-menu.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "ComponentMenu",
-          "members": [
+              "kind": "method",
+              "name": "_setScene",
+              "parameters": [
+                {
+                  "name": "scene",
+                  "type": {
+                    "text": "Scene | null"
+                  }
+                }
+              ]
+            },
             {
-              "kind": "field",
-              "name": "groups",
-              "type": {
-                "text": "Pallet[]"
-              },
-              "default": "[]",
-              "attribute": "groups"
+              "kind": "method",
+              "name": "_setMode",
+              "parameters": [
+                {
+                  "name": "mode",
+                  "type": {
+                    "text": "SCENE_MODE"
+                  }
+                }
+              ]
             },
             {
-              "kind": "field",
-              "name": "scene",
-              "type": {
-                "text": "Scene | null"
-              },
-              "default": "null",
-              "attribute": "scene"
+              "kind": "method",
+              "name": "_setVariables",
+              "parameters": [
+                {
+                  "name": "variables",
+                  "type": {
+                    "text": "Properties"
+                  }
+                }
+              ]
             },
             {
-              "kind": "field",
-              "name": "group",
-              "type": {
-                "text": "string | null"
-              },
-              "default": "''",
-              "attribute": "group"
+              "kind": "method",
+              "name": "_setSelected",
+              "parameters": [
+                {
+                  "name": "selected",
+                  "type": {
+                    "text": "Component[]"
+                  }
+                }
+              ]
             },
             {
-              "kind": "field",
-              "name": "templates",
-              "type": {
-                "text": "PalletItem[]"
-              },
-              "default": "[]"
+              "kind": "method",
+              "name": "_disposeScene"
             },
             {
-              "kind": "field",
-              "name": "template",
-              "type": {
-                "text": "PalletItem | any"
-              }
+              "kind": "method",
+              "name": "resize",
+              "parameters": [
+                {
+                  "name": "force",
+                  "type": {
+                    "text": "boolean"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_onModelChanged",
+              "parameters": [
+                {
+                  "name": "model",
+                  "optional": true,
+                  "type": {
+                    "text": "Model"
+                  }
+                }
+              ]
             },
             {
-              "kind": "field",
-              "name": "detail",
-              "type": {
-                "text": "HTMLElement"
-              }
+              "kind": "method",
+              "name": "_onDisplayChanged",
+              "parameters": [
+                {
+                  "name": "screenSize",
+                  "type": {
+                    "text": "string | number"
+                  }
+                }
+              ]
             },
             {
-              "kind": "field",
-              "name": "scopedElements",
-              "static": true,
-              "readonly": true
+              "kind": "method",
+              "name": "_onModeChanged",
+              "parameters": [
+                {
+                  "name": "mode",
+                  "type": {
+                    "text": "SCENE_MODE"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "findTemplate",
+              "name": "_onDataChanged",
               "parameters": [
                 {
-                  "name": "type",
+                  "name": "data",
                   "type": {
-                    "text": "string | null | undefined"
+                    "text": "any"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "onHoverComponent",
+              "name": "_onSelectedChanged",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "after",
                   "type": {
-                    "text": "MouseEvent"
+                    "text": "Component[]"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "onClickTemplate",
+              "name": "_onSceneModeChanged",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "after",
                   "type": {
-                    "text": "MouseEvent"
+                    "text": "SCENE_MODE"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "templateIcon",
+              "name": "_onBaseUrlChanged",
               "parameters": [
                 {
-                  "name": "template",
+                  "name": "after",
                   "type": {
-                    "text": "PalletItem"
+                    "text": "string"
                   }
                 }
               ]
             }
           ],
-          "attributes": [
+          "events": [
             {
-              "name": "groups",
+              "name": "scene-changed",
               "type": {
-                "text": "Pallet[]"
-              },
-              "default": "[]",
-              "fieldName": "groups"
+                "text": "CustomEvent"
+              }
             },
             {
-              "name": "scene",
+              "name": "mode-changed",
               "type": {
-                "text": "Scene | null"
-              },
-              "default": "null",
-              "fieldName": "scene"
+                "text": "CustomEvent"
+              }
             },
             {
-              "name": "group",
+              "name": "variables-changed",
               "type": {
-                "text": "string | null"
-              },
-              "default": "''",
-              "fieldName": "group"
-            }
-          ],
-          "mixins": [
+                "text": "CustomEvent"
+              }
+            },
             {
-              "name": "ScopedElementsMixin",
-              "package": "@open-wc/scoped-elements"
+              "name": "selected-changed",
+              "type": {
+                "text": "CustomEvent"
+              }
             }
           ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "ComponentMenu",
-          "declaration": {
-            "name": "ComponentMenu",
-            "module": "src/modeller/component-toolbar/component-menu.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/modeller/component-toolbar/component-toolbar.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "ComponentToolbar",
-          "members": [
-            {
-              "kind": "field",
-              "name": "componentGroupList",
-              "type": {
-                "text": "ComponentGroup[]"
-              },
-              "default": "[]",
-              "attribute": "componentGroupList"
-            },
+          "attributes": [
             {
-              "kind": "field",
-              "name": "group",
+              "name": "scene",
               "type": {
-                "text": "string | null | undefined"
+                "text": "Scene | null"
               },
-              "attribute": "group"
+              "default": "null",
+              "fieldName": "scene"
             },
             {
-              "kind": "field",
-              "name": "scene",
+              "name": "model",
               "type": {
-                "text": "Scene"
+                "text": "Model | undefined"
               },
-              "attribute": "scene"
+              "fieldName": "model"
             },
             {
-              "kind": "field",
               "name": "mode",
               "type": {
                 "text": "SCENE_MODE"
               },
-              "attribute": "mode"
+              "fieldName": "mode"
             },
             {
-              "kind": "field",
-              "name": "shift",
+              "name": "screenSize",
               "type": {
-                "text": "HTMLImageElement"
-              }
+                "text": "number"
+              },
+              "default": "13.3",
+              "fieldName": "screenSize"
             },
             {
-              "kind": "field",
-              "name": "menu",
+              "name": "variables",
               "type": {
-                "text": "HTMLElement"
+                "text": "Properties"
               },
-              "privacy": "private"
+              "default": "{}",
+              "fieldName": "variables"
             },
             {
-              "kind": "field",
-              "name": "componentsContainer",
+              "name": "data",
               "type": {
-                "text": "HTMLElement"
+                "text": "any"
               },
-              "privacy": "private"
+              "fieldName": "data"
             },
             {
-              "kind": "field",
-              "name": "groups",
+              "name": "themes",
               "type": {
-                "text": "NodeListOf<HTMLElement>"
+                "text": "any | undefined"
               },
-              "privacy": "private"
+              "fieldName": "themes"
             },
             {
-              "kind": "field",
-              "name": "icons",
+              "name": "fit",
               "type": {
-                "text": "{ [name: string]: string }"
+                "text": "FITMODE"
               },
-              "privacy": "private",
-              "default": "{}"
-            },
-            {
-              "kind": "field",
-              "name": "scopedElements",
-              "static": true,
-              "readonly": true
-            },
-            {
-              "kind": "method",
-              "name": "onWheelEvent",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_setMode",
-              "parameters": [
-                {
-                  "name": "mode",
-                  "type": {
-                    "text": "SCENE_MODE"
-                  }
-                }
-              ]
+              "default": "'none'",
+              "fieldName": "fit"
             },
             {
-              "kind": "method",
-              "name": "_onClickShift",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "MouseEvent"
-                  }
-                }
-              ]
+              "name": "selected",
+              "type": {
+                "text": "Component[]"
+              },
+              "default": "[]",
+              "fieldName": "selected"
             },
             {
-              "kind": "method",
-              "name": "_onClickGroup",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "MouseEvent"
-                  }
-                }
-              ]
-            }
-          ],
-          "events": [
-            {
-              "name": "mode-changed",
+              "name": "disposeWhenDetached",
               "type": {
-                "text": "CustomEvent"
-              }
-            }
-          ],
-          "attributes": [
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "disposeWhenDetached"
+            },
             {
-              "name": "componentGroupList",
+              "name": "baseUrl",
               "type": {
-                "text": "ComponentGroup[]"
+                "text": "string"
               },
-              "default": "[]",
-              "fieldName": "componentGroupList"
+              "default": "''",
+              "fieldName": "baseUrl"
             },
             {
-              "name": "group",
+              "name": "provider",
               "type": {
-                "text": "string | null | undefined"
+                "text": "any"
               },
-              "fieldName": "group"
+              "fieldName": "provider"
             },
             {
-              "name": "scene",
+              "name": "name",
               "type": {
-                "text": "Scene"
+                "text": "string"
               },
-              "fieldName": "scene"
+              "default": "'noname'",
+              "fieldName": "name"
             },
             {
-              "name": "mode",
+              "name": "enableInspector",
               "type": {
-                "text": "SCENE_MODE"
+                "text": "boolean"
               },
-              "fieldName": "mode"
-            }
-          ],
-          "mixins": [
+              "default": "true",
+              "fieldName": "enableInspector"
+            },
             {
-              "name": "ScopedElementsMixin",
-              "package": "@open-wc/scoped-elements"
+              "name": "showInspector",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "showInspector"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
+          "tagName": "ox-scene-viewer",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "ComponentToolbar",
-          "declaration": {
-            "name": "ComponentToolbar",
-            "module": "src/modeller/component-toolbar/component-toolbar.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/modeller/component-toolbar/mode-icons.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "ICON_EDIT_MODE",
-          "default": "`\n  <svg\n    version=\"1.1\"\n    id=\"Layer_1\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n    x=\"0px\"\n    y=\"0px\"\n    viewBox=\"0 0 30 30\"\n    style=\"enable-background:new 0 0 30 30;\"\n    xml:space=\"preserve\"\n  >\n    <style type=\"text/css\">\n      .st0 {\n        fill: {{strokeColor}};\n      }\n      .st1 {\n        fill: none;\n        stroke: {{strokeColor}};\n        stroke-width: 0.75;\n        stroke-linejoin: round;\n        stroke-miterlimit: 10;\n      }\n    </style>\n    <g>\n      <polygon class=\"st0\" points=\"2.7,3.9 2.7,22.8 7.8,17.2 16.1,16.9 \t\" />\n      <path\n        class=\"st1\"\n        d=\"M27.7,20.1L26.1,19c-0.1,0-0.2,0-0.2,0c0,0.1,0,0.2,0,0.2l1.2,0.9h-4.9v-5l0.9,1.2c0,0,0.1,0.1,0.1,0.1\n      c0,0,0.1,0,0.1,0c0.1,0,0.1-0.1,0-0.2l-1.1-1.6c-0.1-0.1-0.2-0.1-0.2,0L20.8,16c0,0.1,0,0.2,0,0.2s0.2,0,0.2,0l0.9-1.2v5h-5\n      l1.2-0.9c0.1,0,0.1-0.1,0-0.2c0-0.1-0.1-0.1-0.2,0l-1.6,1.1c0,0-0.1,0.1-0.1,0.1c0,0,0,0.1,0.1,0.1l1.6,1.1c0,0,0.1,0,0.1,0\n      c0,0,0.1,0,0.1-0.1c0-0.1,0-0.2,0-0.2l-1.2-0.9h5v5L21,24.2c0-0.1-0.1-0.1-0.2,0c-0.1,0-0.1,0.1,0,0.2l1.1,1.6c0,0,0.1,0.1,0.1,0.1\n      s0.1,0,0.1-0.1l1.1-1.6c0-0.1,0-0.2,0-0.2c-0.1,0-0.2,0-0.2,0l-0.9,1.2v-5h4.9l-1.2,0.9c-0.1,0-0.1,0.1,0,0.2c0,0,0.1,0.1,0.1,0.1\n      c0,0,0.1,0,0.1,0l1.6-1.1c0,0,0.1-0.1,0.1-0.1C27.7,20.2,27.7,20.1,27.7,20.1z\"\n      />\n    </g>\n  </svg>\n`"
-        },
-        {
-          "kind": "variable",
-          "name": "ICON_SHIFT_MODE",
-          "default": "`\n  <svg\n    version=\"1.1\"\n    id=\"Layer_1\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n    x=\"0px\"\n    y=\"0px\"\n    viewBox=\"0 0 30 30\"\n    style=\"enable-background:new 0 0 30 30;\"\n    xml:space=\"preserve\"\n  >\n    <style type=\"text/css\">\n      .st0 {\n        fill-rule: evenodd;\n        clip-rule: evenodd;\n      }\n      .st1 {\n        fill: {{strokeColor}};\n        stroke: {{strokeColor}};\n        stroke-width: 0.75;\n        stroke-linejoin: round;\n        stroke-miterlimit: 10;\n      }\n    </style>\n    <g>\n      <path\n        class=\"st0\"\n        d=\"M7.8,23.2c1.6,0,3.8,0,5.7,0c0.8,0,1.3-0.3,1.6-1.2c0.4-2.9,1.5-4.9,2.4-6.9s1.4-2.5,1.6-3.4\n      c0.1-0.5,0.2-1.6-0.4-1.9c-0.6-0.3-1.2,0.1-1.9,1.3c-0.8,1.6-1,2-1.4,2c-0.3,0-0.1-4,0-5.4c0.1-1.3-0.6-1.8-1.3-1.8\n      c-0.8-0.1-1.5,0.4-1.5,1.5c0,1.5-0.2,5.2-0.7,5.2c-0.4,0-0.3-4.3-0.6-6.7c-0.1-1-0.6-1.8-1.5-1.8C9.1,4.2,8.4,4.7,8.3,5.8\n      c-0.1,1.3,1,6.7,0.5,6.7c-0.4,0-1.4-3.3-2.3-5.1C6,6.5,5.6,6,4.6,6.4C3.9,6.7,3.5,7.6,3.8,8.5c0.5,1.2,2.7,6.8,2.2,6.8\n      c-0.4,0-1.4-1.4-2.7-2.1c-1.1-0.6-1.8-0.4-2.1-0.1c-0.4,0.3-0.7,1,0.9,2.8c0.6,0.6,3.1,2.3,3.7,3.2c0.7,1.3,0.6,1,0.8,2.8\n      C6.7,22.7,7,23.2,7.8,23.2z\"\n      />\n      <path\n        class=\"st1\"\n        d=\"M28.7,20.1L27.1,19c-0.1,0-0.2,0-0.2,0c0,0.1,0,0.2,0,0.2l1.2,0.9h-4.9v-5l0.9,1.2c0,0,0.1,0.1,0.1,0.1\n      c0,0,0.1,0,0.1,0c0.1,0,0.1-0.1,0-0.2l-1.1-1.6c-0.1-0.1-0.2-0.1-0.2,0L21.8,16c0,0.1,0,0.2,0,0.2s0.2,0,0.2,0l0.9-1.2v5h-5\n      l1.2-0.9c0.1,0,0.1-0.1,0-0.2c0-0.1-0.1-0.1-0.2,0l-1.6,1.1c0,0-0.1,0.1-0.1,0.1c0,0,0,0.1,0.1,0.1l1.6,1.1c0,0,0.1,0,0.1,0\n      c0,0,0.1,0,0.1-0.1c0-0.1,0-0.2,0-0.2l-1.2-0.9h5v5L22,24.2c0-0.1-0.1-0.1-0.2,0c-0.1,0-0.1,0.1,0,0.2l1.1,1.6c0,0,0.1,0.1,0.1,0.1\n      s0.1,0,0.1-0.1l1.1-1.6c0-0.1,0-0.2,0-0.2c-0.1,0-0.2,0-0.2,0l-0.9,1.2v-5h4.9l-1.2,0.9c-0.1,0-0.1,0.1,0,0.2c0,0,0.1,0.1,0.1,0.1\n      c0,0,0.1,0,0.1,0l1.6-1.1c0,0,0.1-0.1,0.1-0.1C28.7,20.2,28.7,20.1,28.7,20.1z\"\n      />\n    </g>\n  </svg>\n`"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "ICON_EDIT_MODE",
+          "name": "default",
           "declaration": {
-            "name": "ICON_EDIT_MODE",
-            "module": "src/modeller/component-toolbar/mode-icons.ts"
+            "name": "OxSceneViewer",
+            "module": "src/modeller/scene-viewer/ox-scene-viewer.ts"
           }
         },
         {
-          "kind": "js",
-          "name": "ICON_SHIFT_MODE",
+          "kind": "custom-element-definition",
+          "name": "ox-scene-viewer",
           "declaration": {
-            "name": "ICON_SHIFT_MODE",
-            "module": "src/modeller/component-toolbar/mode-icons.ts"
+            "name": "OxSceneViewer",
+            "module": "src/modeller/scene-viewer/ox-scene-viewer.ts"
           }
         }
       ]
@@ -5845,187 +6292,28 @@
               ]
             },
             {
-              "kind": "method",
-              "name": "_isIdentifiable",
-              "parameters": [
-                {
-                  "name": "selected",
-                  "type": {
-                    "text": "Component[]"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_isClassIdentifiable",
-              "parameters": [
-                {
-                  "name": "selected",
-                  "type": {
-                    "text": "Component[]"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_isLine",
-              "parameters": [
-                {
-                  "name": "selected",
-                  "type": {
-                    "text": "Component[]"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_is3dish",
-              "parameters": [
-                {
-                  "name": "selected",
-                  "type": {
-                    "text": "Component[]"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_getValueFromEventTarget",
-              "parameters": [
-                {
-                  "name": "element",
-                  "type": {
-                    "text": "HTMLElement"
-                  }
-                }
-              ],
-              "inheritedFrom": {
-                "name": "AbstractProperty",
-                "module": "src/modeller/property-sidebar/abstract-property.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "_onAfterValueChange",
-              "parameters": [
-                {
-                  "name": "key",
-                  "type": {
-                    "text": "string"
-                  }
-                },
-                {
-                  "name": "value",
-                  "type": {
-                    "text": "any"
-                  }
-                }
-              ],
-              "inheritedFrom": {
-                "name": "AbstractProperty",
-                "module": "src/modeller/property-sidebar/abstract-property.ts"
-              }
-            }
-          ],
-          "events": [
-            {
-              "name": "bounds-change",
-              "type": {
-                "text": "CustomEvent"
-              }
-            },
-            {
-              "name": "property-change",
-              "type": {
-                "text": "CustomEvent"
-              },
-              "inheritedFrom": {
-                "name": "AbstractProperty",
-                "module": "src/modeller/property-sidebar/abstract-property.ts"
-              }
-            }
-          ],
-          "attributes": [
-            {
-              "name": "value",
-              "type": {
-                "text": "Properties | undefined"
-              },
-              "fieldName": "value"
-            },
-            {
-              "name": "bounds",
-              "type": {
-                "text": "BOUNDS | null"
-              },
-              "default": "null",
-              "fieldName": "bounds"
-            },
-            {
-              "name": "selected",
-              "type": {
-                "text": "Component[]"
-              },
-              "default": "[]",
-              "fieldName": "selected"
-            }
-          ],
-          "superclass": {
-            "name": "AbstractProperty",
-            "module": "/src/modeller/property-sidebar/abstract-property"
-          }
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "PropertyShapes",
-          "declaration": {
-            "name": "PropertyShapes",
-            "module": "src/modeller/property-sidebar/shapes/shapes.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/styles/styles.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "PropertyStyles",
-          "members": [
-            {
-              "kind": "field",
-              "name": "value",
-              "type": {
-                "text": "any"
-              },
-              "default": "{}",
-              "attribute": "value"
-            },
-            {
-              "kind": "field",
-              "name": "selected",
-              "type": {
-                "text": "Component[]"
-              },
-              "default": "[]",
-              "attribute": "selected"
-            },
-            {
-              "kind": "field",
-              "name": "fonts",
-              "type": {
-                "text": "any[]"
-              },
-              "default": "[]",
-              "attribute": "fonts"
+              "kind": "method",
+              "name": "_isIdentifiable",
+              "parameters": [
+                {
+                  "name": "selected",
+                  "type": {
+                    "text": "Component[]"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_isClassIdentifiable",
+              "parameters": [
+                {
+                  "name": "selected",
+                  "type": {
+                    "text": "Component[]"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
@@ -6041,19 +6329,15 @@
             },
             {
               "kind": "method",
-              "name": "_onValueChange",
+              "name": "_is3dish",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "selected",
                   "type": {
-                    "text": "Event"
+                    "text": "Component[]"
                   }
                 }
-              ],
-              "inheritedFrom": {
-                "name": "AbstractProperty",
-                "module": "src/modeller/property-sidebar/abstract-property.ts"
-              }
+              ]
             },
             {
               "kind": "method",
@@ -6094,57 +6378,62 @@
               }
             }
           ],
+          "events": [
+            {
+              "name": "bounds-change",
+              "type": {
+                "text": "CustomEvent"
+              }
+            },
+            {
+              "name": "property-change",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
+            }
+          ],
           "attributes": [
             {
               "name": "value",
               "type": {
-                "text": "any"
+                "text": "Properties | undefined"
               },
-              "default": "{}",
               "fieldName": "value"
             },
             {
-              "name": "selected",
+              "name": "bounds",
               "type": {
-                "text": "Component[]"
+                "text": "BOUNDS | null"
               },
-              "default": "[]",
-              "fieldName": "selected"
+              "default": "null",
+              "fieldName": "bounds"
             },
             {
-              "name": "fonts",
+              "name": "selected",
               "type": {
-                "text": "any[]"
+                "text": "Component[]"
               },
               "default": "[]",
-              "fieldName": "fonts"
+              "fieldName": "selected"
             }
           ],
           "superclass": {
             "name": "AbstractProperty",
-            "module": "/src/modeller/property-sidebar/abstract-property.js"
-          },
-          "events": [
-            {
-              "name": "property-change",
-              "type": {
-                "text": "CustomEvent"
-              },
-              "inheritedFrom": {
-                "name": "AbstractProperty",
-                "module": "src/modeller/property-sidebar/abstract-property.ts"
-              }
-            }
-          ]
+            "module": "/src/modeller/property-sidebar/abstract-property"
+          }
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "PropertyStyles",
+          "name": "PropertyShapes",
           "declaration": {
-            "name": "PropertyStyles",
-            "module": "src/modeller/property-sidebar/styles/styles.ts"
+            "name": "PropertyShapes",
+            "module": "src/modeller/property-sidebar/shapes/shapes.ts"
           }
         }
       ]
@@ -6495,6 +6784,164 @@
           }
         }
       ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/property-sidebar/styles/styles.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "PropertyStyles",
+          "members": [
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "any"
+              },
+              "default": "{}",
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "selected",
+              "type": {
+                "text": "Component[]"
+              },
+              "default": "[]",
+              "attribute": "selected"
+            },
+            {
+              "kind": "field",
+              "name": "fonts",
+              "type": {
+                "text": "any[]"
+              },
+              "default": "[]",
+              "attribute": "fonts"
+            },
+            {
+              "kind": "method",
+              "name": "_isLine",
+              "parameters": [
+                {
+                  "name": "selected",
+                  "type": {
+                    "text": "Component[]"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_onValueChange",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ],
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "_getValueFromEventTarget",
+              "parameters": [
+                {
+                  "name": "element",
+                  "type": {
+                    "text": "HTMLElement"
+                  }
+                }
+              ],
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "_onAfterValueChange",
+              "parameters": [
+                {
+                  "name": "key",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "value",
+                  "type": {
+                    "text": "any"
+                  }
+                }
+              ],
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "any"
+              },
+              "default": "{}",
+              "fieldName": "value"
+            },
+            {
+              "name": "selected",
+              "type": {
+                "text": "Component[]"
+              },
+              "default": "[]",
+              "fieldName": "selected"
+            },
+            {
+              "name": "fonts",
+              "type": {
+                "text": "any[]"
+              },
+              "default": "[]",
+              "fieldName": "fonts"
+            }
+          ],
+          "superclass": {
+            "name": "AbstractProperty",
+            "module": "/src/modeller/property-sidebar/abstract-property.js"
+          },
+          "events": [
+            {
+              "name": "property-change",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "PropertyStyles",
+          "declaration": {
+            "name": "PropertyStyles",
+            "module": "src/modeller/property-sidebar/styles/styles.ts"
+          }
+        }
+      ]
     }
   ]
 }