Skip to content

Commit ab34263

Browse files
dodo360dodo360
committed
Decouple from bootstrap dependencies
1 parent 91a5bba commit ab34263

File tree

7 files changed

+178
-178
lines changed

7 files changed

+178
-178
lines changed

‎.eslintrc‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,6 @@
11
{
22
"extends": "eslint-config-airbnb",
33
"rules": {
4-
"react/jsx-indent-props": [2, "tab"],
5-
"react/jsx-indent": [2, "tab"],
6-
"quotes": [1, "double", "avoid-escape"],
7-
"indent": [2, "tab"],
84
"comma-dangle": 0,
95
"max-len": [2, 200, 2, {
106
"ignoreUrls": true,

‎.gitignore‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
1-
#IDE
2-
.idea
3-
4-
#NPM
1+
# dependencies
52
node_modules
3+
4+
# production
5+
dist
6+
lang
7+
8+
# misc
9+
.DS_Store
610
npm-debug.log

LICENSE renamed to LICENSE.md

File renamed without changes.

‎README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ import React from "react";
2424
import ReactSummernote from "react-summernote";
2525
import "react-summernote/lang/summernote-ru-RU"; // you can import any other locale
2626

27-
import "bootstrap/dist/css/bootstrap.css"; // you should import bootstrap.css if you haven't done that before
27+
import "bootstrap/dist/css/bootstrap.css"; // you should import bootstrap styles if you haven't done that before
2828
import "react-summernote/dist/react-summernote.css"; // import styles
2929

3030
class RichTextEditor extends React.Component {

‎package.json‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "react-summernote",
3-
"version": "1.0.2",
4-
"description": "Summernote adaptation for react",
3+
"version": "1.0.3",
4+
"description": "Summernote (Super simple WYSIWYG editor) adaptation for react",
55
"main": "./dist/react-summernote.js",
66
"repository": {
77
"type": "git",
@@ -17,6 +17,11 @@
1717
"rich-text-editor",
1818
"WYSIWYG"
1919
],
20+
"files": [
21+
"dist",
22+
"src",
23+
"lang"
24+
],
2025
"author": {
2126
"name": "Ivan Kitaev",
2227
"email": "[email protected]"
@@ -45,10 +50,10 @@
4550
"css-loader": "0.23.1",
4651
"extract-text-webpack-plugin": "1.0.1",
4752
"copy-webpack-plugin": "3.0.1",
48-
"eslint": "2.13.1",
53+
"eslint": "3.0.1",
4954
"eslint-config-airbnb": "9.0.1",
5055
"eslint-plugin-react": "5.2.2",
51-
"eslint-plugin-import": "1.10.0",
52-
"eslint-plugin-jsx-a11y": "1.5.3"
56+
"eslint-plugin-import": "1.10.2",
57+
"eslint-plugin-jsx-a11y": "1.5.5"
5358
}
5459
}

‎src/Summernote.jsx‎

Lines changed: 98 additions & 98 deletions
Original file line numberDiff line numberDiff line change
@@ -1,106 +1,106 @@
11
/* global $ */
22

3-
import "bootstrap/js/modal";
4-
import "bootstrap/js/dropdown";
5-
import "bootstrap/js/tooltip";
6-
import "summernote-webpack-fix/dist/summernote";
7-
import "summernote-webpack-fix/dist/summernote.css";
8-
import "codemirror/lib/codemirror.css";
9-
import React from "react";
10-
11-
class ReactSummernote extends React.Component {
12-
static reset() {
13-
this.editor.summernote("reset");
14-
}
15-
16-
static insertImage(url, filenameOrCallback) {
17-
this.editor.summernote("insertImage", url, filenameOrCallback);
18-
}
19-
20-
static insertNode(node) {
21-
this.editor.summernote("insertNode", node);
22-
}
23-
24-
static insertText(text) {
25-
this.editor.summernote("insertText", text);
26-
}
27-
28-
constructor(props) {
29-
super(props);
30-
31-
this.uid = `react-summernote-${Date.now()}`;
32-
this.editor = {};
33-
34-
ReactSummernote.insertImage = ReactSummernote.insertImage.bind(this);
35-
ReactSummernote.insertNode = ReactSummernote.insertNode.bind(this);
36-
ReactSummernote.insertText = ReactSummernote.insertText.bind(this);
37-
}
38-
39-
componentDidMount() {
40-
const options = this.props.options || {};
41-
options.callbacks = this.callbacks;
42-
43-
this.editor = $(`#${this.uid}`);
44-
this.editor.summernote(options);
45-
this.manageModalScroll(true);
46-
}
47-
48-
shouldComponentUpdate() {
49-
return false;
50-
}
51-
52-
componentWillUnmount() {
53-
if (this.editor) this.editor.summernote("destroy");
54-
this.manageModalScroll(false);
55-
}
56-
57-
manageModalScroll(mount) {
58-
const $body = $("body");
59-
let hasClassName = false;
60-
if (mount) {
61-
$(".note-editor .modal").on("show.bs.modal", () => {
62-
hasClassName = $body.hasClass("modal-open");
63-
});
64-
$(".note-editor .modal").on("hidden.bs.modal", () => {
65-
$body.toggleClass("modal-open", hasClassName);
66-
});
67-
} else {
68-
$(".note-editor .modal").off("show.bs.modal");
69-
$(".note-editor .modal").off("hidden.bs.modal");
70-
}
71-
}
72-
73-
get callbacks() {
74-
return {
75-
onInit: this.props.onInit,
76-
onEnter: this.props.onEnter,
77-
onFocus: this.props.onFocus,
78-
onBlur: this.props.onBlur,
79-
onKeyup: this.props.onKeyUp,
80-
onKeydown: this.props.onKeyDown,
81-
onPaste: this.props.onPaste,
82-
onChange: this.props.onChange,
83-
onImageUpload: this.props.onImageUpload
84-
};
85-
}
86-
87-
render() {
88-
return <div id={this.uid} dangerouslySetInnerHTML={{ __html: this.props.value }}></div>;
89-
}
3+
import 'summernote-webpack-fix/dist/summernote';
4+
import 'summernote-webpack-fix/dist/summernote.css';
5+
import 'codemirror/lib/codemirror.css';
6+
import React, { Component, PropTypes } from 'react';
7+
8+
class ReactSummernote extends Component {
9+
static reset() {
10+
this.editor.summernote('reset');
11+
}
12+
13+
static insertImage(url, filenameOrCallback) {
14+
this.editor.summernote('insertImage', url, filenameOrCallback);
15+
}
16+
17+
static insertNode(node) {
18+
this.editor.summernote('insertNode', node);
19+
}
20+
21+
static insertText(text) {
22+
this.editor.summernote('insertText', text);
23+
}
24+
25+
constructor(props) {
26+
super(props);
27+
28+
this.uid = `react-summernote-${Date.now()}`;
29+
this.editor = {};
30+
31+
ReactSummernote.reset = ReactSummernote.reset.bind(this);
32+
ReactSummernote.insertImage = ReactSummernote.insertImage.bind(this);
33+
ReactSummernote.insertNode = ReactSummernote.insertNode.bind(this);
34+
ReactSummernote.insertText = ReactSummernote.insertText.bind(this);
35+
}
36+
37+
componentDidMount() {
38+
const options = this.props.options || {};
39+
options.callbacks = this.callbacks;
40+
41+
this.editor = $(`#${this.uid}`);
42+
this.editor.summernote(options);
43+
this.manageModalScroll(true);
44+
}
45+
46+
shouldComponentUpdate() {
47+
return false;
48+
}
49+
50+
componentWillUnmount() {
51+
if (this.editor) this.editor.summernote('destroy');
52+
this.manageModalScroll(false);
53+
}
54+
55+
manageModalScroll(mount) {
56+
const $body = $('body');
57+
let hasClassName = false;
58+
if (mount) {
59+
$('.note-editor .modal').on('show.bs.modal', () => {
60+
hasClassName = $body.hasClass('modal-open');
61+
});
62+
$('.note-editor .modal').on('hidden.bs.modal', () => {
63+
$body.toggleClass('modal-open', hasClassName);
64+
});
65+
} else {
66+
$('.note-editor .modal').off('show.bs.modal');
67+
$('.note-editor .modal').off('hidden.bs.modal');
68+
}
69+
}
70+
71+
get callbacks() {
72+
const props = this.props;
73+
74+
return {
75+
onInit: props.onInit,
76+
onEnter: props.onEnter,
77+
onFocus: props.onFocus,
78+
onBlur: props.onBlur,
79+
onKeyup: props.onKeyUp,
80+
onKeydown: props.onKeyDown,
81+
onPaste: props.onPaste,
82+
onChange: props.onChange,
83+
onImageUpload: props.onImageUpload
84+
};
85+
}
86+
87+
render() {
88+
return <div id={this.uid} dangerouslySetInnerHTML={{ __html: this.props.value }}></div>;
89+
}
9090
}
9191

9292
ReactSummernote.propTypes = {
93-
value: React.PropTypes.string,
94-
options: React.PropTypes.object,
95-
onInit: React.PropTypes.func,
96-
onEnter: React.PropTypes.func,
97-
onFocus: React.PropTypes.func,
98-
onBlur: React.PropTypes.func,
99-
onKeyUp: React.PropTypes.func,
100-
onKeyDown: React.PropTypes.func,
101-
onPaste: React.PropTypes.func,
102-
onChange: React.PropTypes.func,
103-
onImageUpload: React.PropTypes.func
93+
value: PropTypes.string,
94+
options: PropTypes.object,
95+
onInit: PropTypes.func,
96+
onEnter: PropTypes.func,
97+
onFocus: PropTypes.func,
98+
onBlur: PropTypes.func,
99+
onKeyUp: PropTypes.func,
100+
onKeyDown: PropTypes.func,
101+
onPaste: PropTypes.func,
102+
onChange: PropTypes.func,
103+
onImageUpload: PropTypes.func
104104
};
105105

106106
export default ReactSummernote;

0 commit comments

Comments
 (0)