draft-js - npm Package Compare versions

Comparing version 0.11.5 to 0.11.6

CHANGELOG.md

@@ -7,8 +7,55 @@ # Changelog
 
+## 0.11.6 (June 4th, 2020)
+
+### Added
+* Adds BLM banner (#2454) (claudiopro in 2a0c5bbe)
+* HtmlConversion: Add support for telephone links (#2365) (Andrew Lauria in e1e9a0c5)
+* 7.C - Block Operations - Consume (Shalabh Vyas in 99c6b06c)
+* Add fromJS() API to Draft model objects (Shalabh Vyas in 3ee5a23e)
+
+### Changed
+* Add Null return value type in code example (#2429) (Jacob D. Castro in 45bb6b52)
+* Add /meta/bundle-size-stats to .gitignore (#2436) (Kevin Chavez in e3a689df)
+* Update eslint, cross-env and gulp-derequire. Fix version numbers for … (#2437) (Kevin Chavez in 79a25b5c)
+* Update Overview.md (#2434) (Mohamed ABDELLANI in e5e293f1)
+* Upgrade jest and flow-bin deps (#2435) (Kevin Chavez in 9ac399cc)
+* Update cadence for dependabot updates (#2402) (Kevin Chavez in 6619077c)
+* Bump alex from 8.0.0 to 8.1.1 (#2407) (dependabot-preview[bot] in 7e604b06)
+* Bump fstream from 1.0.11 to 1.0.12 in /examples/draft-0-10-0/tex (#2396) (dependabot[bot] in 1f5d40ec)
+* Bump acorn from 6.0.5 to 6.4.1 in /examples/draft-0-10-0/tex (#2376) (dependabot[bot] in 9028881c)
+* chore(flow): Updates flow-bin to 0.123 (#2393) (Claudio Procida in 497a4787)
+* Short-circuit getUpdatedSelectionState for invalid selection updates on prod (Kevin Chavez in 0585b68f)
+* Type selection object in setDraftEditorSelection.js (Kevin Chavez in 31dec710)
+* Type selection object in keyCommandBackspaceToStartOfLine.js (Kevin Chavez in aa5c4a19)
+* Flow v0.123.0 in www (Panagiotis Vekris in af675755)
+* Type selection object in getDraftEditorSelection.js (Kevin Chavez in dfacb1b4)
+* Type selection object in editOnBlur.js (Kevin Chavez in 22997144)
+* Type selection object in editOnInput. (Kevin Chavez in 41beae1b)
+* upgrade to flow 0.122.0 (Marshall Roch in 97dd19b2)
+* DraftEntity ID Changes (Shalabh Vyas in 13989e31)
+* use pasted block type if pasting to empty unstyled block (Frank Thompson in 7d3d3c8f)
+* Update deps for and cleanup playground example (#2368) (Kevin Chavez in 2658dd60)
+* Only extend selection if it has ranges in setDraftEditorSelection.js (Kevin Chavez in d53fa7ab)
+* Update draft.js on website to v0.11.5 (#2370) (Kevin Chavez in 538d864e)
+* Make a few types exact (Kevin Chavez in 0950285d)
+* Remaining non-generated non-reason-parsed files (Jordan Brown in 153482ff)
+
+### Fixed
+* Fix draft-js pasted inline styles (Giulio Jiang in 92176ab2)
+* docs: in react hooks example, limit createEmpty calls (#2432) (Benjamin Atkin in 05e838e6)
+* Revisit comment for todo of T65805998, validate there's nothing to worry about (Kevin Chavez in 268ece35)
+* html/shared/draft-js/model/transaction (generatedunixname89002005287564 in c75f1e4c)
+* types-first in html/js/mobile (Panagiotis Vekris in e66f39ef)
+* Address #2413 by making Firefox follow the same behaviour as Chrome (#2414) (Kevin Chavez in 6d619c61)
+* Prevent placeholder from unnecessarily wrapping (#2392) (Frank Yan in 9d6bbfdc)
+* docs: Fix simple typo, sibbling -> sibling (#2384) (Tim Gates in d1cb1e77)
+* Fix build by adding missing modules (Kevin Chavez in fbe3417e)
+* Fix flow by allowing optional chaining (#2369) (Kevin Chavez in 85764327)
+
 ## 0.11.5 (Mar 26, 2020)
 
-## Removed
+### Removed
 * Remove examples for draft.js 0.9.0 (#2358) (Kevin Chavez in fd16d8e2)
 
-## Changed
+### Changed
 * Update deps in 'universal' example (#2362) (Kevin Chavez in dc8bfbb2)
@@ -39,3 +86,3 @@ * Remove unused Flow suppressions in WWW (George Zahariev in 3858858b)
 
-## Fixed
+### Fixed
 * Fix Uncaught TypeError: Cannot read property 'nodeType' of null at editOnInput (#2330) (Konstantin Tarkus in db3216d9)
@@ -42,0 +89,0 @@ * Fix keyBindingFn documentation URL (Ryan Silva in 3251017d)

lib/BlockTree.js

@@ -13,4 +13,12 @@ /**
 
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var findRangesImmutable = require("./findRangesImmutable");
 
+var getOwnObjectValues = require("./getOwnObjectValues");
+
 var Immutable = require("immutable");
@@ -69,2 +77,12 @@
     return List(leafSets);
+  },
+  fromJS: function fromJS(_ref) {
+    var leaves = _ref.leaves,
+        other = _objectWithoutPropertiesLoose(_ref, ["leaves"]);
+
+    return new DecoratorRange(_objectSpread({}, other, {
+      leaves: leaves != null ? List(Array.isArray(leaves) ? leaves : getOwnObjectValues(leaves)).map(function (leaf) {
+        return LeafRange(leaf);
+      }) : null
+    }));
   }
@@ -71,0 +89,0 @@ };

lib/CharacterMetadata.js

@@ -96,2 +96,11 @@ /**
 
+  CharacterMetadata.fromJS = function fromJS(_ref) {
+    var style = _ref.style,
+        entity = _ref.entity;
+    return new CharacterMetadata({
+      style: Array.isArray(style) ? OrderedSet(style) : style,
+      entity: Array.isArray(entity) ? OrderedSet(entity) : entity
+    });
+  };
+
   return CharacterMetadata;
@@ -98,0 +107,0 @@ }(CharacterMetadataRecord);

lib/ContentState.js

@@ -13,2 +13,6 @@ /**
 
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }
@@ -30,2 +34,4 @@
 
+var getOwnObjectValues = require("./getOwnObjectValues");
+
 var gkx = require("./gkx");
@@ -39,3 +45,5 @@
     Record = Immutable.Record,
-    Repeat = Immutable.Repeat;
+    Repeat = Immutable.Repeat,
+    ImmutableMap = Immutable.Map,
+    OrderedMap = Immutable.OrderedMap;
 var defaultRecord = {
@@ -48,3 +56,8 @@ entityMap: null,
 var ContentStateRecord = Record(defaultRecord);
+/* $FlowFixMe Supressing a `signature-verification-failure` error here.
+ * TODO: T65949050 Clean up the branch for this GK
+ */
 
+var ContentBlockNodeRecord = gkx('draft_tree_data_support') ? ContentBlockNode : ContentBlock;
+
 var ContentState =
@@ -169,2 +182,10 @@ /*#__PURE__*/
 
+  _proto.getAllEntities = function getAllEntities() {
+    return DraftEntity.__getAll();
+  };
+
+  _proto.loadWithEntities = function loadWithEntities(entities) {
+    return DraftEntity.__loadWithEntities(entities);
+  };
+
   ContentState.createFromBlockArray = function createFromBlockArray( // TODO: update flow type when we completely deprecate the old entity API
@@ -189,3 +210,2 @@ blocks, entityMap) {
       block = sanitizeDraftText(block);
-      var ContentBlockNodeRecord = gkx('draft_tree_data_support') ? ContentBlockNode : ContentBlock;
       return new ContentBlockNodeRecord({
@@ -201,2 +221,20 @@ key: generateRandomKey(),
 
+  ContentState.fromJS = function fromJS(state) {
+    return new ContentState(_objectSpread({}, state, {
+      blockMap: OrderedMap(state.blockMap).map(ContentState.createContentBlockFromJS),
+      selectionBefore: new SelectionState(state.selectionBefore),
+      selectionAfter: new SelectionState(state.selectionAfter)
+    }));
+  };
+
+  ContentState.createContentBlockFromJS = function createContentBlockFromJS(block) {
+    var characterList = block.characterList;
+    return new ContentBlockNodeRecord(_objectSpread({}, block, {
+      data: ImmutableMap(block.data),
+      characterList: characterList != null ? List((Array.isArray(characterList) ? characterList : getOwnObjectValues(characterList)).map(function (c) {
+        return CharacterMetadata.fromJS(c);
+      })) : undefined
+    }));
+  };
+
   return ContentState;
@@ -203,0 +241,0 @@ }(ContentStateRecord);

lib/convertFromHTMLToContentBlocks.js

@@ -122,2 +122,14 @@ /**
 };
+
+var detectInlineStyle = function detectInlineStyle(node) {
+  if (isHTMLElement(node)) {
+    var element = node; // Currently only used to detect preformatted inline code
+
+    if (element.style.fontFamily.includes('monospace')) {
+      return 'CODE';
+    }
+  }
+
+  return null;
+};
 /**
@@ -150,3 +162,3 @@ * If we're pasting from one DraftEditor to another we can check to see if
   var anchorNode = node;
-  return !!(anchorNode.href && (anchorNode.protocol === 'http:' || anchorNode.protocol === 'https:' || anchorNode.protocol === 'mailto:'));
+  return !!(anchorNode.href && (anchorNode.protocol === 'http:' || anchorNode.protocol === 'https:' || anchorNode.protocol === 'mailto:' || anchorNode.protocol === 'tel:'));
 };
@@ -487,2 +499,8 @@ /**
       newStyle = styleFromNodeAttributes(node, newStyle);
+      var inlineStyle = detectInlineStyle(node);
+
+      if (inlineStyle != null) {
+        newStyle = newStyle.add(inlineStyle);
+      }
+
       blockConfigs.push.apply(blockConfigs, this._toBlockConfigs(Array.from(node.childNodes), newStyle));
@@ -489,0 +507,0 @@ }

lib/DraftEditor.react.js

@@ -331,3 +331,3 @@ /**
       if (onPaste) {
-        /* $FlowFixMe(>=0.117.0 site=www) This comment suppresses an error found
+        /* $FlowFixMe(>=0.117.0 site=www,mobile) This comment suppresses an error found
          * when Flow v0.117 was deployed. To see the error delete this comment
@@ -334,0 +334,0 @@ * and run Flow. */

lib/DraftEditorBlockNode.react.js

@@ -74,3 +74,3 @@ /**
 var applyWrapperElementToSiblings = function applyWrapperElementToSiblings(wrapperTemplate, Element, nodes) {
-  var wrappedSiblings = []; // we check back until we find a sibbling that does not have same wrapper
+  var wrappedSiblings = []; // we check back until we find a sibling that does not have same wrapper
 
@@ -77,0 +77,0 @@ var _iteratorNormalCompletion = true;

lib/DraftEditorEditHandler.js

@@ -40,3 +40,4 @@ /**
 var isChrome = UserAgent.isBrowser('Chrome');
-var selectionHandler = isChrome ? onSelect : function (e) {};
+var isFirefox = UserAgent.isBrowser('Firefox');
+var selectionHandler = isChrome || isFirefox ? onSelect : function (e) {};
 var DraftEditorEditHandler = {
@@ -43,0 +44,0 @@ onBeforeInput: onBeforeInput,

lib/DraftEntity.js

@@ -23,5 +23,7 @@ "use strict";
 
+var uuid = require("./uuid");
+
 var Map = Immutable.Map;
 var instances = Map();
-var instanceKey = 0;
+var instanceKey = uuid();
 /**
@@ -101,2 +103,17 @@ * Temporary utility for generating the warnings
   /**
+   * Get all the entities in the content state.
+   */
+  __getAll: function __getAll() {
+    return instances;
+  },
+
+  /**
+   * Load the entity map with the given set of entities.
+   */
+  __loadWithEntities: function __loadWithEntities(entities) {
+    instances = entities;
+    instanceKey = uuid();
+  },
+
+  /**
    * WARNING: This method will be deprecated soon!
@@ -134,3 +151,3 @@ * Please use 'contentState.mergeEntityData' instead.
   __getLastCreatedEntityKey: function __getLastCreatedEntityKey() {
-    return '' + instanceKey;
+    return instanceKey;
   },
@@ -158,5 +175,5 @@
   __add: function __add(instance) {
-    var key = '' + ++instanceKey;
-    instances = instances.set(key, instance);
-    return key;
+    instanceKey = uuid();
+    instances = instances.set(instanceKey, instance);
+    return instanceKey;
   },
@@ -163,0 +180,0 @@

lib/editOnInput.js

@@ -79,3 +79,3 @@ /**
 
-  if (isNotTextOrElementNode) {
+  if (anchorNode == null || isNotTextOrElementNode) {
     // TODO: (t16149272) figure out context for this change
@@ -91,5 +91,11 @@ return;
     var span = anchorNode.parentNode;
+
+    if (span == null) {
+      // Handle null-parent case.
+      return;
+    }
+
     anchorNode.nodeValue = span.textContent;
 
-    for (var child = span.firstChild; child !== null; child = child.nextSibling) {
+    for (var child = span.firstChild; child != null; child = child.nextSibling) {
       if (child !== anchorNode) {
@@ -96,0 +102,0 @@ span.removeChild(child);

lib/EditorState.js

@@ -29,3 +29,5 @@ /**
     Record = Immutable.Record,
-    Stack = Immutable.Stack; // When configuring an editor, the user can chose to provide or not provide
+    Stack = Immutable.Stack,
+    OrderedMap = Immutable.OrderedMap,
+    List = Immutable.List; // When configuring an editor, the user can chose to provide or not provide
 // basically all keys. `currentContent` varies, so this type doesn't include it.
@@ -85,2 +87,23 @@ // (See the types defined below.)
 
+  EditorState.fromJS = function fromJS(config) {
+    return new EditorState(new EditorStateRecord(_objectSpread({}, config, {
+      directionMap: config.directionMap != null ? OrderedMap(config.directionMap) : config.directionMap,
+      inlineStyleOverride: config.inlineStyleOverride != null ? OrderedSet(config.inlineStyleOverride) : config.inlineStyleOverride,
+      nativelyRenderedContent: config.nativelyRenderedContent != null ? ContentState.fromJS(config.nativelyRenderedContent) : config.nativelyRenderedContent,
+      redoStack: config.redoStack != null ? Stack(config.redoStack.map(function (v) {
+        return ContentState.fromJS(v);
+      })) : config.redoStack,
+      selection: config.selection != null ? new SelectionState(config.selection) : config.selection,
+      treeMap: config.treeMap != null ? OrderedMap(config.treeMap).map(function (v) {
+        return List(v).map(function (v) {
+          return BlockTree.fromJS(v);
+        });
+      }) : config.treeMap,
+      undoStack: config.undoStack != null ? Stack(config.undoStack.map(function (v) {
+        return ContentState.fromJS(v);
+      })) : config.undoStack,
+      currentContent: ContentState.fromJS(config.currentContent)
+    })));
+  };
+
   EditorState.set = function set(editorState, put) {
@@ -87,0 +110,0 @@ var map = editorState.getImmutable().withMutations(function (state) {

lib/getDraftEditorSelection.js

@@ -21,5 +21,13 @@ /**
 function getDraftEditorSelection(editorState, root) {
-  var selection = root.ownerDocument.defaultView.getSelection(); // No active selection.
+  var selection = root.ownerDocument.defaultView.getSelection();
+  var anchorNode = selection.anchorNode,
+      anchorOffset = selection.anchorOffset,
+      focusNode = selection.focusNode,
+      focusOffset = selection.focusOffset,
+      rangeCount = selection.rangeCount;
 
-  if (selection.rangeCount === 0) {
+  if ( // No active selection.
+  rangeCount === 0 || // No selection, ever. As in, the user hasn't selected anything since
+  // opening the document.
+  anchorNode == null || focusNode == null) {
     return {
@@ -31,5 +39,5 @@ selectionState: editorState.getSelection().set('hasFocus', false),
 
-  return getDraftEditorSelectionWithNodes(editorState, root, selection.anchorNode, selection.anchorOffset, selection.focusNode, selection.focusOffset);
+  return getDraftEditorSelectionWithNodes(editorState, root, anchorNode, anchorOffset, focusNode, focusOffset);
 }
 
 module.exports = getDraftEditorSelection;

lib/getSampleStateForTesting.js

@@ -31,3 +31,3 @@ /**
     ITALIC = SampleDraftInlineStyle.ITALIC;
-var ENTITY_KEY = '1';
+var ENTITY_KEY = '2';
 var BLOCKS = [new ContentBlock({
@@ -34,0 +34,0 @@ key: 'a',

lib/getUpdatedSelectionState.js

@@ -20,8 +20,10 @@ /**
 
-  if (process.env.NODE_ENV !== "production") {
-    if (!anchorKey || !focusKey) {
+  if (!anchorKey || !focusKey) {
+    // If we cannot make sense of the updated selection state, stick to the current one.
+    if (process.env.NODE_ENV !== "production") {
       /* eslint-disable-next-line */
       console.warn('Invalid selection state.', arguments, editorState.toJS());
-      return selection;
     }
+
+    return selection;
   }
@@ -28,0 +30,0 @@

lib/insertFragmentIntoContentState.js

@@ -46,5 +46,12 @@ /**
 
+  var type = targetBlock.getType();
+
+  if (text && type === 'unstyled') {
+    type = fragmentBlock.getType();
+  }
+
   var newBlock = targetBlock.merge({
     text: text.slice(0, targetOffset) + fragmentBlock.getText() + text.slice(targetOffset),
     characterList: insertIntoList(chars, fragmentBlock.getCharacterList(), targetOffset),
+    type: type,
     data: data
@@ -51,0 +58,0 @@ });

lib/keyCommandBackspaceToStartOfLine.js

@@ -32,3 +32,7 @@ /**
     var ownerDocument = e.currentTarget.ownerDocument;
-    var domSelection = ownerDocument.defaultView.getSelection();
+    var domSelection = ownerDocument.defaultView.getSelection(); // getRangeAt can technically throw if there's no selection, but we know
+    // there is one here because text editor has focus (the cursor is a
+    // selection of length 0). Therefore, we don't need to wrap this in a
+    // try-catch block.
+
     var range = domSelection.getRangeAt(0);
@@ -35,0 +39,0 @@ range = expandRangeToStartOfLine(range);

lib/NestedRichTextEditorUtil.js

@@ -131,3 +131,3 @@ "use strict";
       }
-    } // if we have a next sibbling we should not allow the normal backspace
+    } // if we have a next sibling we should not allow the normal backspace
     // behaviour of moving this text into its parent
@@ -134,0 +134,0 @@ // if (currentBlock.getPrevSiblingKey()) {

lib/setDraftEditorSelection.js

@@ -183,4 +183,6 @@ /**
   var activeElement = getActiveElement();
+  var extend = selection.extend; // containsNode returns false if node is null.
+  // Let's refine the type of this value out here so flow knows.
 
-  if (selection.extend && containsNode(activeElement, node)) {
+  if (extend && node != null && containsNode(activeElement, node)) {
     // If `extend` is called while another element has focus, an error is
@@ -207,3 +209,8 @@ // thrown. We therefore disable `extend` if the active element is somewhere
     try {
-      selection.extend(node, offset);
+      // Fixes some reports of "InvalidStateError: Failed to execute 'extend' on
+      // 'Selection': This Selection object doesn't have any Ranges."
+      // Note: selection.extend does not exist in IE.
+      if (selection.rangeCount > 0 && selection.extend) {
+        selection.extend(node, offset);
+      }
     } catch (e) {
@@ -252,3 +259,3 @@ DraftJsDebugLogging.logSelectionStateFailure({
     // after the range is detached.
-    if (selection.rangeCount > 0) {
+    if (node && selection.rangeCount > 0) {
       var range = selection.getRangeAt(0);
@@ -255,0 +262,0 @@ range.setEnd(node, offset);

package.json

 {
   "name": "draft-js",
   "description": "A React framework for building text editors.",
-  "version": "0.11.5",
+  "version": "0.11.6",
   "keywords": [
@@ -53,10 +53,10 @@ "draftjs",
     "babel-preset-fbjs": "^3.3.0",
-    "cross-env": "^6.0.3",
+    "cross-env": "^7.0.2",
     "del": "^5.1.0",
     "es6-shim": "^0.35.5",
-    "eslint": "^6.8.0",
+    "eslint": "^7.0.0",
     "eslint-config-fbjs": "^3.1.1",
     "eslint-config-prettier": "^6.9.0",
     "eslint-plugin-babel": "^5.3.0",
-    "eslint-plugin-flowtype": "^4.6.0",
+    "eslint-plugin-flowtype": "^5.1.0",
     "eslint-plugin-jsx-a11y": "^6.2.3",
@@ -66,3 +66,3 @@ "eslint-plugin-prettier": "^3.1.2",
     "fbjs-scripts": "^1.2.0",
-    "flow-bin": "^0.115.0",
+    "flow-bin": "^0.125.1",
     "gulp": "^4.0.2",
@@ -72,9 +72,9 @@ "gulp-babel": "^8.0.0",
     "gulp-concat-css": "^3.1.0",
-    "gulp-derequire": "^2.1.0",
+    "gulp-derequire": "^3.0.0",
     "gulp-flatten": "^0.4.0",
     "gulp-header": "^2.0.9",
     "gulp-if": "^3.0.0",
-    "gulp-rename": "2",
+    "gulp-rename": "^2.0.0",
     "gulp-util": "^3.0.6",
-    "jest": "^24.9.0",
+    "jest": "^26.0.1",
     "prettier": "1.19.1",
@@ -86,3 +86,3 @@ "react": "^16.8.0",
     "through2": "^3.0.1",
-    "uglifyjs-webpack-plugin": "2",
+    "uglifyjs-webpack-plugin": "^2.2.0",
     "webpack-stream": "5.2.1"
@@ -89,0 +89,0 @@ },

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1810943

increased by1.55%

Number of package files

355

increased by0.57%

Lines of code

27400

increased by1.23%

Number of medium supply chain risk alerts

6

decreased by-14.29%

No dependency changes