dominic - npm Package Compare versions

Comparing version 0.1.44 to 0.1.45

CHANGELOG.md

@@ -0,1 +1,29 @@
+0.1.45 / 2016-06-22
+==================
+* Auto assign reference to component definitions before create
+```javascript
+// example
+Dominic.register('input', function(defs) {
+    return {
+        items: [
+            { tag: 'span', text: defs.label },
+            { tag: 'input', placeholder: 'Choose name...' }
+        ]
+    }
+})
+// usage
+var root = Dominic.create({
+    cls: 'root',
+    items: [
+        // component can be accessed via root.refs.nameInput
+        // previously have to define ref in component definitions
+        { ctype: 'input', ref: 'nameInput', label: 'Name: ' },
+        // accessed via root.nameInput2
+        { ctype: 'input', directRef: 'nameInput2', label: 'Name 2: ' }
+    ]
+})
+```
+* Add to readme what style rules will be directly applied to element's styles without
+ the need of putting them in a style object
+
 0.1.44 / 2016-06-21
@@ -2,0 +30,0 @@ ==================

component.json

 {
   "name": "dominic",
-  "version": "0.1.44",
+  "version": "0.1.45",
   "description": "Helper to quickly build up DOM in simple javascript object format.",
@@ -5,0 +5,0 @@ "scripts": [

dist/dominic.js

@@ -490,3 +490,3 @@ (function (global, factory) {
           var directRef = el.directRef;
-          if (!isStrOrNum(directRef) && directRef !== '') {
+          if (isStrOrNum(directRef) && directRef !== '') {
               delete el.root_[directRef];
@@ -501,3 +501,7 @@ }
       }
-      if (has(el, 'ref')) removeRef(el);else if (has(el, 'directRef')) delete root[el.directRef];
+      if (has(el, 'ref')) {
+          removeRef(el);
+      } else if (has(el, 'directRef')) {
+          delete root[el.directRef];
+      }
       var hasRefEls = queryAll(el, 'hsr', true);
@@ -1024,3 +1028,6 @@ hasRefEls.forEach(removeRef);
       insertBefore(parent, child, stop);
-      if (has(child, 'd__isCmp')) return;
+      if (has(child, 'd__isCmp')) {
+          child.root_ = root;
+          return;
+      }
       var f2 = getChildrenConfigs(child);
@@ -1204,3 +1211,9 @@ setChildren(child, f2, root);
       var definitions = Component.get(ctype).create(defs);
+      // Carry the reference to the component
+      if (has(defs, 'ref')) {
+          definitions.ref = defs.ref;
+          if (has(defs, 'refScope')) definitions.refScope = defs.refScope;
+      } else if (has(defs, 'directRef')) definitions.directRef = defs.directRef;
       var comp = createElement(definitions);
+      comp.ctype = ctype;
       return comp;
@@ -1207,0 +1220,0 @@ }

dist/dominic.min.js

@@ -1,1 +0,1 @@
-!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define("Dominic",r):e.Dominic=r()}(this,function(){"use strict";function e(e){var r="undefined"==typeof e?"undefined":he(e);return"string"===r||"number"===r}function r(e){return"function"==typeof e}function t(e,r){if(!de(e))return!1;for(var t=e.length,n=0;t>n;n++)if(he(e[n])!==r)return!1;return!0}function n(e){return e instanceof Node}function o(e){e=e||[];var r=arguments.length;if(2>r)return e;for(var t=e.length,n=1;r>n;n++)for(var o=arguments[n],i=0;i<o.length;i++)e[t++]=o[i];return e}function i(e,r,t){for(var n in e)le(e,n)&&r.call(t,e[n],n)}function a(e,r,t){if(!e||!e.length)return!1;for(var n=e.length,o=0;n>o;o++)if(r.call(t,e[o],o,e))return!0;return!1}function f(e){return e?e[e.length-1]:null}function u(e,r,t){for(var n=null,o=e.childNodes,i=o.length,a=0;i>a;a++){var f=o[a];if(n=!le(f,r)||"undefined"!=typeof t&&f[r]!==t?u(f,r,t):f)return n}return n}function l(e,r,t){for(var n=e.childNodes,o=n.length,i=0;o>i;i++){var a=n[i];if(le(a,r)&&("undefined"==typeof t||a[r]===t))return a}return null}function c(e,r,t){for(var n=e.childNodes,o=n.length,i=o-1;i>-1;i++){var a=n[i];if(le(a,r)&&("undefined"==typeof t||a[r]===t))return a}return null}function s(e,r,t,n){for(var o=e.childNodes,i=o.length,a=-1,f=0;i>f;f++){var u=o[f];if(-1===a&&(!le(u,t)||"undefined"!=typeof n&&u[t]!==n||-1===a&&(a=f)),-1!==a&&f-a===r)return u}return null}function v(e,r,t){for(var n=[],o=e.childNodes,i=o.length,a=0,f=0;i>f;f++){var u=o[f];!le(u,r)||"undefined"!=typeof t&&u[r]!==t||(n[a++]=u)}return n}function p(e,r,t){for(var n=[],i=e.childNodes,a=i.length,f=0;a>f;f++){var u=i[f];!le(u,r)||"undefined"!=typeof t&&u[r]!==t||(n[n.length]=u),o(n,p(u,r,t))}return n}function h(e,r){if(r)for(var t=Object.keys(r),n=t.length,i=[],a=e.childNodes,f=a.length,u=0,l=0;f>l;l++){for(var c=a[l],s=0;n>s;s++){var v=t[s];if(le(c,v)&&("undefined"==typeof value||c[v]===value)){i[u++]=c;break}}o(i,h(c,r))}}function d(e){return!!("function"==typeof e?e():e)}function y(e){return e.replace(ye,"-$1").toLowerCase()}function g(e){var r=e.id?"#"+e.id:"",t=e.classList.toString(),n=t?t.split(" "):ge,o=e.localName+r+(n.length?"."+n.join("."):"");return o}function _(e,r){return me.call(e,r)}function m(e,r,t){for(;r&&r!==e;){if(_(r,t))return r;r=r.parentNode}return null}function b(){}function w(e,r){function t(e){if("string"==typeof f){if(o===e.target)return;var t=m(o,e.target,f);if(!t)return;"function"==typeof i&&i.call(r,e,t,f)}else"function"==typeof i&&i.call(r,e)}var n=e.type,o=e.el,i=e.callback,a=e.capture,f=e.delegate;return t.destroy=function(){return o.removeEventListener(n,t,a)},o.addEventListener(n,t,a),t}function E(e,r){function t(e){if("string"==typeof f){if(o===e.target)return;var t=m(o,e.target,f);if(!t)return;if(u&&-1===u.indexOf(e.keyCode))return;"function"==typeof i&&i.call(r,e,t,f)}else{if(u&&-1===u.indexOf(e.keyCode))return;"function"==typeof i&&i.call(r,e)}}var n=e.type,o=e.el,i=e.callback,a=e.capture,f=e.delegate,u=e.keys;return t.destroy=function(){return o.removeEventListener(n,t,a)},o.addEventListener(n,t,a),t}function N(e,r,n){var o=r.type;if(!o)throw new Error("No event type specified");var i,a=r.handler,f="undefined"==typeof a?"undefined":he(a);n=n||e;var u="root"===r.scope?n:le(r,"scope")?r.scope:e;if("function"===f?i=a:"string"===f&&(i=u[a]),"function"!=typeof i)throw new Error('Cannot find handler: "'+a+'" on element: ['+g(u)+"].");var l,c=!!r.capture,s=r.delegate,v=-1!==be.indexOf(o),p=-1!==we.indexOf(o);if(v){var h=null;le(r,"key")&&("number"==typeof r.key?h=[r.key]:t(r.key,"number")&&(h=r.key)),l=E({type:o,el:e,callback:i,capture:c,delegate:s,keys:h},u)}else p&&s&&(c=!0),l=w({type:o,el:e,callback:i,capture:c,delegate:s},u);le(e,"evts")||(e.evts=new b),e.evts.push(l),e.hse=!0}function k(e){e=e||{};for(var r=1;r<arguments.length;r++){var t=arguments[r];if(t)for(var n in t)le(t,n)&&(e[n]=t[n])}return e}function x(e){e=e||{};var r=arguments.length;if(3>r)return e;var t=arguments[r-1];if("string"!=typeof t)return e;var n=t.split(",");if(!n.length)return e;for(var o=1;r-1>o;o++){var i=arguments[o];if(i)for(var a in i)if(le(i,a)){if(-1===n.indexOf(a))continue;var f=i[a];e[a]=f}}return e}function O(e){e=e||{};for(var r=1;r<arguments.length;r++){var t=arguments[r];if(t)for(var n in t)if(le(t,n)){var o=t[n];if(de(e))for(var i=0;i<e.length;i++){var a=e[i];le(a,n)||(a[n]=o)}else le(e,n)||(e[n]=o)}}return e}function K(e){e.evts.removeAll(),delete e.evts}function S(e){le(e,"evts")&&K(e);var r=p(e,"hse",!0);r.forEach(K)}function j(r){if(le(r,"ref")){var t=le(r,"refScope")&&"parent"===r.refScope?r.parentNode:r.root_;return void(le(t,"refs")&&t.refs.removeRef(r.ref))}if(le(r,"directRef")){var n=r.directRef;e(n)||""===n||delete r.root_[n]}}function C(e){le(e,"refs")&&(e.refs.removeAll(),delete e.refs),le(e,"ref")?j(e):le(e,"directRef")&&delete root[e.directRef];var r=p(e,"hsr",!0);r.forEach(j)}function A(e){e.forEach(function(e,r){e.nodeType===Node.ELEMENT_NODE&&(C(e),S(e)),e.parentNode.removeChild(e)})}function L(e){return this.__data[e]}function R(e,r){var t=this.__tpl[e],n=this.__owner;this.__data[e]=r;for(var o=0,i=t.length;i>o;o++){var a,u=t[o],l=u.parent,c=u.groupKey,s=v(l,"groupKey",c),n=this.__owner;u["for"]=r,s.length&&(a=f(s).nextSibling),A(s),Q(l,u,c,n,a)}}function M(e,r,t,n){return le(n,"observe")||(n.observe=new ke(n)),n.observe.add(e,r,t,n),n.observe}function P(){}function q(r,t,n){var o,i;if(le(t,"ref")){if(o=t.ref,""===o||!e(o))return;var a=le(t,"refScope")&&"parent"===t.refScope?r:n;le(a,"refs")||(a.refs=new P),i=a.refs}else{if(!le(t,"directRef"))return;if(o=t.directRef,""===o||!e(o))return;i=n}i[o]=t,t.hsr=!0}function D(e,r,t){t?e.insertBefore(r,t):e.appendChild(r)}function T(e){var r=e.setups;return r?r.__configs.defaults:null}function V(e){var r=e.setups;return r?le(r,"items")?r.items:le(r,"children")?r.children:null:null}function B(e,r){var t=e.setups,n=t.__configs,o=t.__events,i=o.length,a=e.style;for(var f in r)if(le(r,f)){var u=r[f],l=We.indexOf(f);if(-1==l)e[f]=u;else if(Ze>l)a[f]=isNaN(u)?u:u+"px";else if($e>l)a[f]=u;else if(Ge>l)le(n,"defaults")||ie(n,"defaults",{value:pe()}),k(n.defaults,u);else if(Je>l)t[f]=u;else if(Qe>l)t.children=u;else if(Ue>l)u.forEach(function(e){o[i++]=e});else if(Xe>l)o[i++]=k({type:f},u);else if(Ye>l)t[f]=u;else if(rr>l){if(!u)continue;le(t,"cls")||(t.cls=""),t.cls+=u+" "}else tr>l?e.appendChild(document.createTextNode(u)):ie(t,"parent",{value:u})}}function z(e){var r=e.setups;r&&le(r,"attrs")&&i(r.attrs,function(r,t){e.setAttribute(y(t),r)})}function F(e){var r=e.setups;if(r&&le(r,"style")){var t=e.style,n=r.style;for(var o in n)if(le(n,o)){var i=n[o];-1!==xe.indexOf(o)?t[o]=isNaN(i)?i:i+"px":t[o]=i}}}function H(e,r){var t=e.setups;if(t&&le(t,"__events"))for(var n=0,o=t.__events,i=o.length;i>n;n++){var a=o[n];N(e,a,r)}}function I(e){var r=e.setups;r&&le(r,"cls")&&r.cls&&(e.className=r.cls.trim())}function W(e,t){var n=e.setups;n&&le(n,"created")&&r(n.created)&&n.created.call(t,e,t)}function Z(e){if(le(e,"if")&&!d(e["if"]))return null;var r=le(e,"tag")?e.tag:"div",t=document.createElement(r);return ee(t),B(t,e),t}function $(e,r,t){var n=T(e),o=O(r,n),i=Z(o);return i?(z(i),F(i),H(i,t),I(i),i.root_=t,i):null}function G(e,r,t,n){if(null!==r&&"undefined"!=typeof r&&(q(e,r,t),D(e,r,n),!le(r,"d__isCmp"))){var o=V(r);X(r,o,t),W(r,t)}}function J(r,t,o,i){var a=null;return de(t)||"function"==typeof t?null:(se(t)?a=le(t,"ctype")?te(t):$(r,t,o):e(t)?a=document.createTextNode(t):n(t)&&(a=t),i&&a&&(a.groupKey=i),a)}function Q(e,r,t,n,o){var i=r["for"];if(i){var a,f,u,l=le(r,"root")?i[r.root]:i,c=r.tplFn;if(l&&"function"==typeof c){var s=n;if(le(r,"scope")){var v=opts.scope;s="root"===v?n:"parent"===v?parent:v}if(de(l))l.forEach(function(r,i){f=c.call(s,r,i),u=J(e,f,n,t),u&&G(e,u,n,o)});else if(se(l)&&r.alwaysIterate){var p=ae(l);a=p.forEach(function(r,i){return f=c.call(s,l[r],r),u=J(e,f,n,t),u&&G(e,u,n,o),u})}else f=c.call(s,l),de(f)||(f=[f]),a=f.forEach(function(r,i){return u=J(e,r,n,t),u&&G(e,u,n,o),u})}}}function U(r,t,n){var o;if(le(t,"observeProp")){var i=t.observeProp,o=nr++;if(i&&e(i)&&"__owner"!==i){M(r,t,o,n)}}Q(r,t,o,n)}function X(e,r,t){if(r){var o;if(se(r))return le(r,"ctype")?(o=te(r),void G(e,o,t)):void(le(r,"for")?U(e,r,t):(o=$(e,r,t),G(e,o,t)));if(de(r))return void r.forEach(function(r){X(e,r,t)});if("function"==typeof r){var i=r();return void X(e,i,t)}n(r)?G(e,r,t):G(e,document.createTextNode(r),t)}}function Y(e){var r=e.setups;if(r){var t=V(e);X(e,t,e)}}function ee(e){var r=pe();oe(r,{__configs:{value:pe()},__events:{value:[]}}),e.setups=r}function re(e){var t=le(e,"tag")?e.tag:"div",n=document.createElement(t);ie(n,"d__isCmp",{value:!0}),ee(n),B(n,e),z(n),F(n),H(n,n),I(n),Y(n);var o=n.setups;return le(o,"created")&&r(o.created)&&o.created.call(n,n,n),le(o,"parent")&&(o.parent.appendChild(n),le(o,"appended")&&o.appended.call(n)),n}function te(e){var r=e.ctype,t=Ne.get(r).create(e),n=re(t);return n}function ne(e){return le(e,"ctype")?te(e):re(e)}var oe=Object.defineProperties,ie=Object.defineProperty,ae=Object.keys,fe=Object.prototype,ue=fe.hasOwnProperty,le=function(e,r){return ue.call(e,r)},ce=Object.prototype.toString,se=function(e){return"[object Object]"===ce.call(e)},ve=Object.create,pe=function(e){var r=ve(null);for(var t in e)le(e,t)&&(r[t]=e[t]);return r},he="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e},de=Array.isArray,ye=/([A-Z])/g,ge=[],_e=Element.prototype,me=_e.matches||_e.matchesSelector||_e.msMatchesSelector||_e.webkitMatchesSelector||_e.mozMatchesSelector||_e.oMatchesSelector,be=["keydown","keypress","keyup","input"],we=["blur","focus"];b.__proto__=Array.prototype,b.prototype=Object.create(Array.prototype),oe(b.prototype,{removeAll:{value:function(){for(var e=0;e<this.length;e++)this[e].destroy();this.length=0}}});var Ee=pe(),Ne=pe();oe(Ne,{register:{value:function(e,t){if(le(Ee,e))throw Error("Name already registered");if(!r(t))throw Error("Not valid definitions");return ie(Ee,e,{value:pe({create:t})}),this}},get:{value:function(e){if(!Ee[e])throw Error("No component registered");return Ee[e]}}});var ke=function(e){if(!e)throw new Error("No root provided");oe(this,{__owner:{value:e},__data:{value:pe()},__tpl:{value:pe()}})};oe(ke.prototype,{add:{value:function(e,r,t,n){var o=r.observeProp,r=x(pe({parent:e,groupKey:t}),r,"tplFn,scope,for,root,observeProp,alwaysIterate"),i=r["for"],a=le(this,o);a?this.__tpl[o].push(r):(this.__data[o]=i,this.__tpl[o]=[r],ie(this,o,{get:L.bind(this,o),set:R.bind(this,o)}))}},insert:{value:function(e,r,t){e=""+e;var n=this[e];if(!n||!de(n))throw new Error("Value for property ["+e+"] is not an array.");if(isNaN(r))return void(arguments.length>1&&this.push.apply(this,arguments));var o,i=n.length,a=r;if(!(r>i||0>r)){if(de(t)){o=t;for(var f=0;f<t.length;f++)n.splice(a++,0,t[f])}else o=[t],n.splice(a,0,t);for(var u=this.__tpl[e],f=0,l=u.length;l>f;f++){var c=u[f],v=c.parent,p=c.groupKey,h=s(v,r,"groupKey",p),d=this.__owner;h&&(c["for"]=o,Q(v,c,p,d,h))}}}},remove:{value:function(e,r){e=""+e;var t=this[e];if(!t||!de(t))throw new Error("Value for property ["+e+"] is not an array.");var n=t.length;if(de(r)||(r=[r]),!a(r,isNaN)){var o=this.__tpl[e];r.sort();for(var i=0,f=o.length;f>i;i++)for(var u=o[i],l=u.parent,c=u.groupKey,v=0,p=0,h=r.length;h>p;p++){var d=r[i];if(!(d>n||0>r)){var y=s(l,d,"groupKey",c);y&&(A([y]),t.splice(d-v++,1))}}}}},push:{value:function(e,r){e=""+e;var t=this[e];if(!t||!de(t))throw new Error("Value for property ["+e+"] is not an array.");var n,o=t.length;if(de(r)){n=r;for(var i=0;i<r.length;i++)t[o++]=r[i]}else n=[r],t[o++]=r;for(var a=this.__tpl[e],i=0,u=a.length;u>i;i++){var l,c=a[i],s=c.parent,p=c.groupKey,h=f(v(s,"groupKey",p)),d=this.__owner;h&&(l=h.nextSibling),c["for"]=n,Q(s,c,p,d,l)}return t.length}},pop:{value:function(e){e=""+e;var r=this[e];if(!r||!de(r))throw new Error("Value for property ["+e+"] is not an array.");for(var t=this.__tpl[e],n=[],o=0,i=0,a=t.length;a>i;i++){var f=t[i],u=f.parent,l=f.groupKey,s=c(u,"groupKey",l);s&&(n[o++]=s)}A(n),r.pop()}},shift:{value:function(e){e=""+e;var r=this[e];if(!r||!de(r))throw new Error("Value for property ["+e+"] is not an array.");for(var t=this.__tpl[e],n=[],o=0,i=0,a=t.length;a>i;i++){var f=t[i],u=f.parent,c=f.groupKey,s=l(u,"groupKey",c);s&&(n[o++]=s)}A(n),r.shift()}},unshift:{value:function(e,r){e=""+e;var t=this[e];if(!t||!de(t))throw new Error("Value for property ["+e+"] is not an array.");var n;t.length;if(de(r)){n=r;for(var o=0;o<r.length;o++)t.unshift(r[o])}else n=[r],t.unshift(r);for(var i=this.__tpl[e],o=0,a=i.length;a>o;o++){var u=i[o],c=u.parent,s=u.groupKey,p=(f(v(c,"groupKey",s)),l(c,"groupKey",s)),h=this.__owner;u["for"]=n,Q(c,u,s,h,p)}return t.length}}}),oe(P.prototype,{remove:{value:function(e){if("function"!=typeof e)return!1;for(var r=Object.keys(this),t=0,n=0;n<r.length;n++){var o=r[n];e.call(null,this[o],o)&&(t+=delete this[o]?1:0)}return t==r.length}},removeRef:{value:function(t){if(e(t)){if(t=""+t,le(this,t))return delete this[t]}else if(r(t)){for(var n=Object.keys(this),o=0,i=0;i<n.length;i++){var a=n[i];expression.call(null,this[a],a)&&(o+=delete this[a]?1:0)}return o==n.length}return!1}},removeAll:{value:function(){for(var e=Object.keys(this),r=0;r<e.length;r++)delete this[e[r]];return r===e.length}}});var xe=["width","height","maxWidth","minWidth","maxHeight","minHeight"];!["","Top","Right","Bottom","Left"].forEach(function(e){xe.push("padding"+e),xe.push("margin"+e)});var Oe=xe,Ke=["color","backgroundColor","background","display","position","border","transform","opacity","fontSize"],Se=["defaults"],je=["style","attrs"],Ce=["children","items"],Ae=["events"],Le=(Oe.concat(Ke),["click","mousedown","mouseup","mouseover","mouseout","mouseenter","mouseleave","mousemove"]),Re=["dragstart","dragend","drag","dragover","dragenter","dragleave","drop"],Me=["blur","focus"],Pe=["keydown","keypress","keyup"],qe=["change","input","submit"],De=["touchstart","touchmove","touchend"],Te=["wheel","scroll"],Ve=Le.concat(Re,Me,Pe,qe,De,Te),Be=["created","appended"],ze=["className","cls"],Fe=["xtraCls","xCls"],He=(Fe.concat(ze),["text","textContent"]),Ie=["parent"],We=Oe.concat(Ke,Se,je,Ce,Ae,Ve,Be,ze,Fe,He,Ie),Ze=Oe.length,$e=Ze+Ke.length,Ge=$e+Se.length,Je=Ge+je.length,Qe=Je+Ce.length,Ue=Qe+Ae.length,Xe=Ue+Ve.length,Ye=Xe+Be.length,er=Ye+ze.length,rr=er+Fe.length,tr=rr+He.length,nr=Math.floor(1e5*Math.random()),or=pe();return oe(or,{create:{value:ne},query:{value:u},queryDirect:{value:l},queryLastDirect:{value:c},queryAll:{value:p},queryAllDirect:{value:v},queryAllByMultipleKeys:{value:h},attachEvent:{value:N},register:{value:function(e,r){return Ne.register(e,r),this}}}),or});
+!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define("Dominic",r):e.Dominic=r()}(this,function(){"use strict";function e(e){var r="undefined"==typeof e?"undefined":de(e);return"string"===r||"number"===r}function r(e){return"function"==typeof e}function t(e,r){if(!he(e))return!1;for(var t=e.length,n=0;t>n;n++)if(de(e[n])!==r)return!1;return!0}function n(e){return e instanceof Node}function o(e){e=e||[];var r=arguments.length;if(2>r)return e;for(var t=e.length,n=1;r>n;n++)for(var o=arguments[n],i=0;i<o.length;i++)e[t++]=o[i];return e}function i(e,r,t){for(var n in e)le(e,n)&&r.call(t,e[n],n)}function a(e,r,t){if(!e||!e.length)return!1;for(var n=e.length,o=0;n>o;o++)if(r.call(t,e[o],o,e))return!0;return!1}function f(e){return e?e[e.length-1]:null}function u(e,r,t){for(var n=null,o=e.childNodes,i=o.length,a=0;i>a;a++){var f=o[a];if(n=!le(f,r)||"undefined"!=typeof t&&f[r]!==t?u(f,r,t):f)return n}return n}function l(e,r,t){for(var n=e.childNodes,o=n.length,i=0;o>i;i++){var a=n[i];if(le(a,r)&&("undefined"==typeof t||a[r]===t))return a}return null}function c(e,r,t){for(var n=e.childNodes,o=n.length,i=o-1;i>-1;i++){var a=n[i];if(le(a,r)&&("undefined"==typeof t||a[r]===t))return a}return null}function s(e,r,t,n){for(var o=e.childNodes,i=o.length,a=-1,f=0;i>f;f++){var u=o[f];if(-1===a&&(!le(u,t)||"undefined"!=typeof n&&u[t]!==n||-1===a&&(a=f)),-1!==a&&f-a===r)return u}return null}function v(e,r,t){for(var n=[],o=e.childNodes,i=o.length,a=0,f=0;i>f;f++){var u=o[f];!le(u,r)||"undefined"!=typeof t&&u[r]!==t||(n[a++]=u)}return n}function p(e,r,t){for(var n=[],i=e.childNodes,a=i.length,f=0;a>f;f++){var u=i[f];!le(u,r)||"undefined"!=typeof t&&u[r]!==t||(n[n.length]=u),o(n,p(u,r,t))}return n}function d(e,r){if(r)for(var t=Object.keys(r),n=t.length,i=[],a=e.childNodes,f=a.length,u=0,l=0;f>l;l++){for(var c=a[l],s=0;n>s;s++){var v=t[s];if(le(c,v)&&("undefined"==typeof value||c[v]===value)){i[u++]=c;break}}o(i,d(c,r))}}function h(e){return!!("function"==typeof e?e():e)}function y(e){return e.replace(ye,"-$1").toLowerCase()}function g(e){var r=e.id?"#"+e.id:"",t=e.classList.toString(),n=t?t.split(" "):ge,o=e.localName+r+(n.length?"."+n.join("."):"");return o}function _(e,r){return me.call(e,r)}function m(e,r,t){for(;r&&r!==e;){if(_(r,t))return r;r=r.parentNode}return null}function b(){}function w(e,r){function t(e){if("string"==typeof f){if(o===e.target)return;var t=m(o,e.target,f);if(!t)return;"function"==typeof i&&i.call(r,e,t,f)}else"function"==typeof i&&i.call(r,e)}var n=e.type,o=e.el,i=e.callback,a=e.capture,f=e.delegate;return t.destroy=function(){return o.removeEventListener(n,t,a)},o.addEventListener(n,t,a),t}function E(e,r){function t(e){if("string"==typeof f){if(o===e.target)return;var t=m(o,e.target,f);if(!t)return;if(u&&-1===u.indexOf(e.keyCode))return;"function"==typeof i&&i.call(r,e,t,f)}else{if(u&&-1===u.indexOf(e.keyCode))return;"function"==typeof i&&i.call(r,e)}}var n=e.type,o=e.el,i=e.callback,a=e.capture,f=e.delegate,u=e.keys;return t.destroy=function(){return o.removeEventListener(n,t,a)},o.addEventListener(n,t,a),t}function N(e,r,n){var o=r.type;if(!o)throw new Error("No event type specified");var i,a=r.handler,f="undefined"==typeof a?"undefined":de(a);n=n||e;var u="root"===r.scope?n:le(r,"scope")?r.scope:e;if("function"===f?i=a:"string"===f&&(i=u[a]),"function"!=typeof i)throw new Error('Cannot find handler: "'+a+'" on element: ['+g(u)+"].");var l,c=!!r.capture,s=r.delegate,v=-1!==be.indexOf(o),p=-1!==we.indexOf(o);if(v){var d=null;le(r,"key")&&("number"==typeof r.key?d=[r.key]:t(r.key,"number")&&(d=r.key)),l=E({type:o,el:e,callback:i,capture:c,delegate:s,keys:d},u)}else p&&s&&(c=!0),l=w({type:o,el:e,callback:i,capture:c,delegate:s},u);le(e,"evts")||(e.evts=new b),e.evts.push(l),e.hse=!0}function k(e){e=e||{};for(var r=1;r<arguments.length;r++){var t=arguments[r];if(t)for(var n in t)le(t,n)&&(e[n]=t[n])}return e}function x(e){e=e||{};var r=arguments.length;if(3>r)return e;var t=arguments[r-1];if("string"!=typeof t)return e;var n=t.split(",");if(!n.length)return e;for(var o=1;r-1>o;o++){var i=arguments[o];if(i)for(var a in i)if(le(i,a)){if(-1===n.indexOf(a))continue;var f=i[a];e[a]=f}}return e}function O(e){e=e||{};for(var r=1;r<arguments.length;r++){var t=arguments[r];if(t)for(var n in t)if(le(t,n)){var o=t[n];if(he(e))for(var i=0;i<e.length;i++){var a=e[i];le(a,n)||(a[n]=o)}else le(e,n)||(e[n]=o)}}return e}function S(e){e.evts.removeAll(),delete e.evts}function K(e){le(e,"evts")&&S(e);var r=p(e,"hse",!0);r.forEach(S)}function j(r){if(le(r,"ref")){var t=le(r,"refScope")&&"parent"===r.refScope?r.parentNode:r.root_;return void(le(t,"refs")&&t.refs.removeRef(r.ref))}if(le(r,"directRef")){var n=r.directRef;e(n)&&""!==n&&delete r.root_[n]}}function C(e){le(e,"refs")&&(e.refs.removeAll(),delete e.refs),le(e,"ref")?j(e):le(e,"directRef")&&delete root[e.directRef];var r=p(e,"hsr",!0);r.forEach(j)}function A(e){e.forEach(function(e,r){e.nodeType===Node.ELEMENT_NODE&&(C(e),K(e)),e.parentNode.removeChild(e)})}function R(e){return this.__data[e]}function L(e,r){var t=this.__tpl[e],n=this.__owner;this.__data[e]=r;for(var o=0,i=t.length;i>o;o++){var a,u=t[o],l=u.parent,c=u.groupKey,s=v(l,"groupKey",c),n=this.__owner;u["for"]=r,s.length&&(a=f(s).nextSibling),A(s),Q(l,u,c,n,a)}}function M(e,r,t,n){return le(n,"observe")||(n.observe=new ke(n)),n.observe.add(e,r,t,n),n.observe}function P(){}function q(r,t,n){var o,i;if(le(t,"ref")){if(o=t.ref,""===o||!e(o))return;var a=le(t,"refScope")&&"parent"===t.refScope?r:n;le(a,"refs")||(a.refs=new P),i=a.refs}else{if(!le(t,"directRef"))return;if(o=t.directRef,""===o||!e(o))return;i=n}i[o]=t,t.hsr=!0}function D(e,r,t){t?e.insertBefore(r,t):e.appendChild(r)}function T(e){var r=e.setups;return r?r.__configs.defaults:null}function V(e){var r=e.setups;return r?le(r,"items")?r.items:le(r,"children")?r.children:null:null}function B(e,r){var t=e.setups,n=t.__configs,o=t.__events,i=o.length,a=e.style;for(var f in r)if(le(r,f)){var u=r[f],l=We.indexOf(f);if(-1==l)e[f]=u;else if(Ze>l)a[f]=isNaN(u)?u:u+"px";else if($e>l)a[f]=u;else if(Ge>l)le(n,"defaults")||ie(n,"defaults",{value:pe()}),k(n.defaults,u);else if(Je>l)t[f]=u;else if(Qe>l)t.children=u;else if(Ue>l)u.forEach(function(e){o[i++]=e});else if(Xe>l)o[i++]=k({type:f},u);else if(Ye>l)t[f]=u;else if(rr>l){if(!u)continue;le(t,"cls")||(t.cls=""),t.cls+=u+" "}else tr>l?e.appendChild(document.createTextNode(u)):ie(t,"parent",{value:u})}}function z(e){var r=e.setups;r&&le(r,"attrs")&&i(r.attrs,function(r,t){e.setAttribute(y(t),r)})}function F(e){var r=e.setups;if(r&&le(r,"style")){var t=e.style,n=r.style;for(var o in n)if(le(n,o)){var i=n[o];-1!==xe.indexOf(o)?t[o]=isNaN(i)?i:i+"px":t[o]=i}}}function H(e,r){var t=e.setups;if(t&&le(t,"__events"))for(var n=0,o=t.__events,i=o.length;i>n;n++){var a=o[n];N(e,a,r)}}function I(e){var r=e.setups;r&&le(r,"cls")&&r.cls&&(e.className=r.cls.trim())}function W(e,t){var n=e.setups;n&&le(n,"created")&&r(n.created)&&n.created.call(t,e,t)}function Z(e){if(le(e,"if")&&!h(e["if"]))return null;var r=le(e,"tag")?e.tag:"div",t=document.createElement(r);return ee(t),B(t,e),t}function $(e,r,t){var n=T(e),o=O(r,n),i=Z(o);return i?(z(i),F(i),H(i,t),I(i),i.root_=t,i):null}function G(e,r,t,n){if(null!==r&&"undefined"!=typeof r){if(q(e,r,t),D(e,r,n),le(r,"d__isCmp"))return void(r.root_=t);var o=V(r);X(r,o,t),W(r,t)}}function J(r,t,o,i){var a=null;return he(t)||"function"==typeof t?null:(se(t)?a=le(t,"ctype")?te(t):$(r,t,o):e(t)?a=document.createTextNode(t):n(t)&&(a=t),i&&a&&(a.groupKey=i),a)}function Q(e,r,t,n,o){var i=r["for"];if(i){var a,f,u,l=le(r,"root")?i[r.root]:i,c=r.tplFn;if(l&&"function"==typeof c){var s=n;if(le(r,"scope")){var v=opts.scope;s="root"===v?n:"parent"===v?parent:v}if(he(l))l.forEach(function(r,i){f=c.call(s,r,i),u=J(e,f,n,t),u&&G(e,u,n,o)});else if(se(l)&&r.alwaysIterate){var p=ae(l);a=p.forEach(function(r,i){return f=c.call(s,l[r],r),u=J(e,f,n,t),u&&G(e,u,n,o),u})}else f=c.call(s,l),he(f)||(f=[f]),a=f.forEach(function(r,i){return u=J(e,r,n,t),u&&G(e,u,n,o),u})}}}function U(r,t,n){var o;if(le(t,"observeProp")){var i=t.observeProp,o=nr++;if(i&&e(i)&&"__owner"!==i){M(r,t,o,n)}}Q(r,t,o,n)}function X(e,r,t){if(r){var o;if(se(r))return le(r,"ctype")?(o=te(r),void G(e,o,t)):void(le(r,"for")?U(e,r,t):(o=$(e,r,t),G(e,o,t)));if(he(r))return void r.forEach(function(r){X(e,r,t)});if("function"==typeof r){var i=r();return void X(e,i,t)}n(r)?G(e,r,t):G(e,document.createTextNode(r),t)}}function Y(e){var r=e.setups;if(r){var t=V(e);X(e,t,e)}}function ee(e){var r=pe();oe(r,{__configs:{value:pe()},__events:{value:[]}}),e.setups=r}function re(e){var t=le(e,"tag")?e.tag:"div",n=document.createElement(t);ie(n,"d__isCmp",{value:!0}),ee(n),B(n,e),z(n),F(n),H(n,n),I(n),Y(n);var o=n.setups;return le(o,"created")&&r(o.created)&&o.created.call(n,n,n),le(o,"parent")&&(o.parent.appendChild(n),le(o,"appended")&&o.appended.call(n)),n}function te(e){var r=e.ctype,t=Ne.get(r).create(e);le(e,"ref")?(t.ref=e.ref,le(e,"refScope")&&(t.refScope=e.refScope)):le(e,"directRef")&&(t.directRef=e.directRef);var n=re(t);return n.ctype=r,n}function ne(e){return le(e,"ctype")?te(e):re(e)}var oe=Object.defineProperties,ie=Object.defineProperty,ae=Object.keys,fe=Object.prototype,ue=fe.hasOwnProperty,le=function(e,r){return ue.call(e,r)},ce=Object.prototype.toString,se=function(e){return"[object Object]"===ce.call(e)},ve=Object.create,pe=function(e){var r=ve(null);for(var t in e)le(e,t)&&(r[t]=e[t]);return r},de="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e},he=Array.isArray,ye=/([A-Z])/g,ge=[],_e=Element.prototype,me=_e.matches||_e.matchesSelector||_e.msMatchesSelector||_e.webkitMatchesSelector||_e.mozMatchesSelector||_e.oMatchesSelector,be=["keydown","keypress","keyup","input"],we=["blur","focus"];b.__proto__=Array.prototype,b.prototype=Object.create(Array.prototype),oe(b.prototype,{removeAll:{value:function(){for(var e=0;e<this.length;e++)this[e].destroy();this.length=0}}});var Ee=pe(),Ne=pe();oe(Ne,{register:{value:function(e,t){if(le(Ee,e))throw Error("Name already registered");if(!r(t))throw Error("Not valid definitions");return ie(Ee,e,{value:pe({create:t})}),this}},get:{value:function(e){if(!Ee[e])throw Error("No component registered");return Ee[e]}}});var ke=function(e){if(!e)throw new Error("No root provided");oe(this,{__owner:{value:e},__data:{value:pe()},__tpl:{value:pe()}})};oe(ke.prototype,{add:{value:function(e,r,t,n){var o=r.observeProp,r=x(pe({parent:e,groupKey:t}),r,"tplFn,scope,for,root,observeProp,alwaysIterate"),i=r["for"],a=le(this,o);a?this.__tpl[o].push(r):(this.__data[o]=i,this.__tpl[o]=[r],ie(this,o,{get:R.bind(this,o),set:L.bind(this,o)}))}},insert:{value:function(e,r,t){e=""+e;var n=this[e];if(!n||!he(n))throw new Error("Value for property ["+e+"] is not an array.");if(isNaN(r))return void(arguments.length>1&&this.push.apply(this,arguments));var o,i=n.length,a=r;if(!(r>i||0>r)){if(he(t)){o=t;for(var f=0;f<t.length;f++)n.splice(a++,0,t[f])}else o=[t],n.splice(a,0,t);for(var u=this.__tpl[e],f=0,l=u.length;l>f;f++){var c=u[f],v=c.parent,p=c.groupKey,d=s(v,r,"groupKey",p),h=this.__owner;d&&(c["for"]=o,Q(v,c,p,h,d))}}}},remove:{value:function(e,r){e=""+e;var t=this[e];if(!t||!he(t))throw new Error("Value for property ["+e+"] is not an array.");var n=t.length;if(he(r)||(r=[r]),!a(r,isNaN)){var o=this.__tpl[e];r.sort();for(var i=0,f=o.length;f>i;i++)for(var u=o[i],l=u.parent,c=u.groupKey,v=0,p=0,d=r.length;d>p;p++){var h=r[i];if(!(h>n||0>r)){var y=s(l,h,"groupKey",c);y&&(A([y]),t.splice(h-v++,1))}}}}},push:{value:function(e,r){e=""+e;var t=this[e];if(!t||!he(t))throw new Error("Value for property ["+e+"] is not an array.");var n,o=t.length;if(he(r)){n=r;for(var i=0;i<r.length;i++)t[o++]=r[i]}else n=[r],t[o++]=r;for(var a=this.__tpl[e],i=0,u=a.length;u>i;i++){var l,c=a[i],s=c.parent,p=c.groupKey,d=f(v(s,"groupKey",p)),h=this.__owner;d&&(l=d.nextSibling),c["for"]=n,Q(s,c,p,h,l)}return t.length}},pop:{value:function(e){e=""+e;var r=this[e];if(!r||!he(r))throw new Error("Value for property ["+e+"] is not an array.");for(var t=this.__tpl[e],n=[],o=0,i=0,a=t.length;a>i;i++){var f=t[i],u=f.parent,l=f.groupKey,s=c(u,"groupKey",l);s&&(n[o++]=s)}A(n),r.pop()}},shift:{value:function(e){e=""+e;var r=this[e];if(!r||!he(r))throw new Error("Value for property ["+e+"] is not an array.");for(var t=this.__tpl[e],n=[],o=0,i=0,a=t.length;a>i;i++){var f=t[i],u=f.parent,c=f.groupKey,s=l(u,"groupKey",c);s&&(n[o++]=s)}A(n),r.shift()}},unshift:{value:function(e,r){e=""+e;var t=this[e];if(!t||!he(t))throw new Error("Value for property ["+e+"] is not an array.");var n;t.length;if(he(r)){n=r;for(var o=0;o<r.length;o++)t.unshift(r[o])}else n=[r],t.unshift(r);for(var i=this.__tpl[e],o=0,a=i.length;a>o;o++){var u=i[o],c=u.parent,s=u.groupKey,p=(f(v(c,"groupKey",s)),l(c,"groupKey",s)),d=this.__owner;u["for"]=n,Q(c,u,s,d,p)}return t.length}}}),oe(P.prototype,{remove:{value:function(e){if("function"!=typeof e)return!1;for(var r=Object.keys(this),t=0,n=0;n<r.length;n++){var o=r[n];e.call(null,this[o],o)&&(t+=delete this[o]?1:0)}return t==r.length}},removeRef:{value:function(t){if(e(t)){if(t=""+t,le(this,t))return delete this[t]}else if(r(t)){for(var n=Object.keys(this),o=0,i=0;i<n.length;i++){var a=n[i];expression.call(null,this[a],a)&&(o+=delete this[a]?1:0)}return o==n.length}return!1}},removeAll:{value:function(){for(var e=Object.keys(this),r=0;r<e.length;r++)delete this[e[r]];return r===e.length}}});var xe=["width","height","maxWidth","minWidth","maxHeight","minHeight"];!["","Top","Right","Bottom","Left"].forEach(function(e){xe.push("padding"+e),xe.push("margin"+e)});var Oe=xe,Se=["color","backgroundColor","background","display","position","border","transform","opacity","fontSize"],Ke=["defaults"],je=["style","attrs"],Ce=["children","items"],Ae=["events"],Re=(Oe.concat(Se),["click","mousedown","mouseup","mouseover","mouseout","mouseenter","mouseleave","mousemove"]),Le=["dragstart","dragend","drag","dragover","dragenter","dragleave","drop"],Me=["blur","focus"],Pe=["keydown","keypress","keyup"],qe=["change","input","submit"],De=["touchstart","touchmove","touchend"],Te=["wheel","scroll"],Ve=Re.concat(Le,Me,Pe,qe,De,Te),Be=["created","appended"],ze=["className","cls"],Fe=["xtraCls","xCls"],He=(Fe.concat(ze),["text","textContent"]),Ie=["parent"],We=Oe.concat(Se,Ke,je,Ce,Ae,Ve,Be,ze,Fe,He,Ie),Ze=Oe.length,$e=Ze+Se.length,Ge=$e+Ke.length,Je=Ge+je.length,Qe=Je+Ce.length,Ue=Qe+Ae.length,Xe=Ue+Ve.length,Ye=Xe+Be.length,er=Ye+ze.length,rr=er+Fe.length,tr=rr+He.length,nr=Math.floor(1e5*Math.random()),or=pe();return oe(or,{create:{value:ne},query:{value:u},queryDirect:{value:l},queryLastDirect:{value:c},queryAll:{value:p},queryAllDirect:{value:v},queryAllByMultipleKeys:{value:d},attachEvent:{value:N},register:{value:function(e,r){return Ne.register(e,r),this}}}),or});

package.json

 {
   "name": "dominic",
-  "version": "0.1.44",
+  "version": "0.1.45",
   "description": "Helper to quickly build up DOM in simple javascript object format.",
@@ -5,0 +5,0 @@ "main": "dist/dominic.js",

README.md

@@ -55,2 +55,6 @@ ## Dominic
 ###### Styling
+* `color`, `backgroundColor`, `background`, `display`, `position`, `border`,
+  `transform`, `opacity`, `fontSize`
+  will be applied directly to element style without the need of putting them
+  in a style object. Same with: 
 * `width`, `height`, `minHeight`, `maxHeight`,  `minWidth`, `maxWidth`
@@ -226,3 +230,3 @@ * `margin`, `padding`, `margin` and `padding` + `(Top - Left - Right - Bottom)`
 
-#### Reference
+#### Reference 1
 ```javascript
@@ -252,2 +256,49 @@ var root = Dominic.create({
 
+#### Reference 2
+```javascript
+var root = Dominic.create({
+    className: 'root',
+    parent: document.body,
+    width: 300,
+    height: 300,
+    background: 'darkgreen',
+    items: [
+        { width: 50, height: 50, text: 'Intro', display: 'inline-block' },
+        { width: 200, ref: 'orange', // access by root.refs.orange
+            items: [
+                { width: 20, height: 20, background: 'red',
+                    ref: 'lightgreen' // access by root.refs.lightgreen
+                },
+                { width: 20, height: 20, background: 'orange',
+                    // access by root['orange-f2']
+                    // ref: 'orange', // using ref will get dominic ignore directRef
+                    directRef: 'orange-f2'
+                },
+            ]
+        }
+    ]
+})
+
+// example
+Dominic.register('input', function(defs) {
+    return {
+        items: [
+            { tag: 'span', text: defs.label },
+            { tag: 'input', placeholder: 'Choose name...' }
+        ]
+    }
+})
+// usage
+var root = Dominic.create({
+    cls: 'root', 
+    items: [
+        // accessed by root.refs.nameInput
+        // previously have to define ref in component definitions
+        { ctype: 'input', ref: 'nameInput', label: 'Name: ' },
+        // accessed by root.nameInput2
+        { ctype: 'input', directRef: 'nameInput2', label: 'Name 2: ' }
+    ]
+})
+```
+
 #### Events 1:
@@ -254,0 +305,0 @@ Reserved keyword for events:

src/modules/create.js

@@ -237,3 +237,6 @@ import { has, createDict, defProp, defProps, isPlain, getKeys } from './object'
     insertBefore(parent, child, stop)
-    if (has(child, 'd__isCmp')) return
+    if (has(child, 'd__isCmp')) {
+        child.root_ = root
+        return
+    }
     var f2 = getChildrenConfigs(child)
@@ -431,3 +434,12 @@ setChildren(child, f2, root)
     var definitions = Component.get(ctype).create(defs)
+    // Carry the reference to the component
+    if (has(defs, 'ref')) {
+        definitions.ref = defs.ref
+        if (has(defs, 'refScope'))
+            definitions.refScope = defs.refScope
+    }
+    else if (has(defs, 'directRef'))
+        definitions.directRef = defs.directRef
     var comp = createElement(definitions)
+    comp.ctype = ctype
     return comp
@@ -434,0 +446,0 @@ }

src/modules/observer.js

@@ -29,3 +29,3 @@ import { has, createDict, defProps, defProp } from './object'
         var directRef = el.directRef
-        if (!isStrOrNum(directRef) && directRef !== '') {
+        if (isStrOrNum(directRef) && directRef !== '') {
             delete el.root_[directRef]
@@ -40,6 +40,7 @@ }
 	}
-	if (has(el, 'ref'))
+	if (has(el, 'ref')) {
 		removeRef(el)
-    else if (has(el, 'directRef'))
+    } else if (has(el, 'directRef')) {
         delete root[el.directRef]
+    }
 	var hasRefEls = queryAll(el, 'hsr', true)
@@ -46,0 +47,0 @@ hasRefEls.forEach(removeRef)

No alert changes

Improved metrics

Total package byte prevSize

132985

increased by2.64%

Lines of code

2692

increased by0.98%

Number of lines in readme file

748

increased by7.32%

No dependency changes