chore: move to typescript

src/demo/components/App.js → src/demo/components/App.tsx

@@ -1,4 +1,3 @@
-// @flow
 import React, { Component } from "react";
 import "./App.css";
 

src/demo/components/Highlight.js → src/demo/components/Highlight.tsx

@@ -1,4 +1,3 @@
-// @flow
 import React from "react";
 
 const onCopy = (value: string) => {
@@ -13,7 +12,11 @@ const onCopy = (value: string) => {
   document.body.removeChild(hidden);
 };
 
-const Highlight = ({ value }: { value: string }) => (
+const Highlight = ({
+  value
+}: {
+  value: string
+}) => (
   <pre style={{ position: "relative" }}>
     <button
       onClick={onCopy.bind(null, value)}

src/demo/components/Image.js → src/demo/components/Image.tsx

@@ -1,13 +1,12 @@
-// @flow
 import React from "react";
 import { ContentBlock, ContentState } from "draft-js";
 
 const Image = ({
   block,
-  contentState,
+  contentState
 }: {
   block: ContentBlock,
-  contentState: ContentState,
+  contentState: ContentState
 }) => {
   const entityKey = block.getEntityAt(0);
   const src = entityKey

src/demo/components/Link.js → src/demo/components/Link.tsx

@@ -1,18 +1,17 @@
-// @flow
 import React from "react";
-import type { Node } from "react";
+import { Node } from "react";
 import { ContentState } from "draft-js";
-import type { ContentBlock } from "draft-js";
+import { ContentBlock } from "draft-js";
 
 type Props = {
   contentState: ContentState,
   entityKey: string,
-  children: Node,
+  children: Node
 };
 
 export const linkStrategy = (
   contentBlock: ContentBlock,
-  callback: (start: number, end: number) => void,
+  callback: ((start: number, end: number) => void),
   contentState: ContentState,
 ) => {
   contentBlock.findEntityRanges((character) => {
@@ -24,7 +23,11 @@ export const linkStrategy = (
   }, callback);
 };
 
-const Link = ({ contentState, entityKey, children }: Props) => {
+const Link = ({
+  contentState,
+  entityKey,
+  children
+}: Props) => {
   const entity = contentState.getEntity(entityKey);
   return (
     <span className="link" title={entity.getData().url}>

src/demo/components/SentryBoundary.js → src/demo/components/SentryBoundary.tsx

@@ -1,13 +1,12 @@
-// @flow
 import React, { Component } from "react";
-import type { Node } from "react";
+import { Node } from "react";
 
 type Props = {
-  children: Node,
+  children: Node
 };
 
 type State = {
-  error: ?Error,
+  error: Error | null
 };
 
 class SentryBoundary extends Component<Props, State> {
@@ -16,7 +15,9 @@ class SentryBoundary extends Component<Props, State> {
     this.state = { error: null };
   }
 
-  componentDidCatch(error: Error, errorInfo: { componentStack: string }) {
+  componentDidCatch(error: Error, errorInfo: {
+    componentStack: string
+  }) {
     const isRavenAvailable = !!window.Raven;
     this.setState({ error });
 

src/demo/components/Snippet.js → src/demo/components/Snippet.tsx

@@ -1,15 +1,14 @@
-// @flow
 import React from "react";
 import { ContentBlock, ContentState } from "draft-js";
 
 import "./Snippet.css";
 
 const Snippet = ({
   block,
-  contentState,
+  contentState
 }: {
   block: ContentBlock,
-  contentState: ContentState,
+  contentState: ContentState
 }) => {
   const entityKey = block.getEntityAt(0);
   const text = entityKey

src/demo/utils/DraftUtils.js → src/demo/utils/DraftUtils.ts

@@ -1,4 +1,3 @@
-// @flow
 import { EditorState, Modifier, RichUtils } from "draft-js";
 
 const addLineBreak = (editorState: EditorState) => {

src/lib/api/conversion.js → src/lib/api/conversion.ts

@@ -1,7 +1,6 @@
-// @flow
 import { EditorState, convertFromRaw, convertToRaw } from "draft-js";
-import type { RawDraftContentState } from "draft-js/lib/RawDraftContentState";
-import type { DraftDecoratorType } from "draft-js/lib/DraftDecoratorType";
+import { RawDraftContentState } from "draft-js/lib/RawDraftContentState";
+import { DraftDecoratorType } from "draft-js/lib/DraftDecoratorType";
 
 const EMPTY_CONTENT_STATE = null;
 
@@ -10,8 +9,8 @@ const EMPTY_CONTENT_STATE = null;
  * passing `null`. Optionally takes a decorator.
  */
 export const createEditorStateFromRaw = (
-  rawContentState: ?RawDraftContentState,
-  decorator?: ?DraftDecoratorType,
+  rawContentState: RawDraftContentState | null,
+  decorator?: DraftDecoratorType | null,
 ) => {
   let editorState;
 

src/lib/api/copypaste.js → src/lib/api/copypaste.ts

@@ -1,4 +1,3 @@
-// @flow
 import getContentStateFragment from "draft-js/lib/getContentStateFragment";
 import getDraftEditorSelection from "draft-js/lib/getDraftEditorSelection";
 import editOnCopy from "draft-js/lib/editOnCopy";
@@ -12,8 +11,8 @@ import {
   ContentState,
 } from "draft-js";
 
-import type { ElementRef } from "react";
-import type { Editor, EditorState as EditorStateType } from "draft-js";
+import { ElementRef } from "react";
+import { Editor, EditorState as EditorStateType } from "draft-js";
 
 // Custom attribute to store Draft.js content in the HTML clipboard.
 const FRAGMENT_ATTR = "data-draftjs-conductor-fragment";
@@ -72,7 +71,7 @@ const getSelectedContent = (
 // to HTML in its paste event handler.
 const draftEditorCopyCutListener = (
   ref: ElementRef<Editor>,
-  e: SyntheticClipboardEvent<>,
+  e: SyntheticClipboardEvent,
 ) => {
   const selection = window.getSelection();
 
@@ -114,15 +113,15 @@ const draftEditorCopyCutListener = (
 
 export const onDraftEditorCopy = (
   editor: Editor,
-  e: SyntheticClipboardEvent<>,
+  e: SyntheticClipboardEvent,
 ) => {
   draftEditorCopyCutListener(editor, e);
   editOnCopy(editor, e);
 };
 
 export const onDraftEditorCut = (
   editor: Editor,
-  e: SyntheticClipboardEvent<>,
+  e: SyntheticClipboardEvent,
 ) => {
   draftEditorCopyCutListener(editor, e);
   editOnCut(editor, e);
@@ -150,7 +149,7 @@ export const registerCopySource = (ref: ElementRef<Editor>) => {
  * Returns pasted content coming from Draft.js editors set up to serialise
  * their Draft.js content within the HTML.
  */
-export const getDraftEditorPastedContent = (html: ?string) => {
+export const getDraftEditorPastedContent = (html: string | null) => {
   // Plain-text pastes are better handled by Draft.js.
   if (html === "" || typeof html === "undefined" || html === null) {
     return null;
@@ -185,7 +184,7 @@ export const getDraftEditorPastedContent = (html: ?string) => {
  * This SHOULD NOT be used for stripPastedStyles editor.
  */
 export const handleDraftEditorPastedText = (
-  html: ?string,
+  html: string | null,
   editorState: EditorStateType,
 ) => {
   const pastedContent = getDraftEditorPastedContent(html);

src/lib/api/lists.js → src/lib/api/lists.ts

@@ -1,5 +1,4 @@
-// @flow
-import type { BlockNode } from "draft-js/lib/BlockNode";
+import { BlockNode } from "draft-js/lib/BlockNode";
 
 // Default maximum block depth supported by Draft.js CSS.
 export const DRAFT_DEFAULT_MAX_DEPTH = 4;

src/lib/index.js → src/lib/index.ts

@@ -1,4 +1,3 @@
-// @flow
 
 export {
   getListNestingStyles,