Merge branch 'WebReflection-uhtml'

Author: krausest

frameworks/keyed/uhtml/package-lock.json

@@ -4,10 +4,7 @@
   "description": "uhtml demo",
   "main": "index.js",
   "js-framework-benchmark": {
-    "frameworkVersionFromPackage": "uhtml",
-    "issues": [
-      801
-    ]
+    "frameworkVersionFromPackage": "uhtml"
   },
   "scripts": {
     "build-dev": "rollup -c -w",
@@ -27,13 +24,13 @@
   },
   "homepage": "https://github.com/krausest/js-framework-benchmark#readme",
   "dependencies": {
-    "js-framework-benchmark-utils": "^0.2.5",
-    "uhtml": "^2.7.5"
+    "js-framework-benchmark-utils": "^0.3.2",
+    "uhtml": "^2.7.6"
   },
   "devDependencies": {
     "@rollup/plugin-node-resolve": "^13.0.0",
-    "@ungap/degap": "^0.2.6",
-    "rollup": "^2.52.1",
+    "@ungap/degap": "^0.2.7",
+    "rollup": "^2.52.6",
     "rollup-plugin-includepaths": "^0.2.4",
     "rollup-plugin-minify-html-literals": "^1.2.6",
     "rollup-plugin-terser": "^7.0.2"

frameworks/keyed/uhtml/package.json

@@ -2,9 +2,9 @@ import {State} from 'js-framework-benchmark-utils';
 import {html, render} from 'uhtml';
 
 import Jumbotron from './jumbotron.js';
-import Table from './table-delegate.js';
+import Table from './table.js';
 
-const state = State(Table);
+const state = State(Table, false, html.for);
 
 render(document.getElementById('container'), html`
   <div class="container">

frameworks/keyed/uhtml/src/index.js

@@ -0,0 +1,24 @@
+import {html} from 'uhtml';
+
+export default (state) => {
+  const {data, selected, selectRow, removeRow} = state;
+  return html.for(state)`
+    <table class="table table-hover table-striped test-data" .state=${state}>
+      <tbody>${
+      data.map(({id, label, html}) => html`
+        <tr id=${id} class=${id === selected ? 'danger' : ''}>
+          <td class="col-md-1">${id}</td>
+          <td class="col-md-4">
+            <a @click=${selectRow}>${label}</a>
+          </td>
+          <td class="col-md-1">
+            <a @click=${removeRow}>
+              <span class="glyphicon glyphicon-remove" aria-hidden="true" />
+            </a>
+          </td>
+          <td class="col-md-6" />
+        </tr>`
+      )}</tbody>
+    </table>
+  `;
+};