@elliemae/ds-wysiwygeditor 2.0.0-rc.6 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/components/DSWYSIWYGEditorImpl.js +16 -17
- package/cjs/components/ImageLibraryModal.js +6 -7
- package/cjs/components/InsertFieldModal.js +18 -19
- package/cjs/quillOverrides/LinkFormat.js +4 -13
- package/esm/components/DSWYSIWYGEditorImpl.js +16 -17
- package/esm/components/ImageLibraryModal.js +6 -7
- package/esm/components/InsertFieldModal.js +17 -18
- package/esm/quillOverrides/LinkFormat.js +4 -9
- package/package.json +10 -8
- package/types/DSWYSIWYGEditor.d.ts +64 -9
- package/types/quillMatchers/clipboardLinkWithTagMatcher.d.ts +1 -0
|
@@ -57,8 +57,7 @@ ReactQuill.Quill.register(SizeStyle, true); // ---------------------------------
|
|
|
57
57
|
class DSWYSIWYGEditorImpl extends React__default["default"].PureComponent {
|
|
58
58
|
constructor(props) {
|
|
59
59
|
super(props);
|
|
60
|
-
|
|
61
|
-
_defineProperty__default["default"](this, "quillModules", _objectSpread({
|
|
60
|
+
this.quillModules = _objectSpread({
|
|
62
61
|
toolbar: {
|
|
63
62
|
container: this.props.toolbarContainer ? "#".concat(this.props.toolbarContainer) : '#toolbar',
|
|
64
63
|
handlers: _objectSpread({}, this.props.toolbarHandlers)
|
|
@@ -69,31 +68,31 @@ class DSWYSIWYGEditorImpl extends React__default["default"].PureComponent {
|
|
|
69
68
|
},
|
|
70
69
|
blotFormatter: {// options... https://github.com/Fandom-OSS/quill-blot-formatter
|
|
71
70
|
}
|
|
72
|
-
}, this.props.quillModules)
|
|
71
|
+
}, this.props.quillModules);
|
|
73
72
|
|
|
74
|
-
|
|
73
|
+
this.onChangeQuill = (html, delta, source, editor) => {
|
|
75
74
|
const {
|
|
76
75
|
showRawHTML,
|
|
77
76
|
onChange
|
|
78
77
|
} = this.props;
|
|
79
78
|
if (!showRawHTML) onChange(html, delta, source, editor);
|
|
80
|
-
}
|
|
79
|
+
};
|
|
81
80
|
|
|
82
|
-
|
|
81
|
+
this.onChangeTextArea = e => {
|
|
83
82
|
const {
|
|
84
83
|
showRawHTML,
|
|
85
84
|
onChange
|
|
86
85
|
} = this.props;
|
|
87
86
|
if (showRawHTML) onChange(e.target.value);
|
|
88
|
-
}
|
|
87
|
+
};
|
|
89
88
|
|
|
90
|
-
|
|
89
|
+
this.onInserFieldConfirm = fieldCode => {
|
|
91
90
|
const editor = this.getEditor();
|
|
92
91
|
const range = editor.getSelection(true);
|
|
93
92
|
editor.insertText(range.index, fieldCode);
|
|
94
|
-
}
|
|
93
|
+
};
|
|
95
94
|
|
|
96
|
-
|
|
95
|
+
this.onImageConfirm = image => {
|
|
97
96
|
if (!image) {
|
|
98
97
|
return;
|
|
99
98
|
}
|
|
@@ -101,23 +100,23 @@ class DSWYSIWYGEditorImpl extends React__default["default"].PureComponent {
|
|
|
101
100
|
const editor = this.getEditor();
|
|
102
101
|
const range = editor.getSelection(true);
|
|
103
102
|
editor.insertEmbed(range.index, 'image', image.url);
|
|
104
|
-
}
|
|
103
|
+
};
|
|
105
104
|
|
|
106
|
-
|
|
105
|
+
this.onFieldModalClose = () => {
|
|
107
106
|
this.setState({
|
|
108
107
|
isFieldModalOpen: false
|
|
109
108
|
});
|
|
110
|
-
}
|
|
109
|
+
};
|
|
111
110
|
|
|
112
|
-
|
|
111
|
+
this.onImageModalClose = () => {
|
|
113
112
|
this.setState({
|
|
114
113
|
isImageModalOpen: false
|
|
115
114
|
});
|
|
116
|
-
}
|
|
115
|
+
};
|
|
117
116
|
|
|
118
|
-
|
|
117
|
+
this.quillRef = ref => {
|
|
119
118
|
this.quill = ref;
|
|
120
|
-
}
|
|
119
|
+
};
|
|
121
120
|
|
|
122
121
|
ReactQuill.Quill.register(LinkFormat, true);
|
|
123
122
|
|
|
@@ -23,13 +23,13 @@ class ImageLibraryModal extends React__default["default"].PureComponent {
|
|
|
23
23
|
constructor(props) {
|
|
24
24
|
super(props);
|
|
25
25
|
|
|
26
|
-
|
|
26
|
+
this.onSelect = selectedImage => {
|
|
27
27
|
this.setState({
|
|
28
28
|
selectedImage
|
|
29
29
|
});
|
|
30
|
-
}
|
|
30
|
+
};
|
|
31
31
|
|
|
32
|
-
|
|
32
|
+
this.onConfirm = () => {
|
|
33
33
|
const {
|
|
34
34
|
selectedImage
|
|
35
35
|
} = this.state;
|
|
@@ -39,7 +39,7 @@ class ImageLibraryModal extends React__default["default"].PureComponent {
|
|
|
39
39
|
} = this.props;
|
|
40
40
|
onConfirm(selectedImage);
|
|
41
41
|
onClose();
|
|
42
|
-
}
|
|
42
|
+
};
|
|
43
43
|
|
|
44
44
|
this.state = {
|
|
45
45
|
selectedImage: undefined
|
|
@@ -54,8 +54,7 @@ class ImageLibraryModal extends React__default["default"].PureComponent {
|
|
|
54
54
|
}
|
|
55
55
|
|
|
56
56
|
}
|
|
57
|
-
|
|
58
|
-
_defineProperty__default["default"](ImageLibraryModal, "defaultProps", {
|
|
57
|
+
ImageLibraryModal.defaultProps = {
|
|
59
58
|
onReject: undefined,
|
|
60
59
|
imagesData: [{
|
|
61
60
|
url: 'https://www.freeiconspng.com/minicovers/no-image-icon-6.png',
|
|
@@ -68,6 +67,6 @@ _defineProperty__default["default"](ImageLibraryModal, "defaultProps", {
|
|
|
68
67
|
createdBy: 'user:Jane Doe',
|
|
69
68
|
createdDate: '0000-01-01 00:00 AM UTC'
|
|
70
69
|
}]
|
|
71
|
-
}
|
|
70
|
+
};
|
|
72
71
|
|
|
73
72
|
module.exports = ImageLibraryModal;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
4
|
-
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
5
4
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
5
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
6
|
require('core-js/modules/esnext.async-iterator.map.js');
|
|
7
7
|
require('core-js/modules/esnext.iterator.map.js');
|
|
8
8
|
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
@@ -20,8 +20,8 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
20
20
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
21
21
|
|
|
22
22
|
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
23
|
-
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
24
23
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
24
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
25
25
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
26
26
|
var DSModal__default = /*#__PURE__*/_interopDefaultLegacy(DSModal);
|
|
27
27
|
|
|
@@ -36,7 +36,7 @@ class InsertFieldModal extends React__default["default"].PureComponent {
|
|
|
36
36
|
constructor(props) {
|
|
37
37
|
super(props);
|
|
38
38
|
|
|
39
|
-
|
|
39
|
+
this.onConfirm = () => {
|
|
40
40
|
const {
|
|
41
41
|
onConfirm,
|
|
42
42
|
onClose
|
|
@@ -46,9 +46,9 @@ class InsertFieldModal extends React__default["default"].PureComponent {
|
|
|
46
46
|
} = this.state;
|
|
47
47
|
onConfirm(selectedFieldCode);
|
|
48
48
|
onClose();
|
|
49
|
-
}
|
|
49
|
+
};
|
|
50
50
|
|
|
51
|
-
|
|
51
|
+
this.onReject = () => {
|
|
52
52
|
const {
|
|
53
53
|
onReject,
|
|
54
54
|
onClose
|
|
@@ -59,21 +59,21 @@ class InsertFieldModal extends React__default["default"].PureComponent {
|
|
|
59
59
|
} else {
|
|
60
60
|
onClose();
|
|
61
61
|
}
|
|
62
|
-
}
|
|
62
|
+
};
|
|
63
63
|
|
|
64
|
-
|
|
64
|
+
this.drawDiv = (className, content, content2) => /*#__PURE__*/_jsx__default["default"]("div", {
|
|
65
65
|
className: className
|
|
66
|
-
}, void 0, /*#__PURE__*/_jsx__default["default"]("span", {}, void 0, content), /*#__PURE__*/_jsx__default["default"]("span", {}, void 0, content2))
|
|
66
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"]("span", {}, void 0, content), /*#__PURE__*/_jsx__default["default"]("span", {}, void 0, content2));
|
|
67
67
|
|
|
68
|
-
|
|
68
|
+
this.drawLabel = (className, label, value) => /*#__PURE__*/_jsx__default["default"]("div", {
|
|
69
69
|
className: className
|
|
70
70
|
}, void 0, /*#__PURE__*/_jsx__default["default"]("span", {
|
|
71
71
|
className: "label"
|
|
72
72
|
}, void 0, label), /*#__PURE__*/_jsx__default["default"]("span", {
|
|
73
73
|
className: "value"
|
|
74
|
-
}, void 0, value))
|
|
74
|
+
}, void 0, value));
|
|
75
75
|
|
|
76
|
-
|
|
76
|
+
this.handleElementClick = (e, selectedFieldCode) => {
|
|
77
77
|
if (e.key && e.key !== ' ') {
|
|
78
78
|
return;
|
|
79
79
|
}
|
|
@@ -100,9 +100,9 @@ class InsertFieldModal extends React__default["default"].PureComponent {
|
|
|
100
100
|
if (onSelect) {
|
|
101
101
|
onSelect(selectedFieldCode);
|
|
102
102
|
}
|
|
103
|
-
}
|
|
103
|
+
};
|
|
104
104
|
|
|
105
|
-
|
|
105
|
+
this.preventSpacebarScroll = () => {
|
|
106
106
|
document.onkeypress = function (e) {
|
|
107
107
|
if (!lodash.includes(e.target.className, elementClassName)) {
|
|
108
108
|
return true;
|
|
@@ -118,9 +118,9 @@ class InsertFieldModal extends React__default["default"].PureComponent {
|
|
|
118
118
|
|
|
119
119
|
return true;
|
|
120
120
|
};
|
|
121
|
-
}
|
|
121
|
+
};
|
|
122
122
|
|
|
123
|
-
|
|
123
|
+
this.renderElements = () => {
|
|
124
124
|
const {
|
|
125
125
|
customFields: customFields$1
|
|
126
126
|
} = this.props;
|
|
@@ -154,7 +154,7 @@ class InsertFieldModal extends React__default["default"].PureComponent {
|
|
|
154
154
|
children: this.drawLabel('content', customFields.getFieldName(customField), fieldCode)
|
|
155
155
|
}), fieldCode);
|
|
156
156
|
});
|
|
157
|
-
}
|
|
157
|
+
};
|
|
158
158
|
|
|
159
159
|
this.state = {
|
|
160
160
|
selectedFieldCode: customFields.getFieldCode(customFields.fields[0])
|
|
@@ -202,8 +202,7 @@ class InsertFieldModal extends React__default["default"].PureComponent {
|
|
|
202
202
|
}
|
|
203
203
|
|
|
204
204
|
}
|
|
205
|
-
|
|
206
|
-
_defineProperty__default["default"](InsertFieldModal, "defaultProps", {
|
|
205
|
+
InsertFieldModal.defaultProps = {
|
|
207
206
|
confirmLabel: 'Add',
|
|
208
207
|
customFields: customFields.fields,
|
|
209
208
|
disableDoubleClick: false,
|
|
@@ -214,6 +213,6 @@ _defineProperty__default["default"](InsertFieldModal, "defaultProps", {
|
|
|
214
213
|
shouldCloseOnOverlayClick: true,
|
|
215
214
|
size: constants.sizeOptions[1],
|
|
216
215
|
onSelect: undefined
|
|
217
|
-
}
|
|
216
|
+
};
|
|
218
217
|
|
|
219
218
|
module.exports = InsertFieldModal;
|
|
@@ -1,13 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
3
|
require('core-js/modules/web.dom-collections.iterator.js');
|
|
5
4
|
var ReactQuill = require('react-quill');
|
|
6
5
|
|
|
7
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
8
|
-
|
|
9
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
10
|
-
|
|
11
6
|
const sanitizeProtocol = value => {
|
|
12
7
|
if (typeof value === 'boolean') return value;
|
|
13
8
|
let newVal = value;
|
|
@@ -33,14 +28,10 @@ const Link = ReactQuill.Quill.import('formats/link');
|
|
|
33
28
|
class LinkFormat extends Link {
|
|
34
29
|
constructor() {
|
|
35
30
|
super(...arguments);
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
_defineProperty__default["default"](this, "SANITIZED_URL", 'about:blank');
|
|
42
|
-
|
|
43
|
-
_defineProperty__default["default"](this, "PROTOCOL_WHITELIST", ['http', 'ftp', 'https', 'mailto', 'tel']);
|
|
31
|
+
this.blotName = 'link';
|
|
32
|
+
this.tagName = 'A';
|
|
33
|
+
this.SANITIZED_URL = 'about:blank';
|
|
34
|
+
this.PROTOCOL_WHITELIST = ['http', 'ftp', 'https', 'mailto', 'tel'];
|
|
44
35
|
}
|
|
45
36
|
|
|
46
37
|
static create(value) {
|
|
@@ -46,8 +46,7 @@ Quill.register(SizeStyle, true); // -----------------------------------------
|
|
|
46
46
|
class DSWYSIWYGEditorImpl extends React.PureComponent {
|
|
47
47
|
constructor(props) {
|
|
48
48
|
super(props);
|
|
49
|
-
|
|
50
|
-
_defineProperty(this, "quillModules", _objectSpread({
|
|
49
|
+
this.quillModules = _objectSpread({
|
|
51
50
|
toolbar: {
|
|
52
51
|
container: this.props.toolbarContainer ? "#".concat(this.props.toolbarContainer) : '#toolbar',
|
|
53
52
|
handlers: _objectSpread({}, this.props.toolbarHandlers)
|
|
@@ -58,31 +57,31 @@ class DSWYSIWYGEditorImpl extends React.PureComponent {
|
|
|
58
57
|
},
|
|
59
58
|
blotFormatter: {// options... https://github.com/Fandom-OSS/quill-blot-formatter
|
|
60
59
|
}
|
|
61
|
-
}, this.props.quillModules)
|
|
60
|
+
}, this.props.quillModules);
|
|
62
61
|
|
|
63
|
-
|
|
62
|
+
this.onChangeQuill = (html, delta, source, editor) => {
|
|
64
63
|
const {
|
|
65
64
|
showRawHTML,
|
|
66
65
|
onChange
|
|
67
66
|
} = this.props;
|
|
68
67
|
if (!showRawHTML) onChange(html, delta, source, editor);
|
|
69
|
-
}
|
|
68
|
+
};
|
|
70
69
|
|
|
71
|
-
|
|
70
|
+
this.onChangeTextArea = e => {
|
|
72
71
|
const {
|
|
73
72
|
showRawHTML,
|
|
74
73
|
onChange
|
|
75
74
|
} = this.props;
|
|
76
75
|
if (showRawHTML) onChange(e.target.value);
|
|
77
|
-
}
|
|
76
|
+
};
|
|
78
77
|
|
|
79
|
-
|
|
78
|
+
this.onInserFieldConfirm = fieldCode => {
|
|
80
79
|
const editor = this.getEditor();
|
|
81
80
|
const range = editor.getSelection(true);
|
|
82
81
|
editor.insertText(range.index, fieldCode);
|
|
83
|
-
}
|
|
82
|
+
};
|
|
84
83
|
|
|
85
|
-
|
|
84
|
+
this.onImageConfirm = image => {
|
|
86
85
|
if (!image) {
|
|
87
86
|
return;
|
|
88
87
|
}
|
|
@@ -90,23 +89,23 @@ class DSWYSIWYGEditorImpl extends React.PureComponent {
|
|
|
90
89
|
const editor = this.getEditor();
|
|
91
90
|
const range = editor.getSelection(true);
|
|
92
91
|
editor.insertEmbed(range.index, 'image', image.url);
|
|
93
|
-
}
|
|
92
|
+
};
|
|
94
93
|
|
|
95
|
-
|
|
94
|
+
this.onFieldModalClose = () => {
|
|
96
95
|
this.setState({
|
|
97
96
|
isFieldModalOpen: false
|
|
98
97
|
});
|
|
99
|
-
}
|
|
98
|
+
};
|
|
100
99
|
|
|
101
|
-
|
|
100
|
+
this.onImageModalClose = () => {
|
|
102
101
|
this.setState({
|
|
103
102
|
isImageModalOpen: false
|
|
104
103
|
});
|
|
105
|
-
}
|
|
104
|
+
};
|
|
106
105
|
|
|
107
|
-
|
|
106
|
+
this.quillRef = ref => {
|
|
108
107
|
this.quill = ref;
|
|
109
|
-
}
|
|
108
|
+
};
|
|
110
109
|
|
|
111
110
|
Quill.register(LinkFormat, true);
|
|
112
111
|
|
|
@@ -15,13 +15,13 @@ class ImageLibraryModal extends React.PureComponent {
|
|
|
15
15
|
constructor(props) {
|
|
16
16
|
super(props);
|
|
17
17
|
|
|
18
|
-
|
|
18
|
+
this.onSelect = selectedImage => {
|
|
19
19
|
this.setState({
|
|
20
20
|
selectedImage
|
|
21
21
|
});
|
|
22
|
-
}
|
|
22
|
+
};
|
|
23
23
|
|
|
24
|
-
|
|
24
|
+
this.onConfirm = () => {
|
|
25
25
|
const {
|
|
26
26
|
selectedImage
|
|
27
27
|
} = this.state;
|
|
@@ -31,7 +31,7 @@ class ImageLibraryModal extends React.PureComponent {
|
|
|
31
31
|
} = this.props;
|
|
32
32
|
onConfirm(selectedImage);
|
|
33
33
|
onClose();
|
|
34
|
-
}
|
|
34
|
+
};
|
|
35
35
|
|
|
36
36
|
this.state = {
|
|
37
37
|
selectedImage: undefined
|
|
@@ -46,8 +46,7 @@ class ImageLibraryModal extends React.PureComponent {
|
|
|
46
46
|
}
|
|
47
47
|
|
|
48
48
|
}
|
|
49
|
-
|
|
50
|
-
_defineProperty(ImageLibraryModal, "defaultProps", {
|
|
49
|
+
ImageLibraryModal.defaultProps = {
|
|
51
50
|
onReject: undefined,
|
|
52
51
|
imagesData: [{
|
|
53
52
|
url: 'https://www.freeiconspng.com/minicovers/no-image-icon-6.png',
|
|
@@ -60,6 +59,6 @@ _defineProperty(ImageLibraryModal, "defaultProps", {
|
|
|
60
59
|
createdBy: 'user:Jane Doe',
|
|
61
60
|
createdDate: '0000-01-01 00:00 AM UTC'
|
|
62
61
|
}]
|
|
63
|
-
}
|
|
62
|
+
};
|
|
64
63
|
|
|
65
64
|
export { ImageLibraryModal as default };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
2
|
-
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
3
2
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
3
|
+
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
4
4
|
import 'core-js/modules/esnext.async-iterator.map.js';
|
|
5
5
|
import 'core-js/modules/esnext.iterator.map.js';
|
|
6
6
|
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
@@ -26,7 +26,7 @@ class InsertFieldModal extends React.PureComponent {
|
|
|
26
26
|
constructor(props) {
|
|
27
27
|
super(props);
|
|
28
28
|
|
|
29
|
-
|
|
29
|
+
this.onConfirm = () => {
|
|
30
30
|
const {
|
|
31
31
|
onConfirm,
|
|
32
32
|
onClose
|
|
@@ -36,9 +36,9 @@ class InsertFieldModal extends React.PureComponent {
|
|
|
36
36
|
} = this.state;
|
|
37
37
|
onConfirm(selectedFieldCode);
|
|
38
38
|
onClose();
|
|
39
|
-
}
|
|
39
|
+
};
|
|
40
40
|
|
|
41
|
-
|
|
41
|
+
this.onReject = () => {
|
|
42
42
|
const {
|
|
43
43
|
onReject,
|
|
44
44
|
onClose
|
|
@@ -49,21 +49,21 @@ class InsertFieldModal extends React.PureComponent {
|
|
|
49
49
|
} else {
|
|
50
50
|
onClose();
|
|
51
51
|
}
|
|
52
|
-
}
|
|
52
|
+
};
|
|
53
53
|
|
|
54
|
-
|
|
54
|
+
this.drawDiv = (className, content, content2) => /*#__PURE__*/_jsx("div", {
|
|
55
55
|
className: className
|
|
56
|
-
}, void 0, /*#__PURE__*/_jsx("span", {}, void 0, content), /*#__PURE__*/_jsx("span", {}, void 0, content2))
|
|
56
|
+
}, void 0, /*#__PURE__*/_jsx("span", {}, void 0, content), /*#__PURE__*/_jsx("span", {}, void 0, content2));
|
|
57
57
|
|
|
58
|
-
|
|
58
|
+
this.drawLabel = (className, label, value) => /*#__PURE__*/_jsx("div", {
|
|
59
59
|
className: className
|
|
60
60
|
}, void 0, /*#__PURE__*/_jsx("span", {
|
|
61
61
|
className: "label"
|
|
62
62
|
}, void 0, label), /*#__PURE__*/_jsx("span", {
|
|
63
63
|
className: "value"
|
|
64
|
-
}, void 0, value))
|
|
64
|
+
}, void 0, value));
|
|
65
65
|
|
|
66
|
-
|
|
66
|
+
this.handleElementClick = (e, selectedFieldCode) => {
|
|
67
67
|
if (e.key && e.key !== ' ') {
|
|
68
68
|
return;
|
|
69
69
|
}
|
|
@@ -90,9 +90,9 @@ class InsertFieldModal extends React.PureComponent {
|
|
|
90
90
|
if (onSelect) {
|
|
91
91
|
onSelect(selectedFieldCode);
|
|
92
92
|
}
|
|
93
|
-
}
|
|
93
|
+
};
|
|
94
94
|
|
|
95
|
-
|
|
95
|
+
this.preventSpacebarScroll = () => {
|
|
96
96
|
document.onkeypress = function (e) {
|
|
97
97
|
if (!includes(e.target.className, elementClassName)) {
|
|
98
98
|
return true;
|
|
@@ -108,9 +108,9 @@ class InsertFieldModal extends React.PureComponent {
|
|
|
108
108
|
|
|
109
109
|
return true;
|
|
110
110
|
};
|
|
111
|
-
}
|
|
111
|
+
};
|
|
112
112
|
|
|
113
|
-
|
|
113
|
+
this.renderElements = () => {
|
|
114
114
|
const {
|
|
115
115
|
customFields
|
|
116
116
|
} = this.props;
|
|
@@ -144,7 +144,7 @@ class InsertFieldModal extends React.PureComponent {
|
|
|
144
144
|
children: this.drawLabel('content', getFieldName(customField), fieldCode)
|
|
145
145
|
}), fieldCode);
|
|
146
146
|
});
|
|
147
|
-
}
|
|
147
|
+
};
|
|
148
148
|
|
|
149
149
|
this.state = {
|
|
150
150
|
selectedFieldCode: getFieldCode(fields[0])
|
|
@@ -192,8 +192,7 @@ class InsertFieldModal extends React.PureComponent {
|
|
|
192
192
|
}
|
|
193
193
|
|
|
194
194
|
}
|
|
195
|
-
|
|
196
|
-
_defineProperty(InsertFieldModal, "defaultProps", {
|
|
195
|
+
InsertFieldModal.defaultProps = {
|
|
197
196
|
confirmLabel: 'Add',
|
|
198
197
|
customFields: fields,
|
|
199
198
|
disableDoubleClick: false,
|
|
@@ -204,6 +203,6 @@ _defineProperty(InsertFieldModal, "defaultProps", {
|
|
|
204
203
|
shouldCloseOnOverlayClick: true,
|
|
205
204
|
size: sizeOptions[1],
|
|
206
205
|
onSelect: undefined
|
|
207
|
-
}
|
|
206
|
+
};
|
|
208
207
|
|
|
209
208
|
export { InsertFieldModal as default };
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
1
|
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
3
2
|
import { Quill } from 'react-quill';
|
|
4
3
|
|
|
@@ -27,14 +26,10 @@ const Link = Quill.import('formats/link');
|
|
|
27
26
|
class LinkFormat extends Link {
|
|
28
27
|
constructor() {
|
|
29
28
|
super(...arguments);
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
_defineProperty(this, "SANITIZED_URL", 'about:blank');
|
|
36
|
-
|
|
37
|
-
_defineProperty(this, "PROTOCOL_WHITELIST", ['http', 'ftp', 'https', 'mailto', 'tel']);
|
|
29
|
+
this.blotName = 'link';
|
|
30
|
+
this.tagName = 'A';
|
|
31
|
+
this.SANITIZED_URL = 'about:blank';
|
|
32
|
+
this.PROTOCOL_WHITELIST = ['http', 'ftp', 'https', 'mailto', 'tel'];
|
|
38
33
|
}
|
|
39
34
|
|
|
40
35
|
static create(value) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-wysiwygeditor",
|
|
3
|
-
"version": "2.0.0
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - WYSIWYG Editor",
|
|
6
6
|
"module": "./esm/index.js",
|
|
@@ -96,15 +96,17 @@
|
|
|
96
96
|
"build": "node ../../scripts/build/build.js"
|
|
97
97
|
},
|
|
98
98
|
"dependencies": {
|
|
99
|
-
"@elliemae/ds-
|
|
100
|
-
"@elliemae/ds-dropdownmenu": "2.0.0
|
|
101
|
-
"@elliemae/ds-icons": "2.0.0
|
|
102
|
-
"@elliemae/ds-imagelibrarymodal": "2.0.0
|
|
103
|
-
"@elliemae/ds-modal": "2.0.0
|
|
104
|
-
"@elliemae/ds-shared": "2.0.0
|
|
105
|
-
"@elliemae/ds-
|
|
99
|
+
"@elliemae/ds-button": "2.0.0",
|
|
100
|
+
"@elliemae/ds-dropdownmenu": "2.0.0",
|
|
101
|
+
"@elliemae/ds-icons": "2.0.0",
|
|
102
|
+
"@elliemae/ds-imagelibrarymodal": "2.0.0",
|
|
103
|
+
"@elliemae/ds-modal": "2.0.0",
|
|
104
|
+
"@elliemae/ds-shared": "2.0.0",
|
|
105
|
+
"@elliemae/ds-tooltip": "2.0.0",
|
|
106
|
+
"@elliemae/ds-uploader": "2.0.0",
|
|
106
107
|
"prop-types": "~15.7.2",
|
|
107
108
|
"quill-blot-formatter": "~1.0.5",
|
|
109
|
+
"quill-delta": "4.2.2",
|
|
108
110
|
"react-desc": "~4.1.3",
|
|
109
111
|
"react-quill": "2.0.0-beta.2"
|
|
110
112
|
},
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/// <reference path="../../../../shared/typings/react-desc.d.ts" />
|
|
1
2
|
/// <reference types="react" />
|
|
2
3
|
declare const DSWYSIWYGEditor: {
|
|
3
4
|
({ value, onChange, getQuillRef, quillModules, customToolbar, toolbarHandlers, showRawHTML, height, hideItems, ...rest }: {
|
|
@@ -13,19 +14,73 @@ declare const DSWYSIWYGEditor: {
|
|
|
13
14
|
hideItems: any;
|
|
14
15
|
}): JSX.Element;
|
|
15
16
|
propTypes: {
|
|
16
|
-
value:
|
|
17
|
-
onChange:
|
|
18
|
-
getQuillRef:
|
|
19
|
-
|
|
17
|
+
value: import("react-desc").PropTypesDescValidator;
|
|
18
|
+
onChange: import("react-desc").PropTypesDescValidator;
|
|
19
|
+
getQuillRef: {
|
|
20
|
+
defaultValue<T = unknown>(arg: T): {
|
|
21
|
+
deprecated: import("react-desc").PropTypesDescValidator;
|
|
22
|
+
};
|
|
23
|
+
isRequired: import("react-desc").PropTypesDescValidator;
|
|
24
|
+
};
|
|
25
|
+
quillModules: {
|
|
26
|
+
defaultValue<T = unknown>(arg: T): {
|
|
27
|
+
deprecated: import("react-desc").PropTypesDescValidator;
|
|
28
|
+
};
|
|
29
|
+
isRequired: import("react-desc").PropTypesDescValidator;
|
|
30
|
+
};
|
|
31
|
+
customToolbar: {
|
|
32
|
+
defaultValue<T = unknown>(arg: T): {
|
|
33
|
+
deprecated: import("react-desc").PropTypesDescValidator;
|
|
34
|
+
};
|
|
35
|
+
isRequired: import("react-desc").PropTypesDescValidator;
|
|
36
|
+
};
|
|
37
|
+
toolbarHandlers: {
|
|
38
|
+
defaultValue<T = unknown>(arg: T): {
|
|
39
|
+
deprecated: import("react-desc").PropTypesDescValidator;
|
|
40
|
+
};
|
|
41
|
+
isRequired: import("react-desc").PropTypesDescValidator;
|
|
42
|
+
};
|
|
43
|
+
showRawHTML: {
|
|
44
|
+
deprecated: import("react-desc").PropTypesDescValidator;
|
|
45
|
+
};
|
|
46
|
+
height: {
|
|
47
|
+
defaultValue<T = unknown>(arg: T): {
|
|
48
|
+
deprecated: import("react-desc").PropTypesDescValidator;
|
|
49
|
+
};
|
|
50
|
+
isRequired: import("react-desc").PropTypesDescValidator;
|
|
51
|
+
};
|
|
52
|
+
readOnly: {
|
|
53
|
+
defaultValue<T = unknown>(arg: T): {
|
|
54
|
+
deprecated: import("react-desc").PropTypesDescValidator;
|
|
55
|
+
};
|
|
56
|
+
isRequired: import("react-desc").PropTypesDescValidator;
|
|
57
|
+
};
|
|
58
|
+
hideItems: {
|
|
59
|
+
deprecated: import("react-desc").PropTypesDescValidator;
|
|
60
|
+
};
|
|
61
|
+
zIndex: {
|
|
62
|
+
defaultValue<T = unknown>(arg: T): {
|
|
63
|
+
deprecated: import("react-desc").PropTypesDescValidator;
|
|
64
|
+
};
|
|
65
|
+
isRequired: import("react-desc").PropTypesDescValidator;
|
|
66
|
+
};
|
|
67
|
+
};
|
|
68
|
+
};
|
|
69
|
+
declare const WYSIWYWithSchema: {
|
|
70
|
+
(props?: {
|
|
71
|
+
[x: string]: any;
|
|
72
|
+
value?: string | undefined;
|
|
73
|
+
onChange?: (() => null) | undefined;
|
|
74
|
+
getQuillRef?: (() => null) | undefined;
|
|
75
|
+
quillModules?: {} | undefined;
|
|
20
76
|
customToolbar: any;
|
|
21
77
|
toolbarHandlers: any;
|
|
22
|
-
showRawHTML
|
|
78
|
+
showRawHTML?: boolean | undefined;
|
|
23
79
|
height: any;
|
|
24
|
-
readOnly: any;
|
|
25
80
|
hideItems: any;
|
|
26
|
-
|
|
27
|
-
|
|
81
|
+
} | undefined): JSX.Element;
|
|
82
|
+
propTypes: unknown;
|
|
83
|
+
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
28
84
|
};
|
|
29
|
-
declare const WYSIWYWithSchema: any;
|
|
30
85
|
export { WYSIWYWithSchema };
|
|
31
86
|
export default DSWYSIWYGEditor;
|