mjml-core - npm Package Compare versions

Comparing version 4.0.0-alpha.2 to 4.0.0-alpha.3

lib/components.js

@@ -9,10 +9,6 @@ 'use strict';
 
-var _flatMap = require('lodash/flatMap');
+var _kebabCase = require('lodash/kebabCase');
 
-var _flatMap2 = _interopRequireDefault(_flatMap);
+var _kebabCase2 = _interopRequireDefault(_kebabCase);
 
-var _merge = require('lodash/merge');
-
-var _merge2 = _interopRequireDefault(_merge);
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -22,4 +18,4 @@
 
-function registerComponent(component) {
-  components[component.getName()] = component;
+function registerComponent(Component) {
+  components[(0, _kebabCase2.default)(Component.name)] = Component;
 }
@@ -31,6 +27,6 @@
 
-  var component = components[name];
+  var Component = components[name];
 
-  if (component) {
-    return new component(initialDatas);
+  if (Component) {
+    return new Component(initialDatas);
   }
@@ -37,0 +33,0 @@

lib/createComponent.js

@@ -6,2 +6,3 @@ 'use strict';
 });
+exports.HeadComponent = exports.BodyComponent = undefined;
 
@@ -12,5 +13,3 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
-exports.createBodyComponent = createBodyComponent;
-exports.createHeadComponent = createHeadComponent;
-exports.default = createComponent;
+var _class, _temp;
 
@@ -21,2 +20,6 @@ var _forEach = require('lodash/forEach');
 
+var _identity = require('lodash/identity');
+
+var _identity2 = _interopRequireDefault(_identity);
+
 var _reduce = require('lodash/reduce');
@@ -26,2 +29,6 @@
 
+var _kebabCase = require('lodash/kebabCase');
+
+var _kebabCase2 = _interopRequireDefault(_kebabCase);
+
 var _objectPath = require('object-path');
@@ -31,2 +38,6 @@
 
+var _mjmlParserXml = require('mjml-parser-xml');
+
+var _mjmlParserXml2 = _interopRequireDefault(_mjmlParserXml);
+
 var _shorthandParser = require('./helpers/shorthandParser');
@@ -36,269 +47,242 @@
 
-var _mjmlParserXml = require('mjml-parser-xml');
+var _components = require('./components');
 
-var _mjmlParserXml2 = _interopRequireDefault(_mjmlParserXml);
+var _components2 = _interopRequireDefault(_components);
 
-var _components = require('./components');
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
 
-function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) {
-  var desc = {};
-  Object['ke' + 'ys'](descriptor).forEach(function (key) {
-    desc[key] = descriptor[key];
-  });
-  desc.enumerable = !!desc.enumerable;
-  desc.configurable = !!desc.configurable;
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
 
-  if ('value' in desc || desc.initializer) {
-    desc.writable = true;
-  }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-  desc = decorators.slice().reverse().reduce(function (desc, decorator) {
-    return decorator(target, property, desc) || desc;
-  }, desc);
+var Component = (_temp = _class = function () {
+  _createClass(Component, null, [{
+    key: 'getTagName',
+    value: function getTagName() {
+      return (0, _kebabCase2.default)(this.name);
+    }
+  }]);
 
-  if (context && desc.initializer !== void 0) {
-    desc.value = desc.initializer ? desc.initializer.call(context) : void 0;
-    desc.initializer = undefined;
-  }
+  function Component() {
+    var initialDatas = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
 
-  if (desc.initializer === void 0) {
-    Object['define' + 'Property'](target, property, desc);
-    desc = null;
-  }
+    _classCallCheck(this, Component);
 
-  return desc;
-}
+    var _initialDatas$attribu = initialDatas.attributes,
+        attributes = _initialDatas$attribu === undefined ? {} : _initialDatas$attribu,
+        _initialDatas$childre = initialDatas.children,
+        children = _initialDatas$childre === undefined ? [] : _initialDatas$childre,
+        _initialDatas$content = initialDatas.content,
+        content = _initialDatas$content === undefined ? '' : _initialDatas$content,
+        _initialDatas$context = initialDatas.context,
+        context = _initialDatas$context === undefined ? {} : _initialDatas$context,
+        _initialDatas$props = initialDatas.props,
+        props = _initialDatas$props === undefined ? {} : _initialDatas$props;
 
-function createBodyComponent(name, component) {
-  return createComponent('body', name, component);
-}
 
-function createHeadComponent(name, component) {
-  return createComponent('head', name, component);
-}
+    this.props = _extends({}, props, {
+      children: children,
+      content: content
+    });
 
-function createComponent(type, name, component) {
-  var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _desc, _value, _class;
+    this.attributes = _extends({}, this.constructor.defaultAttributes, attributes);
+    this.context = context;
 
-  var onlyFor = function onlyFor(forType) {
-    return function (target, key, desc) {
-      var fn = desc.value;
+    return this;
+  }
 
-      desc.value = function () {
-        if (forType !== type) {
-          throw new Error('This method can be use only with a ' + type + ' component.');
-        }
+  _createClass(Component, [{
+    key: 'getChildContext',
+    value: function getChildContext() {
+      return this.context;
+    }
+  }, {
+    key: 'getAttribute',
+    value: function getAttribute(name) {
+      return this.attributes[name];
+    }
+  }, {
+    key: 'getContent',
+    value: function getContent() {
+      return this.props.content.trim();
+    }
+  }, {
+    key: 'renderMJML',
+    value: function renderMJML(mjml) {
+      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
 
-        for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
-          args[_key] = arguments[_key];
-        }
-
-        return fn.apply(this, args);
-      };
-    };
-  };
-
-  var Component = (_dec = onlyFor('body'), _dec2 = onlyFor('body'), _dec3 = onlyFor('body'), _dec4 = onlyFor('body'), _dec5 = onlyFor('head'), _dec6 = onlyFor('body'), (_class = function () {
-    _createClass(Component, null, [{
-      key: 'getName',
-      value: function getName() {
-        return name;
+      if (typeof mjml === 'string') {
+        mjml = (0, _mjmlParserXml2.default)(mjml, _extends({}, options, {
+          components: _components2.default,
+          ignoreInclude: true
+        }));
       }
-    }, {
-      key: 'getType',
-      value: function getType() {
-        return type;
-      }
-    }]);
 
-    function Component() {
-      var initialDatas = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      return this.context.processing(mjml, this.context);
+    }
+  }]);
 
-      _classCallCheck(this, Component);
+  return Component;
+}(), _class.defaultAttributes = {}, _temp);
 
-      var _initialDatas$attribu = initialDatas.attributes,
-          attributes = _initialDatas$attribu === undefined ? {} : _initialDatas$attribu,
-          _initialDatas$childre = initialDatas.children,
-          children = _initialDatas$childre === undefined ? [] : _initialDatas$childre,
-          _initialDatas$content = initialDatas.content,
-          content = _initialDatas$content === undefined ? '' : _initialDatas$content,
-          _initialDatas$context = initialDatas.context,
-          context = _initialDatas$context === undefined ? {} : _initialDatas$context,
-          _initialDatas$props = initialDatas.props,
-          props = _initialDatas$props === undefined ? {} : _initialDatas$props;
+var BodyComponent = function (_Component) {
+  _inherits(BodyComponent, _Component);
 
+  function BodyComponent() {
+    _classCallCheck(this, BodyComponent);
 
-      this.props = _extends({}, props, {
-        children: children,
-        content: content
-      });
+    return _possibleConstructorReturn(this, (BodyComponent.__proto__ || Object.getPrototypeOf(BodyComponent)).apply(this, arguments));
+  }
 
-      this.attributes = _extends({}, component.defaultAttributes, attributes);
-      this.context = context;
-
-      return this;
+  _createClass(BodyComponent, [{
+    key: 'getStyles',
+    value: function getStyles() {
+      return {};
     }
+  }, {
+    key: 'getShorthandAttrValue',
+    value: function getShorthandAttrValue(attribute, direction) {
+      var mjAttributeDirection = this.getAttribute(attribute + '-' + direction);
+      var mjAttribute = this.getAttribute(attribute);
 
-    _createClass(Component, [{
-      key: 'getChildContext',
-      value: function getChildContext() {
-        return this.context;
+      if (mjAttributeDirection) {
+        return parseInt(mjAttributeDirection);
       }
-    }, {
-      key: 'getStyles',
-      value: function getStyles() {
-        return {};
+
+      if (!mjAttribute) {
+        return 0;
       }
-    }, {
-      key: 'getMjAttribute',
-      value: function getMjAttribute(name) {
-        return this.attributes[name] || undefined;
-      }
-    }, {
-      key: 'getMjContent',
-      value: function getMjContent() {
-        return this.props.content.trim();
-      }
-    }, {
-      key: 'getShorthandAttrValue',
-      value: function getShorthandAttrValue(attribute, direction) {
-        var mjAttributeDirection = this.getMjAttribute(attribute + '-' + direction);
-        var mjAttribute = this.getMjAttribute(attribute);
 
-        if (mjAttributeDirection) {
-          return parseInt(mjAttributeDirection);
-        }
+      return (0, _shorthandParser2.default)(mjAttribute, direction);
+    }
+  }, {
+    key: 'htmlAttributes',
+    value: function htmlAttributes(attributes) {
+      var _this2 = this;
 
-        if (!mjAttribute) {
-          return 0;
+      var specialAttributes = {
+        style: function style(v) {
+          return _this2.styles(v);
+        },
+        default: _identity2.default
+      };
+
+      return (0, _reduce2.default)(attributes, function (output, v, name) {
+        var value = (specialAttributes[name] || specialAttributes.default)(v);
+
+        if (value) {
+          return output += ' ' + name + '="' + value + '"';
         }
 
-        return (0, _shorthandParser2.default)(mjAttribute, direction);
-      }
-    }, {
-      key: 'generateHtmlAttributes',
-      value: function generateHtmlAttributes(attributes) {
-        var _this = this;
+        return output;
+      }, '');
+    }
+  }, {
+    key: 'styles',
+    value: function styles(_styles) {
+      _styles = _styles ? typeof _styles === 'string' ? _objectPath2.default.get(this.getStyles(), _styles) : _styles : this.getStyles();
 
-        var specialAttributes = {
-          style: function style(v) {
-            return _this.generateStyles(v);
-          },
-          default: function _default(v) {
-            return v;
-          }
-        };
+      var output = '';
 
-        return (0, _reduce2.default)(attributes, function (output, v, name) {
-          var value = (specialAttributes[name] || specialAttributes['default'])(v);
+      (0, _forEach2.default)(_styles, function (value, name) {
+        if (value) {
+          output += name + ':' + value + ';';
+        }
+      });
 
-          if (value) {
-            return output += ' ' + name + '="' + value + '"';
-          }
+      return output;
+    }
+  }, {
+    key: 'renderChildren',
+    value: function renderChildren(childrens) {
+      var _this3 = this;
 
-          return output;
-        }, '');
-      }
-    }, {
-      key: 'generateStyles',
-      value: function generateStyles(styles) {
-        styles = styles ? typeof styles === 'string' ? _objectPath2.default.get(this.getStyles(), styles) : styles : this.getStyles();
+      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+      var _options$props = options.props,
+          props = _options$props === undefined ? {} : _options$props,
+          _options$renderer = options.renderer,
+          renderer = _options$renderer === undefined ? function (component) {
+        return component.render();
+      } : _options$renderer,
+          _options$attributes = options.attributes,
+          attributes = _options$attributes === undefined ? {} : _options$attributes;
 
-        var output = '';
 
-        (0, _forEach2.default)(styles, function (value, name) {
-          if (value) {
-            output += name + ':' + value + ';';
-          }
-        });
+      childrens = childrens || this.props.children;
 
-        return output;
-      }
-    }, {
-      key: 'handlerChildren',
-      value: function handlerChildren() {
-        var _this2 = this;
+      var sibling = childrens.length;
 
-        var childrens = this.props.children;
+      var output = '';
+      var index = 0;
 
-        (0, _forEach2.default)(childrens, function (children) {
-          var component = (0, _components.initComponent)({
-            name: children.tagName,
-            initialDatas: _extends({}, children, {
-              context: _this2.getChildContext()
+      (0, _forEach2.default)(childrens, function (children) {
+        var component = (0, _components.initComponent)({
+          name: children.tagName,
+          initialDatas: _extends({}, children, {
+            attributes: _extends({}, attributes, children.attributes),
+            context: _this3.getChildContext(),
+            props: _extends({}, props, {
+              first: index === 0,
+              index: index,
+              last: index + 1 === sibling,
+              sibling: sibling
             })
-          });
-
-          if (component.handler) {
-            component.handler();
-          }
+          })
         });
-      }
-    }, {
-      key: 'renderChildren',
-      value: function renderChildren(children) {
-        var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-        var _options$props = options.props,
-            props = _options$props === undefined ? {} : _options$props,
-            _options$renderer = options.renderer,
-            renderer = _options$renderer === undefined ? function (component) {
-          return component.render();
-        } : _options$renderer,
-            _options$attributes = options.attributes,
-            attributes = _options$attributes === undefined ? {} : _options$attributes;
 
+        if (component !== null) {
+          output += renderer(component);
+        }
 
-        children = children || this.props.children;
+        index++;
+      });
 
-        var sibling = children.length;
+      return output;
+    }
+  }]);
 
-        var output = '';
+  return BodyComponent;
+}(Component);
 
-        for (var index = 0; index < sibling; index++) {
-          var child = children[index];
-          var _component = (0, _components.initComponent)({
-            name: child.tagName,
-            initialDatas: _extends({}, child, {
-              attributes: _extends({}, attributes, child.attributes),
-              context: this.getChildContext(),
-              props: _extends({}, props, {
-                first: index === 0,
-                index: index,
-                last: index + 1 === sibling,
-                sibling: sibling
-              })
-            })
-          });
+exports.BodyComponent = BodyComponent;
 
-          if (_component !== null) {
-            output += renderer(_component);
-          }
-        }
+var HeadComponent = exports.HeadComponent = function (_Component2) {
+  _inherits(HeadComponent, _Component2);
 
-        return output;
-      }
-    }]);
+  function HeadComponent() {
+    _classCallCheck(this, HeadComponent);
 
-    return Component;
-  }(), (_applyDecoratedDescriptor(_class.prototype, 'getStyles', [_dec], Object.getOwnPropertyDescriptor(_class.prototype, 'getStyles'), _class.prototype), _applyDecoratedDescriptor(_class.prototype, 'getShorthandAttrValue', [_dec2], Object.getOwnPropertyDescriptor(_class.prototype, 'getShorthandAttrValue'), _class.prototype), _applyDecoratedDescriptor(_class.prototype, 'generateHtmlAttributes', [_dec3], Object.getOwnPropertyDescriptor(_class.prototype, 'generateHtmlAttributes'), _class.prototype), _applyDecoratedDescriptor(_class.prototype, 'generateStyles', [_dec4], Object.getOwnPropertyDescriptor(_class.prototype, 'generateStyles'), _class.prototype), _applyDecoratedDescriptor(_class.prototype, 'handlerChildren', [_dec5], Object.getOwnPropertyDescriptor(_class.prototype, 'handlerChildren'), _class.prototype), _applyDecoratedDescriptor(_class.prototype, 'renderChildren', [_dec6], Object.getOwnPropertyDescriptor(_class.prototype, 'renderChildren'), _class.prototype)), _class));
+    return _possibleConstructorReturn(this, (HeadComponent.__proto__ || Object.getPrototypeOf(HeadComponent)).apply(this, arguments));
+  }
 
+  _createClass(HeadComponent, [{
+    key: 'handlerChildren',
+    value: function handlerChildren() {
+      var _this5 = this;
 
-  var newComponent = Component;
+      var childrens = this.props.children;
 
-  if (component.useMJML) {
-    component._render = component.render;
-    component.render = function () {
-      var mjml = (0, _mjmlParserXml2.default)(this._render(), { ignoreInclude: true });
+      (0, _forEach2.default)(childrens, function (children) {
+        var component = (0, _components.initComponent)({
+          name: children.tagName,
+          initialDatas: _extends({}, children, {
+            context: _this5.getChildContext()
+          })
+        });
 
-      return this.context.processing(mjml, this.context);
-    };
-  }
+        if (component.handler) {
+          component.handler();
+        }
+      });
+    }
+  }], [{
+    key: 'getTagName',
+    value: function getTagName() {
+      return (0, _kebabCase2.default)(this.name);
+    }
+  }]);
 
-  Object.assign(newComponent.prototype, component);
-
-  return newComponent;
-}
+  return HeadComponent;
+}(Component);

lib/helpers/mediaQueries.js

@@ -14,8 +14,8 @@ 'use strict';
 
-function buildMediaQueriesTags() {
-  var mediaQueries = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+function buildMediaQueriesTags(breakpoint) {
+  var mediaQueries = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
 
-  return !_lodash2.default.isEmpty(mediaQueries) ? '\n    <style type="text/css">\n      @media only screen and (min-width:480px) {\n        ' + _lodash2.default.map(mediaQueries, function (mediaQuery, className) {
+  return !_lodash2.default.isEmpty(mediaQueries) ? '\n    <style type="text/css">\n      @media only screen and (min-width:' + breakpoint + ') {\n        ' + _lodash2.default.map(mediaQueries, function (mediaQuery, className) {
     return '.' + className + ' ' + mediaQuery;
   }).join('\n') + '\n      }\n    </style>\n  ' : '';
 }

lib/helpers/mergeOutlookConditionnals.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -9,5 +9,5 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = function (content) {
-  return content.replace(/(<!\[endif]-->\s*?\<\!--\[if mso \| IE]>)/gm, "");
+  return content.replace(/(<!\[endif]-->\s*?\<\!--\[if mso \| IE]>)/gm, '');
 };
 
-module.exports = exports["default"];
+module.exports = exports['default'];

lib/helpers/skeleton.js

@@ -8,2 +8,6 @@ 'use strict';
 
+var _preview = require('./preview');
+
+var _preview2 = _interopRequireDefault(_preview);
+
 var _fonts = require('./fonts');
@@ -13,4 +17,8 @@
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function skeleton(options) {
-  var _options$content = options.content,
+  var _options$breakpoint = options.breakpoint,
+      breakpoint = _options$breakpoint === undefined ? '480px' : _options$breakpoint,
+      _options$content = options.content,
       content = _options$content === undefined ? '' : _options$content,
@@ -21,8 +29,10 @@ _options$fonts = options.fonts,
       mediaQueries = _options$mediaQueries === undefined ? {} : _options$mediaQueries,
+      preview = options.preview,
       _options$title = options.title,
-      title = _options$title === undefined ? '' : _options$title;
+      title = _options$title === undefined ? '' : _options$title,
+      style = options.style;
 
 
-  return '\n    <!doctype html>\n    <html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">\n      <head>\n        <title>\n          ' + title + '\n        </title>\n        <!--[if !mso]><!-- -->\n        <meta http-equiv="X-UA-Compatible" content="IE=edge">\n        <!--<![endif]-->\n        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">\n        <style type="text/css">\n          #outlook a { padding:0; }\n          .ReadMsgBody { width:100%; }\n          .ExternalClass { width:100%; }\n          .ExternalClass * { line-height:100%; }\n          body { margin:0;padding:0;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%; }\n          table, td { border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt; }\n          img { border:0;height:auto;line-height:100%; outline:none;text-decoration:none;-ms-interpolation-mode:bicubic; }\n          p { display:block;margin:13px 0; }\n        </style>\n        <!--[if !mso]><!-->\n        <style type="text/css">\n          @media only screen and (max-width:480px) {\n            @-ms-viewport { width:320px; }\n            @viewport { width:320px; }\n          }\n        </style>\n        <!--<![endif]-->\n        <!--[if mso]>\n        <xml>\n        <o:OfficeDocumentSettings>\n          <o:AllowPNG/>\n          <o:PixelsPerInch>96</o:PixelsPerInch>\n        </o:OfficeDocumentSettings>\n        </xml>\n        <![endif]-->\n        <!--[if lte mso 11]>\n        <style type="text/css">\n          .outlook-group-fix { width:100% !important; }\n        </style>\n        <![endif]-->\n        ' + (0, _fonts.buildFontsTags)(content, fonts) + '\n        ' + (0, _mediaQueries.buildMediaQueriesTags)(mediaQueries) + '\n      </head>\n      <body>\n        ' + content + '\n      </body>\n    </html>\n  ';
+  return '\n    <!doctype html>\n    <html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">\n      <head>\n        <title>\n          ' + title + '\n        </title>\n        <!--[if !mso]><!-- -->\n        <meta http-equiv="X-UA-Compatible" content="IE=edge">\n        <!--<![endif]-->\n        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">\n        <style type="text/css">\n          #outlook a { padding:0; }\n          .ReadMsgBody { width:100%; }\n          .ExternalClass { width:100%; }\n          .ExternalClass * { line-height:100%; }\n          body { margin:0;padding:0;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%; }\n          table, td { border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt; }\n          img { border:0;height:auto;line-height:100%; outline:none;text-decoration:none;-ms-interpolation-mode:bicubic; }\n          p { display:block;margin:13px 0; }\n        </style>\n        <!--[if !mso]><!-->\n        <style type="text/css">\n          @media only screen and (max-width:480px) {\n            @-ms-viewport { width:320px; }\n            @viewport { width:320px; }\n          }\n        </style>\n        <!--<![endif]-->\n        <!--[if mso]>\n        <xml>\n        <o:OfficeDocumentSettings>\n          <o:AllowPNG/>\n          <o:PixelsPerInch>96</o:PixelsPerInch>\n        </o:OfficeDocumentSettings>\n        </xml>\n        <![endif]-->\n        <!--[if lte mso 11]>\n        <style type="text/css">\n          .outlook-group-fix { width:100% !important; }\n        </style>\n        <![endif]-->\n        ' + (0, _fonts.buildFontsTags)(content, fonts) + '\n        ' + (0, _mediaQueries.buildMediaQueriesTags)(breakpoint, mediaQueries) + '\n        ' + (style ? '<style type="text/css">' + style.join('') + '</style>' : '') + '\n      </head>\n      <body>\n        ' + (0, _preview2.default)(preview) + '\n        ' + content + '\n      </body>\n    </html>\n  ';
 }
 module.exports = exports['default'];

lib/helpers/traverseMJML.js

@@ -8,13 +8,25 @@ 'use strict';
 
-var _lodash = require('lodash');
+var _flattenDeep = require('lodash/flattenDeep');
 
-var _lodash2 = _interopRequireDefault(_lodash);
+var _flattenDeep2 = _interopRequireDefault(_flattenDeep);
 
+var _head = require('lodash/head');
+
+var _head2 = _interopRequireDefault(_head);
+
+var _map = require('lodash/map');
+
+var _map2 = _interopRequireDefault(_map);
+
+var _noop = require('lodash/noop');
+
+var _noop2 = _interopRequireDefault(_noop);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function traverseMJML(mjml) {
-  var predicate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _lodash2.default.noop;
+  var predicate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _noop2.default;
 
-  var traverse = function traverse(mjml, predicate) {
-    return _lodash2.default.map(mjml.children, function (child) {
+  var traverse = function traverse(mjml) {
+    return (0, _map2.default)(mjml.children, function (child) {
       if (predicate(child)) {
@@ -24,8 +36,8 @@ return child;
 
-      return traverse(child, predicate);
+      return traverse(child);
     });
   };
 
-  return _lodash2.default.head(_lodash2.default.flattenDeep(traverse(mjml, predicate)));
+  return (0, _head2.default)((0, _flattenDeep2.default)(traverse(mjml)));
 }
 module.exports = exports['default'];

lib/helpers/widthParser.js

@@ -21,3 +21,3 @@ 'use strict';
   };
-  var parser = unitParsers[widthUnit] || unitParsers['default'];
+  var parser = unitParsers[widthUnit] || unitParsers.default;
 
@@ -24,0 +24,0 @@ return {

lib/index.js

@@ -6,3 +6,3 @@ 'use strict';
 });
-exports.registerComponent = exports.initComponent = exports.components = undefined;
+exports.HeadComponent = exports.BodyComponent = exports.registerComponent = exports.initComponent = exports.components = undefined;
 
@@ -13,5 +13,16 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
-var _forEach = require('lodash/forEach');
+var _createComponent = require('./createComponent');
 
-var _forEach2 = _interopRequireDefault(_forEach);
+Object.defineProperty(exports, 'BodyComponent', {
+  enumerable: true,
+  get: function get() {
+    return _createComponent.BodyComponent;
+  }
+});
+Object.defineProperty(exports, 'HeadComponent', {
+  enumerable: true,
+  get: function get() {
+    return _createComponent.HeadComponent;
+  }
+});
 
@@ -22,2 +33,14 @@ var _identity = require('lodash/identity');
 
+var _map = require('lodash/map');
+
+var _map2 = _interopRequireDefault(_map);
+
+var _omit = require('lodash/omit');
+
+var _omit2 = _interopRequireDefault(_omit);
+
+var _reduce = require('lodash/reduce');
+
+var _reduce2 = _interopRequireDefault(_reduce);
+
 var _juice = require('juice');
@@ -31,10 +54,2 @@
 
-var _map = require('lodash/map');
-
-var _map2 = _interopRequireDefault(_map);
-
-var _omit = require('lodash/omit');
-
-var _omit2 = _interopRequireDefault(_omit);
-
 var _mjmlParserXml = require('mjml-parser-xml');
@@ -48,6 +63,2 @@
 
-var _reduce = require('lodash/reduce');
-
-var _reduce2 = _interopRequireDefault(_reduce);
-
 var _components = require('./components');
@@ -106,13 +117,11 @@
     'Droid Sans': 'https://fonts.googleapis.com/css?family=Droid+Sans:300,400,500,700',
-    'Lato': 'https://fonts.googleapis.com/css?family=Lato:300,400,500,700',
-    'Roboto': 'https://fonts.googleapis.com/css?family=Roboto:300,400,500,700',
-    'Ubuntu': 'https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700'
+    Lato: 'https://fonts.googleapis.com/css?family=Lato:300,400,500,700',
+    Roboto: 'https://fonts.googleapis.com/css?family=Roboto:300,400,500,700',
+    Ubuntu: 'https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700'
   } : _options$fonts,
       _options$inlineCSS = options.inlineCSS,
       inlineCSS = _options$inlineCSS === undefined ? true : _options$inlineCSS,
+      keepComments = options.keepComments,
       _options$minify = options.minify,
       minify = _options$minify === undefined ? false : _options$minify,
-      _options$style = options.style,
-      style = _options$style === undefined ? [] : _options$style,
-      keepComments = options.keepComments,
       _options$validationLe = options.validationLevel,
@@ -123,8 +132,10 @@ validationLevel = _options$validationLe === undefined ? 'soft' : _options$validationLe;
   var globalDatas = {
+    breakpoint: '480px',
     classes: {},
     defaultAttributes: {},
     fonts: fonts,
+    inlineStyle: [],
     mediaQueries: {},
-    mobileBreakpoint: '480px',
-    style: style,
+    preview: '',
+    style: [],
     title: ''
@@ -134,10 +145,18 @@ };
   if (typeof mjml === 'string') {
-    mjml = (0, _mjmlParserXml2.default)(mjml, { keepComments: keepComments });
+    mjml = (0, _mjmlParserXml2.default)(mjml, {
+      keepComments: keepComments,
+      components: _components2.default
+    });
   }
 
+  var validatorOptions = {
+    components: _components2.default
+  };
+
   switch (validationLevel) {
     case 'skip':
       break;
+
     case 'strict':
-      errors = (0, _mjmlValidator2.default)(mjml);
+      errors = (0, _mjmlValidator2.default)(mjml, validatorOptions);
 
@@ -150,5 +169,6 @@ if (errors.length > 0) {
       break;
+
     case 'soft':
     default:
-      errors = (0, _mjmlValidator2.default)(mjml);
+      errors = (0, _mjmlValidator2.default)(mjml, validatorOptions);
       break;
@@ -191,3 +211,3 @@ }
     var parse = function parse(mjml) {
-      var classes = mjml.attributes['mj-class'];
+      var classes = mjml.attributes && mjml.attributes['mj-class'];
       var attributesClasses = classes ? (0, _reduce2.default)(classes.split(' '), function (result, value) {
@@ -229,3 +249,3 @@ return _extends({}, result, globalDatas.classes[value]);
         (_globalDatas$attr = globalDatas[attr]).push.apply(_globalDatas$attr, _toConsumableArray(params));
-      } else if (globalDatas[attr]) {
+      } else if (globalDatas.hasOwnProperty(attr)) {
         if (params.length > 1) {
@@ -243,11 +263,12 @@ globalDatas[attr][params[0]] = params[1];
   _processing(mjHead, headHelpers);
+
   content = _processing(mjBody, bodyHelpers, applyAttributes);
 
-  if (globalDatas.style.length > 0) {
-    content = inlineCSS ? (0, _juice2.default)(content, {
+  if (globalDatas.inlineStyle.length > 0) {
+    content = (0, _juice2.default)(content, {
       applyStyleTags: false,
-      extraCss: globalDatas.style.join(''),
+      extraCss: globalDatas.inlineStyle.join(''),
       insertPreservedExtraCss: false,
       removeStyleTags: false
-    }) : content;
+    });
   }
@@ -274,3 +295,6 @@
 
-  return { html: content, errors: errors };
+  return {
+    html: content,
+    errors: errors
+  };
 }
@@ -277,0 +301,0 @@

lib/types/color.js

@@ -1,1 +0,41 @@
-"use strict";
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.matcher = undefined;
+
+var _type = require('./type');
+
+var _type2 = _interopRequireDefault(_type);
+
+var _colors = require('../helpers/colors');
+
+var _colors2 = _interopRequireDefault(_colors);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var matcher = exports.matcher = /^color/gmi;
+
+exports.default = function (params) {
+  return function (_Type) {
+    _inherits(Color, _Type);
+
+    function Color(color) {
+      _classCallCheck(this, Color);
+
+      var _this = _possibleConstructorReturn(this, (Color.__proto__ || Object.getPrototypeOf(Color)).call(this, color));
+
+      _this.matchers = [/rgba\(\d{1,3},\d{1,3},\d{1,3},\d(\.\d)?\)/gi, /rgb\(\d{1,3},\d{1,3},\d{1,3}\)/gi, /^#([0-9a-f]{3}){1,2}$/gi, new RegExp('^(' + _colors2.default.join('|') + ')$')];
+      return _this;
+    }
+
+    return Color;
+  }(_type2.default);
+};

lib/types/enum.js

@@ -1,1 +0,47 @@
-"use strict";
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.matcher = undefined;
+
+var _type = require('./type');
+
+var _type2 = _interopRequireDefault(_type);
+
+var _escapeRegExp = require('lodash/escapeRegExp');
+
+var _escapeRegExp2 = _interopRequireDefault(_escapeRegExp);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var matcher = exports.matcher = /^enum/gmi;
+
+exports.default = function (params) {
+  var _class, _temp;
+
+  var matchers = params.match(/\(([^)]+)\)/)[1].split(',');
+
+  return _temp = _class = function (_Type) {
+    _inherits(Enum, _Type);
+
+    function Enum(value) {
+      _classCallCheck(this, Enum);
+
+      var _this = _possibleConstructorReturn(this, (Enum.__proto__ || Object.getPrototypeOf(Enum)).call(this, value));
+
+      _this.matchers = matchers.map(function (m) {
+        return new RegExp('^' + (0, _escapeRegExp2.default)(m) + '$');
+      });
+      return _this;
+    }
+
+    return Enum;
+  }(_type2.default), _class.errorMessage = 'Invalid value: $value for type Enum, only accepts ' + matchers.join(', '), _temp;
+};

lib/types/string.js

@@ -1,1 +0,37 @@
-"use strict";
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.matcher = undefined;
+
+var _type = require('./type');
+
+var _type2 = _interopRequireDefault(_type);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var matcher = exports.matcher = /^string/gmi;
+
+exports.default = function (params) {
+  return function (_Type) {
+    _inherits(NString, _Type);
+
+    function NString(value) {
+      _classCallCheck(this, NString);
+
+      var _this = _possibleConstructorReturn(this, (NString.__proto__ || Object.getPrototypeOf(NString)).call(this, value));
+
+      _this.matchers = [/.*/];
+      return _this;
+    }
+
+    return NString;
+  }(_type2.default);
+};

lib/types/unit.js

@@ -1,1 +0,56 @@
-"use strict";
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.matcher = undefined;
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _type = require('./type');
+
+var _type2 = _interopRequireDefault(_type);
+
+var _escapeRegExp = require('lodash/escapeRegExp');
+
+var _escapeRegExp2 = _interopRequireDefault(_escapeRegExp);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var matcher = exports.matcher = /^unit\(.*\)/gmi;
+
+exports.default = function (params) {
+  var _class, _temp;
+
+  var units = params.match(/\(([^)]+)\)/)[1].split(',');
+  var args = params.match(/\{([^}]+)\}/)[1].split(',');
+
+  return _temp = _class = function (_Type) {
+    _inherits(Unit, _Type);
+
+    function Unit(value) {
+      _classCallCheck(this, Unit);
+
+      var _this = _possibleConstructorReturn(this, (Unit.__proto__ || Object.getPrototypeOf(Unit)).call(this, value));
+
+      _this.matchers = [new RegExp('^((\\d){1,}(' + units.map(_escapeRegExp2.default).join('|') + ')( )?){' + args.join(',') + '}$')];
+      return _this;
+    }
+
+    _createClass(Unit, [{
+      key: 'convertAs',
+      value: function convertAs() {
+        var unit = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'px';
+        var base = arguments[1];
+      }
+    }]);
+
+    return Unit;
+  }(_type2.default), _class.errorMessage = 'Invalid value: $value for type Unit, only accepts (' + units.join(', ') + ') units and ' + args.join(' to ') + ' members', _temp;
+};

package.json

 {
   "name": "mjml-core",
   "description": "mjml-core",
-  "version": "4.0.0-alpha.2",
+  "version": "4.0.0-alpha.3",
   "main": "lib/index.js",
@@ -20,10 +20,10 @@ "repository": {
   "dependencies": {
-    "html-minifier": "^3.5.2",
+    "html-minifier": "^3.5.3",
     "js-beautify": "^1.6.14",
     "juice": "^4.1.0",
     "lodash": "^4.17.3",
-    "mjml-parser-xml": "^4.0.0-alpha.2",
-    "mjml-validator": "^4.0.0-alpha.2",
+    "mjml-parser-xml": "^4.0.0-alpha.3",
+    "mjml-validator": "^4.0.0-alpha.3",
     "object-path": "^0.11.3"
   }
 }

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

74292

increased by30.14%

Number of package files

23

increased by27.78%

Lines of code

872

increased by44.61%

Dependency changes

• Updatedhtml-minifier@^3.5.3

• Updatedmjml-parser-xml@^4.0.0-alpha.3

• Updatedmjml-validator@^4.0.0-alpha.3