@elliemae/ds-wysiwygeditor 2.0.0-next.0 → 2.0.0-next.5
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/DSWYSIWYGEditor.js +2 -5
- package/cjs/components/CustomImageUploader.js +2 -1
- package/cjs/components/CustomToolbar.js +1 -0
- package/cjs/components/DSWYSIWYGEditorImpl.js +2 -2
- package/cjs/components/colors.js +2 -2
- package/cjs/components/customFields.js +2 -2
- package/cjs/constants.js +1 -0
- package/cjs/quillOverrides/IndentStyle.js +2 -2
- package/cjs/quillOverrides/LinkFormat.js +3 -2
- package/cjs/utils.js +1 -1
- package/esm/DSWYSIWYGEditor.js +2 -5
- package/esm/components/CustomImageUploader.js +2 -1
- package/esm/components/CustomToolbar.js +1 -0
- package/esm/components/DSWYSIWYGEditorImpl.js +2 -2
- package/esm/components/colors.js +2 -2
- package/esm/components/customFields.js +2 -2
- package/esm/constants.js +1 -0
- package/esm/quillOverrides/IndentStyle.js +2 -2
- package/esm/quillOverrides/LinkFormat.js +3 -2
- package/esm/utils.js +1 -1
- package/package.json +6 -6
- package/cjs/package.json +0 -7
- package/esm/package.json +0 -7
package/cjs/DSWYSIWYGEditor.js
CHANGED
|
@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
6
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
7
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
7
8
|
var React = require('react');
|
|
8
9
|
var reactDesc = require('react-desc');
|
|
9
10
|
var DSWYSIWYGEditorImpl = require('./components/DSWYSIWYGEditorImpl.js');
|
|
@@ -58,11 +59,7 @@ const DSWYSIWYGEditor = _ref => {
|
|
|
58
59
|
|
|
59
60
|
const wysiwygEditorProps = {
|
|
60
61
|
value: reactDesc.PropTypes.string.description('editors value').isRequired,
|
|
61
|
-
onChange: reactDesc.PropTypes.func.description(
|
|
62
|
-
It will be passed the HTML contents of the editor, a delta object expressing the change, the source of the change, and finally a read-only proxy to editor accessors such as getHTML().
|
|
63
|
-
⚠️ Do not use this delta object as value, as it will cause a loop.
|
|
64
|
-
Use editor.getContents() instead. See Using Deltas for details.
|
|
65
|
-
Read more: https://github.com/zenoamaro/react-quill#props`).isRequired,
|
|
62
|
+
onChange: reactDesc.PropTypes.func.description("(content, delta, source, editor) : Called back with the new contents of the editor after change. \n It will be passed the HTML contents of the editor, a delta object expressing the change, the source of the change, and finally a read-only proxy to editor accessors such as getHTML(). \n \u26A0\uFE0F Do not use this delta object as value, as it will cause a loop. \n Use editor.getContents() instead. See Using Deltas for details. \n Read more: https://github.com/zenoamaro/react-quill#props").isRequired,
|
|
66
63
|
getQuillRef: reactDesc.PropTypes.func.description('function to use quill.js ref'),
|
|
67
64
|
quillModules: reactDesc.PropTypes.object.description('object to override quill modules'),
|
|
68
65
|
customToolbar: reactDesc.PropTypes.element.description('custom toolbar'),
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
6
7
|
var React = require('react');
|
|
7
8
|
var Image = require('@elliemae/ds-icons/Image');
|
|
8
9
|
var DSUploader = require('@elliemae/ds-uploader');
|
|
@@ -34,7 +35,7 @@ const CustomImageUploader = ({
|
|
|
34
35
|
index: 0,
|
|
35
36
|
length: 0
|
|
36
37
|
});
|
|
37
|
-
const elementId =
|
|
38
|
+
const elementId = "uploadImage".concat(editorFieldName); // eslint-disable-next-line consistent-return
|
|
38
39
|
|
|
39
40
|
const handleFileChange = async files => {
|
|
40
41
|
if (!inProgress) {
|
|
@@ -6,6 +6,7 @@ var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
|
6
6
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
7
7
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
8
8
|
require('core-js/modules/es.string.replace.js');
|
|
9
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
9
10
|
var React = require('react');
|
|
10
11
|
var DSButton = require('@elliemae/ds-basic/Button');
|
|
11
12
|
var ArrowheadDown = require('@elliemae/ds-icons/ArrowheadDown');
|
|
@@ -52,7 +52,7 @@ class DSWYSIWYGEditorImpl extends React__default["default"].PureComponent {
|
|
|
52
52
|
|
|
53
53
|
_defineProperty__default["default"](this, "quillModules", _objectSpread({
|
|
54
54
|
toolbar: {
|
|
55
|
-
container: this.props.toolbarContainer ?
|
|
55
|
+
container: this.props.toolbarContainer ? "#".concat(this.props.toolbarContainer) : '#toolbar',
|
|
56
56
|
handlers: _objectSpread({}, this.props.toolbarHandlers)
|
|
57
57
|
},
|
|
58
58
|
clipboard: {
|
|
@@ -195,7 +195,7 @@ class DSWYSIWYGEditorImpl extends React__default["default"].PureComponent {
|
|
|
195
195
|
editorProps = _objectWithoutProperties__default["default"](_this$props, _excluded);
|
|
196
196
|
|
|
197
197
|
return /*#__PURE__*/jsxRuntime.jsxs("div", _objectSpread(_objectSpread({}, containerProps), {}, {
|
|
198
|
-
className:
|
|
198
|
+
className: "quill-wysiwyg-editor ".concat(showRawHTML ? 'show-raw' : ''),
|
|
199
199
|
children: [customToolbar || /*#__PURE__*/_jsx__default["default"](CustomToolbar.CustomToolbar, {
|
|
200
200
|
customFields: customFields,
|
|
201
201
|
onShowHTML: onShowHTML,
|
package/cjs/components/colors.js
CHANGED
|
@@ -6,7 +6,7 @@ function sinToHex(i, size, phase) {
|
|
|
6
6
|
const sin = Math.sin(Math.PI / size * 2 * i + phase);
|
|
7
7
|
const int = Math.floor(sin * 127) + 128;
|
|
8
8
|
const hex = int.toString(16);
|
|
9
|
-
return hex.length === 1 ?
|
|
9
|
+
return hex.length === 1 ? "0".concat(hex) : hex;
|
|
10
10
|
}
|
|
11
11
|
|
|
12
12
|
function getRainbowColors(size = 28) {
|
|
@@ -18,7 +18,7 @@ function getRainbowColors(size = 28) {
|
|
|
18
18
|
|
|
19
19
|
const green = sinToHex(idx, size, 2 * Math.PI * 2 / 3); // 240 deg
|
|
20
20
|
|
|
21
|
-
color =
|
|
21
|
+
color = "#".concat(red).concat(green).concat(blue);
|
|
22
22
|
return color;
|
|
23
23
|
});
|
|
24
24
|
}
|
|
@@ -10,9 +10,9 @@ const fields = ['Lender Name «315»', 'Lender Address «319»', 'Lender C
|
|
|
10
10
|
*/
|
|
11
11
|
|
|
12
12
|
const getFields = (customFields = fields) => customFields.map((opt, index) => ({
|
|
13
|
-
id:
|
|
13
|
+
id: "".concat(opt, "_").concat(index),
|
|
14
14
|
// icon: 'ADD',
|
|
15
|
-
label:
|
|
15
|
+
label: "".concat(opt),
|
|
16
16
|
onClick: opt.indexOf('«') !== -1 ? () => undefined.onOptionClick(undefined.getFieldCode(opt)) : null,
|
|
17
17
|
type: opt === '' ? 'separator' : null
|
|
18
18
|
}));
|
package/cjs/constants.js
CHANGED
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
5
6
|
var colors$1 = require('./components/colors.js');
|
|
6
7
|
|
|
7
8
|
const colors = ['#000000', '#e60000', '#ff9900', '#ffff00', '#008A00', '#0066cc', '#9933ff', '#ffffff', '#facccc', '#ffebcc', '#ffffcc', '#cce8cc', '#cce0f5', '#ebd6ff', '#bbbbbb', '#f06666', '#ffc266', '#ffff66', '#66b966', '#66a3e0', '#c285ff', '#888888', '#a10000', '#b26b00', '#b2b200', '#006100', '#0047b2', '#6b24b2', '#444444', '#5c0000', '#663d00', '#666600', '#003700', '#002966', '#3d1466', ...colors$1.getRainbowColors(28)];
|
|
@@ -8,7 +8,7 @@ const multiplier = 2;
|
|
|
8
8
|
|
|
9
9
|
class IndentAttributor extends Parchment.Attributor.Style {
|
|
10
10
|
add(node, value) {
|
|
11
|
-
return super.add(node,
|
|
11
|
+
return super.add(node, "".concat(value * multiplier, "em"));
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
value(node) {
|
|
@@ -23,7 +23,7 @@ class IndentAttributor extends Parchment.Attributor.Style {
|
|
|
23
23
|
|
|
24
24
|
const IndentStyle = new IndentAttributor('indent', 'margin-left', {
|
|
25
25
|
scope: Parchment.Scope.BLOCK,
|
|
26
|
-
whitelist: levels.map(value =>
|
|
26
|
+
whitelist: levels.map(value => "".concat(value * multiplier, "em"))
|
|
27
27
|
});
|
|
28
28
|
|
|
29
29
|
module.exports = IndentStyle;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
4
5
|
var ReactQuill = require('react-quill');
|
|
5
6
|
|
|
6
7
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -13,8 +14,8 @@ const sanitizeProtocol = value => {
|
|
|
13
14
|
|
|
14
15
|
if (!value.startsWith('http') && !value.startsWith('ftp') && !value.startsWith('mailto:') && !value.startsWith('{{')) {
|
|
15
16
|
if (!value.startsWith('www')) {
|
|
16
|
-
newVal =
|
|
17
|
-
} else newVal =
|
|
17
|
+
newVal = "https://www.".concat(value);
|
|
18
|
+
} else newVal = "https://".concat(value);
|
|
18
19
|
}
|
|
19
20
|
|
|
20
21
|
return newVal;
|
package/cjs/utils.js
CHANGED
package/esm/DSWYSIWYGEditor.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
2
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
3
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
3
4
|
import { useState, useEffect } from 'react';
|
|
4
5
|
import { PropTypes, describe } from 'react-desc';
|
|
5
6
|
import DSWYSIWYGEditorImpl from './components/DSWYSIWYGEditorImpl.js';
|
|
@@ -49,11 +50,7 @@ const DSWYSIWYGEditor = _ref => {
|
|
|
49
50
|
|
|
50
51
|
const wysiwygEditorProps = {
|
|
51
52
|
value: PropTypes.string.description('editors value').isRequired,
|
|
52
|
-
onChange: PropTypes.func.description(
|
|
53
|
-
It will be passed the HTML contents of the editor, a delta object expressing the change, the source of the change, and finally a read-only proxy to editor accessors such as getHTML().
|
|
54
|
-
⚠️ Do not use this delta object as value, as it will cause a loop.
|
|
55
|
-
Use editor.getContents() instead. See Using Deltas for details.
|
|
56
|
-
Read more: https://github.com/zenoamaro/react-quill#props`).isRequired,
|
|
53
|
+
onChange: PropTypes.func.description("(content, delta, source, editor) : Called back with the new contents of the editor after change. \n It will be passed the HTML contents of the editor, a delta object expressing the change, the source of the change, and finally a read-only proxy to editor accessors such as getHTML(). \n \u26A0\uFE0F Do not use this delta object as value, as it will cause a loop. \n Use editor.getContents() instead. See Using Deltas for details. \n Read more: https://github.com/zenoamaro/react-quill#props").isRequired,
|
|
57
54
|
getQuillRef: PropTypes.func.description('function to use quill.js ref'),
|
|
58
55
|
quillModules: PropTypes.object.description('object to override quill modules'),
|
|
59
56
|
customToolbar: PropTypes.element.description('custom toolbar'),
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
2
3
|
import { useState } from 'react';
|
|
3
4
|
import Image from '@elliemae/ds-icons/Image';
|
|
4
5
|
import DSUploader from '@elliemae/ds-uploader';
|
|
@@ -23,7 +24,7 @@ const CustomImageUploader = ({
|
|
|
23
24
|
index: 0,
|
|
24
25
|
length: 0
|
|
25
26
|
});
|
|
26
|
-
const elementId =
|
|
27
|
+
const elementId = "uploadImage".concat(editorFieldName); // eslint-disable-next-line consistent-return
|
|
27
28
|
|
|
28
29
|
const handleFileChange = async files => {
|
|
29
30
|
if (!inProgress) {
|
|
@@ -2,6 +2,7 @@ import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
|
2
2
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
3
3
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
4
4
|
import 'core-js/modules/es.string.replace.js';
|
|
5
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
5
6
|
import { useState } from 'react';
|
|
6
7
|
import DSButton from '@elliemae/ds-basic/Button';
|
|
7
8
|
import ArrowheadDown from '@elliemae/ds-icons/ArrowheadDown';
|
|
@@ -41,7 +41,7 @@ class DSWYSIWYGEditorImpl extends React.PureComponent {
|
|
|
41
41
|
|
|
42
42
|
_defineProperty(this, "quillModules", _objectSpread({
|
|
43
43
|
toolbar: {
|
|
44
|
-
container: this.props.toolbarContainer ?
|
|
44
|
+
container: this.props.toolbarContainer ? "#".concat(this.props.toolbarContainer) : '#toolbar',
|
|
45
45
|
handlers: _objectSpread({}, this.props.toolbarHandlers)
|
|
46
46
|
},
|
|
47
47
|
clipboard: {
|
|
@@ -184,7 +184,7 @@ class DSWYSIWYGEditorImpl extends React.PureComponent {
|
|
|
184
184
|
editorProps = _objectWithoutProperties(_this$props, _excluded);
|
|
185
185
|
|
|
186
186
|
return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, containerProps), {}, {
|
|
187
|
-
className:
|
|
187
|
+
className: "quill-wysiwyg-editor ".concat(showRawHTML ? 'show-raw' : ''),
|
|
188
188
|
children: [customToolbar || /*#__PURE__*/_jsx(CustomToolbar, {
|
|
189
189
|
customFields: customFields,
|
|
190
190
|
onShowHTML: onShowHTML,
|
package/esm/components/colors.js
CHANGED
|
@@ -2,7 +2,7 @@ function sinToHex(i, size, phase) {
|
|
|
2
2
|
const sin = Math.sin(Math.PI / size * 2 * i + phase);
|
|
3
3
|
const int = Math.floor(sin * 127) + 128;
|
|
4
4
|
const hex = int.toString(16);
|
|
5
|
-
return hex.length === 1 ?
|
|
5
|
+
return hex.length === 1 ? "0".concat(hex) : hex;
|
|
6
6
|
}
|
|
7
7
|
|
|
8
8
|
function getRainbowColors(size = 28) {
|
|
@@ -14,7 +14,7 @@ function getRainbowColors(size = 28) {
|
|
|
14
14
|
|
|
15
15
|
const green = sinToHex(idx, size, 2 * Math.PI * 2 / 3); // 240 deg
|
|
16
16
|
|
|
17
|
-
color =
|
|
17
|
+
color = "#".concat(red).concat(green).concat(blue);
|
|
18
18
|
return color;
|
|
19
19
|
});
|
|
20
20
|
}
|
|
@@ -6,9 +6,9 @@ const fields = ['Lender Name «315»', 'Lender Address «319»', 'Lender C
|
|
|
6
6
|
*/
|
|
7
7
|
|
|
8
8
|
const getFields = (customFields = fields) => customFields.map((opt, index) => ({
|
|
9
|
-
id:
|
|
9
|
+
id: "".concat(opt, "_").concat(index),
|
|
10
10
|
// icon: 'ADD',
|
|
11
|
-
label:
|
|
11
|
+
label: "".concat(opt),
|
|
12
12
|
onClick: opt.indexOf('«') !== -1 ? () => undefined.onOptionClick(undefined.getFieldCode(opt)) : null,
|
|
13
13
|
type: opt === '' ? 'separator' : null
|
|
14
14
|
}));
|
package/esm/constants.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
1
2
|
import { getRainbowColors } from './components/colors.js';
|
|
2
3
|
|
|
3
4
|
const colors = ['#000000', '#e60000', '#ff9900', '#ffff00', '#008A00', '#0066cc', '#9933ff', '#ffffff', '#facccc', '#ffebcc', '#ffffcc', '#cce8cc', '#cce0f5', '#ebd6ff', '#bbbbbb', '#f06666', '#ffc266', '#ffff66', '#66b966', '#66a3e0', '#c285ff', '#888888', '#a10000', '#b26b00', '#b2b200', '#006100', '#0047b2', '#6b24b2', '#444444', '#5c0000', '#663d00', '#666600', '#003700', '#002966', '#3d1466', ...getRainbowColors(28)];
|
|
@@ -6,7 +6,7 @@ const multiplier = 2;
|
|
|
6
6
|
|
|
7
7
|
class IndentAttributor extends Parchment.Attributor.Style {
|
|
8
8
|
add(node, value) {
|
|
9
|
-
return super.add(node,
|
|
9
|
+
return super.add(node, "".concat(value * multiplier, "em"));
|
|
10
10
|
}
|
|
11
11
|
|
|
12
12
|
value(node) {
|
|
@@ -21,7 +21,7 @@ class IndentAttributor extends Parchment.Attributor.Style {
|
|
|
21
21
|
|
|
22
22
|
const IndentStyle = new IndentAttributor('indent', 'margin-left', {
|
|
23
23
|
scope: Parchment.Scope.BLOCK,
|
|
24
|
-
whitelist: levels.map(value =>
|
|
24
|
+
whitelist: levels.map(value => "".concat(value * multiplier, "em"))
|
|
25
25
|
});
|
|
26
26
|
|
|
27
27
|
export { IndentStyle as default };
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
2
3
|
import { Quill } from 'react-quill';
|
|
3
4
|
|
|
4
5
|
const sanitizeProtocol = value => {
|
|
@@ -7,8 +8,8 @@ const sanitizeProtocol = value => {
|
|
|
7
8
|
|
|
8
9
|
if (!value.startsWith('http') && !value.startsWith('ftp') && !value.startsWith('mailto:') && !value.startsWith('{{')) {
|
|
9
10
|
if (!value.startsWith('www')) {
|
|
10
|
-
newVal =
|
|
11
|
-
} else newVal =
|
|
11
|
+
newVal = "https://www.".concat(value);
|
|
12
|
+
} else newVal = "https://".concat(value);
|
|
12
13
|
}
|
|
13
14
|
|
|
14
15
|
return newVal;
|
package/esm/utils.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-wysiwygeditor",
|
|
3
|
-
"version": "2.0.0-next.
|
|
3
|
+
"version": "2.0.0-next.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - WYSIWYG Editor",
|
|
6
6
|
"module": "./esm/index.js",
|
|
@@ -84,11 +84,11 @@
|
|
|
84
84
|
"build": "node ../../scripts/build/build.js"
|
|
85
85
|
},
|
|
86
86
|
"dependencies": {
|
|
87
|
-
"@elliemae/ds-basic": "2.0.0-next.
|
|
88
|
-
"@elliemae/ds-classnames": "2.0.0-next.
|
|
89
|
-
"@elliemae/ds-imagelibrarymodal": "2.0.0-next.
|
|
90
|
-
"@elliemae/ds-shared": "2.0.0-next.
|
|
91
|
-
"@elliemae/ds-uploader": "2.0.0-next.
|
|
87
|
+
"@elliemae/ds-basic": "2.0.0-next.5",
|
|
88
|
+
"@elliemae/ds-classnames": "2.0.0-next.5",
|
|
89
|
+
"@elliemae/ds-imagelibrarymodal": "2.0.0-next.5",
|
|
90
|
+
"@elliemae/ds-shared": "2.0.0-next.5",
|
|
91
|
+
"@elliemae/ds-uploader": "2.0.0-next.5",
|
|
92
92
|
"immutable": "4.0.0-rc.14",
|
|
93
93
|
"quill-blot-formatter": "~1.0.5",
|
|
94
94
|
"react-quill": "2.0.0-beta1"
|
package/cjs/package.json
DELETED