Fix-up diff for enabling 'ship-it' and 'import-it'

**what is the change?:**
what is the change?:
Development on Draft.js is causing Github and our internal version to
get out of sync.

This pulls various changes from our internal version into the Github
project, so that they will be basically the same.

Some of the included changes;

Reorder requires via a codemod, maintained by an ESLint rule
(D5117037)
Fix 'first character prevention' bug that is triggered by Fiber async
rendering (D5161053)
Add 'z-index' to placeholder (D4769133)
Add possible fix for issue facebookarchive#1020 (D5261172)
Add 'flowfixme' comment (D5337485)
Fix 'flowfixme' comment (D5389367)

For reference, this patch was generated by the commands listed in
D5273910.

why make this change?:
We want to keep them in sync going forward, and will be enabling scripts
to automate mirroring changes back and forth.

test plan:
yarn install && yarn build && yarn test and manually tested examples.

issue:
related to facebookarchive#1244

fbshipit-source-id:a5d95c34f709c6fabcf0ceec876d4edb93881f85

docs/APIReference-Editor.md

@@ -249,7 +249,6 @@ onUpArrow?: (e: SyntheticKeyboardEvent) => void
 ```
 onDownArrow?: (e: SyntheticKeyboardEvent) => void
 ```
-
 ### Mouse events
 
 ### onFocus

src/component/base/DraftEditor.react.js

@@ -15,8 +15,8 @@
 'use strict';
 
 import type {BlockMap} from 'BlockMap';
-import type {DraftEditorDefaultProps, DraftEditorProps} from 'DraftEditorProps';
 import type {DraftEditorModes} from 'DraftEditorModes';
+import type {DraftEditorDefaultProps, DraftEditorProps} from 'DraftEditorProps';
 import type {DraftScrollPosition} from 'DraftScrollPosition';
 
 const DefaultDraftBlockRenderMap = require('DefaultDraftBlockRenderMap');
@@ -26,7 +26,6 @@ const DraftEditorContents = require('DraftEditorContents.react');
 const DraftEditorDragHandler = require('DraftEditorDragHandler');
 const DraftEditorEditHandler = require('DraftEditorEditHandler');
 const DraftEditorPlaceholder = require('DraftEditorPlaceholder.react');
-
 const EditorState = require('EditorState');
 const React = require('React');
 const ReactDOM = require('ReactDOM');
@@ -38,7 +37,6 @@ const cx = require('cx');
 const emptyFunction = require('emptyFunction');
 const generateRandomKey = require('generateRandomKey');
 const getDefaultKeyBinding = require('getDefaultKeyBinding');
-
 const getScrollPosition = require('getScrollPosition');
 const invariant = require('invariant');
 const nullthrows = require('nullthrows');

src/component/base/DraftEditorPlaceholder.css

@@ -6,7 +6,7 @@
 .public/DraftEditorPlaceholder/root {
   color: var(fig-secondary-text);
   position: absolute;
-  z-index: 0;
+  z-index: 1;
 }
 
 .public/DraftEditorPlaceholder/hasFocus {

src/component/base/DraftEditorPlaceholder.react.js

@@ -13,13 +13,13 @@
 
 'use strict';
 
+import type {DraftTextAlignment} from 'DraftTextAlignment';
+import type EditorState from 'EditorState';
+
 const React = require('React');
 
 const cx = require('cx');
 
-import type {DraftTextAlignment} from 'DraftTextAlignment';
-import type EditorState from 'EditorState';
-
 type Props = {
   accessibilityID: string,
   editorState: EditorState,

src/component/base/DraftEditorProps.js

@@ -12,16 +12,16 @@
 
 'use strict';
 
-import type {BidiDirection} from 'UnicodeBidiDirection';
 import type ContentBlock from 'ContentBlock';
 import type {DraftBlockRenderMap} from 'DraftBlockRenderMap';
 import type {DraftDragType} from 'DraftDragType';
 import type {DraftEditorCommand} from 'DraftEditorCommand';
-import type {DraftTextAlignment} from 'DraftTextAlignment';
-import type {DraftInlineStyle} from 'DraftInlineStyle';
 import type {DraftHandleValue} from 'DraftHandleValue';
+import type {DraftInlineStyle} from 'DraftInlineStyle';
+import type {DraftTextAlignment} from 'DraftTextAlignment';
 import type EditorState from 'EditorState';
 import type SelectionState from 'SelectionState';
+import type {BidiDirection} from 'UnicodeBidiDirection';
 
 export type DraftEditorProps = {
   /**

src/component/base/__tests__/DraftEditor.react-test.js

@@ -17,10 +17,10 @@ jest
   .unmock('react-test-renderer/shallow')
   .unmock('generateRandomKey');
 
+var DraftEditor = require('DraftEditor.react');
 var React = require('React');
-var ReactShallowRenderer = require('react-test-renderer/shallow');
 
-var DraftEditor = require('DraftEditor.react');
+var ReactShallowRenderer = require('react-test-renderer/shallow');
 
 describe('DraftEditor.react', () => {
   var shallow;

src/component/contents/DraftEditorBlock.react.js

@@ -13,19 +13,18 @@
 
 'use strict';
 
-import type {BidiDirection} from 'UnicodeBidiDirection';
 import type ContentBlock from 'ContentBlock';
 import type ContentState from 'ContentState';
 import type {DraftDecoratorType} from 'DraftDecoratorType';
-import type {List} from 'immutable';
 import type SelectionState from 'SelectionState';
+import type {BidiDirection} from 'UnicodeBidiDirection';
+import type {List} from 'immutable';
 
 const DraftEditorLeaf = require('DraftEditorLeaf.react');
 const DraftOffsetKey = require('DraftOffsetKey');
 const React = require('React');
 const ReactDOM = require('ReactDOM');
 const Scroll = require('Scroll');
-
 const Style = require('Style');
 const UnicodeBidi = require('UnicodeBidi');
 const UnicodeBidiDirection = require('UnicodeBidiDirection');

src/component/contents/DraftEditorContents.react.js

@@ -13,6 +13,9 @@
 
 'use strict';
 
+import type ContentBlock from 'ContentBlock';
+import type {BidiDirection} from 'UnicodeBidiDirection';
+
 const DraftEditorBlock = require('DraftEditorBlock.react');
 const DraftOffsetKey = require('DraftOffsetKey');
 const EditorState = require('EditorState');
@@ -22,9 +25,6 @@ const cx = require('cx');
 const joinClasses = require('joinClasses');
 const nullthrows = require('nullthrows');
 
-import type {BidiDirection} from 'UnicodeBidiDirection';
-import type ContentBlock from 'ContentBlock';
-
 type Props = {
   blockRendererFn: Function,
   blockStyleFn: (block: ContentBlock) => string,

src/component/contents/__tests__/DraftEditorBlock.react-test.js

@@ -18,10 +18,10 @@ jest.disableAutomock()
   .mock('getScrollPosition')
   .mock('getViewportDimensions');
 
-var ContentState = require('ContentState');
 var BlockTree = require('BlockTree');
 var CharacterMetadata = require('CharacterMetadata');
 var ContentBlock = require('ContentBlock');
+var ContentState = require('ContentState');
 var Immutable = require('immutable');
 var React = require('React');
 var ReactDOM = require('ReactDOM');

src/component/contents/__tests__/DraftEditorTextNode-test.js

@@ -11,7 +11,8 @@
 
 'use strict';
 
-jest.disableAutomock().mock('UserAgent');
+jest.disableAutomock().mock('UserAgent')
+  .mock('UserAgent');
 
 var BLOCK_DELIMITER_CHAR = '\n';
 var TEST_A = 'Hello';

src/component/handlers/composition/DraftEditorCompositionHandler.js

@@ -12,15 +12,15 @@
 
 'use strict';
 
+import type DraftEditor from 'DraftEditor.react';
+
 const DraftModifier = require('DraftModifier');
 const EditorState = require('EditorState');
 const Keys = require('Keys');
 
 const getEntityKeyForSelection = require('getEntityKeyForSelection');
 const isSelectionAtLeafStart = require('isSelectionAtLeafStart');
 
-import type DraftEditor from 'DraftEditor.react';
-
 /**
  * Millisecond delay to allow `compositionstart` to fire again upon
  * `compositionend`.

src/component/handlers/drag/DraftEditorDragHandler.js

@@ -13,18 +13,18 @@
 
 'use strict';
 
+import type DraftEditor from 'DraftEditor.react';
+import type SelectionState from 'SelectionState';
+
 const DataTransfer = require('DataTransfer');
 const DraftModifier = require('DraftModifier');
 const EditorState = require('EditorState');
 
 const findAncestorOffsetKey = require('findAncestorOffsetKey');
 const getTextContentFromFiles = require('getTextContentFromFiles');
 const getUpdatedSelectionState = require('getUpdatedSelectionState');
-const nullthrows = require('nullthrows');
-
-import type DraftEditor from 'DraftEditor.react';
-import type SelectionState from 'SelectionState';
 const isEventHandled = require('isEventHandled');
+const nullthrows = require('nullthrows');
 
 /**
  * Get a SelectionState for the supplied mouse event.

src/component/handlers/edit/commands/SecondaryClipboard.js

@@ -12,15 +12,15 @@
 
 'use strict';
 
+import type {BlockMap} from 'BlockMap';
+import type SelectionState from 'SelectionState';
+
 var DraftModifier = require('DraftModifier');
 var EditorState = require('EditorState');
 
 var getContentStateFragment = require('getContentStateFragment');
 var nullthrows = require('nullthrows');
 
-import type {BlockMap} from 'BlockMap';
-import type SelectionState from 'SelectionState';
-
 var clipboard: ?BlockMap = null;
 
 /**

src/component/handlers/edit/commands/removeTextWithStrategy.js

@@ -12,13 +12,13 @@
 
 'use strict';
 
-var DraftModifier = require('DraftModifier');
-
 import type ContentState from 'ContentState';
 import type {DraftRemovalDirection} from 'DraftRemovalDirection';
 import type EditorState from 'EditorState';
 import type SelectionState from 'SelectionState';
 
+var DraftModifier = require('DraftModifier');
+
 /**
  * For a collapsed selection state, remove text based on the specified strategy.
  * If the selection state is not collapsed, remove the entire selected range.

src/component/handlers/edit/editOnBeforeInput.js

@@ -12,20 +12,20 @@
 
 'use strict';
 
+import type DraftEditor from 'DraftEditor.react';
+import type {DraftInlineStyle} from 'DraftInlineStyle';
+
 var BlockTree = require('BlockTree');
 var DraftModifier = require('DraftModifier');
 var EditorState = require('EditorState');
 var UserAgent = require('UserAgent');
 
 var getEntityKeyForSelection = require('getEntityKeyForSelection');
+const isEventHandled = require('isEventHandled');
 var isSelectionAtLeafStart = require('isSelectionAtLeafStart');
 var nullthrows = require('nullthrows');
 var setImmediate = require('setImmediate');
 
-import type DraftEditor from 'DraftEditor.react';
-import type {DraftInlineStyle} from 'DraftInlineStyle';
-const isEventHandled = require('isEventHandled');
-
 // When nothing is focused, Firefox regards two characters, `'` and `/`, as
 // commands that should open and focus the "quickfind" search bar. This should
 // *never* happen while a contenteditable is focused, but as of v28, it

src/component/handlers/edit/editOnBlur.js

@@ -12,13 +12,13 @@
 
 'use strict';
 
+import type DraftEditor from 'DraftEditor.react';
+
 var EditorState = require('EditorState');
 var UserAgent = require('UserAgent');
 
 var getActiveElement = require('getActiveElement');
 
-import type DraftEditor from 'DraftEditor.react';
-
 var isWebKit = UserAgent.isEngine('WebKit');
 
 function editOnBlur(editor: DraftEditor, e: SyntheticEvent): void {

src/component/handlers/edit/editOnCompositionStart.js

@@ -12,10 +12,10 @@
 
 'use strict';
 
-var EditorState = require('EditorState');
-
 import type DraftEditor from 'DraftEditor.react';
 
+var EditorState = require('EditorState');
+
 /**
  * The user has begun using an IME input system. Switching to `composite` mode
  * allows handling composition input and disables other edit behavior.

src/component/handlers/edit/editOnCopy.js

@@ -12,10 +12,10 @@
 
 'use strict';
 
-var getFragmentFromSelection = require('getFragmentFromSelection');
-
 import type DraftEditor from 'DraftEditor.react';
 
+var getFragmentFromSelection = require('getFragmentFromSelection');
+
 /**
  * If we have a selection, create a ContentState fragment and store
  * it in our internal clipboard. Subsequent paste events will use this

src/component/handlers/edit/editOnCut.js

@@ -12,15 +12,15 @@
 
 'use strict';
 
+import type DraftEditor from 'DraftEditor.react';
+
 const DraftModifier = require('DraftModifier');
 const EditorState = require('EditorState');
 const Style = require('Style');
 
 const getFragmentFromSelection = require('getFragmentFromSelection');
 const getScrollPosition = require('getScrollPosition');
 
-import type DraftEditor from 'DraftEditor.react';
-
 /**
  * On `cut` events, native behavior is allowed to occur so that the system
  * clipboard is set properly. This means that we need to take steps to recover

src/component/handlers/edit/editOnFocus.js

@@ -12,10 +12,11 @@
 
 'use strict';
 
-var EditorState = require('EditorState');
-
 import type DraftEditor from 'DraftEditor.react';
 
+var DraftFeatureFlags = require('DraftFeatureFlags');
+var EditorState = require('EditorState');
+
 function editOnFocus(editor: DraftEditor, e: SyntheticFocusEvent): void {
   var editorState = editor._latestEditorState;
   var currentSelection = editorState.getSelection();
@@ -32,7 +33,12 @@ function editOnFocus(editor: DraftEditor, e: SyntheticFocusEvent): void {
   // moves the cursor back to the beginning of the editor, so we force the
   // selection here instead of simply accepting it in order to preserve the
   // old cursor position. See https://crbug.com/540004.
-  editor.update(EditorState.forceSelection(editorState, selection));
+  // But it looks like this is fixed in Chrome 60.0.3081.0.
+  if (DraftFeatureFlags.draft_accept_selection_after_refocus) {
+    editor.update(EditorState.acceptSelection(editorState, selection));
+  } else {
+    editor.update(EditorState.forceSelection(editorState, selection));
+  }
 }
 
 module.exports = editOnFocus;

src/component/handlers/edit/editOnInput.js

@@ -12,6 +12,8 @@
 
 'use strict';
 
+import type DraftEditor from 'DraftEditor.react';
+
 const DraftFeatureFlags = require('DraftFeatureFlags');
 var DraftModifier = require('DraftModifier');
 var DraftOffsetKey = require('DraftOffsetKey');
@@ -21,8 +23,6 @@ var UserAgent = require('UserAgent');
 var findAncestorOffsetKey = require('findAncestorOffsetKey');
 var nullthrows = require('nullthrows');
 
-import type DraftEditor from 'DraftEditor.react';
-
 var isGecko = UserAgent.isEngine('Gecko');
 
 var DOUBLE_NEWLINE = '\n\n';

src/component/handlers/edit/editOnKeyDown.js

@@ -12,28 +12,28 @@
 
 'use strict';
 
+import type DraftEditor from 'DraftEditor.react';
+import type {DraftEditorCommand} from 'DraftEditorCommand';
+
 var DraftModifier = require('DraftModifier');
 var EditorState = require('EditorState');
 var KeyBindingUtil = require('KeyBindingUtil');
 var Keys = require('Keys');
 var SecondaryClipboard = require('SecondaryClipboard');
 var UserAgent = require('UserAgent');
 
+const isEventHandled = require('isEventHandled');
 var keyCommandBackspaceToStartOfLine = require('keyCommandBackspaceToStartOfLine');
 var keyCommandBackspaceWord = require('keyCommandBackspaceWord');
 var keyCommandDeleteWord = require('keyCommandDeleteWord');
 var keyCommandInsertNewline = require('keyCommandInsertNewline');
-var keyCommandPlainBackspace = require('keyCommandPlainBackspace');
-var keyCommandPlainDelete = require('keyCommandPlainDelete');
 var keyCommandMoveSelectionToEndOfBlock = require('keyCommandMoveSelectionToEndOfBlock');
 var keyCommandMoveSelectionToStartOfBlock = require('keyCommandMoveSelectionToStartOfBlock');
+var keyCommandPlainBackspace = require('keyCommandPlainBackspace');
+var keyCommandPlainDelete = require('keyCommandPlainDelete');
 var keyCommandTransposeCharacters = require('keyCommandTransposeCharacters');
 var keyCommandUndo = require('keyCommandUndo');
 
-import type DraftEditor from 'DraftEditor.react';
-import type {DraftEditorCommand} from 'DraftEditorCommand';
-const isEventHandled = require('isEventHandled');
-
 var {isOptionKeyCommand} = KeyBindingUtil;
 var isChrome = UserAgent.isBrowser('Chrome');