diff --git a/tobago-example/tobago-example-demo/src/main/webapp/css/demo.css.map b/tobago-example/tobago-example-demo/src/main/webapp/css/demo.css.map
new file mode 100644
index 0000000..2096b0c
--- /dev/null
+++ b/tobago-example/tobago-example-demo/src/main/webapp/css/demo.css.map
@@ -0,0 +1,12 @@
+{
+	"version": 3,
+	"file": "demo.css",
+	"sources": [
+		"../../../../npm/scss/demo.scss"
+	],
+	"sourcesContent": [
+		"/*\n * Licensed to the Apache Software Foundation (ASF) under one or more\n * contributor license agreements.  See the NOTICE file distributed with\n * this work for additional information regarding copyright ownership.\n * The ASF licenses this file to You under the Apache License, Version 2.0\n * (the \"License\"); you may not use this file except in compliance with\n * the License.  You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n.box-shadow {\n  box-shadow: 0 0 5px 5px rgba(200, 200, 200, 0.5);\n}\n\n.demo-selected {\n  background-color: #ffddff;\n}\n\n#demo-view-source .demo-selected {\n  border: 1px solid #cccccc;\n}\n\n.blue {\n  background-color: #2aabff;\n}\n\n.demo-data-attribute {\n  height: 100px;\n  border: 1px solid #000000;\n  border-radius: .25rem;\n}\n\ndemo-highlight {\n  font-size: 75%;\n}\n\n/* todo: should be switchable\n.comment {\n  display: none;\n}\n*/\n\n/* Prism and Bootstrap both use \"tag\" as CSS class name. So we need to \"fix\" some stuff. */\n.language-markup .token.tag {\n  font-weight: inherit;\n  font-size: inherit;\n  line-height: inherit;\n  /*display: inherit;*/\n  white-space: inherit;\n  text-align: inherit;\n  padding: inherit;\n}\n\n.planet {\n  background-color: #5cb85c;\n}\n\n.old-planet {\n  background-color: #b3d4fc;\n}\n\n.tobago-sheet-cell-markup-sun {\n  background-color: #fffacd;\n}\n\n.tobago-sheet-cell-markup-planet {\n  background-color: #ffb6c1;\n}\n\n.tobago-sheet-cell-markup-moon {\n  background-color: #6495ed;\n}\n\n.tobago-sheet-cell-markup-lightgreen {\n  background-color: #ddffdd;\n}\n\n.tobago-sheet-cell-markup-lightred {\n  background-color: #ffdddd;\n}\n\n.testframe-wrapper {\n  display: inline-block;\n  border: 1px solid;\n  text-align: center;\n  margin-bottom: 2px;\n}\n"
+	],
+	"names": [],
+	"mappings": "AAAA;;;;;;;;;;;;;;;GAeG;AAEH,AAAA,WAAW,CAAC;EACV,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,wBAAwB;CACjD;;AAED,AAAA,cAAc,CAAC;EACb,gBAAgB,EAAE,OAAO;CAC1B;;AAED,AAAA,iBAAiB,CAAC,cAAc,CAAC;EAC/B,MAAM,EAAE,iBAAiB;CAC1B;;AAED,AAAA,KAAK,CAAC;EACJ,gBAAgB,EAAE,OAAO;CAC1B;;AAED,AAAA,oBAAoB,CAAC;EACnB,MAAM,EAAE,KAAK;EACb,MAAM,EAAE,iBAAiB;EACzB,aAAa,EAAE,MAAM;CACtB;;AAED,AAAA,cAAc,CAAC;EACb,SAAS,EAAE,GAAG;CACf;;AAED;;;;EAIE;AAEF,2FAA2F;AAC3F,AAAA,gBAAgB,CAAC,MAAM,AAAA,IAAI,CAAC;EAC1B,WAAW,EAAE,OAAO;EACpB,SAAS,EAAE,OAAO;EAClB,WAAW,EAAE,OAAO;EACpB,qBAAqB;EACrB,WAAW,EAAE,OAAO;EACpB,UAAU,EAAE,OAAO;EACnB,OAAO,EAAE,OAAO;CACjB;;AAED,AAAA,OAAO,CAAC;EACN,gBAAgB,EAAE,OAAO;CAC1B;;AAED,AAAA,WAAW,CAAC;EACV,gBAAgB,EAAE,OAAO;CAC1B;;AAED,AAAA,6BAA6B,CAAC;EAC5B,gBAAgB,EAAE,OAAO;CAC1B;;AAED,AAAA,gCAAgC,CAAC;EAC/B,gBAAgB,EAAE,OAAO;CAC1B;;AAED,AAAA,8BAA8B,CAAC;EAC7B,gBAAgB,EAAE,OAAO;CAC1B;;AAED,AAAA,oCAAoC,CAAC;EACnC,gBAAgB,EAAE,OAAO;CAC1B;;AAED,AAAA,kCAAkC,CAAC;EACjC,gBAAgB,EAAE,OAAO;CAC1B;;AAED,AAAA,kBAAkB,CAAC;EACjB,OAAO,EAAE,YAAY;EACrB,MAAM,EAAE,SAAS;EACjB,UAAU,EAAE,MAAM;EAClB,aAAa,EAAE,GAAG;CACnB"
+}
\ No newline at end of file
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/css/demo.min.css b/tobago-example/tobago-example-demo/src/main/webapp/css/demo.min.css
new file mode 100644
index 0000000..31f4fb8
--- /dev/null
+++ b/tobago-example/tobago-example-demo/src/main/webapp/css/demo.min.css
@@ -0,0 +1,2 @@
+.box-shadow{box-shadow:0 0 5px 5px rgba(200,200,200,.5)}.demo-selected{background-color:#fdf}#demo-view-source .demo-selected{border:1px solid #ccc}.blue{background-color:#2aabff}.demo-data-attribute{height:100px;border:1px solid #000;border-radius:.25rem}demo-highlight{font-size:75%}.language-markup .token.tag{font-weight:inherit;font-size:inherit;line-height:inherit;white-space:inherit;text-align:inherit;padding:inherit}.planet{background-color:#5cb85c}.old-planet{background-color:#b3d4fc}.tobago-sheet-cell-markup-sun{background-color:#fffacd}.tobago-sheet-cell-markup-planet{background-color:#ffb6c1}.tobago-sheet-cell-markup-moon{background-color:#6495ed}.tobago-sheet-cell-markup-lightgreen{background-color:#dfd}.tobago-sheet-cell-markup-lightred{background-color:#fdd}.testframe-wrapper{display:inline-block;border:1px solid;text-align:center;margin-bottom:2px}
+/*# sourceMappingURL=demo.min.css.map */
\ No newline at end of file
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/css/demo.min.css.map b/tobago-example/tobago-example-demo/src/main/webapp/css/demo.min.css.map
new file mode 100644
index 0000000..c0dbab4
--- /dev/null
+++ b/tobago-example/tobago-example-demo/src/main/webapp/css/demo.min.css.map
@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../npm/scss/demo.scss"],"names":[],"mappings":"AAiBA,YACE,WAAY,EAAE,EAAE,IAAI,IAAI,qBAG1B,eACE,iBAAkB,KAGF,iCAChB,OAAQ,IAAA,MAAA,KAGV,MACE,iBAAkB,QAGpB,qBACE,OAAQ,MACR,OAAQ,IAAA,MAAA,KACR,cAAe,OAGjB,eACE,UAAW,IAUU,4BACrB,YAAa,QACb,UAAW,QACX,YAAa,QAEb,YAAa,QACb,WAAY,QACZ,QAAS,QAGX,QACE,iBAAkB,QAGpB,YACE,iBAAkB,QAGpB,8BACE,iBAAkB,QAGpB,iCACE,iBAAkB,QAGpB,+BACE,iBAAkB,QAGpB,qCACE,iBAAkB,KAGpB,mCACE,iBAAkB,KAGpB,mBACE,QAAS,aACT,OAAQ,IAAA,MACR,WAAY,OACZ,cAAe","sourcesContent":["/*\n * Licensed to the Apache Software Foundation (ASF) under one or more\n * contributor license agreements.  See the NOTICE file distributed with\n * this work for additional information regarding copyright ownership.\n * The ASF licenses this file to You under the Apache License, Version 2.0\n * (the \"License\"); you may not use this file except in compliance with\n * the License.  You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n.box-shadow {\n  box-shadow: 0 0 5px 5px rgba(200, 200, 200, 0.5);\n}\n\n.demo-selected {\n  background-color: #ffddff;\n}\n\n#demo-view-source .demo-selected {\n  border: 1px solid #cccccc;\n}\n\n.blue {\n  background-color: #2aabff;\n}\n\n.demo-data-attribute {\n  height: 100px;\n  border: 1px solid #000000;\n  border-radius: .25rem;\n}\n\ndemo-highlight {\n  font-size: 75%;\n}\n\n/* todo: should be switchable\n.comment {\n  display: none;\n}\n*/\n\n/* Prism and Bootstrap both use \"tag\" as CSS class name. So we need to \"fix\" some stuff. */\n.language-markup .token.tag {\n  font-weight: inherit;\n  font-size: inherit;\n  line-height: inherit;\n  /*display: inherit;*/\n  white-space: inherit;\n  text-align: inherit;\n  padding: inherit;\n}\n\n.planet {\n  background-color: #5cb85c;\n}\n\n.old-planet {\n  background-color: #b3d4fc;\n}\n\n.tobago-sheet-cell-markup-sun {\n  background-color: #fffacd;\n}\n\n.tobago-sheet-cell-markup-planet {\n  background-color: #ffb6c1;\n}\n\n.tobago-sheet-cell-markup-moon {\n  background-color: #6495ed;\n}\n\n.tobago-sheet-cell-markup-lightgreen {\n  background-color: #ddffdd;\n}\n\n.tobago-sheet-cell-markup-lightred {\n  background-color: #ffdddd;\n}\n\n.testframe-wrapper {\n  display: inline-block;\n  border: 1px solid;\n  text-align: center;\n  margin-bottom: 2px;\n}\n"]}
\ No newline at end of file
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/js/demo-copy-to-clipboard.js b/tobago-example/tobago-example-demo/src/main/webapp/js/demo-copy-to-clipboard.js
new file mode 100644
index 0000000..69c44c4
--- /dev/null
+++ b/tobago-example/tobago-example-demo/src/main/webapp/js/demo-copy-to-clipboard.js
@@ -0,0 +1,55 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+class DemoCopyToClipboard extends HTMLElement {
+    constructor() {
+        super();
+    }
+    connectedCallback() {
+        this.addEventListener("click", (event) => {
+            const sourceElement = document.getElementById(this.source);
+            if (window.getSelection) {
+                const selection = window.getSelection();
+                const range = document.createRange();
+                range.selectNodeContents(sourceElement);
+                selection.removeAllRanges();
+                selection.addRange(range);
+            }
+            else {
+                console.warn("Text select not possible: Unsupported browser.");
+            }
+            try {
+                const result = document.execCommand("copy");
+                console.debug("result: " + result);
+            }
+            catch (error) {
+                console.error("Copying text not possible");
+            }
+        });
+    }
+    get source() {
+        return this.getAttribute("source");
+    }
+    set source(name) {
+        this.setAttribute("source", name);
+    }
+}
+document.addEventListener("DOMContentLoaded", function (event) {
+    if (window.customElements.get("demo-copy-to-clipboard") == null) {
+        window.customElements.define("demo-copy-to-clipboard", DemoCopyToClipboard);
+    }
+});
+//# sourceMappingURL=demo-copy-to-clipboard.js.map
\ No newline at end of file
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/js/demo-copy-to-clipboard.js.map b/tobago-example/tobago-example-demo/src/main/webapp/js/demo-copy-to-clipboard.js.map
new file mode 100644
index 0000000..655c877
--- /dev/null
+++ b/tobago-example/tobago-example-demo/src/main/webapp/js/demo-copy-to-clipboard.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"demo-copy-to-clipboard.js","sourceRoot":"","sources":["../../../../npm/ts/demo-copy-to-clipboard.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,MAAM,mBAAoB,SAAQ,WAAW;IAE3C;QACE,KAAK,EAAE,CAAC;IACV,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,KAAiB,EAAE,EAAE;YACnD,MAAM,aAAa,GAAG,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAE3D,IAAI,MAAM,CAAC,YAAY,EAAE;gBACvB,MAAM,SAAS,GAAG,MAAM,CAAC,YAAY,EAAE,CAAC;gBACxC,MAAM,KAAK,GAAG,QAAQ,CAAC,WAAW,EAAE,CAAC;gBACrC,KAAK,CAAC,kBAAkB,CAAC,aAAa,CAAC,CAAC;gBACxC,SAAS,CAAC,eAAe,EAAE,CAAC;gBAC5B,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;aAC3B;iBAAM;gBACL,OAAO,CAAC,IAAI,CAAC,gDAAgD,CAAC,CAAC;aAChE;YACD,IAAI;gBACF,MAAM,MAAM,GAAG,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;gBAC5C,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM,CAAC,CAAC;aACpC;YAAC,OAAO,KAAK,EAAE;gBACd,OAAO,CAAC,KAAK,CAAC,2BAA2B,CAAC,CAAC;aAC5C;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;IACrC,CAAC;IAED,IAAI,MAAM,CAAC,IAAY;QACrB,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;IACpC,CAAC;CAEF;AAED,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,UAAU,KAAY;IAClE,IAAI,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,wBAAwB,CAAC,IAAI,IAAI,EAAE;QAC/D,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,wBAAwB,EAAE,mBAAmB,CAAC,CAAC;KAC7E;AACH,CAAC,CAAC,CAAC"}
\ No newline at end of file