react-element-to-jsx-string - npm Package Compare versions

Comparing version 14.1.0 to 14.2.0

CHANGELOG.md

@@ -0,1 +1,16 @@
+# [14.2.0](https://github.com/algolia/react-element-to-jsx-string/compare/v14.1.0...v14.2.0) (2019-12-29)
+
+
+### Bug Fixes
+
+* **deps:** pin dependency @base2/pretty-print-object to 1.0.0 ([07f19f9](https://github.com/algolia/react-element-to-jsx-string/commit/07f19f95844681fc4a04e440138e41e385f98a75))
+* **formatting:** fix the anonymous functional component detection after babel upgrade ([7a1b93e](https://github.com/algolia/react-element-to-jsx-string/commit/7a1b93eca7446c4183298a03178f737678d85678))
+
+
+### Features
+
+* **typescript:** Add TypeScript declaration file. ([#475](https://github.com/algolia/react-element-to-jsx-string/issues/475)) ([f9ea4e5](https://github.com/algolia/react-element-to-jsx-string/commit/f9ea4e54c3d01f45ace0038f2031bf9095a48138))
+
+
+
 # [14.1.0](https://github.com/algolia/react-element-to-jsx-string/compare/v14.0.3...v14.1.0) (2019-09-15)
@@ -2,0 +17,0 @@

dist/cjs/index.js

@@ -18,2 +18,36 @@ 'use strict';
 
+function _typeof(obj) {
+  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+    _typeof = function (obj) {
+      return typeof obj;
+    };
+  } else {
+    _typeof = function (obj) {
+      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+    };
+  }
+
+  return _typeof(obj);
+}
+
+function _toConsumableArray(arr) {
+  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread();
+}
+
+function _arrayWithoutHoles(arr) {
+  if (Array.isArray(arr)) {
+    for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];
+
+    return arr2;
+  }
+}
+
+function _iterableToArray(iter) {
+  if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter);
+}
+
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance");
+}
+
 /*!
@@ -239,21 +273,19 @@ * isobject <https://github.com/jonschlinkert/isobject>
 
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
 function sortObject(value) {
   // return non-object value as is
-  if (value === null || (typeof value === 'undefined' ? 'undefined' : _typeof(value)) !== 'object') {
+  if (value === null || _typeof(value) !== 'object') {
     return value;
-  }
+  } // return date and regexp values as is
 
-  // return date and regexp values as is
+
   if (value instanceof Date || value instanceof RegExp) {
     return value;
-  }
+  } // make a copy of array with each item passed through sortObject()
 
-  // make a copy of array with each item passed through sortObject()
+
   if (Array.isArray(value)) {
     return value.map(sortObject);
-  }
+  } // make a copy of object with key sorted
 
-  // make a copy of object with key sorted
+
   return Object.keys(value).sort().reduce(function (result, key) {
@@ -263,2 +295,3 @@ if (key === '_owner') {
     }
+
     if (key === 'current') {
@@ -271,2 +304,3 @@ // eslint-disable-next-line no-param-reassign
     }
+
     return result;
@@ -277,3 +311,2 @@ }, {});
 /* eslint-disable no-use-before-define */
-
 var createStringTreeNode = function createStringTreeNode(value) {
@@ -285,3 +318,2 @@ return {
 };
-
 var createNumberTreeNode = function createNumberTreeNode(value) {
@@ -293,3 +325,2 @@ return {
 };
-
 var createReactElementTreeNode = function createReactElementTreeNode(displayName, props, defaultProps, childrens) {
@@ -304,3 +335,2 @@ return {
 };
-
 var createReactFragmentTreeNode = function createReactFragmentTreeNode(key, childrens) {
@@ -314,9 +344,6 @@ return {
 
-var _typeof$1 = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
-
 var supportFragment = Boolean(React.Fragment);
 
 var getReactElementDisplayName = function getReactElementDisplayName(element) {
-  return element.type.displayName || element.type.name || ( // function name
+  return element.type.displayName || (element.type.name !== '_default' ? element.type.name : null) || ( // function name
   typeof element.type === 'function' // function without a name, you should provide one
@@ -336,3 +363,2 @@ ? 'No Display Name' : element.type);
   var filteredProps = {};
-
   Object.keys(originalProps).filter(function (key) {
@@ -343,3 +369,2 @@ return cb(originalProps[key], key);
   });
-
   return filteredProps;
@@ -350,5 +375,4 @@ };
   var _options$displayName = options.displayName,
-      displayNameFn = _options$displayName === undefined ? getReactElementDisplayName : _options$displayName;
+      displayNameFn = _options$displayName === void 0 ? getReactElementDisplayName : _options$displayName;
 
-
   if (typeof element === 'string') {
@@ -359,8 +383,8 @@ return createStringTreeNode(element);
   } else if (!React__default.isValidElement(element)) {
-    throw new Error('react-element-to-jsx-string: Expected a React.Element, got `' + (typeof element === 'undefined' ? 'undefined' : _typeof$1(element)) + '`');
+    throw new Error("react-element-to-jsx-string: Expected a React.Element, got `".concat(_typeof(element), "`"));
   }
 
   var displayName = displayNameFn(element);
+  var props = filterProps(element.props, noChildren);
 
-  var props = filterProps(element.props, noChildren);
   if (element.ref !== null) {
@@ -371,2 +395,3 @@ props.ref = element.ref;
   var key = element.key;
+
   if (typeof key === 'string' && key.search(/^\./)) {
@@ -396,12 +421,9 @@ // React automatically add key=".X" when there are some children
 };
-
 var preserveFunctionLineBreak = function preserveFunctionLineBreak(fn) {
   return fn.toString();
 };
-
 var defaultFunctionValue = inlineFunction;
-
 var formatFunction = (function (fn, options) {
   var _options$functionValu = options.functionValue,
-      functionValue = _options$functionValu === undefined ? defaultFunctionValue : _options$functionValu,
+      functionValue = _options$functionValu === void 0 ? defaultFunctionValue : _options$functionValu,
       showFunctions = options.showFunctions;
@@ -418,3 +440,2 @@
   var normalizedValue = sortObject(value);
-
   var stringifiedValue = dist_1(normalizedValue, {
@@ -438,10 +459,8 @@ transform: function transform(currentObj, prop, originalResult) {
     return stringifiedValue.replace(/\s+/g, ' ').replace(/{ /g, '{').replace(/ }/g, '}').replace(/\[ /g, '[').replace(/ ]/g, ']');
-  }
+  } // Replace tabs with spaces, and add necessary indentation in front of each new line
 
-  // Replace tabs with spaces, and add necessary indentation in front of each new line
-  return stringifiedValue.replace(/\t/g, spacer(1, options.tabStop)).replace(/\n([^$])/g, '\n' + spacer(lvl + 1, options.tabStop) + '$1');
+
+  return stringifiedValue.replace(/\t/g, spacer(1, options.tabStop)).replace(/\n([^$])/g, "\n".concat(spacer(lvl + 1, options.tabStop), "$1"));
 });
 
-var _typeof$2 = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
 var escape = function escape(s) {
@@ -453,39 +472,39 @@ return s.replace(/"/g, '&quot;');
   if (typeof propValue === 'number') {
-    return '{' + String(propValue) + '}';
+    return "{".concat(String(propValue), "}");
   }
 
   if (typeof propValue === 'string') {
-    return '"' + escape(propValue) + '"';
-  }
-
-  // > "Symbols (new in ECMAScript 2015, not yet supported in Flow)"
+    return "\"".concat(escape(propValue), "\"");
+  } // > "Symbols (new in ECMAScript 2015, not yet supported in Flow)"
   // @see: https://flow.org/en/docs/types/primitives/
   // $FlowFixMe: Flow does not support Symbol
-  if ((typeof propValue === 'undefined' ? 'undefined' : _typeof$2(propValue)) === 'symbol') {
+
+
+  if (_typeof(propValue) === 'symbol') {
     var symbolDescription = propValue.valueOf().toString().replace(/Symbol\((.*)\)/, '$1');
 
     if (!symbolDescription) {
-      return '{Symbol()}';
+      return "{Symbol()}";
     }
 
-    return '{Symbol(\'' + symbolDescription + '\')}';
+    return "{Symbol('".concat(symbolDescription, "')}");
   }
 
   if (typeof propValue === 'function') {
-    return '{' + formatFunction(propValue, options) + '}';
+    return "{".concat(formatFunction(propValue, options), "}");
   }
 
   if (React.isValidElement(propValue)) {
-    return '{' + formatTreeNode(parseReactElement(propValue, options), true, lvl, options) + '}';
+    return "{".concat(formatTreeNode(parseReactElement(propValue, options), true, lvl, options), "}");
   }
 
   if (propValue instanceof Date) {
-    return '{new Date("' + propValue.toISOString() + '")}';
+    return "{new Date(\"".concat(propValue.toISOString(), "\")}");
   }
 
   if (isPlainObject(propValue) || Array.isArray(propValue)) {
-    return '{' + formatComplexDataStructure(propValue, inline, lvl, options) + '}';
+    return "{".concat(formatComplexDataStructure(propValue, inline, lvl, options), "}");
   }
 
-  return '{' + String(propValue) + '}';
+  return "{".concat(String(propValue), "}");
 };
@@ -495,15 +514,11 @@
   if (!hasValue && !hasDefaultValue) {
-    throw new Error('The prop "' + name + '" has no value and no default: could not be formatted');
+    throw new Error("The prop \"".concat(name, "\" has no value and no default: could not be formatted"));
   }
 
   var usedValue = hasValue ? value : defaultValue;
-
   var useBooleanShorthandSyntax = options.useBooleanShorthandSyntax,
       tabStop = options.tabStop;
-
-
   var formattedPropValue = formatPropValue(usedValue, inline, lvl, options);
-
   var attributeFormattedInline = ' ';
-  var attributeFormattedMultiline = '\n' + spacer(lvl + 1, tabStop);
+  var attributeFormattedMultiline = "\n".concat(spacer(lvl + 1, tabStop));
   var isMultilineAttribute = formattedPropValue.includes('\n');
@@ -516,7 +531,7 @@
   } else if (useBooleanShorthandSyntax && formattedPropValue === '{true}') {
-    attributeFormattedInline += '' + name;
-    attributeFormattedMultiline += '' + name;
+    attributeFormattedInline += "".concat(name);
+    attributeFormattedMultiline += "".concat(name);
   } else {
-    attributeFormattedInline += name + '=' + formattedPropValue;
-    attributeFormattedMultiline += name + '=' + formattedPropValue;
+    attributeFormattedInline += "".concat(name, "=").concat(formattedPropValue);
+    attributeFormattedMultiline += "".concat(name, "=").concat(formattedPropValue);
   }
@@ -548,4 +563,2 @@
 
-function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
-
 var isKeyOrRefProps = function isKeyOrRefProps(propName) {
@@ -559,10 +572,8 @@ return ['key', 'ref'].includes(propName);
     var haveRefProp = props.includes('ref');
-
     var userPropsOnly = props.filter(function (oneProp) {
       return !isKeyOrRefProps(oneProp);
     });
+    var sortedProps = shouldSortUserProps ? _toConsumableArray(userPropsOnly.sort()) // We use basic lexical order
+    : _toConsumableArray(userPropsOnly);
 
-    var sortedProps = shouldSortUserProps ? [].concat(_toConsumableArray(userPropsOnly.sort())) // We use basic lexical order
-    : [].concat(_toConsumableArray(userPropsOnly));
-
     if (haveRefProp) {
@@ -583,3 +594,2 @@ sortedProps.unshift('ref');
 
-
   if (element.type === 'string') {
@@ -591,3 +601,3 @@ return formattedElement.split('\n').map(function (line, offset) {
 
-      return '' + spacer(lvl, tabStop) + line;
+      return "".concat(spacer(lvl, tabStop)).concat(line);
     }).join('\n');
@@ -627,12 +637,11 @@ }
       _node$displayName = node.displayName,
-      displayName = _node$displayName === undefined ? '' : _node$displayName,
+      displayName = _node$displayName === void 0 ? '' : _node$displayName,
       childrens = node.childrens,
       _node$props = node.props,
-      props = _node$props === undefined ? {} : _node$props,
+      props = _node$props === void 0 ? {} : _node$props,
       _node$defaultProps = node.defaultProps,
-      defaultProps = _node$defaultProps === undefined ? {} : _node$defaultProps;
+      defaultProps = _node$defaultProps === void 0 ? {} : _node$defaultProps;
 
-
   if (type !== 'ReactElement') {
-    throw new Error('The "formatReactElementNode" function could only format node of type "ReactElement". Given:  ' + type);
+    throw new Error("The \"formatReactElementNode\" function could only format node of type \"ReactElement\". Given:  ".concat(type));
   }
@@ -645,12 +654,7 @@
       tabStop = options.tabStop;
-
-
-  var out = '<' + displayName;
-
+  var out = "<".concat(displayName);
   var outInlineAttr = out;
   var outMultilineAttr = out;
   var containsMultilineAttr = false;
-
   var visibleAttributeNames = [];
-
   Object.keys(props).filter(function (propName) {
@@ -661,3 +665,2 @@ return filterProps.indexOf(propName) === -1;
   });
-
   Object.keys(defaultProps).filter(function (defaultPropName) {
@@ -672,5 +675,3 @@ return filterProps.indexOf(defaultPropName) === -1;
   });
-
   var attributes = sortPropsByNames(sortProps)(visibleAttributeNames);
-
   attributes.forEach(function (attributeName) {
@@ -689,5 +690,4 @@ var _formatProp = formatProp(attributeName, Object.keys(props).includes(attributeName), props[attributeName], Object.keys(defaultProps).includes(attributeName), defaultProps[attributeName], inline, lvl, options),
   });
+  outMultilineAttr += "\n".concat(spacer(lvl, tabStop));
 
-  outMultilineAttr += '\n' + spacer(lvl, tabStop);
-
   if (shouldRenderMultilineAttr(attributes, outInlineAttr, containsMultilineAttr, inline, lvl, tabStop, maxInlineAttributesLineLength)) {
@@ -701,3 +701,2 @@ out = outMultilineAttr;
     var newLvl = lvl + 1;
-
     out += '>';
@@ -710,3 +709,3 @@
 
-    out += childrens.reduce(mergeSiblingPlainStringChildrenReducer, []).map(formatOneChildren(inline, newLvl, options)).join(!inline ? '\n' + spacer(newLvl, tabStop) : '');
+    out += childrens.reduce(mergeSiblingPlainStringChildrenReducer, []).map(formatOneChildren(inline, newLvl, options)).join(!inline ? "\n".concat(spacer(newLvl, tabStop)) : '');
 
@@ -717,3 +716,4 @@ if (!inline) {
     }
-    out += '</' + displayName + '>';
+
+    out += "</".concat(displayName, ">");
   } else {
@@ -735,4 +735,7 @@ if (!isInlineAttributeTooLong(attributes, outInlineAttr, lvl, tabStop, maxInlineAttributesLineLength)) {
   var props = {};
+
   if (key) {
-    props = { key: key };
+    props = {
+      key: key
+    };
   }
@@ -753,2 +756,3 @@
 };
+
 var hasNoChildren = function hasNoChildren(_ref2) {
@@ -764,11 +768,9 @@ var childrens = _ref2.childrens;
 
-
   if (type !== 'ReactFragment') {
-    throw new Error('The "formatReactFragmentNode" function could only format node of type "ReactFragment". Given: ' + type);
+    throw new Error("The \"formatReactFragmentNode\" function could only format node of type \"ReactFragment\". Given: ".concat(type));
   }
 
   var useFragmentShortSyntax = options.useFragmentShortSyntax;
+  var displayName;
 
-
-  var displayName = void 0;
   if (useFragmentShortSyntax) {
@@ -788,2 +790,3 @@ if (hasNoChildren(node) || isKeyedFragment(node)) {
 var jsxStopChars = ['<', '>', '{', '}'];
+
 var shouldBeEscaped = function shouldBeEscaped(s) {
@@ -800,3 +803,3 @@ return jsxStopChars.some(function (jsxStopChar) {
 
-  return '{`' + s + '`}';
+  return "{`".concat(s, "`}");
 };
@@ -806,2 +809,3 @@
   var result = s;
+
   if (result.endsWith(' ')) {
@@ -824,3 +828,3 @@ result = result.replace(/^(\S*)(\s*)$/, "$1{'$2'}");
   if (node.type === 'string') {
-    return node.value ? '' + preserveTrailingSpace(escape$1(String(node.value))) : '';
+    return node.value ? "".concat(preserveTrailingSpace(escape$1(String(node.value)))) : '';
   }
@@ -836,3 +840,3 @@
 
-  throw new TypeError('Unknow format type "' + node.type + '"');
+  throw new TypeError("Unknow format type \"".concat(node.type, "\""));
 });
@@ -847,16 +851,16 @@
       _ref$filterProps = _ref.filterProps,
-      filterProps = _ref$filterProps === undefined ? [] : _ref$filterProps,
+      filterProps = _ref$filterProps === void 0 ? [] : _ref$filterProps,
       _ref$showDefaultProps = _ref.showDefaultProps,
-      showDefaultProps = _ref$showDefaultProps === undefined ? true : _ref$showDefaultProps,
+      showDefaultProps = _ref$showDefaultProps === void 0 ? true : _ref$showDefaultProps,
       _ref$showFunctions = _ref.showFunctions,
-      showFunctions = _ref$showFunctions === undefined ? false : _ref$showFunctions,
+      showFunctions = _ref$showFunctions === void 0 ? false : _ref$showFunctions,
       functionValue = _ref.functionValue,
       _ref$tabStop = _ref.tabStop,
-      tabStop = _ref$tabStop === undefined ? 2 : _ref$tabStop,
+      tabStop = _ref$tabStop === void 0 ? 2 : _ref$tabStop,
       _ref$useBooleanShorth = _ref.useBooleanShorthandSyntax,
-      useBooleanShorthandSyntax = _ref$useBooleanShorth === undefined ? true : _ref$useBooleanShorth,
+      useBooleanShorthandSyntax = _ref$useBooleanShorth === void 0 ? true : _ref$useBooleanShorth,
       _ref$useFragmentShort = _ref.useFragmentShortSyntax,
-      useFragmentShortSyntax = _ref$useFragmentShort === undefined ? true : _ref$useFragmentShort,
+      useFragmentShortSyntax = _ref$useFragmentShort === void 0 ? true : _ref$useFragmentShort,
       _ref$sortProps = _ref.sortProps,
-      sortProps = _ref$sortProps === undefined ? true : _ref$sortProps,
+      sortProps = _ref$sortProps === void 0 ? true : _ref$sortProps,
       maxInlineAttributesLineLength = _ref.maxInlineAttributesLineLength,
@@ -881,3 +885,2 @@ displayName = _ref.displayName;
   };
-
   return formatTree(parseReactElement(element, options), options);
@@ -884,0 +887,0 @@ };

dist/esm/index.js

@@ -11,2 +11,36 @@ import React, { Fragment, isValidElement } from 'react';
 
+function _typeof(obj) {
+  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+    _typeof = function (obj) {
+      return typeof obj;
+    };
+  } else {
+    _typeof = function (obj) {
+      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+    };
+  }
+
+  return _typeof(obj);
+}
+
+function _toConsumableArray(arr) {
+  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread();
+}
+
+function _arrayWithoutHoles(arr) {
+  if (Array.isArray(arr)) {
+    for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];
+
+    return arr2;
+  }
+}
+
+function _iterableToArray(iter) {
+  if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter);
+}
+
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance");
+}
+
 /*!
@@ -232,21 +266,19 @@ * isobject <https://github.com/jonschlinkert/isobject>
 
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
 function sortObject(value) {
   // return non-object value as is
-  if (value === null || (typeof value === 'undefined' ? 'undefined' : _typeof(value)) !== 'object') {
+  if (value === null || _typeof(value) !== 'object') {
     return value;
-  }
+  } // return date and regexp values as is
 
-  // return date and regexp values as is
+
   if (value instanceof Date || value instanceof RegExp) {
     return value;
-  }
+  } // make a copy of array with each item passed through sortObject()
 
-  // make a copy of array with each item passed through sortObject()
+
   if (Array.isArray(value)) {
     return value.map(sortObject);
-  }
+  } // make a copy of object with key sorted
 
-  // make a copy of object with key sorted
+
   return Object.keys(value).sort().reduce(function (result, key) {
@@ -256,2 +288,3 @@ if (key === '_owner') {
     }
+
     if (key === 'current') {
@@ -264,2 +297,3 @@ // eslint-disable-next-line no-param-reassign
     }
+
     return result;
@@ -270,3 +304,2 @@ }, {});
 /* eslint-disable no-use-before-define */
-
 var createStringTreeNode = function createStringTreeNode(value) {
@@ -278,3 +311,2 @@ return {
 };
-
 var createNumberTreeNode = function createNumberTreeNode(value) {
@@ -286,3 +318,2 @@ return {
 };
-
 var createReactElementTreeNode = function createReactElementTreeNode(displayName, props, defaultProps, childrens) {
@@ -297,3 +328,2 @@ return {
 };
-
 var createReactFragmentTreeNode = function createReactFragmentTreeNode(key, childrens) {
@@ -307,9 +337,6 @@ return {
 
-var _typeof$1 = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
-
 var supportFragment = Boolean(Fragment);
 
 var getReactElementDisplayName = function getReactElementDisplayName(element) {
-  return element.type.displayName || element.type.name || ( // function name
+  return element.type.displayName || (element.type.name !== '_default' ? element.type.name : null) || ( // function name
   typeof element.type === 'function' // function without a name, you should provide one
@@ -329,3 +356,2 @@ ? 'No Display Name' : element.type);
   var filteredProps = {};
-
   Object.keys(originalProps).filter(function (key) {
@@ -336,3 +362,2 @@ return cb(originalProps[key], key);
   });
-
   return filteredProps;
@@ -343,5 +368,4 @@ };
   var _options$displayName = options.displayName,
-      displayNameFn = _options$displayName === undefined ? getReactElementDisplayName : _options$displayName;
+      displayNameFn = _options$displayName === void 0 ? getReactElementDisplayName : _options$displayName;
 
-
   if (typeof element === 'string') {
@@ -352,8 +376,8 @@ return createStringTreeNode(element);
   } else if (!React.isValidElement(element)) {
-    throw new Error('react-element-to-jsx-string: Expected a React.Element, got `' + (typeof element === 'undefined' ? 'undefined' : _typeof$1(element)) + '`');
+    throw new Error("react-element-to-jsx-string: Expected a React.Element, got `".concat(_typeof(element), "`"));
   }
 
   var displayName = displayNameFn(element);
+  var props = filterProps(element.props, noChildren);
 
-  var props = filterProps(element.props, noChildren);
   if (element.ref !== null) {
@@ -364,2 +388,3 @@ props.ref = element.ref;
   var key = element.key;
+
   if (typeof key === 'string' && key.search(/^\./)) {
@@ -389,12 +414,9 @@ // React automatically add key=".X" when there are some children
 };
-
 var preserveFunctionLineBreak = function preserveFunctionLineBreak(fn) {
   return fn.toString();
 };
-
 var defaultFunctionValue = inlineFunction;
-
 var formatFunction = (function (fn, options) {
   var _options$functionValu = options.functionValue,
-      functionValue = _options$functionValu === undefined ? defaultFunctionValue : _options$functionValu,
+      functionValue = _options$functionValu === void 0 ? defaultFunctionValue : _options$functionValu,
       showFunctions = options.showFunctions;
@@ -411,3 +433,2 @@
   var normalizedValue = sortObject(value);
-
   var stringifiedValue = dist_1(normalizedValue, {
@@ -431,10 +452,8 @@ transform: function transform(currentObj, prop, originalResult) {
     return stringifiedValue.replace(/\s+/g, ' ').replace(/{ /g, '{').replace(/ }/g, '}').replace(/\[ /g, '[').replace(/ ]/g, ']');
-  }
+  } // Replace tabs with spaces, and add necessary indentation in front of each new line
 
-  // Replace tabs with spaces, and add necessary indentation in front of each new line
-  return stringifiedValue.replace(/\t/g, spacer(1, options.tabStop)).replace(/\n([^$])/g, '\n' + spacer(lvl + 1, options.tabStop) + '$1');
+
+  return stringifiedValue.replace(/\t/g, spacer(1, options.tabStop)).replace(/\n([^$])/g, "\n".concat(spacer(lvl + 1, options.tabStop), "$1"));
 });
 
-var _typeof$2 = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
 var escape = function escape(s) {
@@ -446,39 +465,39 @@ return s.replace(/"/g, '&quot;');
   if (typeof propValue === 'number') {
-    return '{' + String(propValue) + '}';
+    return "{".concat(String(propValue), "}");
   }
 
   if (typeof propValue === 'string') {
-    return '"' + escape(propValue) + '"';
-  }
-
-  // > "Symbols (new in ECMAScript 2015, not yet supported in Flow)"
+    return "\"".concat(escape(propValue), "\"");
+  } // > "Symbols (new in ECMAScript 2015, not yet supported in Flow)"
   // @see: https://flow.org/en/docs/types/primitives/
   // $FlowFixMe: Flow does not support Symbol
-  if ((typeof propValue === 'undefined' ? 'undefined' : _typeof$2(propValue)) === 'symbol') {
+
+
+  if (_typeof(propValue) === 'symbol') {
     var symbolDescription = propValue.valueOf().toString().replace(/Symbol\((.*)\)/, '$1');
 
     if (!symbolDescription) {
-      return '{Symbol()}';
+      return "{Symbol()}";
     }
 
-    return '{Symbol(\'' + symbolDescription + '\')}';
+    return "{Symbol('".concat(symbolDescription, "')}");
   }
 
   if (typeof propValue === 'function') {
-    return '{' + formatFunction(propValue, options) + '}';
+    return "{".concat(formatFunction(propValue, options), "}");
   }
 
   if (isValidElement(propValue)) {
-    return '{' + formatTreeNode(parseReactElement(propValue, options), true, lvl, options) + '}';
+    return "{".concat(formatTreeNode(parseReactElement(propValue, options), true, lvl, options), "}");
   }
 
   if (propValue instanceof Date) {
-    return '{new Date("' + propValue.toISOString() + '")}';
+    return "{new Date(\"".concat(propValue.toISOString(), "\")}");
   }
 
   if (isPlainObject(propValue) || Array.isArray(propValue)) {
-    return '{' + formatComplexDataStructure(propValue, inline, lvl, options) + '}';
+    return "{".concat(formatComplexDataStructure(propValue, inline, lvl, options), "}");
   }
 
-  return '{' + String(propValue) + '}';
+  return "{".concat(String(propValue), "}");
 };
@@ -488,15 +507,11 @@
   if (!hasValue && !hasDefaultValue) {
-    throw new Error('The prop "' + name + '" has no value and no default: could not be formatted');
+    throw new Error("The prop \"".concat(name, "\" has no value and no default: could not be formatted"));
   }
 
   var usedValue = hasValue ? value : defaultValue;
-
   var useBooleanShorthandSyntax = options.useBooleanShorthandSyntax,
       tabStop = options.tabStop;
-
-
   var formattedPropValue = formatPropValue(usedValue, inline, lvl, options);
-
   var attributeFormattedInline = ' ';
-  var attributeFormattedMultiline = '\n' + spacer(lvl + 1, tabStop);
+  var attributeFormattedMultiline = "\n".concat(spacer(lvl + 1, tabStop));
   var isMultilineAttribute = formattedPropValue.includes('\n');
@@ -509,7 +524,7 @@
   } else if (useBooleanShorthandSyntax && formattedPropValue === '{true}') {
-    attributeFormattedInline += '' + name;
-    attributeFormattedMultiline += '' + name;
+    attributeFormattedInline += "".concat(name);
+    attributeFormattedMultiline += "".concat(name);
   } else {
-    attributeFormattedInline += name + '=' + formattedPropValue;
-    attributeFormattedMultiline += name + '=' + formattedPropValue;
+    attributeFormattedInline += "".concat(name, "=").concat(formattedPropValue);
+    attributeFormattedMultiline += "".concat(name, "=").concat(formattedPropValue);
   }
@@ -541,4 +556,2 @@
 
-function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
-
 var isKeyOrRefProps = function isKeyOrRefProps(propName) {
@@ -552,10 +565,8 @@ return ['key', 'ref'].includes(propName);
     var haveRefProp = props.includes('ref');
-
     var userPropsOnly = props.filter(function (oneProp) {
       return !isKeyOrRefProps(oneProp);
     });
+    var sortedProps = shouldSortUserProps ? _toConsumableArray(userPropsOnly.sort()) // We use basic lexical order
+    : _toConsumableArray(userPropsOnly);
 
-    var sortedProps = shouldSortUserProps ? [].concat(_toConsumableArray(userPropsOnly.sort())) // We use basic lexical order
-    : [].concat(_toConsumableArray(userPropsOnly));
-
     if (haveRefProp) {
@@ -576,3 +587,2 @@ sortedProps.unshift('ref');
 
-
   if (element.type === 'string') {
@@ -584,3 +594,3 @@ return formattedElement.split('\n').map(function (line, offset) {
 
-      return '' + spacer(lvl, tabStop) + line;
+      return "".concat(spacer(lvl, tabStop)).concat(line);
     }).join('\n');
@@ -620,12 +630,11 @@ }
       _node$displayName = node.displayName,
-      displayName = _node$displayName === undefined ? '' : _node$displayName,
+      displayName = _node$displayName === void 0 ? '' : _node$displayName,
       childrens = node.childrens,
       _node$props = node.props,
-      props = _node$props === undefined ? {} : _node$props,
+      props = _node$props === void 0 ? {} : _node$props,
       _node$defaultProps = node.defaultProps,
-      defaultProps = _node$defaultProps === undefined ? {} : _node$defaultProps;
+      defaultProps = _node$defaultProps === void 0 ? {} : _node$defaultProps;
 
-
   if (type !== 'ReactElement') {
-    throw new Error('The "formatReactElementNode" function could only format node of type "ReactElement". Given:  ' + type);
+    throw new Error("The \"formatReactElementNode\" function could only format node of type \"ReactElement\". Given:  ".concat(type));
   }
@@ -638,12 +647,7 @@
       tabStop = options.tabStop;
-
-
-  var out = '<' + displayName;
-
+  var out = "<".concat(displayName);
   var outInlineAttr = out;
   var outMultilineAttr = out;
   var containsMultilineAttr = false;
-
   var visibleAttributeNames = [];
-
   Object.keys(props).filter(function (propName) {
@@ -654,3 +658,2 @@ return filterProps.indexOf(propName) === -1;
   });
-
   Object.keys(defaultProps).filter(function (defaultPropName) {
@@ -665,5 +668,3 @@ return filterProps.indexOf(defaultPropName) === -1;
   });
-
   var attributes = sortPropsByNames(sortProps)(visibleAttributeNames);
-
   attributes.forEach(function (attributeName) {
@@ -682,5 +683,4 @@ var _formatProp = formatProp(attributeName, Object.keys(props).includes(attributeName), props[attributeName], Object.keys(defaultProps).includes(attributeName), defaultProps[attributeName], inline, lvl, options),
   });
+  outMultilineAttr += "\n".concat(spacer(lvl, tabStop));
 
-  outMultilineAttr += '\n' + spacer(lvl, tabStop);
-
   if (shouldRenderMultilineAttr(attributes, outInlineAttr, containsMultilineAttr, inline, lvl, tabStop, maxInlineAttributesLineLength)) {
@@ -694,3 +694,2 @@ out = outMultilineAttr;
     var newLvl = lvl + 1;
-
     out += '>';
@@ -703,3 +702,3 @@
 
-    out += childrens.reduce(mergeSiblingPlainStringChildrenReducer, []).map(formatOneChildren(inline, newLvl, options)).join(!inline ? '\n' + spacer(newLvl, tabStop) : '');
+    out += childrens.reduce(mergeSiblingPlainStringChildrenReducer, []).map(formatOneChildren(inline, newLvl, options)).join(!inline ? "\n".concat(spacer(newLvl, tabStop)) : '');
 
@@ -710,3 +709,4 @@ if (!inline) {
     }
-    out += '</' + displayName + '>';
+
+    out += "</".concat(displayName, ">");
   } else {
@@ -728,4 +728,7 @@ if (!isInlineAttributeTooLong(attributes, outInlineAttr, lvl, tabStop, maxInlineAttributesLineLength)) {
   var props = {};
+
   if (key) {
-    props = { key: key };
+    props = {
+      key: key
+    };
   }
@@ -746,2 +749,3 @@
 };
+
 var hasNoChildren = function hasNoChildren(_ref2) {
@@ -757,11 +761,9 @@ var childrens = _ref2.childrens;
 
-
   if (type !== 'ReactFragment') {
-    throw new Error('The "formatReactFragmentNode" function could only format node of type "ReactFragment". Given: ' + type);
+    throw new Error("The \"formatReactFragmentNode\" function could only format node of type \"ReactFragment\". Given: ".concat(type));
   }
 
   var useFragmentShortSyntax = options.useFragmentShortSyntax;
+  var displayName;
 
-
-  var displayName = void 0;
   if (useFragmentShortSyntax) {
@@ -781,2 +783,3 @@ if (hasNoChildren(node) || isKeyedFragment(node)) {
 var jsxStopChars = ['<', '>', '{', '}'];
+
 var shouldBeEscaped = function shouldBeEscaped(s) {
@@ -793,3 +796,3 @@ return jsxStopChars.some(function (jsxStopChar) {
 
-  return '{`' + s + '`}';
+  return "{`".concat(s, "`}");
 };
@@ -799,2 +802,3 @@
   var result = s;
+
   if (result.endsWith(' ')) {
@@ -817,3 +821,3 @@ result = result.replace(/^(\S*)(\s*)$/, "$1{'$2'}");
   if (node.type === 'string') {
-    return node.value ? '' + preserveTrailingSpace(escape$1(String(node.value))) : '';
+    return node.value ? "".concat(preserveTrailingSpace(escape$1(String(node.value)))) : '';
   }
@@ -829,3 +833,3 @@
 
-  throw new TypeError('Unknow format type "' + node.type + '"');
+  throw new TypeError("Unknow format type \"".concat(node.type, "\""));
 });
@@ -840,16 +844,16 @@
       _ref$filterProps = _ref.filterProps,
-      filterProps = _ref$filterProps === undefined ? [] : _ref$filterProps,
+      filterProps = _ref$filterProps === void 0 ? [] : _ref$filterProps,
       _ref$showDefaultProps = _ref.showDefaultProps,
-      showDefaultProps = _ref$showDefaultProps === undefined ? true : _ref$showDefaultProps,
+      showDefaultProps = _ref$showDefaultProps === void 0 ? true : _ref$showDefaultProps,
       _ref$showFunctions = _ref.showFunctions,
-      showFunctions = _ref$showFunctions === undefined ? false : _ref$showFunctions,
+      showFunctions = _ref$showFunctions === void 0 ? false : _ref$showFunctions,
       functionValue = _ref.functionValue,
       _ref$tabStop = _ref.tabStop,
-      tabStop = _ref$tabStop === undefined ? 2 : _ref$tabStop,
+      tabStop = _ref$tabStop === void 0 ? 2 : _ref$tabStop,
       _ref$useBooleanShorth = _ref.useBooleanShorthandSyntax,
-      useBooleanShorthandSyntax = _ref$useBooleanShorth === undefined ? true : _ref$useBooleanShorth,
+      useBooleanShorthandSyntax = _ref$useBooleanShorth === void 0 ? true : _ref$useBooleanShorth,
       _ref$useFragmentShort = _ref.useFragmentShortSyntax,
-      useFragmentShortSyntax = _ref$useFragmentShort === undefined ? true : _ref$useFragmentShort,
+      useFragmentShortSyntax = _ref$useFragmentShort === void 0 ? true : _ref$useFragmentShort,
       _ref$sortProps = _ref.sortProps,
-      sortProps = _ref$sortProps === undefined ? true : _ref$sortProps,
+      sortProps = _ref$sortProps === void 0 ? true : _ref$sortProps,
       maxInlineAttributesLineLength = _ref.maxInlineAttributesLineLength,
@@ -874,3 +878,2 @@ displayName = _ref.displayName;
   };
-
   return formatTree(parseReactElement(element, options), options);
@@ -877,0 +880,0 @@ };

package.json

 {
   "name": "react-element-to-jsx-string",
-  "version": "14.1.0",
+  "version": "14.2.0",
   "description": "Turn a ReactElement into the corresponding JSX string.",
@@ -8,2 +8,3 @@ "main": "dist/cjs/index.js",
   "browser": "dist/cjs/index.js",
+  "types": "index.d.ts",
   "scripts": {
@@ -39,42 +40,42 @@ "build": "rollup -c",
   "devDependencies": {
-    "@commitlint/cli": "7.6.1",
-    "@commitlint/config-angular": "7.6.0",
-    "babel-cli": "6.26.0",
+    "@babel/cli": "7.6.4",
+    "@babel/core": "7.6.4",
+    "@babel/preset-env": "7.6.3",
+    "@babel/preset-flow": "7.0.0",
+    "@babel/preset-react": "7.6.3",
+    "@commitlint/cli": "8.2.0",
+    "@commitlint/config-angular": "8.2.0",
     "babel-eslint": "10.0.3",
-    "babel-jest": "23.6.0",
-    "babel-preset-es2015": "6.24.1",
-    "babel-preset-flow": "6.23.0",
-    "babel-preset-react": "6.24.1",
-    "babel-preset-stage-2": "6.24.1",
+    "babel-jest": "24.9.0",
     "babel-register": "6.26.0",
-    "conventional-changelog-cli": "2.0.23",
+    "conventional-changelog-cli": "2.0.31",
     "doctoc": "1.4.0",
-    "enzyme": "3.10.0",
-    "enzyme-adapter-react-16": "1.14.0",
-    "eslint": "5.16.0",
-    "eslint-config-algolia": "13.4.0",
-    "eslint-config-prettier": "3.6.0",
-    "eslint-plugin-import": "2.18.2",
-    "eslint-plugin-jest": "22.17.0",
-    "eslint-plugin-prettier": "3.1.0",
-    "eslint-plugin-react": "7.14.3",
+    "enzyme": "3.11.0",
+    "enzyme-adapter-react-16": "1.15.2",
+    "eslint": "6.8.0",
+    "eslint-config-algolia": "14.0.1",
+    "eslint-config-prettier": "6.9.0",
+    "eslint-plugin-import": "2.19.1",
+    "eslint-plugin-jest": "22.21.0",
+    "eslint-plugin-prettier": "3.1.2",
+    "eslint-plugin-react": "7.17.0",
     "esm": "3.2.25",
-    "expect": "23.6.0",
-    "flow-bin": "0.107.0",
-    "flow-copy-source": "2.0.8",
-    "husky": "2.7.0",
-    "jest": "23.6.0",
+    "expect": "24.9.0",
+    "flow-bin": "0.114.0",
+    "flow-copy-source": "2.0.9",
+    "husky": "3.1.0",
+    "jest": "24.9.0",
     "json": "9.0.6",
-    "lint-staged": "8.2.1",
+    "lint-staged": "9.5.0",
     "mversion": "1.13.0",
-    "prettier": "1.18.2",
-    "react": "16.9.0",
-    "react-dom": "16.9.0",
-    "react-test-renderer": "16.9.0",
-    "rollup": "0.68.2",
-    "rollup-plugin-babel": "3.0.7",
-    "rollup-plugin-commonjs": "9.3.4",
+    "prettier": "1.19.1",
+    "react": "16.12.0",
+    "react-dom": "16.12.0",
+    "react-test-renderer": "16.12.0",
+    "rollup": "1.27.14",
+    "rollup-plugin-babel": "4.3.3",
+    "rollup-plugin-commonjs": "10.1.0",
     "rollup-plugin-node-builtins": "2.1.2",
     "rollup-plugin-node-globals": "1.4.0",
-    "rollup-plugin-node-resolve": "3.4.0",
+    "rollup-plugin-node-resolve": "5.2.0",
     "rollup-plugin-sourcemaps": "0.4.2"
@@ -87,8 +88,10 @@ },
   "dependencies": {
-    "@base2/pretty-print-object": "^1.0.0",
+    "@base2/pretty-print-object": "1.0.0",
     "is-plain-object": "3.0.0"
   },
   "jest": {
-    "setupTestFrameworkScriptFile": "<rootDir>tests/setupTests.js"
+    "setupFilesAfterEnv": [
+      "<rootDir>tests/setupTests.js"
+    ]
   }
 }

rollup.config.js

@@ -31,18 +31,9 @@ import babel from 'rollup-plugin-babel';
       presets: [
-        [
-          'es2015',
-          {
-            modules: false,
-          },
-        ],
-        'stage-2',
-        'react',
-        'flow',
+        '@babel/preset-env',
+        '@babel/preset-react',
+        '@babel/preset-flow',
       ],
     }),
     resolve({
-      module: true,
-      jsnext: true,
-      main: true,
-      browser: true,
+      mainFields: ['module', 'main', 'jsnext', 'browser'],
     }),
@@ -49,0 +40,0 @@ commonjs({

Fixed alerts

Shell access

Supply chain risk

This module accesses the system shell. Accessing the system shell increases the risk of executing arbitrary code.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

574093

128.91%

Number of low supply chain risk alerts

1

-66.67%

Number of medium supply chain risk alerts

0

-100%

Worsened metrics

Number of package files

34

-32%

Lines of code

1530

-3.77%

Dependency changes

• + Added

  @base2/pretty-print-object@1.0.0
  (transitive)

• - Removed

  @base2/pretty-print-object@1.0.2
  (transitive)

• Updated

  @base2/pretty-print-object@1.0.0