react-shadow - npm Package Compare versions

Comparing version 0.2.3 to 0.2.4

bower.json

 {
   "name": "react-shadow",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "homepage": "https://github.com/Wildhoney/ReactShadow",
@@ -5,0 +5,0 @@ "authors": [

component/ReactShadow.js

@@ -30,3 +30,3 @@ (function main($window, $document) {
      */
-    $window.ReactShadow = {
+    var ReactShadow = {
 
@@ -49,9 +49,5 @@ /**
 
-            // Attach CSS
-            if (this.cssDocuments) {
-                this._attachCSSDocuments(shadowRoot);
-            }
-            if (this.cssSource) {
-                this._attachCSSSource(shadowRoot);
-            }
+            // Attach CSS.
+            this._attachCSS(shadowRoot);
+
             // Append the template node's content to our component.
@@ -84,2 +80,20 @@ shadowRoot.appendChild(mainElement);
         /**
+         * @method _attachCSS
+         * @param {HTMLElement} shadowRoot
+         * @return {void}
+         * @private
+         */
+        _attachCSS: function _attachCSS(shadowRoot) {
+
+            if (this.cssDocuments) {
+                this._attachCSSDocuments(shadowRoot);
+            }
+
+            if (this.cssSource) {
+                this._attachCSSSource(shadowRoot);
+            }
+
+        },
+
+        /**
          * @method _interceptEvents
@@ -138,22 +152,25 @@ * @return {void}
 
-
         /**
+         * Construct the HTML for the external stylesheets
+         *
          * @method createStyle
-         * @param  {HTMLElement} element
-         * @param  {string} styleContent Content style for given element
-         * @return {HTMLElement}              
+         * @param {HTMLElement} element
+         * @param {String} styleContent Content style for given element.
+         * @return {HTMLElement}
+         * @private
          */
         _createStyle: function(element, styleContent) {
-            // Construct the HTML for the external stylesheets.
-            var styleElement = $document.createElement('style');
+
+            var styleElement       = $document.createElement('style');
             styleElement.innerHTML = styleContent;
             element.appendChild(styleElement);
             return element;
+
         },
 
-
         /**
          * @method _attachCSSSource
          * @param  {HTMLElement} element
-         * @return {HTMLElement}      
+         * @return {HTMLElement}
+         * @private
          */
@@ -191,2 +208,7 @@ _attachCSSSource: function(element) {
 
+
+    // Export the module attached to the `$window` element or as a CommonJS module.
+    var root = typeof exports !== 'undefined' && exports !== null ? exports : $window;
+    root.ReactShadow = ReactShadow;
+
 })(window, window.document);

dist/react-shadow.js

@@ -30,3 +30,3 @@ (function main($window, $document) {
      */
-    $window.ReactShadow = {
+    var ReactShadow = {
 
@@ -49,9 +49,5 @@ /**
 
-            // Attach CSS
-            if (this.cssDocuments) {
-                this._attachCSSDocuments(shadowRoot);
-            }
-            if (this.cssSource) {
-                this._attachCSSSource(shadowRoot);
-            }
+            // Attach CSS.
+            this._attachCSS(shadowRoot);
+
             // Append the template node's content to our component.
@@ -84,2 +80,20 @@ shadowRoot.appendChild(mainElement);
         /**
+         * @method _attachCSS
+         * @param {HTMLElement} shadowRoot
+         * @return {void}
+         * @private
+         */
+        _attachCSS: function _attachCSS(shadowRoot) {
+
+            if (this.cssDocuments) {
+                this._attachCSSDocuments(shadowRoot);
+            }
+
+            if (this.cssSource) {
+                this._attachCSSSource(shadowRoot);
+            }
+
+        },
+
+        /**
          * @method _interceptEvents
@@ -138,22 +152,25 @@ * @return {void}
 
-
         /**
+         * Construct the HTML for the external stylesheets
+         *
          * @method createStyle
-         * @param  {HTMLElement} element
-         * @param  {string} styleContent Content style for given element
-         * @return {HTMLElement}              
+         * @param {HTMLElement} element
+         * @param {String} styleContent Content style for given element.
+         * @return {HTMLElement}
+         * @private
          */
         _createStyle: function(element, styleContent) {
-            // Construct the HTML for the external stylesheets.
-            var styleElement = $document.createElement('style');
+
+            var styleElement       = $document.createElement('style');
             styleElement.innerHTML = styleContent;
             element.appendChild(styleElement);
             return element;
+
         },
 
-
         /**
          * @method _attachCSSSource
          * @param  {HTMLElement} element
-         * @return {HTMLElement}      
+         * @return {HTMLElement}
+         * @private
          */
@@ -191,2 +208,7 @@ _attachCSSSource: function(element) {
 
+
+    // Export the module attached to the `$window` element or as a CommonJS module.
+    var root = typeof exports !== 'undefined' && exports !== null ? exports : $window;
+    root.ReactShadow = ReactShadow;
+
 })(window, window.document);

dist/react-shadow.min.js

@@ -1,1 +0,1 @@
-!function(t,e){"use strict";var n;n="function"==typeof require?require("react"):t.React;var o="data-reactid",i="main";t.ReactShadow={_shadowRoot:{},componentDidMount:function(){var t=this._shadowRoot=this.getDOMNode().parentNode.createShadowRoot(),o=e.createElement(i);this.cssDocuments&&this._attachCSSDocuments(t),this.cssSource&&this._attachCSSSource(t),t.appendChild(o),n.render(this.render(),o),this._interceptEvents();var r=e.createElement("script");this.getDOMNode().parentNode.appendChild(r),r.appendChild(this.getDOMNode())},componentDidUpdate:function(){var t=this._shadowRoot.querySelector(i);n.render(this.render(),t)},_interceptEvents:function(){var t=this.getDOMNode().getAttribute(o),n=this.getDOMNode().parentNode,i=function(i){i.stopPropagation();var r=i.target.getAttribute(o);if(r){var s=r.replace(/\.[0-9]+/,t),c=n.querySelector("*["+o+'="'+s+'"]');i.target.value&&c.setAttribute("value",i.target.value);var a=e.createEvent("Events");a.initEvent(i.type,!0,!1),c.dispatchEvent(a)}}.bind(this),r=["click","dblclick","mouseup","mouseout","mouseover","mousedown","mouseenter","mouseleave","contextmenu","keyup","keydown","change"];r.forEach(function(t){this._shadowRoot.addEventListener(t,i)}.bind(this))},_createStyle:function(t,n){var o=e.createElement("style");return o.innerHTML=n,t.appendChild(o),t},_attachCSSSource:function(t){this._createStyle(t,this.cssSource)},_attachCSSDocuments:function(t){var e=this;if(this.cssDocuments){var n="function"==typeof this.cssDocuments,o=n?this.cssDocuments():this.cssDocuments;o.forEach(function(n){e._createStyle(t,'@import "'+n+'"')})}return t}}}(window,window.document);
+!function(t,e){"use strict";var n;n="function"==typeof require?require("react"):t.React;var o="data-reactid",i="main",r={_shadowRoot:{},componentDidMount:function(){var t=this._shadowRoot=this.getDOMNode().parentNode.createShadowRoot(),o=e.createElement(i);this._attachCSS(t),t.appendChild(o),n.render(this.render(),o),this._interceptEvents();var r=e.createElement("script");this.getDOMNode().parentNode.appendChild(r),r.appendChild(this.getDOMNode())},componentDidUpdate:function(){var t=this._shadowRoot.querySelector(i);n.render(this.render(),t)},_attachCSS:function(t){this.cssDocuments&&this._attachCSSDocuments(t),this.cssSource&&this._attachCSSSource(t)},_interceptEvents:function(){var t=this.getDOMNode().getAttribute(o),n=this.getDOMNode().parentNode,i=function(i){i.stopPropagation();var r=i.target.getAttribute(o);if(r){var s=r.replace(/\.[0-9]+/,t),a=n.querySelector("*["+o+'="'+s+'"]');i.target.value&&a.setAttribute("value",i.target.value);var c=e.createEvent("Events");c.initEvent(i.type,!0,!1),a.dispatchEvent(c)}}.bind(this),r=["click","dblclick","mouseup","mouseout","mouseover","mousedown","mouseenter","mouseleave","contextmenu","keyup","keydown","change"];r.forEach(function(t){this._shadowRoot.addEventListener(t,i)}.bind(this))},_createStyle:function(t,n){var o=e.createElement("style");return o.innerHTML=n,t.appendChild(o),t},_attachCSSSource:function(t){this._createStyle(t,this.cssSource)},_attachCSSDocuments:function(t){var e=this;if(this.cssDocuments){var n="function"==typeof this.cssDocuments,o=n?this.cssDocuments():this.cssDocuments;o.forEach(function(n){e._createStyle(t,'@import "'+n+'"')})}return t}},s="undefined"!=typeof exports&&null!==exports?exports:t;s.ReactShadow=r}(window,window.document);

package.json

 {
   "name": "react-shadow",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "description": "Use Shadow DOM with React.js and CSS imports; write your component styles in CSS!",
@@ -5,0 +5,0 @@ "main": "dist/react-shadow.min.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

27856

increased by4.05%

Lines of code

527

increased by6.04%

No dependency changes