@fmsim/board 1.0.35 → 1.0.38

package/custom-elements.json

@@ -2,6 +2,91 @@
   "schemaVersion": "1.0.0",
   "readme": "",
   "modules": [
+    {
+      "kind": "javascript-module",
+      "path": "stories/restful-attachment-selector.stories.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "meta",
+          "default": "{ title: 'Components/RestfulAttachmentSelector', component: 'restful-attachment-selector', argTypes: { category: { control: 'select', options: ['', 'audio', 'video', 'image', 'text', 'application'], description: '첨부파일 카테고리' }, creatable: { control: 'boolean', description: '파일 업로드 가능 여부' }, userName: { control: 'text', description: '사용자 이름' } }, parameters: { layout: 'centered' } } satisfies Meta"
+        },
+        {
+          "kind": "variable",
+          "name": "Default",
+          "type": {
+            "text": "Story"
+          },
+          "default": "{ render: args => html` <restful-attachment-selector .category=${args.category} .creatable=${args.creatable} .userName=${args.userName} style=\"width: 800px; height: 600px;\" ></restful-attachment-selector> `, args: { category: '', creatable: true, userName: 'testUser' } }"
+        },
+        {
+          "kind": "variable",
+          "name": "WithCategory",
+          "type": {
+            "text": "Story"
+          },
+          "default": "{ ...Default, args: { ...Default.args, category: 'document' } }"
+        },
+        {
+          "kind": "variable",
+          "name": "ReadOnly",
+          "type": {
+            "text": "Story"
+          },
+          "default": "{ ...Default, args: { ...Default.args, creatable: false } }"
+        },
+        {
+          "kind": "variable",
+          "name": "WithTestData",
+          "type": {
+            "text": "Story"
+          },
+          "default": "{ ...Default, args: { ...Default.args, category: 'document' }, play: async ({ canvasElement }) => { const selector = canvasElement.querySelector('restful-attachment-selector') as RestfulAttachmentSelector if (selector) { // 테스트 데이터 주입 selector.attachments = [ { id: 'test-1', name: 'test1.txt', description: 'Test file 1', mimetype: 'text/plain', encoding: '7bit', category: 'document', path: 'test1.txt', bulk: '27', createdAt: new Date().toISOString(), updatedAt: new Date().toISOString(), creatorId: 'testUser', updaterId: 'testUser', fullpath: 'http://localhost:16060/mcs/lv/images/test1.txt', download: 'http://localhost:16060/mcs/lv/downloadFile/test1.txt' }, { id: 'test-2', name: 'test2.jpg', description: 'Test image', mimetype: 'image/jpeg', encoding: '7bit', category: 'image', path: 'test2.jpg', bulk: '1024', createdAt: new Date().toISOString(), updatedAt: new Date().toISOString(), creatorId: 'testUser', updaterId: 'testUser', fullpath: 'http://localhost:16060/mcs/lv/images/test2.jpg', download: 'http://localhost:16060/mcs/lv/downloadFile/test2.jpg' } ] } } }"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "meta",
+            "module": "stories/restful-attachment-selector.stories.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "Default",
+          "declaration": {
+            "name": "Default",
+            "module": "stories/restful-attachment-selector.stories.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "WithCategory",
+          "declaration": {
+            "name": "WithCategory",
+            "module": "stories/restful-attachment-selector.stories.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "ReadOnly",
+          "declaration": {
+            "name": "ReadOnly",
+            "module": "stories/restful-attachment-selector.stories.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "WithTestData",
+          "declaration": {
+            "name": "WithTestData",
+            "module": "stories/restful-attachment-selector.stories.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/index.ts",
@@ -54,6 +139,14 @@
             "name": "*",
             "package": "./ox-board-list.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./component/index.js"
+          }
         }
       ]
     },
@@ -1619,69 +1712,6 @@
       "declarations": [],
       "exports": []
     },
-    {
-      "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/component/etc.ts",
@@ -1716,7 +1746,23 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./etc"
+            "package": "./restful-attachment-selector.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./etc.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./restful-input-fill-style.js"
           }
         }
       ]
@@ -1743,101 +1789,1128 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/data-storage/data-storage.ts",
+      "path": "src/component/restful-attachment-creation-card.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "DataStorage",
+          "name": "RestfulAttachmentCreationCard",
           "members": [
             {
               "kind": "field",
-              "name": "id",
+              "name": "defaultCategory",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "privacy": "private",
-              "default": "id"
+              "attribute": "defaultCategory"
             },
             {
-              "kind": "method",
-              "name": "load",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "Promise<any>"
-                }
+              "kind": "field",
+              "name": "categories",
+              "type": {
+                "text": "string[]"
+              },
+              "default": "[]",
+              "attribute": "categories"
+            },
+            {
+              "kind": "field",
+              "name": "_files",
+              "type": {
+                "text": "any[]"
+              },
+              "default": "[]",
+              "attribute": "_files"
+            },
+            {
+              "kind": "field",
+              "name": "_currentCategory",
+              "type": {
+                "text": "string | undefined"
               },
+              "attribute": "_currentCategory"
+            },
+            {
+              "kind": "field",
+              "name": "fileId",
+              "type": {
+                "text": "string | undefined"
+              },
+              "attribute": "fileId"
+            },
+            {
+              "kind": "method",
+              "name": "onClickFlip",
               "parameters": [
                 {
-                  "name": "key",
+                  "name": "e",
                   "type": {
-                    "text": "Component"
+                    "text": "Event"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "save",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "Promise<void>"
-                }
-              },
+              "name": "onClickSubmit",
               "parameters": [
                 {
-                  "name": "key",
-                  "type": {
-                    "text": "Component"
-                  }
-                },
-                {
-                  "name": "value",
+                  "name": "e",
                   "type": {
-                    "text": "any"
+                    "text": "Event"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "clear",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "Promise<void>"
-                }
+              "name": "reset"
+            }
+          ],
+          "events": [
+            {
+              "name": "create-attachment",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "defaultCategory",
+              "type": {
+                "text": "string | undefined"
               },
-              "parameters": [
-                {
-                  "name": "key",
-                  "type": {
-                    "text": "Component"
-                  }
-                }
-              ]
+              "fieldName": "defaultCategory"
+            },
+            {
+              "name": "categories",
+              "type": {
+                "text": "string[]"
+              },
+              "default": "[]",
+              "fieldName": "categories"
+            },
+            {
+              "name": "_files",
+              "type": {
+                "text": "any[]"
+              },
+              "default": "[]",
+              "fieldName": "_files"
+            },
+            {
+              "name": "_currentCategory",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "_currentCategory"
+            },
+            {
+              "name": "fileId",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "fileId"
             }
-          ]
+          ],
+          "mixins": [
+            {
+              "name": "localize(i18next)",
+              "module": "src/component/restful-attachment-creation-card.ts"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "restful-attachment-creation-card",
+          "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "DataStorage",
+          "name": "RestfulAttachmentCreationCard",
           "declaration": {
-            "name": "DataStorage",
-            "module": "src/data-storage/data-storage.ts"
+            "name": "RestfulAttachmentCreationCard",
+            "module": "src/component/restful-attachment-creation-card.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "restful-attachment-creation-card",
+          "declaration": {
+            "name": "RestfulAttachmentCreationCard",
+            "module": "src/component/restful-attachment-creation-card.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/layers/mcs-mouse-event-handler.ts",
-      "declarations": [],
-      "exports": []
+      "path": "src/component/restful-attachment-selector.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "RestfulAttachmentSelector",
+          "members": [
+            {
+              "kind": "field",
+              "name": "categories",
+              "type": {
+                "text": "string[]"
+              },
+              "default": "['audio', 'video', 'image', 'text', 'application']",
+              "attribute": "categories"
+            },
+            {
+              "kind": "field",
+              "name": "attachments",
+              "type": {
+                "text": "any[]"
+              },
+              "default": "[]",
+              "attribute": "attachments"
+            },
+            {
+              "kind": "field",
+              "name": "category",
+              "type": {
+                "text": "string | undefined"
+              },
+              "attribute": "category"
+            },
+            {
+              "kind": "field",
+              "name": "_page",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "attribute": "_page"
+            },
+            {
+              "kind": "field",
+              "name": "_total",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "attribute": "_total"
+            },
+            {
+              "kind": "field",
+              "name": "creatable",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "attribute": "creatable"
+            },
+            {
+              "kind": "field",
+              "name": "selectBoxToggle",
+              "type": {
+                "text": "string | null | undefined"
+              },
+              "attribute": "selectBoxToggle"
+            },
+            {
+              "kind": "field",
+              "name": "btnDropBoxIcon",
+              "type": {
+                "text": "string"
+              },
+              "default": "'btn-open-dropbox'",
+              "attribute": "btnDropBoxIcon"
+            },
+            {
+              "kind": "field",
+              "name": "userName",
+              "type": {
+                "text": "string | undefined"
+              },
+              "attribute": "userName"
+            },
+            {
+              "kind": "field",
+              "name": "main",
+              "type": {
+                "text": "HTMLDivElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "creationCard",
+              "type": {
+                "text": "RestfulAttachmentCreationCard"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "toggleSelectBox"
+            },
+            {
+              "kind": "method",
+              "name": "onClickSelect",
+              "parameters": [
+                {
+                  "name": "attachment",
+                  "type": {
+                    "text": "any"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onAttachmentDropped",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onCreateAttachment",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onDeleteAttachment",
+              "parameters": [
+                {
+                  "name": "id",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "refreshAttachments"
+            },
+            {
+              "kind": "method",
+              "name": "appendAttachments"
+            },
+            {
+              "kind": "method",
+              "name": "getAttachments",
+              "parameters": [
+                {
+                  "name": "{ page = 1, limit = 1000 }",
+                  "default": "{}"
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "createAttachments",
+              "parameters": [
+                {
+                  "name": "category",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "files",
+                  "type": {
+                    "text": "any[]"
+                  }
+                },
+                {
+                  "name": "fileId",
+                  "optional": true,
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "deleteAttachment",
+              "parameters": [
+                {
+                  "name": "id",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "copy",
+              "parameters": [
+                {
+                  "name": "copied",
+                  "type": {
+                    "text": "any"
+                  }
+                }
+              ]
+            }
+          ],
+          "events": [
+            {
+              "name": "attachment-selected",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "categories",
+              "type": {
+                "text": "string[]"
+              },
+              "default": "['audio', 'video', 'image', 'text', 'application']",
+              "fieldName": "categories"
+            },
+            {
+              "name": "attachments",
+              "type": {
+                "text": "any[]"
+              },
+              "default": "[]",
+              "fieldName": "attachments"
+            },
+            {
+              "name": "category",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "category"
+            },
+            {
+              "name": "_page",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "fieldName": "_page"
+            },
+            {
+              "name": "_total",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "fieldName": "_total"
+            },
+            {
+              "name": "creatable",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "fieldName": "creatable"
+            },
+            {
+              "name": "selectBoxToggle",
+              "type": {
+                "text": "string | null | undefined"
+              },
+              "fieldName": "selectBoxToggle"
+            },
+            {
+              "name": "btnDropBoxIcon",
+              "type": {
+                "text": "string"
+              },
+              "default": "'btn-open-dropbox'",
+              "fieldName": "btnDropBoxIcon"
+            },
+            {
+              "name": "userName",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "userName"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "localize(i18next)",
+              "module": "src/component/restful-attachment-selector.ts"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "restful-attachment-selector",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "RestfulAttachmentSelector",
+          "declaration": {
+            "name": "RestfulAttachmentSelector",
+            "module": "src/component/restful-attachment-selector.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "restful-attachment-selector",
+          "declaration": {
+            "name": "RestfulAttachmentSelector",
+            "module": "src/component/restful-attachment-selector.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/component/restful-file-selector.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "RestfulFileSelector",
+          "members": [
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'select file'",
+              "attribute": "label"
+            },
+            {
+              "kind": "field",
+              "name": "accept",
+              "type": {
+                "text": "string | undefined"
+              },
+              "attribute": "accept"
+            },
+            {
+              "kind": "field",
+              "name": "showFilename",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "attribute": "show-filename"
+            },
+            {
+              "kind": "field",
+              "name": "multiple",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "multiple"
+            },
+            {
+              "kind": "field",
+              "name": "_files",
+              "type": {
+                "text": "any[]"
+              },
+              "default": "[]",
+              "attribute": "_files"
+            },
+            {
+              "kind": "field",
+              "name": "fileInput",
+              "type": {
+                "text": "HTMLInputElement"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "getUUID"
+            },
+            {
+              "kind": "method",
+              "name": "onFileChange",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "onImageFileChanged",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            }
+          ],
+          "attributes": [
+            {
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'select file'",
+              "fieldName": "label"
+            },
+            {
+              "name": "accept",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "accept"
+            },
+            {
+              "name": "show-filename",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "fieldName": "showFilename"
+            },
+            {
+              "name": "multiple",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "multiple"
+            },
+            {
+              "name": "_files",
+              "type": {
+                "text": "any[]"
+              },
+              "default": "[]",
+              "fieldName": "_files"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "restful-file-selector",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "RestfulFileSelector",
+          "declaration": {
+            "name": "RestfulFileSelector",
+            "module": "src/component/restful-file-selector.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "restful-file-selector",
+          "declaration": {
+            "name": "RestfulFileSelector",
+            "module": "src/component/restful-file-selector.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/component/restful-input-attachment-selector.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "RestfulInputAttachmentSelector",
+          "members": [
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "popup",
+              "type": {
+                "text": "PopupHandle | undefined"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "getIconByCategory"
+            },
+            {
+              "kind": "method",
+              "name": "_onInputChanged",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "openSelector"
+            }
+          ],
+          "events": [
+            {
+              "name": "change",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "fieldName": "value"
+            },
+            {
+              "name": "properties",
+              "type": {
+                "text": "any"
+              },
+              "fieldName": "properties"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "restful-input-attachment-selector",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "RestfulInputAttachmentSelector",
+          "declaration": {
+            "name": "RestfulInputAttachmentSelector",
+            "module": "src/component/restful-input-attachment-selector.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "restful-input-attachment-selector",
+          "declaration": {
+            "name": "RestfulInputAttachmentSelector",
+            "module": "src/component/restful-input-attachment-selector.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/component/restful-input-fill-style.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "RestfulInputColorStyle",
+          "members": [
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "FillStyle | undefined"
+              },
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "fillType",
+              "type": {
+                "text": "string | undefined"
+              },
+              "attribute": "fillType"
+            },
+            {
+              "kind": "field",
+              "name": "solid",
+              "type": {
+                "text": "string | undefined"
+              },
+              "attribute": "solid"
+            },
+            {
+              "kind": "field",
+              "name": "gradient",
+              "type": {
+                "text": "GradientOption | undefined"
+              },
+              "attribute": "gradient"
+            },
+            {
+              "kind": "field",
+              "name": "pattern",
+              "type": {
+                "text": "BackgroundPatternOption | undefined"
+              },
+              "attribute": "pattern"
+            },
+            {
+              "kind": "field",
+              "name": "colorOnly",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "color-only"
+            },
+            {
+              "kind": "field",
+              "name": "_block_reset",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false"
+            },
+            {
+              "kind": "method",
+              "name": "_onChangedValue",
+              "parameters": [
+                {
+                  "name": "value",
+                  "type": {
+                    "text": "FillStyle"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_onChangedFillType",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_onChangedSolid",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_onChandedGradient",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_onChangedPattern",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            }
+          ],
+          "events": [
+            {
+              "name": "change",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "FillStyle | undefined"
+              },
+              "fieldName": "value"
+            },
+            {
+              "name": "fillType",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "fillType"
+            },
+            {
+              "name": "solid",
+              "type": {
+                "text": "string | undefined"
+              },
+              "fieldName": "solid"
+            },
+            {
+              "name": "gradient",
+              "type": {
+                "text": "GradientOption | undefined"
+              },
+              "fieldName": "gradient"
+            },
+            {
+              "name": "pattern",
+              "type": {
+                "text": "BackgroundPatternOption | undefined"
+              },
+              "fieldName": "pattern"
+            },
+            {
+              "name": "color-only",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "colorOnly"
+            }
+          ],
+          "superclass": {
+            "name": "OxFormField",
+            "package": "@operato/input"
+          },
+          "tagName": "restful-input-fill-style",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "RestfulInputColorStyle",
+          "declaration": {
+            "name": "RestfulInputColorStyle",
+            "module": "src/component/restful-input-fill-style.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "restful-input-fill-style",
+          "declaration": {
+            "name": "RestfulInputColorStyle",
+            "module": "src/component/restful-input-fill-style.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/component/restrul-input-background-pattern.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "컴포넌트의 fill pattern을 편집하는 element\n\nExample:\n <restful-input-background-pattern",
+          "name": "RestfulInputBackgroundPattern",
+          "members": [
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "BackgroundPatternOption | undefined"
+              },
+              "attribute": "value"
+            },
+            {
+              "kind": "method",
+              "name": "_onChange",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            }
+          ],
+          "events": [
+            {
+              "name": "change",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "BackgroundPatternOption | undefined"
+              },
+              "fieldName": "value"
+            }
+          ],
+          "superclass": {
+            "name": "OxFormField",
+            "package": "@operato/input"
+          },
+          "tagName": "restful-input-background-pattern",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "RestfulInputBackgroundPattern",
+          "declaration": {
+            "name": "RestfulInputBackgroundPattern",
+            "module": "src/component/restrul-input-background-pattern.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "restful-input-background-pattern",
+          "declaration": {
+            "name": "RestfulInputBackgroundPattern",
+            "module": "src/component/restrul-input-background-pattern.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/data-storage/data-storage.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "DataStorage",
+          "members": [
+            {
+              "kind": "field",
+              "name": "id",
+              "type": {
+                "text": "string"
+              },
+              "privacy": "private",
+              "default": "id"
+            },
+            {
+              "kind": "method",
+              "name": "load",
+              "privacy": "public",
+              "return": {
+                "type": {
+                  "text": "Promise<any>"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "key",
+                  "type": {
+                    "text": "Component"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "save",
+              "privacy": "public",
+              "return": {
+                "type": {
+                  "text": "Promise<void>"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "key",
+                  "type": {
+                    "text": "Component"
+                  }
+                },
+                {
+                  "name": "value",
+                  "type": {
+                    "text": "any"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "clear",
+              "privacy": "public",
+              "return": {
+                "type": {
+                  "text": "Promise<void>"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "key",
+                  "type": {
+                    "text": "Component"
+                  }
+                }
+              ]
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "DataStorage",
+          "declaration": {
+            "name": "DataStorage",
+            "module": "src/data-storage/data-storage.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/layers/mcs-mouse-event-handler.ts",
+      "declarations": [],
+      "exports": []
     },
     {
       "kind": "javascript-module",
@@ -4650,331 +5723,78 @@
               "fieldName": "name"
             },
             {
-              "name": "enableInspector",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "true",
-              "fieldName": "enableInspector"
-            },
-            {
-              "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/property-sidebar/data-binding/data-binding-mapper.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "element for mapping data value editing\n\nExample:\n\n<data-binding-mapper mapping=${mapping}>\n</data-binding-mapper>",
-          "name": "DataBindingMapper",
-          "members": [
-            {
-              "kind": "field",
-              "name": "mapping",
-              "type": {
-                "text": "Mapping"
-              },
-              "default": "{ rule: 'value' }",
-              "attribute": "mapping"
-            },
-            {
-              "kind": "field",
-              "name": "rule",
-              "type": {
-                "text": "Rule"
-              },
-              "default": "{}",
-              "attribute": "rule"
-            },
-            {
-              "kind": "field",
-              "name": "scene",
-              "type": {
-                "text": "Scene | undefined"
-              },
-              "attribute": "scene"
-            },
-            {
-              "kind": "field",
-              "name": "_valueTypes",
-              "type": {
-                "text": "any"
-              },
-              "default": "{ play: 'boolean', hidden: 'boolean', started: 'boolean', rotation: 'number', value: 'number', fillStyle: 'color', strokeStyle: 'color', fontColor: 'color', data: 'object', source: 'attachment', location: 'object', dimension: 'object', text: 'string', ref: 'string' }"
-            },
-            {
-              "kind": "field",
-              "name": "_componentIds",
-              "type": {
-                "text": "{ value: string; description: string }[]"
-              },
-              "default": "[]"
-            },
-            {
-              "kind": "field",
-              "name": "editor",
-              "type": {
-                "text": "HTMLInputElement"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "target",
-              "type": {
-                "text": "HTMLInputElement"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "_valuetype",
-              "parameters": [
-                {
-                  "name": "property",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "field",
-              "name": "_keep_saved_rule_params",
-              "type": {
-                "text": "boolean"
-              },
-              "privacy": "private",
-              "default": "false"
-            },
-            {
-              "kind": "method",
-              "name": "_onChangedMapping"
-            },
-            {
-              "kind": "method",
-              "name": "_onChangeRule",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_onChange",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
-            }
-          ],
-          "events": [
-            {
-              "name": "value-change",
-              "type": {
-                "text": "CustomEvent"
-              }
-            }
-          ],
-          "attributes": [
-            {
-              "name": "mapping",
-              "type": {
-                "text": "Mapping"
-              },
-              "default": "{ rule: 'value' }",
-              "fieldName": "mapping"
-            },
-            {
-              "name": "rule",
-              "type": {
-                "text": "Rule"
-              },
-              "default": "{}",
-              "fieldName": "rule"
-            },
-            {
-              "name": "properties",
-              "type": {
-                "text": "Properties[]"
-              },
-              "default": "[]",
-              "fieldName": "properties"
-            },
-            {
-              "name": "scene",
-              "type": {
-                "text": "Scene | undefined"
-              },
-              "fieldName": "scene"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "DataBindingMapper",
-          "declaration": {
-            "name": "DataBindingMapper",
-            "module": "src/modeller/property-sidebar/data-binding/data-binding-mapper.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/data-binding/data-binding-value-map.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "DataBindingValueMap",
-          "members": [
-            {
-              "kind": "method",
-              "name": "valueInputTemplate",
-              "parameters": [
-                {
-                  "name": "value",
-                  "optional": true,
-                  "type": {
-                    "text": "any"
-                  }
-                }
-              ]
+              "name": "enableInspector",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "true",
+              "fieldName": "enableInspector"
+            },
+            {
+              "name": "showInspector",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "showInspector"
             }
           ],
           "superclass": {
-            "name": "OxInputValueMap",
-            "package": "@operato/input"
+            "name": "LitElement",
+            "package": "lit"
           },
-          "tagName": "data-binding-value-map",
+          "tagName": "ox-scene-viewer",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "DataBindingValueMap",
+          "name": "default",
           "declaration": {
-            "name": "DataBindingValueMap",
-            "module": "src/modeller/property-sidebar/data-binding/data-binding-value-map.ts"
+            "name": "OxSceneViewer",
+            "module": "src/modeller/scene-viewer/ox-scene-viewer.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "data-binding-value-map",
+          "name": "ox-scene-viewer",
           "declaration": {
-            "name": "DataBindingValueMap",
-            "module": "src/modeller/property-sidebar/data-binding/data-binding-value-map.ts"
+            "name": "OxSceneViewer",
+            "module": "src/modeller/scene-viewer/ox-scene-viewer.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/data-binding/data-binding-value-range.ts",
+      "path": "src/modeller/property-sidebar/effects/effects-shared-style.ts",
       "declarations": [
         {
-          "kind": "class",
-          "description": "",
-          "name": "DataBindingValueRange",
-          "members": [
-            {
-              "kind": "method",
-              "name": "valueInputTemplate",
-              "parameters": [
-                {
-                  "name": "value",
-                  "optional": true,
-                  "type": {
-                    "text": "any"
-                  }
-                }
-              ]
-            }
-          ],
-          "superclass": {
-            "name": "OxInputValueRange",
-            "package": "@operato/input"
-          },
-          "tagName": "data-binding-value-range",
-          "customElement": true
+          "kind": "variable",
+          "name": "EffectsSharedStyle",
+          "default": "css` :host { display: grid; grid-template-columns: repeat(10, 1fr); grid-gap: 5px; grid-auto-rows: minmax(24px, auto); align-items: center; } * { align-self: stretch; } label { grid-column: span 3; text-align: right; text-transform: capitalize; align-self: center; } input, select, ox-input-angle, ox-input-color, [custom-editor] { grid-column: span 7; } input, select, ox-input-angle input, ox-input-color input, [custom-editor] input { border: var(--property-sidebar-fieldset-border); } ox-input-data { height: 300px; } input[type='checkbox'] { grid-column: 4 / 5; align-self: center; } label.checkbox-label { grid-column: span 6; text-align: left; } [fullwidth] { grid-column: 1 / -1; } `"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "DataBindingValueRange",
-          "declaration": {
-            "name": "DataBindingValueRange",
-            "module": "src/modeller/property-sidebar/data-binding/data-binding-value-range.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "data-binding-value-range",
+          "name": "EffectsSharedStyle",
           "declaration": {
-            "name": "DataBindingValueRange",
-            "module": "src/modeller/property-sidebar/data-binding/data-binding-value-range.ts"
+            "name": "EffectsSharedStyle",
+            "module": "src/modeller/property-sidebar/effects/effects-shared-style.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/data-binding/data-binding.ts",
+      "path": "src/modeller/property-sidebar/effects/effects.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "PropertyDataBinding",
+          "name": "PropertyEffects",
           "members": [
             {
               "kind": "field",
@@ -4994,52 +5814,12 @@
             },
             {
               "kind": "field",
-              "name": "mappingIndex",
-              "type": {
-                "text": "number"
-              },
-              "default": "0"
-            },
-            {
-              "kind": "field",
-              "name": "_afterRender",
-              "type": {
-                "text": "Function | null | undefined"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "_dataExpanded",
+              "name": "selected",
               "type": {
-                "text": "boolean"
+                "text": "Component[]"
               },
-              "default": "true"
-            },
-            {
-              "kind": "field",
-              "name": "tabs",
-              "type": {
-                "text": "HTMLElement"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "tabNavLeftButton",
-              "type": {
-                "text": "HTMLElement"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "tabNavRightButton",
-              "type": {
-                "text": "HTMLElement"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "mappings",
-              "readonly": true
+              "default": "[]",
+              "attribute": "selected"
             },
             {
               "kind": "field",
@@ -5049,40 +5829,28 @@
             },
             {
               "kind": "method",
-              "name": "_setMappingIndex",
+              "name": "_onValueChange",
               "parameters": [
                 {
-                  "name": "idx",
+                  "name": "e",
                   "type": {
-                    "text": "number"
+                    "text": "Event"
                   }
                 }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_clearDataBindingMapper"
-            },
-            {
-              "kind": "method",
-              "name": "_copyDataBindingMapper"
-            },
-            {
-              "kind": "method",
-              "name": "_pasteDataBindingMapper"
-            },
-            {
-              "kind": "method",
-              "name": "_onValueChanged"
+              ],
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
             },
             {
               "kind": "method",
-              "name": "_onValueChange",
+              "name": "_getValueFromEventTarget",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "element",
                   "type": {
-                    "text": "Event"
+                    "text": "HTMLElement"
                   }
                 }
               ],
@@ -5091,83 +5859,160 @@
                 "module": "src/modeller/property-sidebar/abstract-property.ts"
               }
             },
-            {
-              "kind": "field",
-              "name": "tabContainer",
-              "readonly": true
-            },
             {
               "kind": "method",
-              "name": "_onMappingChanged",
+              "name": "_onAfterValueChange",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "key",
                   "type": {
-                    "text": "CustomEvent"
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "value",
+                  "type": {
+                    "text": "any"
                   }
                 }
-              ]
+              ],
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "Properties | undefined"
+              },
+              "fieldName": "value"
             },
             {
-              "kind": "method",
-              "name": "_onTabScroll"
+              "name": "scene",
+              "type": {
+                "text": "Scene | undefined"
+              },
+              "fieldName": "scene"
             },
             {
-              "kind": "method",
-              "name": "_onTabScrollNavLeft"
+              "name": "selected",
+              "type": {
+                "text": "Component[]"
+              },
+              "default": "[]",
+              "fieldName": "selected"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "ScopedElementsMixin",
+              "package": "@open-wc/scoped-elements"
+            }
+          ],
+          "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": "PropertyEffects",
+          "declaration": {
+            "name": "PropertyEffects",
+            "module": "src/modeller/property-sidebar/effects/effects.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/property-sidebar/effects/property-event-hover.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "PropertyEventHover",
+          "members": [
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "Properties | undefined"
+              },
+              "attribute": "value"
             },
             {
-              "kind": "method",
-              "name": "_onTabScrollNavRight"
+              "kind": "field",
+              "name": "scene",
+              "type": {
+                "text": "Scene | undefined"
+              },
+              "attribute": "scene"
             },
             {
               "kind": "method",
-              "name": "_getValueFromEventTarget",
+              "name": "_getPlaceHoder",
               "parameters": [
                 {
-                  "name": "element",
+                  "name": "action",
                   "type": {
-                    "text": "HTMLElement"
+                    "text": "string"
                   }
                 }
-              ],
-              "inheritedFrom": {
-                "name": "AbstractProperty",
-                "module": "src/modeller/property-sidebar/abstract-property.ts"
-              }
+              ]
             },
             {
               "kind": "method",
-              "name": "_onAfterValueChange",
+              "name": "_getTargetList",
+              "return": {
+                "type": {
+                  "text": "{ value: string; description: string }[]"
+                }
+              },
               "parameters": [
                 {
-                  "name": "key",
+                  "name": "action",
                   "type": {
                     "text": "string"
                   }
-                },
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_onValueChange",
+              "parameters": [
                 {
-                  "name": "value",
+                  "name": "e",
                   "type": {
-                    "text": "any"
+                    "text": "Event"
                   }
                 }
-              ],
-              "inheritedFrom": {
-                "name": "AbstractProperty",
-                "module": "src/modeller/property-sidebar/abstract-property.ts"
-              }
+              ]
             }
           ],
           "events": [
             {
-              "name": "property-change",
+              "name": "change",
               "type": {
                 "text": "CustomEvent"
-              },
-              "inheritedFrom": {
-                "name": "AbstractProperty",
-                "module": "src/modeller/property-sidebar/abstract-property.ts"
               }
             }
           ],
@@ -5187,58 +6032,132 @@
               "fieldName": "scene"
             }
           ],
-          "mixins": [
-            {
-              "name": "ScopedElementsMixin",
-              "package": "@open-wc/scoped-elements"
-            }
-          ],
           "superclass": {
-            "name": "AbstractProperty",
-            "module": "/src/modeller/property-sidebar/abstract-property.js"
-          }
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "PropertyDataBinding",
+          "name": "PropertyEventHover",
           "declaration": {
-            "name": "PropertyDataBinding",
-            "module": "src/modeller/property-sidebar/data-binding/data-binding.ts"
+            "name": "PropertyEventHover",
+            "module": "src/modeller/property-sidebar/effects/property-event-hover.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/effects/effects-shared-style.ts",
+      "path": "src/modeller/property-sidebar/effects/property-event-tap.ts",
       "declarations": [
         {
-          "kind": "variable",
-          "name": "EffectsSharedStyle",
-          "default": "css` :host { display: grid; grid-template-columns: repeat(10, 1fr); grid-gap: 5px; grid-auto-rows: minmax(24px, auto); align-items: center; } * { align-self: stretch; } label { grid-column: span 3; text-align: right; text-transform: capitalize; align-self: center; } input, select, ox-input-angle, ox-input-color, [custom-editor] { grid-column: span 7; } input, select, ox-input-angle input, ox-input-color input, [custom-editor] input { border: var(--property-sidebar-fieldset-border); } ox-input-data { height: 300px; } input[type='checkbox'] { grid-column: 4 / 5; align-self: center; } label.checkbox-label { grid-column: span 6; text-align: left; } [fullwidth] { grid-column: 1 / -1; } `"
+          "kind": "class",
+          "description": "",
+          "name": "PropertyEventTap",
+          "members": [
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "Properties | undefined"
+              },
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "scene",
+              "type": {
+                "text": "Scene | undefined"
+              },
+              "attribute": "scene"
+            },
+            {
+              "kind": "field",
+              "name": "targetList",
+              "type": {
+                "text": "{ value: string; description: string }[]"
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "method",
+              "name": "_getPlaceHoder",
+              "parameters": [
+                {
+                  "name": "action",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_onValueChange",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            }
+          ],
+          "events": [
+            {
+              "name": "change",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "Properties | undefined"
+              },
+              "fieldName": "value"
+            },
+            {
+              "name": "scene",
+              "type": {
+                "text": "Scene | undefined"
+              },
+              "fieldName": "scene"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "EffectsSharedStyle",
+          "name": "PropertyEventTap",
           "declaration": {
-            "name": "EffectsSharedStyle",
-            "module": "src/modeller/property-sidebar/effects/effects-shared-style.ts"
+            "name": "PropertyEventTap",
+            "module": "src/modeller/property-sidebar/effects/property-event-tap.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/effects/effects.ts",
+      "path": "src/modeller/property-sidebar/effects/property-event.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "PropertyEffects",
+          "name": "PropertyEvent",
           "members": [
             {
               "kind": "field",
@@ -5256,15 +6175,6 @@
               },
               "attribute": "scene"
             },
-            {
-              "kind": "field",
-              "name": "selected",
-              "type": {
-                "text": "Component[]"
-              },
-              "default": "[]",
-              "attribute": "selected"
-            },
             {
               "kind": "field",
               "name": "scopedElements",
@@ -5281,48 +6191,14 @@
                     "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"
-              }
-            },
+              ]
+            }
+          ],
+          "events": [
             {
-              "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"
+              "name": "change",
+              "type": {
+                "text": "CustomEvent"
               }
             }
           ],
@@ -5340,14 +6216,6 @@
                 "text": "Scene | undefined"
               },
               "fieldName": "scene"
-            },
-            {
-              "name": "selected",
-              "type": {
-                "text": "Component[]"
-              },
-              "default": "[]",
-              "fieldName": "selected"
             }
           ],
           "mixins": [
@@ -5357,42 +6225,31 @@
             }
           ],
           "superclass": {
-            "name": "AbstractProperty",
-            "module": "/src/modeller/property-sidebar/abstract-property.js"
+            "name": "LitElement",
+            "package": "lit"
           },
-          "events": [
-            {
-              "name": "property-change",
-              "type": {
-                "text": "CustomEvent"
-              },
-              "inheritedFrom": {
-                "name": "AbstractProperty",
-                "module": "src/modeller/property-sidebar/abstract-property.ts"
-              }
-            }
-          ]
+          "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "PropertyEffects",
+          "name": "PropertyEvent",
           "declaration": {
-            "name": "PropertyEffects",
-            "module": "src/modeller/property-sidebar/effects/effects.ts"
+            "name": "PropertyEvent",
+            "module": "src/modeller/property-sidebar/effects/property-event.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/effects/property-event-hover.ts",
+      "path": "src/modeller/property-sidebar/effects/property-shadow.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "",
-          "name": "PropertyEventHover",
+          "description": "컴포넌트의 그림자 속성을 편집하는 element\n\nExample:\n <property-shadow",
+          "name": "PropertyShadow",
           "members": [
             {
               "kind": "field",
@@ -5402,43 +6259,6 @@
               },
               "attribute": "value"
             },
-            {
-              "kind": "field",
-              "name": "scene",
-              "type": {
-                "text": "Scene | undefined"
-              },
-              "attribute": "scene"
-            },
-            {
-              "kind": "method",
-              "name": "_getPlaceHoder",
-              "parameters": [
-                {
-                  "name": "action",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_getTargetList",
-              "return": {
-                "type": {
-                  "text": "{ value: string; description: string }[]"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "action",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ]
-            },
             {
               "kind": "method",
               "name": "_onValueChange",
@@ -5467,13 +6287,6 @@
                 "text": "Properties | undefined"
               },
               "fieldName": "value"
-            },
-            {
-              "name": "scene",
-              "type": {
-                "text": "Scene | undefined"
-              },
-              "fieldName": "scene"
             }
           ],
           "superclass": {
@@ -5486,88 +6299,256 @@
       "exports": [
         {
           "kind": "js",
-          "name": "PropertyEventHover",
+          "name": "PropertyShadow",
           "declaration": {
-            "name": "PropertyEventHover",
-            "module": "src/modeller/property-sidebar/effects/property-event-hover.ts"
+            "name": "PropertyShadow",
+            "module": "src/modeller/property-sidebar/effects/property-shadow.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/effects/property-event-tap.ts",
+      "path": "src/modeller/property-sidebar/effects/value-converter.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "convert",
+          "parameters": [
+            {
+              "name": "element",
+              "type": {
+                "text": "any"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "convert",
+          "declaration": {
+            "name": "convert",
+            "module": "src/modeller/property-sidebar/effects/value-converter.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/modeller/property-sidebar/inspector/inspector.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "PropertyEventTap",
+          "name": "SceneInspector",
           "members": [
             {
               "kind": "field",
-              "name": "value",
+              "name": "scene",
               "type": {
-                "text": "Properties | undefined"
+                "text": "Scene | undefined"
               },
-              "attribute": "value"
+              "attribute": "scene"
             },
             {
               "kind": "field",
-              "name": "scene",
+              "name": "searchText",
               "type": {
-                "text": "Scene | undefined"
+                "text": "string"
               },
-              "attribute": "scene"
+              "privacy": "private",
+              "default": "''"
             },
             {
               "kind": "field",
-              "name": "targetList",
+              "name": "_extendedMap",
               "type": {
-                "text": "{ value: string; description: string }[]"
+                "text": "any"
               },
-              "default": "[]"
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "show",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false"
+            },
+            {
+              "kind": "field",
+              "name": "count",
+              "type": {
+                "text": "number"
+              },
+              "privacy": "private",
+              "default": "-1"
             },
             {
               "kind": "method",
-              "name": "_getPlaceHoder",
+              "name": "disconnectScene",
+              "parameters": [
+                {
+                  "name": "scene",
+                  "optional": true,
+                  "type": {
+                    "text": "Scene"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "refresh"
+            },
+            {
+              "kind": "method",
+              "name": "_onclick",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_ondblclick",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "extendedMap",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "getNodeHandleClass",
+              "parameters": [
+                {
+                  "name": "component",
+                  "type": {
+                    "text": "Component"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "isExtended",
+              "parameters": [
+                {
+                  "name": "component",
+                  "type": {
+                    "text": "Component"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "toggleExtended",
+              "parameters": [
+                {
+                  "name": "component",
+                  "type": {
+                    "text": "Component"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "toggleHidden",
+              "parameters": [
+                {
+                  "name": "component",
+                  "type": {
+                    "text": "Component"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "selectComponent",
+              "parameters": [
+                {
+                  "name": "component",
+                  "type": {
+                    "text": "Component"
+                  }
+                },
+                {
+                  "name": "append",
+                  "default": "false",
+                  "type": {
+                    "text": "boolean"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "shouldBeShown",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
               "parameters": [
                 {
-                  "name": "action",
+                  "name": "component",
+                  "type": {
+                    "text": "Component"
+                  }
+                },
+                {
+                  "name": "counting",
+                  "default": "false",
                   "type": {
-                    "text": "string"
+                    "text": "boolean"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "_onValueChange",
+              "name": "renderComponent",
+              "return": {
+                "type": {
+                  "text": "TemplateResult"
+                }
+              },
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "component",
                   "type": {
-                    "text": "Event"
+                    "text": "Component"
+                  }
+                },
+                {
+                  "name": "depth",
+                  "type": {
+                    "text": "number"
                   }
                 }
               ]
             }
           ],
-          "events": [
-            {
-              "name": "change",
-              "type": {
-                "text": "CustomEvent"
-              }
-            }
-          ],
           "attributes": [
-            {
-              "name": "value",
-              "type": {
-                "text": "Properties | undefined"
-              },
-              "fieldName": "value"
-            },
             {
               "name": "scene",
               "type": {
@@ -5586,30 +6567,40 @@
       "exports": [
         {
           "kind": "js",
-          "name": "PropertyEventTap",
+          "name": "SceneInspector",
           "declaration": {
-            "name": "PropertyEventTap",
-            "module": "src/modeller/property-sidebar/effects/property-event-tap.ts"
+            "name": "SceneInspector",
+            "module": "src/modeller/property-sidebar/inspector/inspector.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/effects/property-event.ts",
+      "path": "src/modeller/property-sidebar/data-binding/data-binding-mapper.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "",
-          "name": "PropertyEvent",
+          "description": "element for mapping data value editing\n\nExample:\n\n<data-binding-mapper mapping=${mapping}>\n</data-binding-mapper>",
+          "name": "DataBindingMapper",
           "members": [
             {
               "kind": "field",
-              "name": "value",
+              "name": "mapping",
               "type": {
-                "text": "Properties | undefined"
+                "text": "Mapping"
               },
-              "attribute": "value"
+              "default": "{ rule: 'value' }",
+              "attribute": "mapping"
+            },
+            {
+              "kind": "field",
+              "name": "rule",
+              "type": {
+                "text": "Rule"
+              },
+              "default": "{}",
+              "attribute": "rule"
             },
             {
               "kind": "field",
@@ -5621,13 +6612,74 @@
             },
             {
               "kind": "field",
-              "name": "scopedElements",
-              "static": true,
-              "readonly": true
+              "name": "_valueTypes",
+              "type": {
+                "text": "any"
+              },
+              "default": "{ play: 'boolean', hidden: 'boolean', started: 'boolean', rotation: 'number', value: 'number', fillStyle: 'color', strokeStyle: 'color', fontColor: 'color', data: 'object', source: 'attachment', location: 'object', dimension: 'object', text: 'string', ref: 'string' }"
+            },
+            {
+              "kind": "field",
+              "name": "_componentIds",
+              "type": {
+                "text": "{ value: string; description: string }[]"
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "editor",
+              "type": {
+                "text": "HTMLInputElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "target",
+              "type": {
+                "text": "HTMLInputElement"
+              }
             },
             {
               "kind": "method",
-              "name": "_onValueChange",
+              "name": "_valuetype",
+              "parameters": [
+                {
+                  "name": "property",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "_keep_saved_rule_params",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false"
+            },
+            {
+              "kind": "method",
+              "name": "_onChangedMapping"
+            },
+            {
+              "kind": "method",
+              "name": "_onChangeRule",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_onChange",
               "parameters": [
                 {
                   "name": "e",
@@ -5640,7 +6692,7 @@
           ],
           "events": [
             {
-              "name": "change",
+              "name": "value-change",
               "type": {
                 "text": "CustomEvent"
               }
@@ -5648,11 +6700,28 @@
           ],
           "attributes": [
             {
-              "name": "value",
+              "name": "mapping",
               "type": {
-                "text": "Properties | undefined"
+                "text": "Mapping"
               },
-              "fieldName": "value"
+              "default": "{ rule: 'value' }",
+              "fieldName": "mapping"
+            },
+            {
+              "name": "rule",
+              "type": {
+                "text": "Rule"
+              },
+              "default": "{}",
+              "fieldName": "rule"
+            },
+            {
+              "name": "properties",
+              "type": {
+                "text": "Properties[]"
+              },
+              "default": "[]",
+              "fieldName": "properties"
             },
             {
               "name": "scene",
@@ -5662,12 +6731,6 @@
               "fieldName": "scene"
             }
           ],
-          "mixins": [
-            {
-              "name": "ScopedElementsMixin",
-              "package": "@open-wc/scoped-elements"
-            }
-          ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
@@ -5678,116 +6741,131 @@
       "exports": [
         {
           "kind": "js",
-          "name": "PropertyEvent",
+          "name": "DataBindingMapper",
           "declaration": {
-            "name": "PropertyEvent",
-            "module": "src/modeller/property-sidebar/effects/property-event.ts"
+            "name": "DataBindingMapper",
+            "module": "src/modeller/property-sidebar/data-binding/data-binding-mapper.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/effects/property-shadow.ts",
+      "path": "src/modeller/property-sidebar/data-binding/data-binding-value-map.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "컴포넌트의 그림자 속성을 편집하는 element\n\nExample:\n <property-shadow",
-          "name": "PropertyShadow",
+          "description": "",
+          "name": "DataBindingValueMap",
           "members": [
-            {
-              "kind": "field",
-              "name": "value",
-              "type": {
-                "text": "Properties | undefined"
-              },
-              "attribute": "value"
-            },
             {
               "kind": "method",
-              "name": "_onValueChange",
+              "name": "valueInputTemplate",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "value",
+                  "optional": true,
                   "type": {
-                    "text": "Event"
+                    "text": "any"
                   }
                 }
               ]
             }
           ],
-          "events": [
-            {
-              "name": "change",
-              "type": {
-                "text": "CustomEvent"
-              }
-            }
-          ],
-          "attributes": [
-            {
-              "name": "value",
-              "type": {
-                "text": "Properties | undefined"
-              },
-              "fieldName": "value"
-            }
-          ],
           "superclass": {
-            "name": "LitElement",
-            "package": "lit"
+            "name": "OxInputValueMap",
+            "package": "@operato/input"
           },
+          "tagName": "data-binding-value-map",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "PropertyShadow",
+          "name": "DataBindingValueMap",
           "declaration": {
-            "name": "PropertyShadow",
-            "module": "src/modeller/property-sidebar/effects/property-shadow.ts"
+            "name": "DataBindingValueMap",
+            "module": "src/modeller/property-sidebar/data-binding/data-binding-value-map.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "data-binding-value-map",
+          "declaration": {
+            "name": "DataBindingValueMap",
+            "module": "src/modeller/property-sidebar/data-binding/data-binding-value-map.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/effects/value-converter.ts",
+      "path": "src/modeller/property-sidebar/data-binding/data-binding-value-range.ts",
       "declarations": [
         {
-          "kind": "function",
-          "name": "convert",
-          "parameters": [
+          "kind": "class",
+          "description": "",
+          "name": "DataBindingValueRange",
+          "members": [
             {
-              "name": "element",
-              "type": {
-                "text": "any"
-              }
+              "kind": "method",
+              "name": "valueInputTemplate",
+              "parameters": [
+                {
+                  "name": "value",
+                  "optional": true,
+                  "type": {
+                    "text": "any"
+                  }
+                }
+              ]
             }
-          ]
+          ],
+          "superclass": {
+            "name": "OxInputValueRange",
+            "package": "@operato/input"
+          },
+          "tagName": "data-binding-value-range",
+          "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "convert",
+          "name": "DataBindingValueRange",
           "declaration": {
-            "name": "convert",
-            "module": "src/modeller/property-sidebar/effects/value-converter.ts"
+            "name": "DataBindingValueRange",
+            "module": "src/modeller/property-sidebar/data-binding/data-binding-value-range.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "data-binding-value-range",
+          "declaration": {
+            "name": "DataBindingValueRange",
+            "module": "src/modeller/property-sidebar/data-binding/data-binding-value-range.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/modeller/property-sidebar/inspector/inspector.ts",
+      "path": "src/modeller/property-sidebar/data-binding/data-binding.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SceneInspector",
+          "name": "PropertyDataBinding",
           "members": [
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "Properties | undefined"
+              },
+              "attribute": "value"
+            },
             {
               "kind": "field",
               "name": "scene",
@@ -5798,201 +6876,191 @@
             },
             {
               "kind": "field",
-              "name": "searchText",
+              "name": "mappingIndex",
               "type": {
-                "text": "string"
+                "text": "number"
               },
-              "privacy": "private",
-              "default": "''"
+              "default": "0"
             },
             {
               "kind": "field",
-              "name": "_extendedMap",
+              "name": "_afterRender",
               "type": {
-                "text": "any"
-              },
-              "privacy": "private"
+                "text": "Function | null | undefined"
+              }
             },
             {
               "kind": "field",
-              "name": "show",
+              "name": "_dataExpanded",
               "type": {
                 "text": "boolean"
               },
-              "privacy": "private",
-              "default": "false"
+              "default": "true"
             },
             {
               "kind": "field",
-              "name": "count",
+              "name": "tabs",
               "type": {
-                "text": "number"
-              },
-              "privacy": "private",
-              "default": "-1"
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "tabNavLeftButton",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "tabNavRightButton",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "mappings",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "scopedElements",
+              "static": true,
+              "readonly": true
             },
             {
               "kind": "method",
-              "name": "disconnectScene",
+              "name": "_setMappingIndex",
               "parameters": [
                 {
-                  "name": "scene",
-                  "optional": true,
+                  "name": "idx",
                   "type": {
-                    "text": "Scene"
+                    "text": "number"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "refresh"
+              "name": "_clearDataBindingMapper"
             },
             {
               "kind": "method",
-              "name": "_onclick",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "MouseEvent"
-                  }
-                }
-              ]
+              "name": "_copyDataBindingMapper"
             },
             {
               "kind": "method",
-              "name": "_ondblclick",
+              "name": "_pasteDataBindingMapper"
+            },
+            {
+              "kind": "method",
+              "name": "_onValueChanged"
+            },
+            {
+              "kind": "method",
+              "name": "_onValueChange",
               "parameters": [
                 {
                   "name": "e",
                   "type": {
-                    "text": "MouseEvent"
+                    "text": "Event"
                   }
                 }
-              ]
+              ],
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
             },
             {
               "kind": "field",
-              "name": "extendedMap",
+              "name": "tabContainer",
               "readonly": true
             },
             {
               "kind": "method",
-              "name": "getNodeHandleClass",
+              "name": "_onMappingChanged",
               "parameters": [
                 {
-                  "name": "component",
+                  "name": "e",
                   "type": {
-                    "text": "Component"
+                    "text": "CustomEvent"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "isExtended",
-              "parameters": [
-                {
-                  "name": "component",
-                  "type": {
-                    "text": "Component"
-                  }
-                }
-              ]
+              "name": "_onTabScroll"
             },
             {
               "kind": "method",
-              "name": "toggleExtended",
-              "parameters": [
-                {
-                  "name": "component",
-                  "type": {
-                    "text": "Component"
-                  }
-                }
-              ]
+              "name": "_onTabScrollNavLeft"
             },
             {
               "kind": "method",
-              "name": "toggleHidden",
-              "parameters": [
-                {
-                  "name": "component",
-                  "type": {
-                    "text": "Component"
-                  }
-                }
-              ]
+              "name": "_onTabScrollNavRight"
             },
             {
               "kind": "method",
-              "name": "selectComponent",
+              "name": "_getValueFromEventTarget",
               "parameters": [
                 {
-                  "name": "component",
-                  "type": {
-                    "text": "Component"
-                  }
-                },
-                {
-                  "name": "append",
-                  "default": "false",
+                  "name": "element",
                   "type": {
-                    "text": "boolean"
+                    "text": "HTMLElement"
                   }
                 }
-              ]
+              ],
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
             },
             {
               "kind": "method",
-              "name": "shouldBeShown",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              },
+              "name": "_onAfterValueChange",
               "parameters": [
                 {
-                  "name": "component",
+                  "name": "key",
                   "type": {
-                    "text": "Component"
+                    "text": "string"
                   }
                 },
                 {
-                  "name": "counting",
-                  "default": "false",
+                  "name": "value",
                   "type": {
-                    "text": "boolean"
+                    "text": "any"
                   }
                 }
-              ]
-            },
+              ],
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
+            }
+          ],
+          "events": [
             {
-              "kind": "method",
-              "name": "renderComponent",
-              "return": {
-                "type": {
-                  "text": "TemplateResult"
-                }
+              "name": "property-change",
+              "type": {
+                "text": "CustomEvent"
               },
-              "parameters": [
-                {
-                  "name": "component",
-                  "type": {
-                    "text": "Component"
-                  }
-                },
-                {
-                  "name": "depth",
-                  "type": {
-                    "text": "number"
-                  }
-                }
-              ]
+              "inheritedFrom": {
+                "name": "AbstractProperty",
+                "module": "src/modeller/property-sidebar/abstract-property.ts"
+              }
             }
           ],
           "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "Properties | undefined"
+              },
+              "fieldName": "value"
+            },
             {
               "name": "scene",
               "type": {
@@ -6001,20 +7069,25 @@
               "fieldName": "scene"
             }
           ],
+          "mixins": [
+            {
+              "name": "ScopedElementsMixin",
+              "package": "@open-wc/scoped-elements"
+            }
+          ],
           "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "customElement": true
+            "name": "AbstractProperty",
+            "module": "/src/modeller/property-sidebar/abstract-property.js"
+          }
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SceneInspector",
+          "name": "PropertyDataBinding",
           "declaration": {
-            "name": "SceneInspector",
-            "module": "src/modeller/property-sidebar/inspector/inspector.ts"
+            "name": "PropertyDataBinding",
+            "module": "src/modeller/property-sidebar/data-binding/data-binding.ts"
           }
         }
       ]