diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8eb07599..1a70849f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,33 @@
+v0.1.17
+
+ - Remove hard-coded height from RichTextEditor.css
+
+v0.1.16
+
+ - Update peerDependencies to allow React 0.14
+ - Pass extra props to
+
+v0.1.15
+
+ - Update Flow and fix some Flow errors
+
+v0.1.14
+
+ - Update README about building demo
+
+v0.1.13
+
+ - Updates to demo including better display on mobile
+ - Remove console.error hack
+ - Minor style fixes to dropdown component
+
+v0.1.12
+
+ - Updates to README
+ - CSS fix for transparent dropdown options. Fixes #26
+ - Fix placeholder text that was hard-coded in component
+ - Update contributors
+
v0.1.11
- Add onTab handler for list indent
diff --git a/assets/css/demo.css b/assets/css/demo.css
index 5105eec7..600741ef 100644
--- a/assets/css/demo.css
+++ b/assets/css/demo.css
@@ -91,3 +91,7 @@ a {
white-space: pre;
word-wrap: normal;
}
+
+.editor-demo .react-rte-demo .public-DraftEditor-content {
+ min-height: 110px;
+}
diff --git a/package.json b/package.json
index 70887f06..eadbd072 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "react-rte",
- "version": "0.1.14",
+ "version": "0.3.0",
"description": "React Rich Text Editor",
"main": "dist/react-rte.js",
"scripts": {
@@ -11,46 +11,46 @@
"typecheck": "flow",
"prepublish": "npm run build",
"test": "npm run lint && npm run typecheck && npm run test-src",
- "test-src": "mocha"
+ "test-src": "mocha src/__tests__/*.js src/**/__tests__/*.js"
},
"dependencies": {
"class-autobind": "^0.1.2",
"classnames": "^2.2.5",
- "draft-js": "^0.6.0",
- "draft-js-export-html": "^0.1.13",
- "draft-js-export-markdown": "^0.1.5",
- "draft-js-import-html": "^0.1.8",
- "draft-js-import-markdown": "^0.1.4",
- "draft-js-utils": "^0.1.4",
+ "draft-js": "^0.7.0",
+ "draft-js-export-html": "^0.2.2",
+ "draft-js-export-markdown": "^0.2.0",
+ "draft-js-import-html": "^0.1.10",
+ "draft-js-import-markdown": "^0.1.6",
+ "draft-js-utils": "^0.1.5",
"immutable": "^3.8.1"
},
"peerDependencies": {
- "react": "^15.0.1",
- "react-dom": "^15.0.1"
+ "react": "0.14.x || 15.x.x",
+ "react-dom": "0.14.x || 15.x.x"
},
"devDependencies": {
- "babel-cli": "^6.8.0",
- "babel-core": "^6.8.0",
+ "babel-cli": "^6.9.0",
+ "babel-core": "^6.9.0",
"babel-eslint": "^6.0.4",
"babel-loader": "^6.2.3",
- "babel-plugin-transform-class-properties": "^6.8.0",
- "babel-preset-es2015": "^6.5.0",
+ "babel-plugin-transform-class-properties": "^6.9.0",
+ "babel-preset-es2015": "^6.9.0",
"babel-preset-react": "^6.5.0",
"babel-preset-stage-2": "^6.5.0",
"css-loader": "^0.23.1",
"css-modules-require-hook": "^4.0.0",
- "eslint": "^2.9.0",
+ "eslint": "^2.10.2",
"eslint-plugin-babel": "^3.2.0",
"eslint-plugin-flow-vars": "^0.4.0",
- "eslint-plugin-react": "^5.0.1",
- "expect": "^1.19.0",
- "flow-bin": "^0.22.1",
+ "eslint-plugin-react": "^5.1.1",
+ "expect": "^1.20.1",
+ "flow-bin": "^0.25.0",
"mocha": "^2.4.5",
"raw-loader": "^0.5.1",
"react-addons-test-utils": "^15.0.2",
"rimraf": "^2.5.2",
"style-loader": "^0.13.1",
- "webpack": "^1.13.0"
+ "webpack": "^1.13.1"
},
"repository": {
"type": "git",
diff --git a/src/EditorDemo.js b/src/EditorDemo.js
index 380111a7..40c035d9 100644
--- a/src/EditorDemo.js
+++ b/src/EditorDemo.js
@@ -27,6 +27,7 @@ export default class EditorDemo extends Component {
render(): React.Element {
let {value, format} = this.state;
+
return (
@@ -36,7 +37,10 @@ export default class EditorDemo extends Component {
diff --git a/src/RichTextEditor.css b/src/RichTextEditor.css
index fc1ac993..6c424441 100644
--- a/src/RichTextEditor.css
+++ b/src/RichTextEditor.css
@@ -21,7 +21,6 @@
}
.editor :global(.public-DraftEditor-content) {
- height: 110px;
overflow: auto;
}
diff --git a/src/RichTextEditor.js b/src/RichTextEditor.js
index 13e8c968..da937fd8 100644
--- a/src/RichTextEditor.js
+++ b/src/RichTextEditor.js
@@ -38,9 +38,12 @@ type ChangeHandler = (value: EditorValue) => any;
type Props = {
className?: string;
+ toolbarClassName?: string;
+ editorClassName?: string;
value: EditorValue;
onChange?: ChangeHandler;
placeholder?: string;
+ customStyleMap?: {[style: string]: {[key: string]: any}};
};
export default class RichTextEditor extends Component {
@@ -54,28 +57,30 @@ export default class RichTextEditor extends Component {
}
render(): React.Element {
- let {props} = this;
- let editorState = props.value.getEditorState();
- let className = cx(props.className, styles.root);
- let placeholder = props.placeholder ? props.placeholder : '';
+ let {value, className, toolbarClassName, editorClassName, placeholder, customStyleMap, ...otherProps} = this.props;
+ let editorState = value.getEditorState();
+ customStyleMap = customStyleMap ? {...styleMap, ...customStyleMap} : styleMap;
+
// If the user changes block type before entering any text, we can either
// style the placeholder or hide it. Let's just hide it for now.
- let editorClassName = cx({
+ let combinedEditorClassName = cx({
[styles.editor]: true,
[styles.hidePlaceholder]: this._shouldHidePlaceholder(),
- });
+ }, editorClassName);
return (
-
+
-
+
any;
type Props = {
+ className?: string;
editorState: EditorState;
keyEmitter: EventEmitter;
onChange: ChangeHandler;
@@ -60,8 +62,9 @@ export default class EditorToolbar extends Component {
}
render(): React.Element {
+ const {className} = this.props;
return (
-
+
{this._renderInlineStyleButtons()}
{this._renderBlockTypeButtons()}
{this._renderLinkButtons()}
diff --git a/test/mocha.opts b/test/mocha.opts
index a7a82c62..54abcf1c 100644
--- a/test/mocha.opts
+++ b/test/mocha.opts
@@ -1,3 +1,2 @@
--compilers js:babel-core/register
--require ./test/init.js
-src/__tests__/*.js src/**/__tests__/*.js