@pie-lib/editable-html 11.21.2 → 11.21.3-next.155

package/lib/serialization.js

@@ -1,45 +1,28 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.valueToHtml = exports.reduceMultipleBrs = exports.reactAttributes = exports.parseStyleString = exports.htmlToValue = exports.handleHtml = exports.getBase64 = exports.extraCSSRulesOpts = exports.TEXT_RULE = exports.INLINE_TAGS = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _slateHtmlSerializer = _interopRequireDefault(require("slate-html-serializer"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _debug = _interopRequireDefault(require("debug"));
-
 var _toStyle = require("to-style");
-
 var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
-
 var _image = require("./plugins/image");
-
 var _math = require("./plugins/math");
-
 var _media = require("./plugins/media");
-
 var _list = require("./plugins/list");
-
 var _table = require("./plugins/table");
-
 var _respArea = require("./plugins/respArea");
-
 var _slate = require("slate");
-
 var _blockTags = require("./block-tags");
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var log = (0, _debug["default"])('@pie-lib:editable-html:serialization');
+
 /**
  * Tags to marks.
  *
@@ -58,51 +41,36 @@ var MARK_TAGS = {
   sup: 'sup',
   sub: 'sub'
 };
-
-var parseStyleString = function parseStyleString(s) {
+var parseStyleString = exports.parseStyleString = function parseStyleString(s) {
   var regex = /([\w-]*)\s*:\s*([^;]*)/g;
   var match;
   var result = {};
-
   while (match = regex.exec(s)) {
     result[match[1]] = match[2].trim();
   }
-
   return result;
 };
-
-exports.parseStyleString = parseStyleString;
-
-var getBase64 = function getBase64(file) {
+var getBase64 = exports.getBase64 = function getBase64(file) {
   return new Promise(function (resolve, reject) {
     var reader = new FileReader();
     reader.readAsDataURL(file);
-
     reader.onload = function () {
       return resolve(reader.result);
     };
-
     reader.onerror = function (error) {
       return reject(error);
     };
   });
 };
-
-exports.getBase64 = getBase64;
-
-var reactAttributes = function reactAttributes(o) {
+var reactAttributes = exports.reactAttributes = function reactAttributes(o) {
   return (0, _toStyle.object)(o, {
     camelize: true,
     addUnits: false
   });
 };
-
-exports.reactAttributes = reactAttributes;
-
 var attributesToMap = function attributesToMap(el) {
   return function (acc, attribute) {
     var value = el.getAttribute(attribute);
-
     if (value) {
       if (attribute === 'style') {
         var styleString = el.getAttribute(attribute);
@@ -112,12 +80,11 @@ var attributesToMap = function attributesToMap(el) {
         acc[attribute] = el.getAttribute(attribute);
       }
     }
-
     return acc;
   };
 };
-
 var attributes = ['border', 'cellpadding', 'cellspacing', 'class', 'style', 'align'];
+
 /**
  * Serializer rules.
  *
@@ -127,25 +94,19 @@ var attributes = ['border', 'cellpadding', 'cellspacing', 'class', 'style', 'ali
 var blocks = {
   deserialize: function deserialize(el, next) {
     log('[blocks:deserialize] block: ', el);
-
     var block = _blockTags.BLOCK_TAGS[el.tagName.toLowerCase()];
-
     if (!block) return;
     log('[blocks:deserialize] block: ', block);
-
     if (el.childNodes.length === 1) {
       var cn = el.childNodes[0];
-
       if (cn && cn.tagName && cn.tagName.toLowerCase() === block) {
         log('[we have a child node of the same]...');
         return;
       }
     }
-
     return {
       object: 'block',
       type: block,
-
       /**
        * Here for rendering styles for all block elements
        */
@@ -160,7 +121,6 @@ var blocks = {
     var jsonData = object.data.toJSON();
     log('[blocks:serialize] object: ', object, children);
     var key;
-
     for (key in _blockTags.BLOCK_TAGS) {
       if (_blockTags.BLOCK_TAGS[key] === object.type) {
         var Tag = key;
@@ -169,30 +129,25 @@ var blocks = {
     }
   }
 };
-var INLINE_TAGS = {
+var INLINE_TAGS = exports.INLINE_TAGS = {
   span: 'span'
 };
-exports.INLINE_TAGS = INLINE_TAGS;
 var inlines = {
   deserialize: function deserialize(el, next) {
     log('[inlines:deserialize] inline: ', el);
     var inlineTag = INLINE_TAGS[el.tagName.toLowerCase()];
     if (!inlineTag) return;
     log('[inlines:deserialize] inline: ', inlineTag);
-
     if (el.childNodes.length === 1) {
       var cn = el.childNodes[0];
-
       if (cn && cn.tagName && cn.tagName.toLowerCase() === inlineTag) {
         log('[we have a child node of the same]...');
         return;
       }
     }
-
     return {
       object: 'inline',
       type: inlineTag,
-
       /**
        * Here for rendering styles for all inline elements
        */
@@ -207,7 +162,6 @@ var inlines = {
     var jsonData = object.data.toJSON();
     log('[inlines:serialize] object: ', object, children);
     var key;
-
     for (key in INLINE_TAGS) {
       if (INLINE_TAGS[key] === object.type) {
         var Tag = key;
@@ -216,8 +170,7 @@ var inlines = {
     }
   }
 };
-var extraCSSRulesOpts = {};
-exports.extraCSSRulesOpts = extraCSSRulesOpts;
+var extraCSSRulesOpts = exports.extraCSSRulesOpts = {};
 var STYLES_MAP = {
   h3: {
     fontSize: 'inherit',
@@ -240,11 +193,9 @@ var marks = {
     var hasCSSRule = ((extraCSSRulesOpts === null || extraCSSRulesOpts === void 0 ? void 0 : extraCSSRulesOpts.names) || []).find(function (name) {
       return elClasses === null || elClasses === void 0 ? void 0 : elClasses.includes(name);
     });
-
     if (!mark && !hasCSSRule) {
       return;
     }
-
     log('[deserialize] mark: ', mark);
     var attrs = attributes.reduce(attributesToMap(el), {});
     var data = (0, _isEmpty["default"])(attrs) ? undefined : {
@@ -253,7 +204,6 @@ var marks = {
     return {
       object: 'mark',
       type: hasCSSRule ? 'css' : mark,
-
       /**
        * Here for rendering styles for all elements
        */
@@ -263,13 +213,11 @@ var marks = {
   },
   serialize: function serialize(object, children) {
     var _object$data, _jsonData$attributes;
-
     var jsonData = ((_object$data = object.data) === null || _object$data === void 0 ? void 0 : _object$data.toJSON()) || {};
     var elClasses = ((_jsonData$attributes = jsonData.attributes) === null || _jsonData$attributes === void 0 ? void 0 : _jsonData$attributes["class"]) || '';
     var hasCSSRule = ((extraCSSRulesOpts === null || extraCSSRulesOpts === void 0 ? void 0 : extraCSSRulesOpts.names) || []).find(function (name) {
       return elClasses === null || elClasses === void 0 ? void 0 : elClasses.includes(name);
     });
-
     if (hasCSSRule) {
       var htmlAttrs = Object.keys(jsonData.attributes).reduce(function (obj, key) {
         obj[reactToHTMLAttributesMap[key] || key] = jsonData.attributes[key];
@@ -277,47 +225,40 @@ var marks = {
       }, {});
       return /*#__PURE__*/_react["default"].createElement("span", htmlAttrs, children);
     }
-
     if (_slate.Mark.isMark(object)) {
       for (var key in MARK_TAGS) {
         if (MARK_TAGS[key] === object.type) {
           var Tag = key;
           var additionalStyles = STYLES_MAP[Tag];
-
           if (additionalStyles) {
             if (!jsonData.attributes) {
               jsonData.attributes = {};
             }
-
             jsonData.attributes.style = _objectSpread(_objectSpread({}, jsonData.attributes.style), additionalStyles);
           }
-
           return /*#__PURE__*/_react["default"].createElement(Tag, jsonData.attributes, children);
         }
       }
     }
   }
-}; // eslint-disable-next-line no-unused-vars
+};
 
-var findPreviousText = function findPreviousText(el) {
+// eslint-disable-next-line no-unused-vars
+var _findPreviousText = function findPreviousText(el) {
   if (el.nodeName === '#text') {
     return el;
   }
-
   if (el.previousSibling) {
-    return findPreviousText(el.previousSibling);
+    return _findPreviousText(el.previousSibling);
   }
-
   return null;
 };
-
-var TEXT_RULE = {
+var TEXT_RULE = exports.TEXT_RULE = {
   deserialize: function deserialize(el) {
     /**
      * This needs to be called on the dom element in order to merge the adjacent text nodes together
      * */
     el.normalize();
-
     if (el.tagName && el.tagName.toLowerCase() === 'br') {
       return {
         object: 'text',
@@ -327,7 +268,6 @@ var TEXT_RULE = {
         }]
       };
     }
-
     if (el.nodeName === '#text') {
       if (el.nodeValue && el.nodeValue.match(/<!--.*?-->/)) return;
       log('[text:deserialize] return text object..');
@@ -343,49 +283,39 @@ var TEXT_RULE = {
   serialize: function serialize(obj, children) {
     if (obj.object === 'string') {
       return children.split('\n').reduce(function (array, text, i) {
-        if (i !== 0) array.push( /*#__PURE__*/_react["default"].createElement("br", null));
+        if (i !== 0) array.push(/*#__PURE__*/_react["default"].createElement("br", null));
         array.push(text);
         return array;
       }, []);
     }
   }
 };
-exports.TEXT_RULE = TEXT_RULE;
 var RULES = [_list.serialization, _math.serialization, _media.serialization, _image.serialization, _table.serialization, _respArea.serialization, TEXT_RULE, inlines, blocks, marks];
-
 function allWhitespace(node) {
   // Use ECMA-262 Edition 3 String and RegExp features
   return !/[^\t\n\r ]/.test(node.textContent);
 }
-
 function defaultParseHtml(html) {
   if (typeof DOMParser === 'undefined') {
     throw new Error('The native `DOMParser` global which the `Html` serializer uses by default is not present in this environment. You must supply the `options.parseHtml` function instead.');
   }
-
   var parsed = new DOMParser().parseFromString(html, 'text/html');
   var body = parsed.body;
   var textNodes = document.createTreeWalker(body, NodeFilter.SHOW_TEXT, null, null);
   var n = textNodes.nextNode();
-
   while (n) {
-    var _n$nextSibling, _n$nextSibling$tagNam, _n$previousSibling, _n$previousSibling$ta;
-
+    var _n$nextSibling, _n$previousSibling;
     var isWhiteSpace = allWhitespace(n);
-    var isNotNearMarkup = !MARK_TAGS[(_n$nextSibling = n.nextSibling) === null || _n$nextSibling === void 0 ? void 0 : (_n$nextSibling$tagNam = _n$nextSibling.tagName) === null || _n$nextSibling$tagNam === void 0 ? void 0 : _n$nextSibling$tagNam.toLowerCase()] && !MARK_TAGS[(_n$previousSibling = n.previousSibling) === null || _n$previousSibling === void 0 ? void 0 : (_n$previousSibling$ta = _n$previousSibling.tagName) === null || _n$previousSibling$ta === void 0 ? void 0 : _n$previousSibling$ta.toLowerCase()];
-
+    var isNotNearMarkup = !MARK_TAGS[(_n$nextSibling = n.nextSibling) === null || _n$nextSibling === void 0 || (_n$nextSibling = _n$nextSibling.tagName) === null || _n$nextSibling === void 0 ? void 0 : _n$nextSibling.toLowerCase()] && !MARK_TAGS[(_n$previousSibling = n.previousSibling) === null || _n$previousSibling === void 0 || (_n$previousSibling = _n$previousSibling.tagName) === null || _n$previousSibling === void 0 ? void 0 : _n$previousSibling.toLowerCase()];
     if (isWhiteSpace && isNotNearMarkup || n.nodeValue === "\u200B") {
       n.parentNode.removeChild(n);
     }
-
     n = textNodes.nextNode();
   }
-
   return body;
 }
-/** If this lib is used on the server side, we need to bypass using the DOMParser - just put in a stub. */
-
 
+/** If this lib is used on the server side, we need to bypass using the DOMParser - just put in a stub. */
 var parseHtml = typeof window === 'undefined' ? function () {
   return {
     childNodes: []
@@ -396,20 +326,18 @@ var serializer = new _slateHtmlSerializer["default"]({
   rules: RULES,
   parseHtml: parseHtml
 });
-
 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;
 };
+
 /**
  * This is needed in order to override the function that eventually leads
  * to the max iteration of 12, which in most cases it's not enough. The newer versions
@@ -419,8 +347,6 @@ var _extends = Object.assign || function (target) {
  * Below is the code that calculates the max iterations.
  * var max = schema.stack.plugins.length + schema.rules.length + 1;
  */
-
-
 serializer.deserialize = function deserialize(html) {
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   var _options$toJSON = options.toJSON;
@@ -429,22 +355,19 @@ serializer.deserialize = function deserialize(html) {
   var parseHtml = this.parseHtml;
   var fragment = parseHtml(html);
   var children = Array.from(fragment.childNodes);
-  var nodes = this.deserializeElements(children); // COMPAT: ensure that all top-level inline nodes are wrapped into a block.
+  var nodes = this.deserializeElements(children);
 
+  // COMPAT: ensure that all top-level inline nodes are wrapped into a block.
   nodes = nodes.reduce(function (memo, node, i, original) {
     if (node.object === 'block') {
       memo.push(node);
       return memo;
     }
-
     if (i > 0 && original[i - 1].object !== 'block') {
       var _block = memo[memo.length - 1];
-
       _block.nodes.push(node);
-
       return memo;
     }
-
     var block = _extends({
       object: 'block',
       data: {},
@@ -452,11 +375,9 @@ serializer.deserialize = function deserialize(html) {
     }, defaultBlock, {
       nodes: [node]
     });
-
     memo.push(block);
     return memo;
   }, []);
-
   if (nodes.length === 0) {
     nodes = [_extends({
       object: 'block',
@@ -473,7 +394,6 @@ serializer.deserialize = function deserialize(html) {
       }]
     })];
   }
-
   var json = {
     object: 'value',
     document: {
@@ -486,7 +406,6 @@ serializer.deserialize = function deserialize(html) {
     }
   };
   var i;
-
   for (i = 0; i < 3000; i++) {
     json.schema.rules.push({
       match: {
@@ -499,56 +418,46 @@ serializer.deserialize = function deserialize(html) {
       }]
     });
   }
-
   var ret = toJSON ? json : _slate.Value.fromJSON(json);
-
   if (ret) {
     return ret;
   }
-
   return null;
 };
-
-var reduceMultipleBrs = function reduceMultipleBrs(markup) {
+var reduceMultipleBrs = exports.reduceMultipleBrs = function reduceMultipleBrs(markup) {
   try {
     return markup.replace(/(<br\s*\/?>){3,}/gi, '<br>');
   } catch (e) {
     // eslint-disable-next-line no-console
-    console.log("Couldn't remove <br/> tags: ", e);
+    console.log('Couldn\'t remove <br/> tags: ', e);
   }
-
   return markup;
 };
-
-exports.reduceMultipleBrs = reduceMultipleBrs;
-
 var reduceRedundantNewLineCharacters = function reduceRedundantNewLineCharacters(markup) {
   try {
     return markup.replace(/\n/gi, '');
   } catch (e) {
     // eslint-disable-next-line no-console
-    console.log("Couldn't remove <br/> tags: ", e);
+    console.log('Couldn\'t remove <br/> tags: ', e);
   }
-
   return markup;
 };
+
 /**
  * Makes sure that the html provided respects the schema
  * rules for the slate editor.
  * @param markup
  * @returns {string}
  */
-
-
 var fixHtmlCode = function fixHtmlCode(markup) {
   var wrapperEl = document.createElement('div');
   wrapperEl.innerHTML = markup;
+
   /**
    * DIV elements that are at the same level as paragraphs
    * are replaced with P elements for normalizing purposes
    * @param child
    */
-
   var fixParagraphs = function fixParagraphs(child) {
     var p = document.createElement('p');
     p.innerHTML = child.innerHTML;
@@ -557,6 +466,7 @@ var fixHtmlCode = function fixHtmlCode(markup) {
     });
     child.replaceWith(p);
   };
+
   /**
    * @summary Makes sure that tables are placed in the root document.
    * @description This function removes the tables from the nodes that are
@@ -564,48 +474,46 @@ var fixHtmlCode = function fixHtmlCode(markup) {
    * the parent element.
    * @param tableArray
    */
-
-
   var fixTables = function fixTables(tableArray) {
     tableArray.forEach(function (el) {
       var index = el.index,
-          child = el.child,
-          parent = el.parent;
+        child = el.child,
+        parent = el.parent;
       var nodesBefore = [];
       var nodesAfter = [];
       var allNodes = Array.from(parent.childNodes);
       var i;
-
       for (i = 0; i < allNodes.length; i++) {
         var node = allNodes[i];
-
         if (i < index) {
           nodesBefore.push(node);
         } else if (i > index) {
           nodesAfter.push(node);
         }
-      } // creating the element that is going to be placed instead of the parent
-
+      }
 
+      // creating the element that is going to be placed instead of the parent
       var beforeEl = document.createElement(parent.nodeName);
-      beforeEl.append.apply(beforeEl, nodesBefore); // replacing parent with the beforeElement
+      beforeEl.append.apply(beforeEl, nodesBefore);
 
-      parent.replaceWith(beforeEl); // adding the table right after the before element
+      // replacing parent with the beforeElement
+      parent.replaceWith(beforeEl);
 
-      beforeEl.after(child); // creating the element that is going to be placed after the table
+      // adding the table right after the before element
+      beforeEl.after(child);
 
+      // creating the element that is going to be placed after the table
       var afterEl = document.createElement(parent.nodeName);
-      afterEl.append.apply(afterEl, nodesAfter); // adding the after element near the table
+      afterEl.append.apply(afterEl, nodesAfter);
 
+      // adding the after element near the table
       child.after(afterEl);
     });
   };
-
   var emptyBlockCheck = function emptyBlockCheck(node) {
     return (node.nodeName === 'DIV' || node.nodeName === 'P' || node.nodeName === 'LI') && node.childNodes.length === 0;
   };
-
-  var parseNode = function parseNode(el) {
+  var _parseNode = function parseNode(el) {
     var childArray = Array.from(el.childNodes);
     var hasParagraphs = childArray.find(function (child) {
       return child.nodeName === 'P';
@@ -617,11 +525,9 @@ var fixHtmlCode = function fixHtmlCode(markup) {
         child.remove();
         return;
       }
-
       if (hasParagraphs && child.nodeName === 'DIV') {
         fixParagraphs(child);
       }
-
       if (wrapperEl !== el && child.nodeName === 'TABLE') {
         // we don't need to fix tables in the root element
         tables.push({
@@ -630,40 +536,31 @@ var fixHtmlCode = function fixHtmlCode(markup) {
           parent: el
         });
       }
-
-      parseNode(child);
+      _parseNode(child);
     });
-
     if (tables.length) {
       fixTables(tables);
     }
   };
-
-  parseNode(wrapperEl);
+  _parseNode(wrapperEl);
   return wrapperEl.innerHTML;
 };
-
-var handleHtml = function handleHtml(html) {
+var handleHtml = exports.handleHtml = function handleHtml(html) {
   return fixHtmlCode(reduceRedundantNewLineCharacters(reduceMultipleBrs(html)));
 };
-
-exports.handleHtml = handleHtml;
-
-var htmlToValue = function htmlToValue(html) {
+var htmlToValue = exports.htmlToValue = function htmlToValue(html) {
   try {
     return serializer.deserialize(handleHtml(html));
   } catch (e) {
     // eslint-disable-next-line no-console
-    console.log("Couldn't parse html: ", e);
+    console.log('Couldn\'t parse html: ', e);
     return {};
   }
 };
-
-exports.htmlToValue = htmlToValue;
-
-var valueToHtml = function valueToHtml(value) {
+var valueToHtml = exports.valueToHtml = function valueToHtml(value) {
   return serializer.serialize(value);
 };
+
 /**
  *
  * <div><div>a</div></div> -> <div>a</div>
@@ -671,7 +568,4 @@ var valueToHtml = function valueToHtml(value) {
  * <div><div>a</div><div>b</div></div> -> <div>a</div><div>b</div>
  * <div><div>a</div>4444<div>b</div></div> -> <div>a</div>4444<div>b</div>
  */
-
-
-exports.valueToHtml = valueToHtml;
 //# sourceMappingURL=serialization.js.map