Non-global entity map

.eslintrc.js

@@ -8,13 +8,9 @@
 module.exports = {
   extends: [
     'prettier',
-    'prettier/react',
-    'prettier/standard',
     'plugin:@typescript-eslint/recommended',
-    'prettier/@typescript-eslint',
   ],
   rules: {
-    'prettier/prettier': ['error'],
     '@typescript-eslint/no-explicit-any': 0,
     '@typescript-eslint/no-inferrable-types': 0,
     '@typescript-eslint/no-use-before-define': 0,
@@ -28,12 +24,10 @@ module.exports = {
       },
     ],
   },
-  plugins: ['prettier'],
   overrides: [
     {
       files: ['examples/draft-0-10-0/**', 'examples/draft-0-9-1/**'],
       rules: {
-        'prettier/prettier': 0,
         'jsx-a11y/no-static-element-interactions': 0,
         'no-console': 0,
       },

.github/workflows/pr.yml

@@ -8,7 +8,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [12.x]
+        node-version: [16.x, 18.x, 20.x]
 
     steps:
       - uses: actions/checkout@v1

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@descript/draft-js",
   "description": "A React framework for building text editors.",
-  "version": "0.11.6-descript.15",
+  "version": "0.11.6-descript.16",
   "keywords": [
     "draftjs",
     "editor",
@@ -47,24 +47,23 @@
     "@babel/core": "^7.6.4",
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.4.4",
     "@babel/plugin-proposal-optional-chaining": "^7.9.0",
-    "@types/jest": "^26.0.0",
+    "@types/jest": "^29.5.4",
     "@types/react": "^16.9.36",
     "@types/react-dom": "^16.9.8",
-    "@typescript-eslint/eslint-plugin": "^3.2.0",
-    "@typescript-eslint/parser": "^3.2.0",
+    "@typescript-eslint/eslint-plugin": "^6.6.0",
+    "@typescript-eslint/parser": "^6.6.0",
     "alex": "^8.0.0",
-    "babel-eslint": "^10.0.3",
+    "babel-eslint": "^10.1.0",
     "babel-preset-fbjs": "^3.3.0",
     "cross-env": "^7.0.2",
     "del": "^5.1.0",
     "es6-shim": "^0.35.5",
-    "eslint": "^7.0.0",
-    "eslint-config-fbjs": "^3.1.1",
-    "eslint-config-prettier": "^6.9.0",
-    "eslint-plugin-babel": "^5.3.0",
-    "eslint-plugin-jsx-a11y": "^6.2.3",
-    "eslint-plugin-prettier": "^3.1.2",
-    "eslint-plugin-react": "^7.17.0",
+    "eslint": "^8.49.0",
+    "eslint-config-fbjs": "^4.0.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-babel": "^5.3.1",
+    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-react": "^7.33.2",
     "fbjs-scripts": "^1.2.0",
     "gulp": "^4.0.2",
     "gulp-babel": "^8.0.0",
@@ -77,22 +76,24 @@
     "gulp-rename": "^2.0.0",
     "gulp-typescript": "^6.0.0-alpha.1",
     "gulp-util": "^3.0.6",
-    "jest": "^26.0.1",
+    "jest": "^29.6.4",
+    "jest-environment-jsdom": "^29.6.4",
     "merge2": "^1.4.1",
     "prettier": "1.19.1",
     "react": "^16.8.0",
     "react-dom": "^16.8.0",
     "react-test-renderer": "^16.0.0",
-    "stats-webpack-plugin": "^0.6.2",
+    "stats-webpack-plugin": "^0.7.0",
     "terser-webpack-plugin": "^3.0.5",
     "through2": "^3.0.1",
-    "ts-jest": "^26.1.0",
-    "typescript": "^3.9.5",
-    "webpack-stream": "5.2.1"
+    "ts-jest": "^29.1.1",
+    "typescript": "^5.2.2",
+    "webpack": "^5.88.2",
+    "webpack-stream": "^7.0.0"
   },
   "devEngines": {
-    "node": "10.x || 12.x || 13.x",
-    "npm": "2.x || 3.x || 5.x || 6.x"
+    "node": "14.x || 16.x || 18.x || 20.x",
+    "npm": "2.x || 3.x || 5.x || 6.x || 7.x || 8.x || 9.x"
   },
   "jest": {
     "preset": "ts-jest",

src/Draft.ts

@@ -11,7 +11,6 @@ import Editor from './component/base/DraftEditor.react';
 export {Editor};
 import DraftEditorBlock from './component/contents/DraftEditorBlock.react';
 import CompositeDraftDecorator from './model/decorators/CompositeDraftDecorator';
-import DraftEntity from './model/entity/DraftEntity';
 import AtomicBlockUtils from './model/modifier/AtomicBlockUtils';
 export {AtomicBlockUtils};
 import KeyBindingUtil from './component/utils/KeyBindingUtil';
@@ -40,7 +39,6 @@ export {DraftHandleValue} from './model/constants/DraftHandleValue';
 
 export const EditorBlock = DraftEditorBlock;
 export const CompositeDecorator = CompositeDraftDecorator;
-export const Entity = DraftEntity;
 
 export * from './model/immutable/BlockMapBuilder';
 export * from './model/immutable/EditorState';
@@ -53,4 +51,5 @@ export * from './model/immutable/DraftInlineStyle';
 export * from './model/immutable/findRangesImmutable';
 export * from './model/immutable/BlockNode';
 export * from './model/immutable/BlockTree';
+export * from './model/immutable/EntityMap';
 export * from './model/entity/DraftEntityInstance';

src/component/contents/__tests__/__snapshots__/DraftEditorBlock.react-test.tsx.snap

@@ -24,7 +24,7 @@ exports[`must allow update when forcing selection 1`] = `1`;
 
 exports[`must allow update when forcing selection 2`] = `2`;
 
-exports[`must not scroll the window if unnecessary 1`] = `Array []`;
+exports[`must not scroll the window if unnecessary 1`] = `[]`;
 
 exports[`must reject update if conditions are not met 1`] = `1`;
 
@@ -65,8 +65,8 @@ exports[`must render multiple leaf nodes 9`] = `true`;
 exports[`must render multiple leaf nodes 10`] = `true`;
 
 exports[`must scroll the window if needed 1`] = `
-Array [
-  Array [
+[
+  [
     0,
     26,
   ],

src/component/handlers/drag/DraftEditorDragHandler.ts

@@ -36,20 +36,18 @@ function getSelectionForEvent(
   let offset: number | null = null;
 
   const eventTargetDocument = getCorrectDocumentFromNode(event.currentTarget);
-  /* $FlowFixMe(>=0.68.0 site=www,mobile) This comment suppresses an error
-   * found when Flow v0.68 was deployed. To see the error delete this comment
-   * and run Flow. */
   if (typeof eventTargetDocument.caretRangeFromPoint === 'function') {
-    /* $FlowFixMe(>=0.68.0 site=www,mobile) This comment suppresses an error
-     * found when Flow v0.68 was deployed. To see the error delete this comment
-     * and run Flow. */
     const dropRange = eventTargetDocument.caretRangeFromPoint(event.x, event.y);
-    node = dropRange.startContainer;
-    offset = dropRange.startOffset;
-  } else if (event.rangeParent) {
+    if (dropRange) {
+      node = dropRange.startContainer;
+      offset = dropRange.startOffset;
+    }
+  }
+  if (!node && event.rangeParent) {
     node = event.rangeParent;
     offset = event.rangeOffset;
-  } else {
+  }
+  if (!node) {
     return null;
   }
 

src/component/handlers/edit/DraftEditorEditHandler.ts

@@ -30,7 +30,7 @@ const isFirefox = UserAgent.isBrowser('Firefox');
 const selectionHandler: (e: DraftEditor) => void =
   isChromium || isFirefox
     ? editOnSelect
-    : _ => {
+    : () => {
         //
       };
 

src/component/handlers/edit/__tests__/__snapshots__/editOnBeforeInput-test.ts.snap

@@ -1,55 +1,56 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`editor is updated with new text if it does not match current selection 1`] = `
-Object {
+{
   "blockMap": Map {
-    "a" => Object {
-      "characterList": Array [
-        Object {
+    "a" => {
+      "characterList": [
+        {
           "entity": null,
           "style": Set {},
         },
-        Object {
+        {
           "entity": null,
           "style": Set {},
         },
-        Object {
+        {
           "entity": null,
           "style": Set {},
         },
-        Object {
+        {
           "entity": null,
           "style": Set {},
         },
-        Object {
+        {
           "entity": null,
           "style": Set {},
         },
-        Object {
+        {
           "entity": null,
           "style": Set {},
         },
-        Object {
+        {
           "entity": null,
           "style": Set {},
         },
       ],
-      "data": Object {},
+      "data": {},
       "depth": 0,
       "key": "a",
       "text": "Orsenal",
       "type": "unstyled",
     },
   },
-  "selectionAfter": Object {
+  "entityMap": Map {},
+  "selectionAfter": {
     "anchorKey": "a",
     "anchorOffset": 1,
     "focusKey": "a",
     "focusOffset": 1,
     "hasFocus": false,
     "isBackward": false,
   },
-  "selectionBefore": Object {
+  "selectionBefore": {
     "anchorKey": "a",
     "anchorOffset": 0,
     "focusKey": "a",
@@ -61,7 +62,7 @@ Object {
 `;
 
 exports[`editor selectionstate is updated if new text matches current selection 1`] = `
-Object {
+{
   "anchorKey": "a",
   "anchorOffset": 1,
   "focusKey": "a",
@@ -72,7 +73,7 @@ Object {
 `;
 
 exports[`editor selectionstate is updated if new text matches current selection and user selected backwards 1`] = `
-Object {
+{
   "anchorKey": "a",
   "anchorOffset": 1,
   "focusKey": "a",

src/component/handlers/edit/__tests__/editOnBeforeInput-test.ts

@@ -15,7 +15,6 @@ import {
   setEditorState,
 } from '../../../../model/immutable/EditorState';
 import {
-  ContentState,
   createFromBlockArray,
 } from '../../../../model/immutable/ContentState';
 import {
@@ -156,7 +155,6 @@ const HASHTAG_REGEX = /#[a-z]+/g;
 function hashtagStrategy(
   contentBlock: ContentBlock,
   callback,
-  _contentState: ContentState,
 ) {
   findWithRegex(HASHTAG_REGEX, contentBlock, callback);
 }
@@ -202,13 +200,13 @@ function testDecoratorFingerprint(
   const ev = getInputEvent(charToInsert);
   editOnBeforeInput(editor, ev);
 
-  expect(ev.preventDefault.mock.calls.length).toBe(shouldPrevent ? 1 : 0);
+  expect((ev.preventDefault as ReturnType<typeof jest.fn>).mock.calls.length).toBe(shouldPrevent ? 1 : 0);
 }
 
 test('decorator fingerprint logic bails out of native insertion', () => {
   const oldGetSelection = global.getSelection;
   try {
-    global.getSelection = () => ({});
+    global.getSelection = () => ({} as Selection);
 
     // Make sure we prevent native insertion in the right cases
     testDecoratorFingerprint('hi #', 4, 'f', true);

src/component/handlers/edit/editOnInput.ts

@@ -21,7 +21,7 @@ import {SelectionObject} from '../../utils/DraftDOMTypes';
 import {nullthrows} from '../../../fbjs/nullthrows';
 import findAncestorOffsetKey from '../../selection/findAncestorOffsetKey';
 import DraftOffsetKey from '../../selection/DraftOffsetKey';
-import {getBlockForKey, getEntity} from '../../../model/immutable/ContentState';
+import {getBlockForKey} from '../../../model/immutable/ContentState';
 import {notEmptyKey} from '../../utils/draftKeyUtils';
 import {
   getEntityAt,
@@ -32,6 +32,7 @@ import {
   getEndOffset,
   getStartOffset,
 } from '../../../model/immutable/SelectionState';
+import {getEntity} from '../../../model/immutable/EntityMap';
 
 const isGecko = UserAgent.isEngine('Gecko');
 
@@ -170,7 +171,9 @@ export default function editOnInput(
   };
 
   const entityKey = getEntityAt(block, start);
-  const entity = notEmptyKey(entityKey) ? getEntity(entityKey) : null;
+  const entity = notEmptyKey(entityKey)
+    ? getEntity(content.entityMap, entityKey)
+    : null;
   const entityType = entity != null ? entity.mutability : null;
   const preserveEntity = entityType === 'MUTABLE';
 

src/component/handlers/edit/editOnPaste.ts

@@ -204,17 +204,23 @@ export default function editOnPaste(
 function insertFragment(
   editorState: EditorState,
   fragment: BlockMap,
-  _?: EntityMap | null,
+  entityMap?: EntityMap | null,
 ): EditorState {
-  const newContent = DraftModifier.replaceWithFragment(
+  let newContent = DraftModifier.replaceWithFragment(
     editorState.currentContent,
     editorState.selection,
     fragment,
   );
-  // TODO: merge the entity map once we stop using DraftEntity
-  // like this:
-  // const mergedEntityMap = newContent.getEntityMap().merge(entityMap);
-
+  const mergedEntityMap = new Map(newContent.entityMap)
+  if (entityMap) {
+    entityMap.forEach((entity, key) => {
+      mergedEntityMap.set(key, entity)
+    })
+  }
+  newContent = {
+    ...newContent,
+    entityMap: mergedEntityMap,
+  }
   return pushContent(editorState, newContent, 'insert-fragment');
 }