all repos — h3 @ b623b80f8fdd1c1170b10ad4c2df8617ee4e1d7c

A tiny, extremely minimalist JavaScript microframework. 

Updates.
h3rald h3rald@h3rald.com
Mon, 20 Apr 2020 13:25:30 +0200
commit

b623b80f8fdd1c1170b10ad4c2df8617ee4e1d7c

parent

2494ba28a8cc3cd9a3ed095fd7a1ea57f4ffa575

5 files changed, 11 insertions(+), 3 deletions(-)

jump to
M docs/H3_DeveloperGuide.htm → docs/H3_DeveloperGuide.htm 
@@ -7780,6 +7780,7 @@ <h4>Special attributes<a href="#document-top" title="Go to top"></a></h4>
 
 <ul>
 <li>Any attribute starting with <em>on</em> (e.g. onclick, onkeydown, etc.) will be treated as an event listener.</li>
+<li>The <code>classList</code> attribute can be set to a list of classes to apply to the element (as an alternative to using the element selector shorthand).</li>
 <li>The special <code>$key</code> attribute can be used to guarantee the uniqueness of two VNodes and it will not be translated into an HTML attribute.</li>
 <li>The special <code>$html</code> attribute can be used to set the <code>innerHTML</code> property of the resulting HTML element. Use only if you know what you are doing!</li>
 </ul>
M docs/example/assets/js/h3.js → docs/example/assets/js/h3.js 
@@ -166,6 +166,7 @@ this.$html = attrs.$html;
     this.style = attrs.style;
     this.value = attrs.value;
     this.data = attrs.data || {};
+    this.classList = this.classList || attrs.classList || [];
     this.attributes = attrs || {};
     Object.keys(attrs)
       .filter((a) => a.startsWith("on"))

@@ -184,6 +185,7 @@ delete this.attributes.$html;
     delete this.attributes.id;
     delete this.attributes.data;
     delete this.attributes.style;
+    delete this.attributes.classList;
   }
 
   processSelector(selector) {

@@ -501,7 +503,7 @@ }
 }
 
 class Route {
-  constructor({ path, def, query, parts}) {
+  constructor({ path, def, query, parts }) {
     this.path = path;
     this.def = def;
     this.query = query;
M docs/js/h3.js → docs/js/h3.js 
@@ -166,6 +166,7 @@ this.$html = attrs.$html;
     this.style = attrs.style;
     this.value = attrs.value;
     this.data = attrs.data || {};
+    this.classList = this.classList || attrs.classList || [];
     this.attributes = attrs || {};
     Object.keys(attrs)
       .filter((a) => a.startsWith("on"))

@@ -184,6 +185,7 @@ delete this.attributes.$html;
     delete this.attributes.id;
     delete this.attributes.data;
     delete this.attributes.style;
+    delete this.attributes.classList;
   }
 
   processSelector(selector) {

@@ -501,7 +503,7 @@ }
 }
 
 class Route {
-  constructor({ path, def, query, parts}) {
+  constructor({ path, def, query, parts }) {
     this.path = path;
     this.def = def;
     this.query = query;
M docs/md/api.md → docs/md/api.md 
@@ -110,6 +110,7 @@ 
 #### Special attributes
 
 * Any attribute starting with *on* (e.g. onclick, onkeydown, etc.) will be treated as an event listener.
+* The `classList` attribute can be set to a list of classes to apply to the element (as an alternative to using the element selector shorthand).
 * The special `$key` attribute can be used to guarantee the uniqueness of two VNodes and it will not be translated into an HTML attribute.
 * The special `$html` attribute can be used to set the `innerHTML` property of the resulting HTML element. Use only if you know what you are doing!
M h3.js → h3.js 
@@ -166,6 +166,7 @@ this.$html = attrs.$html;
     this.style = attrs.style;
     this.value = attrs.value;
     this.data = attrs.data || {};
+    this.classList = this.classList || attrs.classList || [];
     this.attributes = attrs || {};
     Object.keys(attrs)
       .filter((a) => a.startsWith("on"))

@@ -184,6 +185,7 @@ delete this.attributes.$html;
     delete this.attributes.id;
     delete this.attributes.data;
     delete this.attributes.style;
+    delete this.attributes.classList;
   }
 
   processSelector(selector) {

@@ -501,7 +503,7 @@ }
 }
 
 class Route {
-  constructor({ path, def, query, parts}) {
+  constructor({ path, def, query, parts }) {
     this.path = path;
     this.def = def;
     this.query = query;