Update to 0.1.0

Author: ryansolid

frameworks/keyed/solid/package.json

@@ -1,6 +1,6 @@
 {
   "name": "js-framework-benchmark-solid",
-  "version": "0.0.16",
+  "version": "0.1.0",
   "main": "dist/main.js",
   "js-framework-benchmark": {
     "frameworkVersionFromPackage": "solid-js"
@@ -17,15 +17,15 @@
     "url": "https://github.com/krausest/js-framework-benchmark.git"
   },
   "dependencies": {
-    "babel-plugin-jsx-dom-expressions": "0.0.29",
+    "babel-plugin-jsx-dom-expressions": "0.1.0",
     "s-js": "0.4.9",
-    "solid-js": "0.0.16"
+    "solid-js": "0.1.0"
   },
   "devDependencies": {
-    "@babel/core": "7.0.0-beta.56",
-    "rollup": "0.63.4",
-    "rollup-plugin-babel": "beta",
-    "rollup-plugin-node-resolve": "3.3.0",
-    "rollup-plugin-terser": "1.0.1"
+    "@babel/core": "7.0.0",
+    "rollup": "0.65.2",
+    "rollup-plugin-babel": "4.0.3",
+    "rollup-plugin-node-resolve": "3.4.0",
+    "rollup-plugin-terser": "2.0.2"
   }
 }

frameworks/keyed/solid/src/main.jsx

@@ -1,5 +1,5 @@
-import { State, root, memo } from 'solid-js';
-import { r, selectOn, delegateEvent } from 'solid-js/dom';
+import { State, root, each } from 'solid-js';
+import { r, selectWhen } from 'solid-js/dom';
 
 function _random (max) {
   return Math.round(Math.random() * 1000) % max;
@@ -22,7 +22,7 @@ function buildData(count) {
 }
 
 function App() {
-  let rowId, selectClass, clickSelect, clickRemove, tbody;
+  let rowId;
   const state = new State({ data: [], selected: null });
 
   return <div class='container'>
@@ -49,33 +49,28 @@ function App() {
         </div>
       </div></div>
     </div></div>
-    <table class='table table-hover table-striped test-data'><tbody ref={ tbody }>{
-      (selectClass = selectOn(() => state.selected, (el, selected) => el.className = selected ? 'danger' : ''),
-      clickSelect = delegateEvent(tbody, 'click', onSelect),
-      clickRemove = delegateEvent(tbody, 'click', onRemove),
-      memo(row =>
+    <table class='table table-hover table-striped test-data'><tbody onClick={ clickRow }>{
+      selectWhen(() => state.selected, (el, selected) => el.className = selected ? 'danger' : '')
+      (each(row =>
         (rowId = row.sample('id'),
-        <tr $selectClass={ rowId }>
+        <tr model={(( rowId ))}>
           <td class='col-md-1' textContent={(( rowId ))} />
-          <td class='col-md-4'><a $clickSelect={ rowId }>{ row.label }</a></td>
-          <td class='col-md-1'><a $clickRemove={ rowId }><span class='delete glyphicon glyphicon-remove' /></a></td>
+          <td class='col-md-4'><a>{ row.label }</a></td>
+          <td class='col-md-1'><a><span class='delete glyphicon glyphicon-remove' /></a></td>
           <td class='col-md-6'/>
         </tr>)
       )(() => state.data))
     }</tbody></table>
     <span class='preloadicon glyphicon glyphicon-remove' aria-hidden="true" />
   </div>
 
-  function onRemove(id, e) {
+  function clickRow(e, id) {
     e.stopPropagation();
-    state.set({
-      data: state.data.filter(row => row.id !== id)
-    });
-  }
-
-  function onSelect(id, e) {
-    e.stopPropagation();
-    state.set({ selected: id });
+    if (e.target.matches('.delete')) {
+      state.set({
+        data: state.data.filter(row => row.id !== id)
+      });
+    } else state.set({ selected: id })
   }
 
   function run(e) {