mobiledoc-dom-renderer - npm Package Compare versions

Comparing version 0.1.17 to 0.1.18

CHANGELOG.md

@@ -1,5 +0,188 @@
-# Master
+<a name="0.1.18"></a>
+## 0.1.18 (2015-11-16)
 
-# 0.1.12
 
-  * Add support for rendering lists (https://github.com/bustlelabs/mobiledoc-dom-renderer/pull/5)
+
+
+<a name="0.1.18"></a>
+## 0.1.18 (2015-11-16)
+
+
+* 0.1.18 ([172ba45](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/172ba45))
+* Add update-changelog ([2f7100c](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/2f7100c))
+* Do not share state when rendering ([b51510e](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/b51510e)), closes [#11](https://github.com/bustlelabs/mobiledoc-dom-renderer/issues/11)
+* Make file structure more closely match HTML renderer ([2c6dcad](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/2c6dcad))
+* Merge pull request #12 from bustlelabs/fix-spaces-8 ([48cdcf1](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/48cdcf1))
+* Merge pull request #14 from bustlelabs/render-stateless-11 ([87ac82a](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/87ac82a))
+* Merge pull request #15 from bustlelabs/throw-on-unexpected-version-13 ([e8774a1](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/e8774a1))
+* Merge pull request #16 from bustlelabs/add-card-options ([6023452](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/6023452))
+* Render multiple spaces with nbsps to preserve whitespaces ([95c1719](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/95c1719)), closes [#8](https://github.com/bustlelabs/mobiledoc-dom-renderer/issues/8)
+* Throw on Unexpected mobiledoc version ([858239d](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/858239d)), closes [#13](https://github.com/bustlelabs/mobiledoc-dom-renderer/issues/13)
+* update brocfile ([5651e94](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/5651e94))
+* update renderer to accept options ([0b66b0d](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/0b66b0d))
+
+
+
+<a name="0.1.17"></a>
+## 0.1.17 (2015-11-12)
+
+
+* 0.1.17 ([0c35bcc](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/0c35bcc))
+* remove ember-addon index ([c857bf6](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/c857bf6))
+* remove ember-addon stuff ([f4b23d3](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/f4b23d3))
+
+
+
+<a name="0.1.16"></a>
+## 0.1.16 (2015-10-24)
+
+
+* 0.1.16 ([1a3eff2](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/1a3eff2))
+* Assert that `cards` is not passed as an array ([c7ea455](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/c7ea455))
+
+
+
+<a name="0.1.15"></a>
+## 0.1.15 (2015-10-16)
+
+
+* 0.1.15 ([955d8af](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/955d8af))
+* Add a main definition for ember-addon ([31b7991](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/31b7991))
+
+
+
+<a name="0.1.14"></a>
+## 0.1.14 (2015-10-15)
+
+
+* 0.1.14 ([29016e6](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/29016e6))
+* Build commonjs ([8d540f4](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/8d540f4))
+
+
+
+<a name="0.1.13"></a>
+## 0.1.13 (2015-10-01)
+
+
+* 0.1.12 ([7b90ad6](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/7b90ad6))
+* 0.1.13 ([f60bc90](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/f60bc90))
+* Merge pull request #5 from bustlelabs/render-lists-4 ([9cfb0f5](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/9cfb0f5))
+* Merge pull request #6 from bustlelabs/permit-no-payload ([8d0ba5b](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/8d0ba5b))
+* Permit no payload ([d1f36f4](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/d1f36f4))
+* Render ListSections and ListItems ([a838960](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/a838960)), closes [#4](https://github.com/bustlelabs/mobiledoc-dom-renderer/issues/4)
+
+
+
+<a name="0.1.11"></a>
+## 0.1.11 (2015-08-25)
+
+
+* 0.1.11 ([455b8e7](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/455b8e7))
+* Make an addon ([c7ae737](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/c7ae737))
+* Merge pull request #3 from bustlelabs/make-addon ([9a13229](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/9a13229))
+
+
+
+<a name="0.1.10"></a>
+## 0.1.10 (2015-08-05)
+
+
+* 0.1.10 ([6a2fbcf](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/6a2fbcf))
+* Fix bad utils path and test ([3305634](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/3305634))
+
+
+
+<a name="0.1.9"></a>
+## 0.1.9 (2015-08-05)
+
+
+* 0.1.9 ([a4b5501](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/a4b5501))
+* Add a default image card implementation ([58adcf1](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/58adcf1))
+* Add cards to README ([109730f](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/109730f))
+* Merge pull request #2 from bustlelabs/default-cards ([1047a8b](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/1047a8b))
+* Tweak README ([c6a8155](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/c6a8155))
+* Update README.md ([caf23f3](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/caf23f3))
+
+
+
+<a name="0.1.8"></a>
+## 0.1.8 (2015-07-29)
+
+
+* 0.1.7 ([4782eee](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/4782eee))
+* 0.1.8 ([c6b0043](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/c6b0043))
+* Merge pull request #1 from mixonic/version ([86f3506](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/86f3506))
+* Render with version ([0e1f645](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/0e1f645))
+* Tweak README ([d8064ae](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/d8064ae))
+
+
+
+<a name="0.1.6"></a>
+## 0.1.6 (2015-07-27)
+
+
+* 0.1.6 ([f13bbf8](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/f13bbf8))
+
+
+
+<a name="0.1.5"></a>
+## 0.1.5 (2015-07-15)
+
+
+* 0.1.5 ([45298d8](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/45298d8))
+* Render cards to DOM ([dfe3e96](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/dfe3e96))
+
+
+
+<a name="0.1.4"></a>
+## 0.1.4 (2015-07-13)
+
+
+* 0.1.4 ([eb11c5d](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/eb11c5d))
+* Add support for image sections ([5fd6d81](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/5fd6d81))
+
+
+
+<a name="0.1.3"></a>
+## 0.1.3 (2015-07-09)
+
+
+* 0.1.3 ([079e0c1](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/079e0c1))
+* add jshintrc ([cb0607a](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/cb0607a))
+* add readme ([de20a98](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/de20a98))
+* point main at global build ([6a9e697](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/6a9e697))
+* remove bower ([cc4b0d9](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/cc4b0d9))
+* run travis ([eff2cd0](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/eff2cd0))
+* travis ([9e1eeac](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/9e1eeac))
+* travis badge ([9e939d2](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/9e939d2))
+* use testem ([cf12376](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/cf12376))
+
+
+
+<a name="0.1.2"></a>
+## 0.1.2 (2015-07-09)
+
+
+* 0.1.2 ([6e57123](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/6e57123))
+* ignore npm-debug.log ([a652ce2](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/a652ce2))
+
+
+
+<a name="0.1.1"></a>
+## 0.1.1 (2015-07-09)
+
+
+* add "files" to package.json ([268841e](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/268841e))
+* v0.1.1 ([f74e486](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/f74e486))
+
+
+
+<a name="0.1.0"></a>
+# 0.1.0 (2015-07-09)
+
+
+* Add dom renderer, tests ([58a531e](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/58a531e))
+* initial project structure ([39a9b34](https://github.com/bustlelabs/mobiledoc-dom-renderer/commit/39a9b34))
+
+
+

dist/amd/mobiledoc-dom-renderer.js

@@ -1,2 +0,2 @@
-define('mobiledoc-dom-renderer/cards/image', ['exports', 'mobiledoc-dom-renderer/utils'], function (exports, _mobiledocDomRendererUtils) {
+define('mobiledoc-dom-renderer/cards/image', ['exports', 'mobiledoc-dom-renderer/utils/dom'], function (exports, _mobiledocDomRendererUtilsDom) {
   'use strict';
@@ -9,5 +9,5 @@
         if (payload.src) {
-          var img = (0, _mobiledocDomRendererUtils.createElement)('img');
+          var img = (0, _mobiledocDomRendererUtilsDom.createElement)('img');
           img.src = payload.src;
-          element.appendChild(img);
+          (0, _mobiledocDomRendererUtilsDom.appendChild)(element, img);
         }
@@ -20,11 +20,27 @@ }
 });
-define("mobiledoc-dom-renderer/dom-renderer", ["exports", "mobiledoc-dom-renderer/utils", "mobiledoc-dom-renderer/cards/image"], function (exports, _mobiledocDomRendererUtils, _mobiledocDomRendererCardsImage) {
-  "use strict";
+define('mobiledoc-dom-renderer', ['exports', 'mobiledoc-dom-renderer/renderer'], function (exports, _mobiledocDomRendererRenderer) {
+  'use strict';
 
-  var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; })();
+  exports.registerGlobal = registerGlobal;
 
-  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; }; })();
+  function registerGlobal(window) {
+    window.MobiledocDOMRenderer = _mobiledocDomRendererRenderer['default'];
+  }
 
-  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+  exports['default'] = _mobiledocDomRendererRenderer['default'];
+});
+define('mobiledoc-dom-renderer/renderer', ['exports', 'mobiledoc-dom-renderer/utils/dom', 'mobiledoc-dom-renderer/cards/image'], function (exports, _mobiledocDomRendererUtilsDom, _mobiledocDomRendererCardsImage) {
+  'use strict';
 
+  var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } }; })();
+
+  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; }; })();
+
+  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
+
+  var MARKUP_SECTION_TYPE = 1;
+  var IMAGE_SECTION_TYPE = 2;
+  var LIST_SECTION_TYPE = 3;
+  var CARD_SECTION_TYPE = 10;
+
   /**
@@ -46,3 +62,3 @@ * runtime DOM renderer
 
-    var element = (0, _mobiledocDomRendererUtils.createElement)(tagName);
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)(tagName);
     attributes = attributes || [];
@@ -53,3 +69,3 @@
           propValue = attributes[i + 1];
-      element.setAttribute(propName, propValue);
+      (0, _mobiledocDomRendererUtilsDom.setAttribute)(element, propName, propValue);
     }
@@ -59,207 +75,179 @@ return element;
 
-  function setDefaultCards(cards) {
-    cards.image = cards.image || _mobiledocDomRendererCardsImage["default"];
-  }
+  function renderMarkersOnElement(element, markers, renderState) {
+    var elements = [element];
+    var currentElement = element;
 
-  var DOMRenderer = (function () {
-    function DOMRenderer() {
-      _classCallCheck(this, DOMRenderer);
+    for (var i = 0, l = markers.length; i < l; i++) {
+      var marker = markers[i];
+
+      var _marker = _slicedToArray(marker, 3);
+
+      var openTypes = _marker[0];
+      var closeTypes = _marker[1];
+      var text = _marker[2];
+
+      for (var j = 0, m = openTypes.length; j < m; j++) {
+        var markerType = renderState.markerTypes[openTypes[j]];
+        var openedElement = createElementFromMarkerType(markerType);
+        (0, _mobiledocDomRendererUtilsDom.appendChild)(currentElement, openedElement);
+        elements.push(openedElement);
+        currentElement = openedElement;
+      }
+
+      (0, _mobiledocDomRendererUtilsDom.appendChild)(currentElement, (0, _mobiledocDomRendererUtilsDom.createTextNode)(text));
+
+      for (var j = 0, m = closeTypes; j < m; j++) {
+        elements.pop();
+        currentElement = elements[elements.length - 1];
+      }
     }
+  }
 
-    _createClass(DOMRenderer, [{
-      key: "render",
+  function renderListItem(markers, renderState) {
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)('li');
+    renderMarkersOnElement(element, markers, renderState);
+    return element;
+  }
 
-      /**
-       * @param {Mobiledoc} mobiledoc
-       * @param {DOMNode} [rootElement] defaults to an empty div
-       * @param {Object} [cards] Each top-level property on the object is considered
-       *        to be a card's name, its value is an object with `setup` and (optional) `teardown`
-       *        properties
-       * @return DOMNode
-       */
-      value: function render(_ref3) {
-        var _this = this;
+  function renderListSection(_ref3, renderState) {
+    var _ref32 = _slicedToArray(_ref3, 3);
 
-        var rootElement = arguments.length <= 1 || arguments[1] === undefined ? (0, _mobiledocDomRendererUtils.createElement)('div') : arguments[1];
-        var version = _ref3.version;
-        var sectionData = _ref3.sections;
-        var cards = arguments.length <= 2 || arguments[2] === undefined ? {} : arguments[2];
+    var type = _ref32[0];
+    var tagName = _ref32[1];
+    var listItems = _ref32[2];
 
-        var _sectionData = _slicedToArray(sectionData, 2);
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)(tagName);
+    listItems.forEach(function (li) {
+      (0, _mobiledocDomRendererUtilsDom.appendChild)(element, renderListItem(li, renderState));
+    });
+    return element;
+  }
 
-        var markerTypes = _sectionData[0];
-        var sections = _sectionData[1];
+  function renderImageSection(_ref4) {
+    var _ref42 = _slicedToArray(_ref4, 2);
 
-        this.root = rootElement;
-        this.markerTypes = markerTypes;
+    var type = _ref42[0];
+    var src = _ref42[1];
 
-        if (Array.isArray(cards)) {
-          throw new Error('`cards` must be passed as an object, not an array.');
-        }
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)('img');
+    element.src = src;
+    return element;
+  }
 
-        this.cards = cards;
-        setDefaultCards(this.cards);
+  function renderCardSection(_ref5, renderState) {
+    var _ref52 = _slicedToArray(_ref5, 3);
 
-        sections.forEach(function (section) {
-          return _this.renderSection(section);
-        });
+    var type = _ref52[0];
+    var name = _ref52[1];
+    var payload = _ref52[2];
+    var cards = renderState.cards;
 
-        return this.root;
-      }
-    }, {
-      key: "renderSection",
-      value: function renderSection(section) {
-        var _section = _slicedToArray(section, 1);
+    var card = cards[name];
+    if (!card) {
+      throw new Error('Cannot render unknown card named ' + name);
+    }
+    if (!payload) {
+      payload = {};
+    }
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)('div');
+    var cardOptions = renderState.options.cardOptions || {};
+    card.display.setup(element, cardOptions, { name: name }, payload);
+    return element;
+  }
 
-        var type = _section[0];
+  function renderMarkupSection(_ref6, renderState) {
+    var _ref62 = _slicedToArray(_ref6, 3);
 
-        var rendered = undefined;
-        switch (type) {
-          case 1:
-            // markup section
-            rendered = this.renderMarkupSection(section);
-            (0, _mobiledocDomRendererUtils.appendChild)(this.root, rendered);
-            break;
-          case 2:
-            rendered = this.renderImageSection(section);
-            (0, _mobiledocDomRendererUtils.appendChild)(this.root, rendered);
-            break;
-          case 3:
-            // list section
-            rendered = this.renderListSection(section);
-            (0, _mobiledocDomRendererUtils.appendChild)(this.root, rendered);
-            break;
-          case 10:
-            // card section
-            rendered = this.renderCardSection(section);
-            (0, _mobiledocDomRendererUtils.appendChild)(this.root, rendered);
-            break;
-          default:
-            throw new Error('Unimplement renderer for type ' + type);
-        }
-      }
-    }, {
-      key: "renderListSection",
-      value: function renderListSection(_ref4) {
-        var _this2 = this;
+    var type = _ref62[0];
+    var tagName = _ref62[1];
+    var markers = _ref62[2];
 
-        var _ref42 = _slicedToArray(_ref4, 3);
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)(tagName);
+    renderMarkersOnElement(element, markers, renderState);
+    return element;
+  }
 
-        var type = _ref42[0];
-        var tagName = _ref42[1];
-        var listItems = _ref42[2];
+  function renderSection(section, renderState) {
+    var _section = _slicedToArray(section, 1);
 
-        var element = (0, _mobiledocDomRendererUtils.createElement)(tagName);
-        listItems.forEach(function (li) {
-          element.appendChild(_this2.renderListItem(li));
-        });
-        return element;
-      }
-    }, {
-      key: "renderListItem",
-      value: function renderListItem(markers) {
-        var element = (0, _mobiledocDomRendererUtils.createElement)('li');
-        this._renderMarkersOnElement(element, markers);
-        return element;
-      }
-    }, {
-      key: "renderImageSection",
-      value: function renderImageSection(_ref5) {
-        var _ref52 = _slicedToArray(_ref5, 2);
+    var type = _section[0];
 
-        var type = _ref52[0];
-        var src = _ref52[1];
+    switch (type) {
+      case MARKUP_SECTION_TYPE:
+        return renderMarkupSection(section, renderState);
+      case IMAGE_SECTION_TYPE:
+        return renderImageSection(section, renderState);
+      case LIST_SECTION_TYPE:
+        return renderListSection(section, renderState);
+      case CARD_SECTION_TYPE:
+        return renderCardSection(section, renderState);
+      default:
+        throw new Error('Unimplement renderer for type ' + type);
+    }
+  }
 
-        var element = (0, _mobiledocDomRendererUtils.createElement)('img');
-        element.src = src;
-        return element;
-      }
-    }, {
-      key: "renderCardSection",
-      value: function renderCardSection(_ref6) {
-        var _ref62 = _slicedToArray(_ref6, 3);
+  function validateVersion(version) {
+    if (version !== '0.2.0') {
+      throw new Error('Unexpected Mobiledoc version "' + version + '"');
+    }
+  }
 
-        var type = _ref62[0];
-        var name = _ref62[1];
-        var payload = _ref62[2];
+  var Renderer = (function () {
+    function Renderer() {
+      _classCallCheck(this, Renderer);
+    }
 
-        var card = this.cards[name];
-        if (!card) {
-          throw new Error("Cannot render unknown card named " + name);
-        }
-        if (!payload) {
-          payload = {};
-        }
-        var element = (0, _mobiledocDomRendererUtils.createElement)('div');
-        card.display.setup(element, {}, { name: name }, payload);
-        return element;
-      }
-    }, {
-      key: "renderMarkupSection",
-      value: function renderMarkupSection(_ref7) {
-        var _ref72 = _slicedToArray(_ref7, 3);
+    _createClass(Renderer, [{
+      key: 'render',
 
-        var type = _ref72[0];
-        var tagName = _ref72[1];
-        var markers = _ref72[2];
+      /**
+       * @param {Mobiledoc} mobiledoc
+       * @param {DOMNode} [rootElement] defaults to an empty div
+       * @param {Object} [cards] Each top-level property on the object is considered
+       *        to be a card's name, its value is an object with `setup` and (optional) `teardown`
+       *        properties
+       * @return DOMNode
+       */
+      value: function render(_ref7) {
+        var root = arguments.length <= 1 || arguments[1] === undefined ? (0, _mobiledocDomRendererUtilsDom.createElement)('div') : arguments[1];
+        var cards = arguments.length <= 2 || arguments[2] === undefined ? {} : arguments[2];
+        var version = _ref7.version;
+        var sectionData = _ref7.sections;
+        var options = arguments.length <= 3 || arguments[3] === undefined ? {} : arguments[3];
 
-        var element = (0, _mobiledocDomRendererUtils.createElement)(tagName);
-        this._renderMarkersOnElement(element, markers);
-        return element;
-      }
-    }, {
-      key: "_renderMarkersOnElement",
-      value: function _renderMarkersOnElement(element, markers) {
-        var elements = [element];
-        var currentElement = element;
+        validateVersion(version);
 
-        for (var i = 0, l = markers.length; i < l; i++) {
-          var marker = markers[i];
+        var _sectionData = _slicedToArray(sectionData, 2);
 
-          var _marker = _slicedToArray(marker, 3);
+        var markerTypes = _sectionData[0];
+        var sections = _sectionData[1];
 
-          var openTypes = _marker[0];
-          var closeTypes = _marker[1];
-          var text = _marker[2];
+        cards.image = cards.image || _mobiledocDomRendererCardsImage['default'];
+        var renderState = { root: root, markerTypes: markerTypes, cards: cards, options: options };
 
-          for (var j = 0, m = openTypes.length; j < m; j++) {
-            var markerType = this.markerTypes[openTypes[j]];
-            var openedElement = createElementFromMarkerType(markerType);
-            (0, _mobiledocDomRendererUtils.appendChild)(currentElement, openedElement);
-            elements.push(openedElement);
-            currentElement = openedElement;
-          }
+        if (Array.isArray(cards)) {
+          throw new Error('`cards` must be passed as an object, not an array.');
+        }
 
-          (0, _mobiledocDomRendererUtils.appendChild)(currentElement, (0, _mobiledocDomRendererUtils.createTextNode)(text));
+        sections.forEach(function (section) {
+          var rendered = renderSection(section, renderState);
+          (0, _mobiledocDomRendererUtilsDom.appendChild)(renderState.root, rendered);
+        });
 
-          for (var j = 0, m = closeTypes; j < m; j++) {
-            elements.pop();
-            currentElement = elements[elements.length - 1];
-          }
-        }
+        return root;
       }
     }]);
 
-    return DOMRenderer;
+    return Renderer;
   })();
 
-  exports["default"] = DOMRenderer;
+  exports['default'] = Renderer;
 });
-define('mobiledoc-dom-renderer', ['exports', 'mobiledoc-dom-renderer/dom-renderer'], function (exports, _mobiledocDomRendererDomRenderer) {
+define('mobiledoc-dom-renderer/utils/dom', ['exports'], function (exports) {
   'use strict';
 
-  exports.registerGlobal = registerGlobal;
-
-  function registerGlobal(window) {
-    window.MobiledocDOMRenderer = _mobiledocDomRendererDomRenderer['default'];
-  }
-
-  exports['default'] = _mobiledocDomRendererDomRenderer['default'];
-});
-define("mobiledoc-dom-renderer/utils", ["exports"], function (exports) {
-  "use strict";
-
   exports.createElement = createElement;
   exports.appendChild = appendChild;
   exports.createTextNode = createTextNode;
+  exports.setAttribute = setAttribute;
 
@@ -274,5 +262,14 @@ function createElement(tagName) {
 
+  function addHTMLSpaces(text) {
+    var nbsp = ' ';
+    return text.replace(/  /g, ' ' + nbsp);
+  }
+
   function createTextNode(text) {
-    return document.createTextNode(text);
+    return document.createTextNode(addHTMLSpaces(text));
   }
+
+  function setAttribute(node, propName, value) {
+    node.setAttribute(propName, value);
+  }
 });//# sourceMappingURL=mobiledoc-dom-renderer.map

dist/commonjs/mobiledoc-dom-renderer/cards/image.js

 'use strict';
 
-var _utils = require("../utils");
+var _utilsDom = require('../utils/dom');
 
@@ -10,5 +10,5 @@ var ImageCard = {
       if (payload.src) {
-        var img = (0, _utils.createElement)('img');
+        var img = (0, _utilsDom.createElement)('img');
         img.src = payload.src;
-        element.appendChild(img);
+        (0, _utilsDom.appendChild)(element, img);
       }
@@ -15,0 +15,0 @@ }

dist/commonjs/mobiledoc-dom-renderer/index.js

@@ -5,8 +5,8 @@ 'use strict';
 
-var _domRenderer = require('./dom-renderer');
+var _renderer = require('./renderer');
 
 function registerGlobal(window) {
-  window.MobiledocDOMRenderer = _domRenderer['default'];
+  window.MobiledocDOMRenderer = _renderer['default'];
 }
 
-exports['default'] = _domRenderer['default'];
+exports['default'] = _renderer['default'];

dist/global/mobiledoc-dom-renderer.js

@@ -191,3 +191,3 @@ ;(function() {
 
-define('mobiledoc-dom-renderer/cards/image', ['exports', 'mobiledoc-dom-renderer/utils'], function (exports, _mobiledocDomRendererUtils) {
+define('mobiledoc-dom-renderer/cards/image', ['exports', 'mobiledoc-dom-renderer/utils/dom'], function (exports, _mobiledocDomRendererUtilsDom) {
   'use strict';
@@ -200,5 +200,5 @@
         if (payload.src) {
-          var img = (0, _mobiledocDomRendererUtils.createElement)('img');
+          var img = (0, _mobiledocDomRendererUtilsDom.createElement)('img');
           img.src = payload.src;
-          element.appendChild(img);
+          (0, _mobiledocDomRendererUtilsDom.appendChild)(element, img);
         }
@@ -211,11 +211,27 @@ }
 });
-define("mobiledoc-dom-renderer/dom-renderer", ["exports", "mobiledoc-dom-renderer/utils", "mobiledoc-dom-renderer/cards/image"], function (exports, _mobiledocDomRendererUtils, _mobiledocDomRendererCardsImage) {
-  "use strict";
+define('mobiledoc-dom-renderer', ['exports', 'mobiledoc-dom-renderer/renderer'], function (exports, _mobiledocDomRendererRenderer) {
+  'use strict';
 
-  var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; })();
+  exports.registerGlobal = registerGlobal;
 
-  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; }; })();
+  function registerGlobal(window) {
+    window.MobiledocDOMRenderer = _mobiledocDomRendererRenderer['default'];
+  }
 
-  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+  exports['default'] = _mobiledocDomRendererRenderer['default'];
+});
+define('mobiledoc-dom-renderer/renderer', ['exports', 'mobiledoc-dom-renderer/utils/dom', 'mobiledoc-dom-renderer/cards/image'], function (exports, _mobiledocDomRendererUtilsDom, _mobiledocDomRendererCardsImage) {
+  'use strict';
 
+  var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } }; })();
+
+  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; }; })();
+
+  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
+
+  var MARKUP_SECTION_TYPE = 1;
+  var IMAGE_SECTION_TYPE = 2;
+  var LIST_SECTION_TYPE = 3;
+  var CARD_SECTION_TYPE = 10;
+
   /**
@@ -237,3 +253,3 @@ * runtime DOM renderer
 
-    var element = (0, _mobiledocDomRendererUtils.createElement)(tagName);
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)(tagName);
     attributes = attributes || [];
@@ -244,3 +260,3 @@
           propValue = attributes[i + 1];
-      element.setAttribute(propName, propValue);
+      (0, _mobiledocDomRendererUtilsDom.setAttribute)(element, propName, propValue);
     }
@@ -250,207 +266,179 @@ return element;
 
-  function setDefaultCards(cards) {
-    cards.image = cards.image || _mobiledocDomRendererCardsImage["default"];
-  }
+  function renderMarkersOnElement(element, markers, renderState) {
+    var elements = [element];
+    var currentElement = element;
 
-  var DOMRenderer = (function () {
-    function DOMRenderer() {
-      _classCallCheck(this, DOMRenderer);
+    for (var i = 0, l = markers.length; i < l; i++) {
+      var marker = markers[i];
+
+      var _marker = _slicedToArray(marker, 3);
+
+      var openTypes = _marker[0];
+      var closeTypes = _marker[1];
+      var text = _marker[2];
+
+      for (var j = 0, m = openTypes.length; j < m; j++) {
+        var markerType = renderState.markerTypes[openTypes[j]];
+        var openedElement = createElementFromMarkerType(markerType);
+        (0, _mobiledocDomRendererUtilsDom.appendChild)(currentElement, openedElement);
+        elements.push(openedElement);
+        currentElement = openedElement;
+      }
+
+      (0, _mobiledocDomRendererUtilsDom.appendChild)(currentElement, (0, _mobiledocDomRendererUtilsDom.createTextNode)(text));
+
+      for (var j = 0, m = closeTypes; j < m; j++) {
+        elements.pop();
+        currentElement = elements[elements.length - 1];
+      }
     }
+  }
 
-    _createClass(DOMRenderer, [{
-      key: "render",
+  function renderListItem(markers, renderState) {
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)('li');
+    renderMarkersOnElement(element, markers, renderState);
+    return element;
+  }
 
-      /**
-       * @param {Mobiledoc} mobiledoc
-       * @param {DOMNode} [rootElement] defaults to an empty div
-       * @param {Object} [cards] Each top-level property on the object is considered
-       *        to be a card's name, its value is an object with `setup` and (optional) `teardown`
-       *        properties
-       * @return DOMNode
-       */
-      value: function render(_ref3) {
-        var _this = this;
+  function renderListSection(_ref3, renderState) {
+    var _ref32 = _slicedToArray(_ref3, 3);
 
-        var rootElement = arguments.length <= 1 || arguments[1] === undefined ? (0, _mobiledocDomRendererUtils.createElement)('div') : arguments[1];
-        var version = _ref3.version;
-        var sectionData = _ref3.sections;
-        var cards = arguments.length <= 2 || arguments[2] === undefined ? {} : arguments[2];
+    var type = _ref32[0];
+    var tagName = _ref32[1];
+    var listItems = _ref32[2];
 
-        var _sectionData = _slicedToArray(sectionData, 2);
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)(tagName);
+    listItems.forEach(function (li) {
+      (0, _mobiledocDomRendererUtilsDom.appendChild)(element, renderListItem(li, renderState));
+    });
+    return element;
+  }
 
-        var markerTypes = _sectionData[0];
-        var sections = _sectionData[1];
+  function renderImageSection(_ref4) {
+    var _ref42 = _slicedToArray(_ref4, 2);
 
-        this.root = rootElement;
-        this.markerTypes = markerTypes;
+    var type = _ref42[0];
+    var src = _ref42[1];
 
-        if (Array.isArray(cards)) {
-          throw new Error('`cards` must be passed as an object, not an array.');
-        }
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)('img');
+    element.src = src;
+    return element;
+  }
 
-        this.cards = cards;
-        setDefaultCards(this.cards);
+  function renderCardSection(_ref5, renderState) {
+    var _ref52 = _slicedToArray(_ref5, 3);
 
-        sections.forEach(function (section) {
-          return _this.renderSection(section);
-        });
+    var type = _ref52[0];
+    var name = _ref52[1];
+    var payload = _ref52[2];
+    var cards = renderState.cards;
 
-        return this.root;
-      }
-    }, {
-      key: "renderSection",
-      value: function renderSection(section) {
-        var _section = _slicedToArray(section, 1);
+    var card = cards[name];
+    if (!card) {
+      throw new Error('Cannot render unknown card named ' + name);
+    }
+    if (!payload) {
+      payload = {};
+    }
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)('div');
+    var cardOptions = renderState.options.cardOptions || {};
+    card.display.setup(element, cardOptions, { name: name }, payload);
+    return element;
+  }
 
-        var type = _section[0];
+  function renderMarkupSection(_ref6, renderState) {
+    var _ref62 = _slicedToArray(_ref6, 3);
 
-        var rendered = undefined;
-        switch (type) {
-          case 1:
-            // markup section
-            rendered = this.renderMarkupSection(section);
-            (0, _mobiledocDomRendererUtils.appendChild)(this.root, rendered);
-            break;
-          case 2:
-            rendered = this.renderImageSection(section);
-            (0, _mobiledocDomRendererUtils.appendChild)(this.root, rendered);
-            break;
-          case 3:
-            // list section
-            rendered = this.renderListSection(section);
-            (0, _mobiledocDomRendererUtils.appendChild)(this.root, rendered);
-            break;
-          case 10:
-            // card section
-            rendered = this.renderCardSection(section);
-            (0, _mobiledocDomRendererUtils.appendChild)(this.root, rendered);
-            break;
-          default:
-            throw new Error('Unimplement renderer for type ' + type);
-        }
-      }
-    }, {
-      key: "renderListSection",
-      value: function renderListSection(_ref4) {
-        var _this2 = this;
+    var type = _ref62[0];
+    var tagName = _ref62[1];
+    var markers = _ref62[2];
 
-        var _ref42 = _slicedToArray(_ref4, 3);
+    var element = (0, _mobiledocDomRendererUtilsDom.createElement)(tagName);
+    renderMarkersOnElement(element, markers, renderState);
+    return element;
+  }
 
-        var type = _ref42[0];
-        var tagName = _ref42[1];
-        var listItems = _ref42[2];
+  function renderSection(section, renderState) {
+    var _section = _slicedToArray(section, 1);
 
-        var element = (0, _mobiledocDomRendererUtils.createElement)(tagName);
-        listItems.forEach(function (li) {
-          element.appendChild(_this2.renderListItem(li));
-        });
-        return element;
-      }
-    }, {
-      key: "renderListItem",
-      value: function renderListItem(markers) {
-        var element = (0, _mobiledocDomRendererUtils.createElement)('li');
-        this._renderMarkersOnElement(element, markers);
-        return element;
-      }
-    }, {
-      key: "renderImageSection",
-      value: function renderImageSection(_ref5) {
-        var _ref52 = _slicedToArray(_ref5, 2);
+    var type = _section[0];
 
-        var type = _ref52[0];
-        var src = _ref52[1];
+    switch (type) {
+      case MARKUP_SECTION_TYPE:
+        return renderMarkupSection(section, renderState);
+      case IMAGE_SECTION_TYPE:
+        return renderImageSection(section, renderState);
+      case LIST_SECTION_TYPE:
+        return renderListSection(section, renderState);
+      case CARD_SECTION_TYPE:
+        return renderCardSection(section, renderState);
+      default:
+        throw new Error('Unimplement renderer for type ' + type);
+    }
+  }
 
-        var element = (0, _mobiledocDomRendererUtils.createElement)('img');
-        element.src = src;
-        return element;
-      }
-    }, {
-      key: "renderCardSection",
-      value: function renderCardSection(_ref6) {
-        var _ref62 = _slicedToArray(_ref6, 3);
+  function validateVersion(version) {
+    if (version !== '0.2.0') {
+      throw new Error('Unexpected Mobiledoc version "' + version + '"');
+    }
+  }
 
-        var type = _ref62[0];
-        var name = _ref62[1];
-        var payload = _ref62[2];
+  var Renderer = (function () {
+    function Renderer() {
+      _classCallCheck(this, Renderer);
+    }
 
-        var card = this.cards[name];
-        if (!card) {
-          throw new Error("Cannot render unknown card named " + name);
-        }
-        if (!payload) {
-          payload = {};
-        }
-        var element = (0, _mobiledocDomRendererUtils.createElement)('div');
-        card.display.setup(element, {}, { name: name }, payload);
-        return element;
-      }
-    }, {
-      key: "renderMarkupSection",
-      value: function renderMarkupSection(_ref7) {
-        var _ref72 = _slicedToArray(_ref7, 3);
+    _createClass(Renderer, [{
+      key: 'render',
 
-        var type = _ref72[0];
-        var tagName = _ref72[1];
-        var markers = _ref72[2];
+      /**
+       * @param {Mobiledoc} mobiledoc
+       * @param {DOMNode} [rootElement] defaults to an empty div
+       * @param {Object} [cards] Each top-level property on the object is considered
+       *        to be a card's name, its value is an object with `setup` and (optional) `teardown`
+       *        properties
+       * @return DOMNode
+       */
+      value: function render(_ref7) {
+        var root = arguments.length <= 1 || arguments[1] === undefined ? (0, _mobiledocDomRendererUtilsDom.createElement)('div') : arguments[1];
+        var cards = arguments.length <= 2 || arguments[2] === undefined ? {} : arguments[2];
+        var version = _ref7.version;
+        var sectionData = _ref7.sections;
+        var options = arguments.length <= 3 || arguments[3] === undefined ? {} : arguments[3];
 
-        var element = (0, _mobiledocDomRendererUtils.createElement)(tagName);
-        this._renderMarkersOnElement(element, markers);
-        return element;
-      }
-    }, {
-      key: "_renderMarkersOnElement",
-      value: function _renderMarkersOnElement(element, markers) {
-        var elements = [element];
-        var currentElement = element;
+        validateVersion(version);
 
-        for (var i = 0, l = markers.length; i < l; i++) {
-          var marker = markers[i];
+        var _sectionData = _slicedToArray(sectionData, 2);
 
-          var _marker = _slicedToArray(marker, 3);
+        var markerTypes = _sectionData[0];
+        var sections = _sectionData[1];
 
-          var openTypes = _marker[0];
-          var closeTypes = _marker[1];
-          var text = _marker[2];
+        cards.image = cards.image || _mobiledocDomRendererCardsImage['default'];
+        var renderState = { root: root, markerTypes: markerTypes, cards: cards, options: options };
 
-          for (var j = 0, m = openTypes.length; j < m; j++) {
-            var markerType = this.markerTypes[openTypes[j]];
-            var openedElement = createElementFromMarkerType(markerType);
-            (0, _mobiledocDomRendererUtils.appendChild)(currentElement, openedElement);
-            elements.push(openedElement);
-            currentElement = openedElement;
-          }
+        if (Array.isArray(cards)) {
+          throw new Error('`cards` must be passed as an object, not an array.');
+        }
 
-          (0, _mobiledocDomRendererUtils.appendChild)(currentElement, (0, _mobiledocDomRendererUtils.createTextNode)(text));
+        sections.forEach(function (section) {
+          var rendered = renderSection(section, renderState);
+          (0, _mobiledocDomRendererUtilsDom.appendChild)(renderState.root, rendered);
+        });
 
-          for (var j = 0, m = closeTypes; j < m; j++) {
-            elements.pop();
-            currentElement = elements[elements.length - 1];
-          }
-        }
+        return root;
       }
     }]);
 
-    return DOMRenderer;
+    return Renderer;
   })();
 
-  exports["default"] = DOMRenderer;
+  exports['default'] = Renderer;
 });
-define('mobiledoc-dom-renderer', ['exports', 'mobiledoc-dom-renderer/dom-renderer'], function (exports, _mobiledocDomRendererDomRenderer) {
+define('mobiledoc-dom-renderer/utils/dom', ['exports'], function (exports) {
   'use strict';
 
-  exports.registerGlobal = registerGlobal;
-
-  function registerGlobal(window) {
-    window.MobiledocDOMRenderer = _mobiledocDomRendererDomRenderer['default'];
-  }
-
-  exports['default'] = _mobiledocDomRendererDomRenderer['default'];
-});
-define("mobiledoc-dom-renderer/utils", ["exports"], function (exports) {
-  "use strict";
-
   exports.createElement = createElement;
   exports.appendChild = appendChild;
   exports.createTextNode = createTextNode;
+  exports.setAttribute = setAttribute;
 
@@ -465,5 +453,14 @@ function createElement(tagName) {
 
+  function addHTMLSpaces(text) {
+    var nbsp = ' ';
+    return text.replace(/  /g, ' ' + nbsp);
+  }
+
   function createTextNode(text) {
-    return document.createTextNode(text);
+    return document.createTextNode(addHTMLSpaces(text));
   }
+
+  function setAttribute(node, propName, value) {
+    node.setAttribute(propName, value);
+  }
 });
@@ -470,0 +467,0 @@ require("mobiledoc-dom-renderer")["registerGlobal"](window, document);

dist/tests/built-amd-tests.js

@@ -7,22 +7,22 @@ QUnit.module('JSHint - tests/jshint/cards');
 QUnit.module('JSHint - tests/jshint');
-QUnit.test('tests/jshint/dom-renderer.js should pass jshint', function(assert) { 
-  assert.ok(true, 'tests/jshint/dom-renderer.js should pass jshint.'); 
+QUnit.test('tests/jshint/index.js should pass jshint', function(assert) { 
+  assert.ok(true, 'tests/jshint/index.js should pass jshint.'); 
 });
 
 QUnit.module('JSHint - tests/jshint');
-QUnit.test('tests/jshint/index.js should pass jshint', function(assert) { 
-  assert.ok(true, 'tests/jshint/index.js should pass jshint.'); 
+QUnit.test('tests/jshint/renderer.js should pass jshint', function(assert) { 
+  assert.ok(true, 'tests/jshint/renderer.js should pass jshint.'); 
 });
 
 QUnit.module('JSHint - tests/jshint/unit');
-QUnit.test('tests/jshint/unit/dom-renderer-test.js should pass jshint', function(assert) { 
-  assert.ok(true, 'tests/jshint/unit/dom-renderer-test.js should pass jshint.'); 
+QUnit.test('tests/jshint/unit/renderer-test.js should pass jshint', function(assert) { 
+  assert.ok(true, 'tests/jshint/unit/renderer-test.js should pass jshint.'); 
 });
 
-QUnit.module('JSHint - tests/jshint');
-QUnit.test('tests/jshint/utils.js should pass jshint', function(assert) { 
-  assert.ok(true, 'tests/jshint/utils.js should pass jshint.'); 
+QUnit.module('JSHint - tests/jshint/utils');
+QUnit.test('tests/jshint/utils/dom.js should pass jshint', function(assert) { 
+  assert.ok(true, 'tests/jshint/utils/dom.js should pass jshint.'); 
 });
 
-define('tests/unit/dom-renderer-test', ['exports', 'mobiledoc-dom-renderer'], function (exports, _mobiledocDomRenderer) {
+define('tests/unit/renderer-test', ['exports', 'mobiledoc-dom-renderer'], function (exports, _mobiledocDomRenderer) {
   /* global QUnit */
@@ -126,3 +126,3 @@
     var mobiledoc = {
-      versions: MOBILEDOC_VERSION,
+      version: MOBILEDOC_VERSION,
       sections: [[], // markers
@@ -140,3 +140,3 @@ [// sections
   test('renders a mobiledoc with card section', function (assert) {
-    assert.expect(3);
+    assert.expect(4);
     var cardName = 'title-card';
@@ -146,2 +146,6 @@ var payload = {
     };
+    var options = {
+      cardOptions: { foo: 'bar' }
+    };
+    var expectedOptions = options.cardOptions;
     var TitleCard = {
@@ -152,2 +156,3 @@ name: cardName,
           assert.deepEqual(payload, setupPayload);
+          assert.deepEqual(options, expectedOptions);
           element.innerHTML = setupPayload.name;
@@ -163,3 +168,5 @@ }
     };
-    var rendered = renderer.render(mobiledoc, document.createElement('div'), _defineProperty({}, cardName, TitleCard));
+    var cards = _defineProperty({}, cardName, TitleCard);
+    var element = document.createElement('div');
+    var rendered = renderer.render(mobiledoc, element, cards, options);
     assert.equal(rendered.childNodes.length, 1, 'renders 1 section');
@@ -249,2 +256,78 @@ var sectionEl = rendered.childNodes[0];
   });
+
+  test('multiple spaces should preserve whitespace with nbsps', function (assert) {
+    var space = ' ';
+    var repeat = function repeat(str, count) {
+      var result = '';
+      while (count--) {
+        result += str;
+      }
+      return result;
+    };
+    var text = [repeat(space, 4), 'some', repeat(space, 5), 'text', repeat(space, 6)].join('');
+    var mobiledoc = {
+      version: MOBILEDOC_VERSION,
+      sections: [[], // markers
+      [// sections
+      [1, 'P', [[[], 0, text]]]]]
+    };
+
+    var nbsp = ' ';
+    var sn = ' ' + nbsp;
+    var expectedText = [repeat(sn, 2), 'some', repeat(sn, 2), ' ', 'text', repeat(sn, 3)].join('');
+    var rendered = renderer.render(mobiledoc);
+    var textNode = rendered.firstChild.firstChild;
+    assert.equal(textNode.textContent, expectedText, 'renders the text');
+  });
+
+  test('rendering nested mobiledocs in cards', function (assert) {
+    var renderer = new _mobiledocDomRenderer['default']();
+
+    var cards = {
+      'nested-card': {
+        display: {
+          setup: function setup(element, options, env, payload) {
+            renderer.render(payload.mobiledoc, element, cards);
+          }
+        }
+      }
+    };
+
+    var innerMobiledoc = {
+      version: MOBILEDOC_VERSION,
+      sections: [[], // markers
+      [// sections
+      [1, 'P', [[[], 0, 'hello world']]]]]
+    };
+
+    var mobiledoc = {
+      version: MOBILEDOC_VERSION,
+      sections: [[], // markers
+      [// sections
+      [10, 'nested-card', { mobiledoc: innerMobiledoc }]]]
+    };
+
+    var rendered = renderer.render(mobiledoc, document.createElement('div'), cards);
+    assert.equal(rendered.childNodes.length, 1, 'renders 1 section');
+    var card = rendered.childNodes[0];
+    assert.equal(card.childNodes.length, 1, 'card has 1 child');
+    assert.equal(card.childNodes[0].tagName, 'P', 'card has P child');
+    assert.equal(card.childNodes[0].innerText, 'hello world');
+  });
+
+  test('throw when given unexpected mobiledoc version', function (assert) {
+    var mobiledoc = {
+      version: '0.1.0',
+      sections: [[], []]
+    };
+
+    assert.throws(function () {
+      return renderer.render(mobiledoc);
+    }, /Unexpected Mobiledoc version.*0.1.0/);
+
+    mobiledoc.version = '0.2.1';
+    assert.throws(function () {
+      return renderer.render(mobiledoc);
+    }, /Unexpected Mobiledoc version.*0.2.1/);
+  });
 });

lib/cards/image.js

 import {
-  createElement
-} from "../utils";
+  createElement,
+  appendChild
+} from '../utils/dom';
 
@@ -12,3 +13,3 @@ const ImageCard = {
         img.src = payload.src;
-        element.appendChild(img);
+        appendChild(element, img);
       }
@@ -15,0 +16,0 @@ }

lib/index.js

@@ -1,7 +0,7 @@
-import DOMRenderer from './dom-renderer';
+import Renderer from './renderer';
 
 export function registerGlobal(window) {
-  window.MobiledocDOMRenderer = DOMRenderer;
+  window.MobiledocDOMRenderer = Renderer;
 }
 
-export default DOMRenderer;
+export default Renderer;

package.json

 {
   "name": "mobiledoc-dom-renderer",
-  "version": "0.1.17",
+  "version": "0.1.18",
   "description": "Renders Mobiledoc input to DOM output",
   "scripts": {
     "test": "testem ci",
-    "build": "rm -rf dist/ && broccoli build dist"
+    "build": "rm -rf dist/ && broccoli build dist",
+    "update-changelog": "./node_modules/conventional-changelog/cli.js -i CHANGELOG.md -r 0 --overwrite && git add CHANGELOG.md && git commit -m 'Update changelog'"
   },
@@ -34,2 +35,3 @@ "repository": {
     "broccoli-test-builder": "^0.2.0",
+    "conventional-changelog": "^0.5.1",
     "testem": "^0.9.0-1"
@@ -36,0 +38,0 @@ },

README.md

 ## Mobiledoc DOM Renderer [![Build Status](https://travis-ci.org/bustlelabs/mobiledoc-dom-renderer.svg?branch=master)](https://travis-ci.org/bustlelabs/mobiledoc-dom-renderer)
 
 This is a DOM renderer for the [Mobiledoc](https://github.com/bustlelabs/content-kit-editor/blob/master/MOBILEDOC.md) format used
-by the [Content-Kit Editor](https://github.com/bustlelabs/content-kit-editor).
+by [Mobiledoc-Kit](https://github.com/bustlelabs/mobiledoc-kit).
 
@@ -45,3 +45,4 @@ The renderer is a small library intended for use in browser clients.
 * `npm run build`
+* `npm run update-changelog`
 * `git push bustle --tags`
 * `npm publish`

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

211158

increased by5%

Lines of code

5205

increased by0.97%

Number of lines in readme file

48

increased by2.13%

Worsened metrics

Dev dependency count

6

increased by20%

No dependency changes