@gera2ld/jsx-dom - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

lib/index.cjs.js

 'use strict';
 
-var propNames = ['innerHTML', 'innerText', 'textContent'];
+var propRules = ['innerHTML', 'innerText', 'textContent', {
+  key: 'value',
+  tag: 'textarea'
+}];
 function createElement(tag, props) {
@@ -25,3 +28,3 @@ var el = document.createElement(tag);
         if (value) el.setAttribute(key, key);else el.removeAttribute(key);
-      } else if (propNames.indexOf(key) >= 0) {
+      } else if (matchProps(tag, key, value)) {
         el[key] = value;
@@ -44,2 +47,17 @@ } else {
 
+function matchProps(tag, key, value) {
+  return propRules.some(function (rule) {
+    if (!rule) return false;
+    if (typeof rule === 'string') return key === rule;
+    var ctx = {
+      tag: tag,
+      key: key,
+      value: value
+    };
+    return Object.keys(rule).every(function (rk) {
+      return rule[rk] === ctx[rk];
+    });
+  });
+}
+
 function renderChild(el, child) {
@@ -46,0 +64,0 @@ if (Array.isArray(child)) {

lib/index.js

@@ -7,3 +7,6 @@ (function (global, factory) {
 
-  var propNames = ['innerHTML', 'innerText', 'textContent'];
+  var propRules = ['innerHTML', 'innerText', 'textContent', {
+    key: 'value',
+    tag: 'textarea'
+  }];
   function createElement(tag, props) {
@@ -30,3 +33,3 @@ var el = document.createElement(tag);
           if (value) el.setAttribute(key, key);else el.removeAttribute(key);
-        } else if (propNames.indexOf(key) >= 0) {
+        } else if (matchProps(tag, key, value)) {
           el[key] = value;
@@ -49,2 +52,17 @@ } else {
 
+  function matchProps(tag, key, value) {
+    return propRules.some(function (rule) {
+      if (!rule) return false;
+      if (typeof rule === 'string') return key === rule;
+      var ctx = {
+        tag: tag,
+        key: key,
+        value: value
+      };
+      return Object.keys(rule).every(function (rk) {
+        return rule[rk] === ctx[rk];
+      });
+    });
+  }
+
   function renderChild(el, child) {
@@ -51,0 +69,0 @@ if (Array.isArray(child)) {

lib/index.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.JSX=t()}(this,function(){"use strict";var a=["innerHTML","innerText","textContent"];function f(t,e){Array.isArray(e)?e.forEach(function(e){return f(t,e)}):null!=e&&!1!==e&&("object"!=typeof e?t.appendChild(document.createTextNode("".concat(e))):t.appendChild(e))}return function(e,r){var c,i=document.createElement(e);r&&Object.keys(r).forEach(function(e){var n,o,t=r[e];null!=t&&(e.startsWith("on")?i.addEventListener(e.slice(2).toLowerCase(),t):"children"===e?f(i,t):"style"===e&&"object"==typeof t?(n=i,o=t,Object.keys(o).forEach(function(e){var t=o[e];n.style[e]="number"==typeof t?"".concat(t,"px"):t})):"dangerouslySetInnerHTML"===e&&t?i.innerHTML=t.__html||"":"ref"===e&&"function"==typeof t?c=t:"boolean"==typeof t?t?i.setAttribute(e,e):i.removeAttribute(e):0<=a.indexOf(e)?i[e]=t:("className"===e?e="class":"labelFor"===e&&(e="for"),i.setAttribute(e,"".concat(t))))});for(var t=arguments.length,n=new Array(2<t?t-2:0),o=2;o<t;o++)n[o-2]=arguments[o];return f(i,n),c&&c(i),i}});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.JSX=t()}(this,function(){"use strict";var l=["innerHTML","innerText","textContent",{key:"value",tag:"textarea"}];function y(t,e){Array.isArray(e)?e.forEach(function(e){return y(t,e)}):null!=e&&!1!==e&&("object"!=typeof e?t.appendChild(document.createTextNode("".concat(e))):t.appendChild(e))}return function(i,u){var f,s=document.createElement(i);u&&Object.keys(u).forEach(function(e){var r,o,a,n,c,t=u[e];null!=t&&(e.startsWith("on")?s.addEventListener(e.slice(2).toLowerCase(),t):"children"===e?y(s,t):"style"===e&&"object"==typeof t?(n=s,c=t,Object.keys(c).forEach(function(e){var t=c[e];n.style[e]="number"==typeof t?"".concat(t,"px"):t})):"dangerouslySetInnerHTML"===e&&t?s.innerHTML=t.__html||"":"ref"===e&&"function"==typeof t?f=t:"boolean"==typeof t?t?s.setAttribute(e,e):s.removeAttribute(e):(r=i,o=e,a=t,l.some(function(t){if(!t)return!1;if("string"==typeof t)return o===t;var n={tag:r,key:o,value:a};return Object.keys(t).every(function(e){return t[e]===n[e]})})?s[e]=t:("className"===e?e="class":"labelFor"===e&&(e="for"),s.setAttribute(e,"".concat(t)))))});for(var e=arguments.length,t=new Array(2<e?e-2:0),n=2;n<e;n++)t[n-2]=arguments[n];return y(s,t),f&&f(s),s}});

package.json

 {
   "name": "@gera2ld/jsx-dom",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Use JSX for HTML elements.",
   "author": "Gerald <[e-mail]>",
   "license": "ISC",
+  "files": [
+    "lib"
+  ],
   "scripts": {
@@ -19,2 +22,6 @@ "dev": "gulp dev",
   },
+  "keywords": [
+    "jsx",
+    "dom"
+  ],
   "devDependencies": {
@@ -21,0 +28,0 @@ "@babel/core": "^7.0.0-beta.49",

README.md

 # @gera2ld/jsx-dom
 
-![NPM](https://img.shields.io/npm/v/@gera2ld/jsx-dom.svg)
+[![NPM](https://img.shields.io/npm/v/@gera2ld/jsx-dom.svg)](https://npm.im/@gera2ld/jsx-dom)
 ![License](https://img.shields.io/npm/l/@gera2ld/jsx-dom.svg)
 ![Downloads](https://img.shields.io/npm/dt/@gera2ld/jsx-dom.svg)
 
-This is an ES6 project built with yeoman and generator-rollup.
+Use JSX for HTML elements.
 
@@ -9,0 +9,0 @@ ## Usage

No alert changes

Improved metrics

Lines of code

159

increased by6.71%

Worsened metrics

Total package byte prevSize

8410

decreased by-94.85%

Number of package files

5

decreased by-50%

No dependency changes