react-draft-wysiwyg - npm Package Compare versions

Comparing version 1.10.7 to 1.10.8

package.json

 {
   "name": "react-draft-wysiwyg",
-  "version": "1.10.7",
+  "version": "1.10.8",
   "description": "A wysiwyg on top of DraftJS.",
@@ -12,3 +12,3 @@ "main": "dist/react-draft-wysiwyg.js",
   "devDependencies": {
-    "autoprefixer": "^7.1.1",
+    "autoprefixer": "^7.1.2",
     "babel-core": "^6.25.0",
@@ -22,18 +22,18 @@ "babel-eslint": "^7.2.3",
     "babel-preset-stage-0": "^6.24.1",
-    "chai": "^4.0.2",
+    "chai": "^4.1.0",
     "cross-env": "^5.0.1",
     "css-loader": "^0.28.4",
     "draft-js": "^0.10.1",
-    "draftjs-to-html": "^0.7.2",
-    "draftjs-to-markdown": "^0.4.2",
+    "draftjs-to-html": "^0.7.4",
+    "draftjs-to-markdown": "^0.4.3",
     "enzyme": "^2.9.1",
-    "eslint": "^3.7.1",
-    "eslint-config-airbnb": "^15.0.1",
-    "eslint-plugin-import": "^2.6.1",
-    "eslint-plugin-jsx-a11y": "^5.0.3",
+    "eslint": "^4.3.0",
+    "eslint-config-airbnb": "^15.0.2",
+    "eslint-plugin-import": "^2.7.0",
+    "eslint-plugin-jsx-a11y": "^5.0.1",
     "eslint-plugin-mocha": "^4.11.0",
     "eslint-plugin-react": "^7.1.0",
-    "extract-text-webpack-plugin": "^2.1.2",
+    "extract-text-webpack-plugin": "^3.0.0",
     "file-loader": "^0.11.2",
-    "flow-bin": "^0.49.1",
+    "flow-bin": "^0.51.0",
     "html-to-draftjs": "^0.1.0-beta7",
@@ -49,11 +49,11 @@ "immutable": "^4.0.0-rc.1",
     "rimraf": "^2.6.1",
-    "sinon": "^2.3.6",
+    "sinon": "^2.3.8",
     "style-loader": "^0.18.2",
     "url-loader": "^0.5.9",
-    "webpack": "^3.0.0",
-    "@storybook/react": "^3.1.8"
+    "webpack": "^3.3.0",
+    "@storybook/react": "^3.1.9"
   },
   "dependencies": {
     "classnames": "^2.2.5",
-    "draftjs-utils": "^0.8.03",
+    "draftjs-utils": "^0.8.06",
     "prop-types": "^15.5.10"
@@ -73,2 +73,3 @@ },
     "lint": "eslint src",
+    "lintdocs": "eslint docs/src",
     "flow": "flow; test $? -eq 0 -o $? -eq 2",
@@ -75,0 +76,0 @@ "check": "npm run lint && npm run flow",

README.md

@@ -17,3 +17,3 @@ # React Draft Wysiwyg
 - Support for inline styles: Bold, Italic, Underline, StrikeThrough, Code, Subscript, Superscript.
-- Support for block types: Paragraph, H1 - H6, Blockquote.
+- Support for block types: Paragraph, H1 - H6, Blockquote, Code.
 - Support for setting font-size and font-family.
@@ -20,0 +20,0 @@ - Support for ordered / unordered lists and indenting.

src/components/Dropdown/Dropdown/index.js

@@ -11,3 +11,2 @@ /* @flow */
 export default class Dropdown extends Component {
-
   static propTypes = {
@@ -114,34 +113,1 @@ children: PropTypes.any,
 }
-
-
-  // onKeyDown: Function = (event: Object): void => {
-  //   const { expanded, children, doCollapse } = this.props;
-  //   const { highlighted } = this.state;
-  //   let actioned = false;
-  //   if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {
-  //     if (!expanded) {
-  //       this.toggleExpansion();
-  //       actioned = true;
-  //     } else {
-  //       this.setHighlighted((highlighted === children[1].length - 1) ? 0 : highlighted + 1);
-  //       actioned = true;
-  //     }
-  //   } else if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {
-  //     this.setHighlighted(highlighted <= 0 ? children[1].length - 1 : highlighted - 1);
-  //     actioned = true;
-  //   } else if (event.key === 'Enter') {
-  //     if (highlighted > -1) {
-  //       this.onChange(this.props.children[1][highlighted].props.value);
-  //       actioned = true;
-  //     } else {
-  //       this.toggleExpansion();
-  //       actioned = true;
-  //     }
-  //   } else if (event.key === 'Escape') {
-  //     doCollapse();
-  //     actioned = true;
-  //   }
-  //   if (actioned) {
-  //     event.preventDefault();
-  //   }
-  // };

src/components/Dropdown/DropdownOption/index.js

@@ -9,3 +9,2 @@ /* @flow */
 export default class DropDownOption extends Component {
-
   static propTypes = {
@@ -62,3 +61,3 @@ children: PropTypes.any,
       title,
-     } = this.props;
+    } = this.props;
     return (
@@ -65,0 +64,0 @@ <li

src/components/Option/index.js

@@ -9,3 +9,2 @@ /* @flow */
 export default class Option extends Component {
-
   static propTypes = {
@@ -12,0 +11,0 @@ onClick: PropTypes.func.isRequired,

src/controls/BlockType/Component/index.js

@@ -12,3 +12,2 @@ /* @flow */
 class LayoutComponent extends Component {
-
   static propTypes = {
@@ -49,2 +48,3 @@ expanded: PropTypes.bool,
     { label: 'Blockquote', displayName: translations['components.controls.blocktype.blockquote'] },
+    { label: 'Code', displayName: translations['components.controls.blocktype.code'] },
   ];
@@ -57,13 +57,13 @@
         {
-        blocks.map((block, index) =>
-          (<Option
-            key={index}
-            value={block.label}
-            active={blockType === block.label}
-            onClick={onChange}
-          >
-            {block.displayName}
-          </Option>),
-        )
-      }
+          blocks.map((block, index) =>
+            (<Option
+              key={index}
+              value={block.label}
+              active={blockType === block.label}
+              onClick={onChange}
+            >
+              {block.displayName}
+            </Option>),
+          )
+        }
       </div>
@@ -70,0 +70,0 @@ );

src/controls/BlockType/index.js

@@ -11,3 +11,2 @@ /* @flow */
 class BlockType extends Component {
-
   static propTypes = {
@@ -70,2 +69,3 @@ onChange: PropTypes.func.isRequired,
     { label: 'Blockquote', style: 'blockquote' },
+    { label: 'Code', style: 'code' },
   ];
@@ -72,0 +72,0 @@

src/controls/ColorPicker/Component/index.js

@@ -12,3 +12,2 @@ /* @flow */
 class LayoutComponent extends Component {
-
   static propTypes = {
@@ -15,0 +14,0 @@ expanded: PropTypes.bool,

src/controls/ColorPicker/index.js

@@ -13,3 +13,2 @@ /* @flow */
 class ColorPicker extends Component {
-
   static propTypes = {
@@ -16,0 +15,0 @@ onChange: PropTypes.func.isRequired,

src/controls/Embedded/Component/index.js

@@ -12,3 +12,2 @@ /* @flow */
 class LayoutComponent extends Component {
-
   static propTypes: Object = {
@@ -15,0 +14,0 @@ expanded: PropTypes.bool,

src/controls/Embedded/index.js

@@ -10,3 +10,2 @@ /* @flow */
 class Embedded extends Component {
-
   static propTypes: Object = {
@@ -13,0 +12,0 @@ editorState: PropTypes.object.isRequired,

src/controls/Emoji/Component/index.js

@@ -12,3 +12,2 @@ /* @flow */
 class LayoutComponent extends Component {
-
   static propTypes: Object = {
@@ -78,3 +77,1 @@ expanded: PropTypes.bool,
 export default LayoutComponent;
-
-// todo: unit test cases

src/controls/Emoji/index.js

@@ -10,3 +10,2 @@ /* @flow */
 export default class Emoji extends Component {
-
   static propTypes: Object = {
@@ -13,0 +12,0 @@ editorState: PropTypes.object.isRequired,

src/controls/FontFamily/Component/index.js

@@ -11,3 +11,2 @@ /* @flow */
 class LayoutComponent extends Component {
-
   static propTypes = {
@@ -14,0 +13,0 @@ expanded: PropTypes.bool,

src/controls/FontFamily/index.js

@@ -13,3 +13,2 @@ /* @flow */
 export default class FontFamily extends Component {
-
   static propTypes = {
@@ -16,0 +15,0 @@ onChange: PropTypes.func.isRequired,

src/controls/FontSize/Component/index.js

@@ -11,3 +11,2 @@ /* @flow */
 export default class LayoutComponent extends Component {
-
   static propTypes = {
@@ -68,8 +67,4 @@ expanded: PropTypes.bool,
           {currentFontSize ?
-            <span>{currentFontSize}</span>
-          :
-            <img
-              src={icon}
-              alt=""
-            />
+            <span>{currentFontSize}</span> :
+            <img src={icon} alt="" />
           }
@@ -76,0 +71,0 @@ {

src/controls/FontSize/index.js

@@ -13,3 +13,2 @@ /* @flow */
 export default class FontSize extends Component {
-
   static propTypes = {
@@ -16,0 +15,0 @@ onChange: PropTypes.func.isRequired,

src/controls/History/Component/index.js

@@ -13,3 +13,2 @@ /* @flow */
 export default class History extends Component {
-
   static propTypes = {
@@ -16,0 +15,0 @@ expanded: PropTypes.bool,

src/controls/History/index.js

@@ -10,3 +10,2 @@ /* @flow */
 export default class History extends Component {
-
   static propTypes = {
@@ -13,0 +12,0 @@ onChange: PropTypes.func.isRequired,

src/controls/Image/Component/index.js

@@ -12,3 +12,2 @@ /* @flow */
 class LayoutComponent extends Component {
-
   static propTypes: Object = {
@@ -218,4 +217,4 @@ expanded: PropTypes.bool,
                 className={classNames(
-                'rdw-image-modal-upload-option',
-                { 'rdw-image-modal-upload-option-highlighted': dragEnter })}
+                  'rdw-image-modal-upload-option',
+                  { 'rdw-image-modal-upload-option-highlighted': dragEnter })}
               >
@@ -222,0 +221,0 @@ <label

src/controls/Image/index.js

@@ -10,3 +10,2 @@ /* @flow */
 class ImageControl extends Component {
-
   static propTypes: Object = {
@@ -13,0 +12,0 @@ editorState: PropTypes.object.isRequired,

src/controls/Inline/Component/index.js

@@ -14,3 +14,2 @@ /* @flow */
 export default class Inline extends Component {
-
   static propTypes = {
@@ -33,20 +32,20 @@ expanded: PropTypes.bool,
           config.options
-          .map((style, index) =>
-            (<Option
-              key={index}
-              value={style}
-              onClick={onChange}
-              className={classNames(config[style].className)}
-              active={
-                currentState[style] === true ||
-                (style === 'MONOSPACE' && currentState.CODE)
-              }
-              title={config[style].title || translations[`components.controls.inline.${style}`]}
-            >
-              <img
-                alt=""
-                src={config[style].icon}
-              />
-            </Option>),
-          )
+            .map((style, index) =>
+              (<Option
+                key={index}
+                value={style}
+                onClick={onChange}
+                className={classNames(config[style].className)}
+                active={
+                  currentState[style] === true ||
+                  (style === 'MONOSPACE' && currentState.CODE)
+                }
+                title={config[style].title || translations[`components.controls.inline.${style}`]}
+              >
+                <img
+                  alt=""
+                  src={config[style].icon}
+                />
+              </Option>),
+            )
         }
@@ -87,19 +86,19 @@ </div>
           config.options
-          .map((style, index) =>
-            (<DropdownOption
-              key={index}
-              value={style}
-              className={classNames('rdw-inline-dropdownoption', config[style].className)}
-              active={
-                currentState[style] === true ||
-                (style === 'MONOSPACE' && currentState.CODE)
-              }
-              title={config[style].title || translations[`components.controls.inline.${style}`]}
-            >
-              <img
-                src={config[style].icon}
-                alt=""
-              />
-            </DropdownOption>))
-          }
+            .map((style, index) =>
+              (<DropdownOption
+                key={index}
+                value={style}
+                className={classNames('rdw-inline-dropdownoption', config[style].className)}
+                active={
+                  currentState[style] === true ||
+                  (style === 'MONOSPACE' && currentState.CODE)
+                }
+                title={config[style].title || translations[`components.controls.inline.${style}`]}
+              >
+                <img
+                  src={config[style].icon}
+                  alt=""
+                />
+              </DropdownOption>))
+        }
       </Dropdown>
@@ -106,0 +105,0 @@ );

src/controls/Inline/index.js

@@ -12,3 +12,2 @@ /* @flow */
 export default class Inline extends Component {
-
   static propTypes = {
@@ -15,0 +14,0 @@ onChange: PropTypes.func.isRequired,

src/controls/Link/Component/index.js

@@ -14,3 +14,2 @@ /* @flow */
 class LayoutComponent extends Component {
-
   static propTypes = {
@@ -17,0 +16,0 @@ expanded: PropTypes.bool,

src/controls/Link/index.js

@@ -15,3 +15,2 @@ /* @flow */
 class Link extends Component {
-
   static propTypes = {
@@ -18,0 +17,0 @@ editorState: PropTypes.object.isRequired,

src/controls/List/Component/index.js

@@ -13,3 +13,2 @@ /* @flow */
 export default class LayoutComponent extends Component {
-
   static propTypes = {
@@ -16,0 +15,0 @@ expanded: PropTypes.bool,

src/controls/List/index.js

@@ -11,3 +11,2 @@ /* @flow */
 export default class List extends Component {
-
   static propTypes = {
@@ -14,0 +13,0 @@ onChange: PropTypes.func.isRequired,

src/controls/Remove/index.js

@@ -12,3 +12,2 @@ /* @flow */
 export default class Remove extends Component {
-
   static propTypes = {
@@ -15,0 +14,0 @@ onChange: PropTypes.func.isRequired,

src/controls/TextAlign/Component/index.js

@@ -13,3 +13,2 @@ /* @flow */
 export default class TextAlign extends Component {
-
   static propTypes = {
@@ -16,0 +15,0 @@ expanded: PropTypes.bool,

src/controls/TextAlign/index.js

@@ -10,3 +10,2 @@ /* @flow */
 export default class TextAlign extends Component {
-
   static propTypes = {
@@ -13,0 +12,0 @@ editorState: PropTypes.object.isRequired,

src/decorators/HashTag/index.js

@@ -7,3 +7,2 @@ import React from 'react';
 class Hashtag {
-
   constructor(config) {
@@ -10,0 +9,0 @@ this.className = config.className;

src/decorators/Link/index.js

@@ -22,3 +22,2 @@ import React, { Component } from 'react';
   return class Link extends Component {
-
     static propTypes = {
@@ -25,0 +24,0 @@ entityKey: PropTypes.string.isRequired,

src/decorators/Mention/Suggestion/index.js

@@ -47,4 +47,4 @@ import React, { Component } from 'react';
           selection.get('focusOffset') === text.length - 1
-          ? text.length
-          : selection.get('focusOffset') + 1,
+            ? text.length
+            : selection.get('focusOffset') + 1,
         );
@@ -89,3 +89,2 @@ let index = text.lastIndexOf(separator + trigger);
   return class SuggestionComponent extends Component {
-
     static propTypes = {
@@ -92,0 +91,0 @@ children: PropTypes.array,

src/Editor/index.js

@@ -16,2 +16,3 @@ /* @flow */
   handleNewLine,
+  blockRenderMap,
   getCustomStyleMap,
@@ -40,3 +41,2 @@ extractInlineStyle,
 export default class WysiwygEditor extends Component {
-
   static propTypes = {
@@ -376,3 +376,3 @@ onChange: PropTypes.func,
       toolbar,
-     } = this.state;
+    } = this.state;
     const {
@@ -453,2 +453,3 @@ locale,
             ariaLabel={ariaLabel || 'rdw-editor'}
+            blockRenderMap={blockRenderMap}
             {...this.editorProps}
@@ -455,0 +456,0 @@ />

src/event-handler/focus.js

 export default class FocusHandler {
-
   inputFocused = false;
@@ -4,0 +3,0 @@ editorMouseDown = false;

src/event-handler/modals.js

 export default class ModalHandler {
-
   callBacks = [];
@@ -16,20 +15,24 @@ suggestionCallback = undefined;
     const wrapper = document.getElementById(wrapperId); // eslint-disable-line no-undef
-    wrapper.addEventListener('click', () => {
-      this.editorFlag = true;
-    });
-    document.addEventListener('click', () => { // eslint-disable-line no-undef
-      if (!this.editorFlag) {
-        this.closeAllModals();
-        if (this.suggestionCallback) {
-          this.suggestionCallback();
+    if (wrapper) {
+      wrapper.addEventListener('click', () => {
+        this.editorFlag = true;
+      });
+    }
+    if (document) {
+      document.addEventListener('click', () => { // eslint-disable-line no-undef
+        if (!this.editorFlag) {
+          this.closeAllModals();
+          if (this.suggestionCallback) {
+            this.suggestionCallback();
+          }
+        } else {
+          this.editorFlag = false;
         }
-      } else {
-        this.editorFlag = false;
-      }
-    });
-    document.addEventListener('keydown', (event) => { // eslint-disable-line no-undef
-      if (event.key === 'Escape') {
-        this.closeAllModals();
-      }
-    });
+      });
+      document.addEventListener('keydown', (event) => { // eslint-disable-line no-undef
+        if (event.key === 'Escape') {
+          this.closeAllModals();
+        }
+      });
+    }
   };
@@ -36,0 +39,0 @@

src/i18n/en.js

@@ -15,2 +15,3 @@ module.exports = {
   'components.controls.blocktype.blockquote': 'Blockquote',
+  'components.controls.blocktype.code': 'Code',
   'components.controls.blocktype.blocktype': 'Block Type',
@@ -17,0 +18,0 @@ 'components.controls.blocktype.normal': 'Normal',

src/i18n/fr.js

@@ -15,2 +15,3 @@ module.exports = {
   'components.controls.blocktype.blockquote': 'Citation',
+  'components.controls.blocktype.code': 'Code',
   'components.controls.blocktype.blocktype': 'Type bloc',
@@ -17,0 +18,0 @@ 'components.controls.blocktype.normal': 'Normal',

src/i18n/ko.js

@@ -15,2 +15,3 @@ module.exports = {
   'components.controls.blocktype.blockquote': '인용',
+  'components.controls.blocktype.code': 'Code',
   'components.controls.blocktype.blocktype': '블록',
@@ -20,3 +21,3 @@ 'components.controls.blocktype.normal': '표준',
   // Color Picker
-  'components.controls.colorpicker.colorpicker': 'Color Picker',
+  'components.controls.colorpicker.colorpicker': '색상 선택',
   'components.controls.colorpicker.text': '글꼴색',
@@ -26,3 +27,3 @@ 'components.controls.colorpicker.background': '배경색',
   // Embedded
-  'components.controls.embedded.embedded': 'Embedded',
+  'components.controls.embedded.embedded': '임베드',
   'components.controls.embedded.embeddedlink': '임베드 링크',
@@ -32,3 +33,3 @@ 'components.controls.embedded.enterlink': '주소를 입력하세요',
   // Emoji
-  'components.controls.emoji.emoji': 'Emoji',
+  'components.controls.emoji.emoji': '이모지',
 
@@ -39,23 +40,23 @@ // FontFamily
   // FontSize
-  'components.controls.fontsize.fontsize': 'Font Size',
+  'components.controls.fontsize.fontsize': '글꼴 크기',
 
   // History
-  'components.controls.history.history': 'History',
-  'components.controls.history.undo': 'Undo',
-  'components.controls.history.redo': 'Redo',
+  'components.controls.history.history': '히스토리',
+  'components.controls.history.undo': '실행 취소',
+  'components.controls.history.redo': '다시 실행',
 
   // Image
-  'components.controls.image.image': 'Image',
+  'components.controls.image.image': '이미지',
   'components.controls.image.fileUpload': '파일 업로드',
   'components.controls.image.byURL': '주소',
-  'components.controls.image.dropFileText': '파일을 드롭하거나 클릭하여 업로드하세요',
+  'components.controls.image.dropFileText': '클릭하거나 파일을 드롭하여 업로드하세요',
 
   // Inline
-  'components.controls.inline.bold': 'Bold',
-  'components.controls.inline.italic': 'Italic',
-  'components.controls.inline.underline': 'Underline',
-  'components.controls.inline.strikethrough': 'Strikethrough',
-  'components.controls.inline.monospace': 'Monospace',
-  'components.controls.inline.superscript': 'Superscript',
-  'components.controls.inline.subscript': 'Subscript',
+  'components.controls.inline.bold': '굵게',
+  'components.controls.inline.italic': '기울임꼴',
+  'components.controls.inline.underline': '밑줄',
+  'components.controls.inline.strikethrough': '취소선',
+  'components.controls.inline.monospace': '고정 너비',
+  'components.controls.inline.superscript': '위 첨자',
+  'components.controls.inline.subscript': '아래 첨자',
 
@@ -66,21 +67,21 @@ // Link
   'components.controls.link.linkTargetOption': '새창으로 열기',
-  'components.controls.link.link': 'Link',
-  'components.controls.link.unlink': 'Unlink',
+  'components.controls.link.link': '링크',
+  'components.controls.link.unlink': '링크 제거',
 
   // List
-  'components.controls.list.list': 'List',
-  'components.controls.list.unordered': 'Unordered',
-  'components.controls.list.ordered': 'Ordered',
-  'components.controls.list.indent': 'Indent',
-  'components.controls.list.outdent': 'Outdent',
+  'components.controls.list.list': '리스트',
+  'components.controls.list.unordered': '일반 리스트',
+  'components.controls.list.ordered': '순서 리스트',
+  'components.controls.list.indent': '들여쓰기',
+  'components.controls.list.outdent': '내어쓰기',
 
   // Remove
-  'components.controls.remove.remove': 'Remove',
+  'components.controls.remove.remove': '삭제',
 
   // TextAlign
-  'components.controls.textalign.textalign': 'Text Align',
-  'components.controls.textalign.left': 'Left',
-  'components.controls.textalign.center': 'Center',
-  'components.controls.textalign.right': 'Right',
-  'components.controls.textalign.justify': 'Justify',
+  'components.controls.textalign.textalign': '텍스트 정렬',
+  'components.controls.textalign.left': '왼쪽',
+  'components.controls.textalign.center': '중앙',
+  'components.controls.textalign.right': '오른쪽',
+  'components.controls.textalign.justify': '양쪽',
 };

src/i18n/pt.js

@@ -15,2 +15,3 @@ module.exports = {
   'components.controls.blocktype.blockquote': 'Citação',
+  'components.controls.blocktype.code': 'Code',
   'components.controls.blocktype.blocktype': 'Estilo',
@@ -17,0 +18,0 @@ 'components.controls.blocktype.normal': 'Normal',

src/i18n/ru.js

@@ -15,2 +15,3 @@ module.exports = {
   'components.controls.blocktype.blockquote': 'Цитата',
+  'components.controls.blocktype.code': 'Code',
   'components.controls.blocktype.blocktype': 'Форматирование',
@@ -17,0 +18,0 @@ 'components.controls.blocktype.normal': 'Обычный',

src/i18n/zh.js

@@ -15,2 +15,3 @@ module.exports = {
   'components.controls.blocktype.blockquote': '引用',
+  'components.controls.blocktype.code': 'Code',
   'components.controls.blocktype.blocktype': '样式',
@@ -17,0 +18,0 @@ 'components.controls.blocktype.normal': '正文',

src/renderer/Image/__test__/imageRendererTest.js

@@ -33,3 +33,4 @@ /* @flow */
       )
-      .node.type)
+        .node.type,
+    )
       .to.equal('span');
@@ -36,0 +37,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

Improved metrics

Total package byte prevSize

485817

increased by0.75%

Number of package files

107

increased by2.88%

Lines of code

7548

increased by1.4%

Dependency changes

• Updateddraftjs-utils@^0.8.06