@jotforminc/dnd-builder 3.4.2 → 3.4.3
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/CHANGELOG.md +2 -0
- package/lib/cjs/components/TextEditor/QuillEditor.js +8 -10
- package/lib/cjs/components/TextEditor/QuillEditor.js.map +1 -1
- package/lib/cjs/components/TextEditor/TextEditor.js +2 -10
- package/lib/cjs/components/TextEditor/TextEditor.js.map +1 -1
- package/lib/esm/components/TextEditor/QuillEditor.js +8 -10
- package/lib/esm/components/TextEditor/QuillEditor.js.map +1 -1
- package/lib/esm/components/TextEditor/TextEditor.js +3 -11
- package/lib/esm/components/TextEditor/TextEditor.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See [commit-and-tag-version](https://github.com/absolute-version/commit-and-tag-version) for commit guidelines.
|
|
4
4
|
|
|
5
|
+
## [3.4.3](https://github.com/jotform/dnd-builder/compare/v3.4.1...v3.4.3) (2026-02-20)
|
|
6
|
+
|
|
5
7
|
## [3.4.2](https://github.com/jotform/dnd-builder/compare/v3.4.1...v3.4.2) (2026-02-20)
|
|
6
8
|
|
|
7
9
|
## [3.4.1](https://github.com/jotform/dnd-builder/compare/v3.5.0...v3.4.1) (2026-02-19)
|
|
@@ -58,10 +58,12 @@ var QuillEditor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
58
58
|
|
|
59
59
|
_this = _super.call(this, props);
|
|
60
60
|
|
|
61
|
-
_defineProperty(_assertThisInitialized(_this), "
|
|
61
|
+
_defineProperty(_assertThisInitialized(_this), "saveAndQuit", function () {
|
|
62
62
|
var _this$props = _this.props,
|
|
63
63
|
content = _this$props.content,
|
|
64
|
-
handleSave = _this$props.handleSave
|
|
64
|
+
handleSave = _this$props.handleSave,
|
|
65
|
+
setIsTextEditorOpen = _this$props.setIsTextEditorOpen;
|
|
66
|
+
setIsTextEditorOpen(false);
|
|
65
67
|
handleSave(content);
|
|
66
68
|
});
|
|
67
69
|
|
|
@@ -69,11 +71,7 @@ var QuillEditor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
69
71
|
e.stopPropagation();
|
|
70
72
|
|
|
71
73
|
if (e.keyCode === 27) {
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
_this.save();
|
|
75
|
-
|
|
76
|
-
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
74
|
+
_this.saveAndQuit();
|
|
77
75
|
}
|
|
78
76
|
});
|
|
79
77
|
|
|
@@ -100,7 +98,7 @@ var QuillEditor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
100
98
|
}, {
|
|
101
99
|
key: "componentWillUnmount",
|
|
102
100
|
value: function componentWillUnmount() {
|
|
103
|
-
this.
|
|
101
|
+
this.saveAndQuit();
|
|
104
102
|
}
|
|
105
103
|
}, {
|
|
106
104
|
key: "render",
|
|
@@ -132,9 +130,9 @@ QuillEditor.formats = textEditorConstants.formats;
|
|
|
132
130
|
QuillEditor.propTypes = {
|
|
133
131
|
content: PropTypes__default['default'].string,
|
|
134
132
|
handleSave: PropTypes__default['default'].func,
|
|
135
|
-
onClose: PropTypes__default['default'].func,
|
|
136
133
|
placeholder: PropTypes__default['default'].string.isRequired,
|
|
137
|
-
setContent: PropTypes__default['default'].func
|
|
134
|
+
setContent: PropTypes__default['default'].func,
|
|
135
|
+
setIsTextEditorOpen: PropTypes__default['default'].func
|
|
138
136
|
};
|
|
139
137
|
|
|
140
138
|
module.exports = QuillEditor;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuillEditor.js","sources":["../../../../src/components/TextEditor/QuillEditor.js"],"sourcesContent":["import React from 'react';\nimport ReactQuill from 'react-quill';\nimport domPurify from 'dompurify';\nimport PropTypes from 'prop-types';\nimport { formats, modules } from './textEditorConstants';\nimport { fontSizes } from '../../constants/fonts';\nimport 'react-quill/dist/quill.snow.css';\n\nconst Size = ReactQuill.Quill.import('attributors/style/size');\nSize.whitelist = fontSizes.map(s => `${s}px`);\nReactQuill.Quill.register(Size, true);\n\nclass QuillEditor extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.quill = React.createRef();\n }\n\n componentDidMount() {\n if (this.quill.current !== null) {\n const { content } = this.props;\n const editor = this.quill.current.getEditor();\n editor.setSelection(0, content.length);\n }\n }\n\n componentWillUnmount() {\n this.
|
|
1
|
+
{"version":3,"file":"QuillEditor.js","sources":["../../../../src/components/TextEditor/QuillEditor.js"],"sourcesContent":["import React from 'react';\nimport ReactQuill from 'react-quill';\nimport domPurify from 'dompurify';\nimport PropTypes from 'prop-types';\nimport { formats, modules } from './textEditorConstants';\nimport { fontSizes } from '../../constants/fonts';\nimport 'react-quill/dist/quill.snow.css';\n\nconst Size = ReactQuill.Quill.import('attributors/style/size');\nSize.whitelist = fontSizes.map(s => `${s}px`);\nReactQuill.Quill.register(Size, true);\n\nclass QuillEditor extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.quill = React.createRef();\n }\n\n componentDidMount() {\n if (this.quill.current !== null) {\n const { content } = this.props;\n const editor = this.quill.current.getEditor();\n editor.setSelection(0, content.length);\n }\n }\n\n componentWillUnmount() {\n this.saveAndQuit();\n }\n\n saveAndQuit = () => {\n const { content, handleSave, setIsTextEditorOpen } = this.props;\n setIsTextEditorOpen(false);\n handleSave(content);\n }\n\n handleKeyDown = e => {\n e.stopPropagation();\n if (e.keyCode === 27) {\n this.saveAndQuit();\n }\n }\n\n handleSetContent = (value, delta, source) => {\n if (source === 'user') {\n const { setContent } = this.props;\n setContent(domPurify.sanitize(value));\n }\n }\n\n render() {\n const { content, placeholder } = this.props;\n\n return (\n <div\n className=\"f-all\"\n onKeyDown={this.handleKeyDown}\n >\n <ReactQuill\n ref={this.quill}\n formats={QuillEditor.formats}\n modules={QuillEditor.modules}\n onChange={this.handleSetContent}\n placeholder={placeholder}\n preserveWhitespace\n value={content}\n />\n </div>\n );\n }\n}\n\nQuillEditor.modules = modules;\nQuillEditor.formats = formats;\n\nQuillEditor.propTypes = {\n content: PropTypes.string,\n handleSave: PropTypes.func,\n placeholder: PropTypes.string.isRequired,\n setContent: PropTypes.func,\n setIsTextEditorOpen: PropTypes.func,\n};\n\nexport default QuillEditor;\n"],"names":["Size","ReactQuill","Quill","import","whitelist","fontSizes","map","s","register","QuillEditor","props","content","handleSave","setIsTextEditorOpen","e","stopPropagation","keyCode","saveAndQuit","value","delta","source","setContent","domPurify","sanitize","quill","React","createRef","current","editor","getEditor","setSelection","length","placeholder","_jsx","handleKeyDown","formats","modules","handleSetContent","PureComponent","propTypes","PropTypes","string","func","isRequired"],"mappings":"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"}
|
|
@@ -47,19 +47,11 @@ var TextEditor = function TextEditor(_ref) {
|
|
|
47
47
|
var setIsTextEditorOpen = BuilderContext.useBuilderStore(function (state) {
|
|
48
48
|
return state.setIsTextEditorOpen;
|
|
49
49
|
});
|
|
50
|
-
React.useEffect(function () {
|
|
51
|
-
if (isTextEditorOpen && !isSelected) {
|
|
52
|
-
setIsTextEditorOpen(false);
|
|
53
|
-
}
|
|
54
|
-
}, [isSelected, isTextEditorOpen, setIsTextEditorOpen]);
|
|
55
50
|
var onClick = React.useCallback(function () {
|
|
56
51
|
if (isSelected && !isLocked) {
|
|
57
52
|
setIsTextEditorOpen(true);
|
|
58
53
|
}
|
|
59
54
|
}, [isSelected, isLocked, setIsTextEditorOpen]);
|
|
60
|
-
var onClose = React.useCallback(function () {
|
|
61
|
-
setIsTextEditorOpen(false);
|
|
62
|
-
}, [setIsTextEditorOpen]);
|
|
63
55
|
var isNotEmpty = React.useMemo(function () {
|
|
64
56
|
var el = document.createElement('div');
|
|
65
57
|
el.innerHTML = _content;
|
|
@@ -68,9 +60,9 @@ var TextEditor = function TextEditor(_ref) {
|
|
|
68
60
|
return isSelected && isTextEditorOpen ? /*#__PURE__*/jsxRuntime.jsx(QuillEditor, {
|
|
69
61
|
content: _content,
|
|
70
62
|
handleSave: handleSave,
|
|
71
|
-
onClose: onClose,
|
|
72
63
|
placeholder: placeholder,
|
|
73
|
-
setContent: setContent
|
|
64
|
+
setContent: setContent,
|
|
65
|
+
setIsTextEditorOpen: setIsTextEditorOpen
|
|
74
66
|
}) : /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
75
67
|
className: "f-all ql-editor".concat(isNotEmpty ? '' : ' isEmptyTextElement'),
|
|
76
68
|
dangerouslySetInnerHTML: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextEditor.js","sources":["../../../../src/components/TextEditor/TextEditor.js"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"TextEditor.js","sources":["../../../../src/components/TextEditor/TextEditor.js"],"sourcesContent":["import { useCallback, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport domPurify from 'dompurify';\nimport QuillEditor from './QuillEditor';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropState } from '../../utils/hooks';\n\nconst TextEditor = ({\n content = '',\n handleSave = () => {},\n isLocked = false,\n isSelected = false,\n placeholder,\n}) => {\n const [_content, setContent] = usePropState(content, domPurify.sanitize);\n\n const isTextEditorOpen = useBuilderStore(state => state.isTextEditorOpen);\n const setIsTextEditorOpen = useBuilderStore(state => state.setIsTextEditorOpen);\n\n const onClick = useCallback(() => {\n if (isSelected && !isLocked) {\n setIsTextEditorOpen(true);\n }\n }, [isSelected, isLocked, setIsTextEditorOpen]);\n\n const isNotEmpty = useMemo(() => {\n const el = document.createElement('div');\n el.innerHTML = _content;\n return !!el.innerText;\n }, [_content]);\n\n return isSelected && isTextEditorOpen ? (\n <QuillEditor\n content={_content}\n handleSave={handleSave}\n placeholder={placeholder}\n setContent={setContent}\n setIsTextEditorOpen={setIsTextEditorOpen}\n />\n ) : (\n <div\n className={`f-all ql-editor${isNotEmpty ? '' : ' isEmptyTextElement'}`}\n dangerouslySetInnerHTML={{\n __html: isNotEmpty ? _content : placeholder,\n }}\n onClick={onClick}\n onKeyDown={() => {}}\n />\n );\n};\n\nTextEditor.propTypes = {\n content: PropTypes.string,\n handleSave: PropTypes.func,\n isLocked: PropTypes.bool,\n isSelected: PropTypes.bool,\n placeholder: PropTypes.string.isRequired,\n};\n\nexport default TextEditor;\n"],"names":["TextEditor","content","handleSave","isLocked","isSelected","placeholder","usePropState","domPurify","sanitize","_content","setContent","isTextEditorOpen","useBuilderStore","state","setIsTextEditorOpen","onClick","useCallback","isNotEmpty","useMemo","el","document","createElement","innerHTML","innerText","_jsx","__html","propTypes","PropTypes","string","func","bool","isRequired"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;IAOMA,UAAU,GAAG,SAAbA,UAAa,OAMb;AAAA,0BALJC,OAKI;AAAA,MALJA,OAKI,6BALM,EAKN;AAAA,6BAJJC,UAII;AAAA,MAJJA,UAII,gCAJS,YAAM,EAIf;AAAA,2BAHJC,QAGI;AAAA,MAHJA,QAGI,8BAHO,KAGP;AAAA,6BAFJC,UAEI;AAAA,MAFJA,UAEI,gCAFS,KAET;AAAA,MADJC,WACI,QADJA,WACI;;AACJ,sBAA+BC,kBAAY,CAACL,OAAD,EAAUM,6BAAS,CAACC,QAApB,CAA3C;AAAA;AAAA,MAAOC,QAAP;AAAA,MAAiBC,UAAjB;;AAEA,MAAMC,gBAAgB,GAAGC,8BAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,gBAAV;AAAA,GAAN,CAAxC;AACA,MAAMG,mBAAmB,GAAGF,8BAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,mBAAV;AAAA,GAAN,CAA3C;AAEA,MAAMC,OAAO,GAAGC,iBAAW,CAAC,YAAM;AAChC,QAAIZ,UAAU,IAAI,CAACD,QAAnB,EAA6B;AAC3BW,MAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD;AACF,GAJ0B,EAIxB,CAACV,UAAD,EAAaD,QAAb,EAAuBW,mBAAvB,CAJwB,CAA3B;AAMA,MAAMG,UAAU,GAAGC,aAAO,CAAC,YAAM;AAC/B,QAAMC,EAAE,GAAGC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAX;AACAF,IAAAA,EAAE,CAACG,SAAH,GAAeb,QAAf;AACA,WAAO,CAAC,CAACU,EAAE,CAACI,SAAZ;AACD,GAJyB,EAIvB,CAACd,QAAD,CAJuB,CAA1B;AAMA,SAAOL,UAAU,IAAIO,gBAAd,gBACLa,eAAC,WAAD;AACE,IAAA,OAAO,EAAEf,QADX;AAEE,IAAA,UAAU,EAAEP,UAFd;AAGE,IAAA,WAAW,EAAEG,WAHf;AAIE,IAAA,UAAU,EAAEK,UAJd;AAKE,IAAA,mBAAmB,EAAEI;AALvB,IADK,gBASLU;AACE,IAAA,SAAS,2BAAoBP,UAAU,GAAG,EAAH,GAAQ,qBAAtC,CADX;AAEE,IAAA,uBAAuB,EAAE;AACvBQ,MAAAA,MAAM,EAAER,UAAU,GAAGR,QAAH,GAAcJ;AADT,KAF3B;AAKE,IAAA,OAAO,EAAEU,OALX;AAME,IAAA,SAAS,EAAE,qBAAM;AANnB,IATF;AAkBD;;AAEDf,UAAU,CAAC0B,SAAX,GAAuB;AACrBzB,EAAAA,OAAO,EAAE0B,6BAAS,CAACC,MADE;AAErB1B,EAAAA,UAAU,EAAEyB,6BAAS,CAACE,IAFD;AAGrB1B,EAAAA,QAAQ,EAAEwB,6BAAS,CAACG,IAHC;AAIrB1B,EAAAA,UAAU,EAAEuB,6BAAS,CAACG,IAJD;AAKrBzB,EAAAA,WAAW,EAAEsB,6BAAS,CAACC,MAAV,CAAiBG;AALT,CAAvB;;;;"}
|
|
@@ -49,10 +49,12 @@ var QuillEditor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
49
49
|
|
|
50
50
|
_this = _super.call(this, props);
|
|
51
51
|
|
|
52
|
-
_defineProperty(_assertThisInitialized(_this), "
|
|
52
|
+
_defineProperty(_assertThisInitialized(_this), "saveAndQuit", function () {
|
|
53
53
|
var _this$props = _this.props,
|
|
54
54
|
content = _this$props.content,
|
|
55
|
-
handleSave = _this$props.handleSave
|
|
55
|
+
handleSave = _this$props.handleSave,
|
|
56
|
+
setIsTextEditorOpen = _this$props.setIsTextEditorOpen;
|
|
57
|
+
setIsTextEditorOpen(false);
|
|
56
58
|
handleSave(content);
|
|
57
59
|
});
|
|
58
60
|
|
|
@@ -60,11 +62,7 @@ var QuillEditor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
60
62
|
e.stopPropagation();
|
|
61
63
|
|
|
62
64
|
if (e.keyCode === 27) {
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
_this.save();
|
|
66
|
-
|
|
67
|
-
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
65
|
+
_this.saveAndQuit();
|
|
68
66
|
}
|
|
69
67
|
});
|
|
70
68
|
|
|
@@ -91,7 +89,7 @@ var QuillEditor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
91
89
|
}, {
|
|
92
90
|
key: "componentWillUnmount",
|
|
93
91
|
value: function componentWillUnmount() {
|
|
94
|
-
this.
|
|
92
|
+
this.saveAndQuit();
|
|
95
93
|
}
|
|
96
94
|
}, {
|
|
97
95
|
key: "render",
|
|
@@ -123,9 +121,9 @@ QuillEditor.formats = formats;
|
|
|
123
121
|
QuillEditor.propTypes = {
|
|
124
122
|
content: PropTypes.string,
|
|
125
123
|
handleSave: PropTypes.func,
|
|
126
|
-
onClose: PropTypes.func,
|
|
127
124
|
placeholder: PropTypes.string.isRequired,
|
|
128
|
-
setContent: PropTypes.func
|
|
125
|
+
setContent: PropTypes.func,
|
|
126
|
+
setIsTextEditorOpen: PropTypes.func
|
|
129
127
|
};
|
|
130
128
|
|
|
131
129
|
export default QuillEditor;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuillEditor.js","sources":["../../../../src/components/TextEditor/QuillEditor.js"],"sourcesContent":["import React from 'react';\nimport ReactQuill from 'react-quill';\nimport domPurify from 'dompurify';\nimport PropTypes from 'prop-types';\nimport { formats, modules } from './textEditorConstants';\nimport { fontSizes } from '../../constants/fonts';\nimport 'react-quill/dist/quill.snow.css';\n\nconst Size = ReactQuill.Quill.import('attributors/style/size');\nSize.whitelist = fontSizes.map(s => `${s}px`);\nReactQuill.Quill.register(Size, true);\n\nclass QuillEditor extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.quill = React.createRef();\n }\n\n componentDidMount() {\n if (this.quill.current !== null) {\n const { content } = this.props;\n const editor = this.quill.current.getEditor();\n editor.setSelection(0, content.length);\n }\n }\n\n componentWillUnmount() {\n this.
|
|
1
|
+
{"version":3,"file":"QuillEditor.js","sources":["../../../../src/components/TextEditor/QuillEditor.js"],"sourcesContent":["import React from 'react';\nimport ReactQuill from 'react-quill';\nimport domPurify from 'dompurify';\nimport PropTypes from 'prop-types';\nimport { formats, modules } from './textEditorConstants';\nimport { fontSizes } from '../../constants/fonts';\nimport 'react-quill/dist/quill.snow.css';\n\nconst Size = ReactQuill.Quill.import('attributors/style/size');\nSize.whitelist = fontSizes.map(s => `${s}px`);\nReactQuill.Quill.register(Size, true);\n\nclass QuillEditor extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.quill = React.createRef();\n }\n\n componentDidMount() {\n if (this.quill.current !== null) {\n const { content } = this.props;\n const editor = this.quill.current.getEditor();\n editor.setSelection(0, content.length);\n }\n }\n\n componentWillUnmount() {\n this.saveAndQuit();\n }\n\n saveAndQuit = () => {\n const { content, handleSave, setIsTextEditorOpen } = this.props;\n setIsTextEditorOpen(false);\n handleSave(content);\n }\n\n handleKeyDown = e => {\n e.stopPropagation();\n if (e.keyCode === 27) {\n this.saveAndQuit();\n }\n }\n\n handleSetContent = (value, delta, source) => {\n if (source === 'user') {\n const { setContent } = this.props;\n setContent(domPurify.sanitize(value));\n }\n }\n\n render() {\n const { content, placeholder } = this.props;\n\n return (\n <div\n className=\"f-all\"\n onKeyDown={this.handleKeyDown}\n >\n <ReactQuill\n ref={this.quill}\n formats={QuillEditor.formats}\n modules={QuillEditor.modules}\n onChange={this.handleSetContent}\n placeholder={placeholder}\n preserveWhitespace\n value={content}\n />\n </div>\n );\n }\n}\n\nQuillEditor.modules = modules;\nQuillEditor.formats = formats;\n\nQuillEditor.propTypes = {\n content: PropTypes.string,\n handleSave: PropTypes.func,\n placeholder: PropTypes.string.isRequired,\n setContent: PropTypes.func,\n setIsTextEditorOpen: PropTypes.func,\n};\n\nexport default QuillEditor;\n"],"names":["Size","ReactQuill","Quill","import","whitelist","fontSizes","map","s","register","QuillEditor","props","content","handleSave","setIsTextEditorOpen","e","stopPropagation","keyCode","saveAndQuit","value","delta","source","setContent","domPurify","sanitize","quill","React","createRef","current","editor","getEditor","setSelection","length","placeholder","_jsx","handleKeyDown","formats","modules","handleSetContent","PureComponent","propTypes","PropTypes","string","func","isRequired"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { useCallback, useMemo } from 'react';
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import domPurify from 'dompurify';
|
|
4
4
|
import QuillEditor from './QuillEditor.js';
|
|
@@ -40,19 +40,11 @@ var TextEditor = function TextEditor(_ref) {
|
|
|
40
40
|
var setIsTextEditorOpen = useBuilderStore(function (state) {
|
|
41
41
|
return state.setIsTextEditorOpen;
|
|
42
42
|
});
|
|
43
|
-
useEffect(function () {
|
|
44
|
-
if (isTextEditorOpen && !isSelected) {
|
|
45
|
-
setIsTextEditorOpen(false);
|
|
46
|
-
}
|
|
47
|
-
}, [isSelected, isTextEditorOpen, setIsTextEditorOpen]);
|
|
48
43
|
var onClick = useCallback(function () {
|
|
49
44
|
if (isSelected && !isLocked) {
|
|
50
45
|
setIsTextEditorOpen(true);
|
|
51
46
|
}
|
|
52
47
|
}, [isSelected, isLocked, setIsTextEditorOpen]);
|
|
53
|
-
var onClose = useCallback(function () {
|
|
54
|
-
setIsTextEditorOpen(false);
|
|
55
|
-
}, [setIsTextEditorOpen]);
|
|
56
48
|
var isNotEmpty = useMemo(function () {
|
|
57
49
|
var el = document.createElement('div');
|
|
58
50
|
el.innerHTML = _content;
|
|
@@ -61,9 +53,9 @@ var TextEditor = function TextEditor(_ref) {
|
|
|
61
53
|
return isSelected && isTextEditorOpen ? /*#__PURE__*/jsx(QuillEditor, {
|
|
62
54
|
content: _content,
|
|
63
55
|
handleSave: handleSave,
|
|
64
|
-
onClose: onClose,
|
|
65
56
|
placeholder: placeholder,
|
|
66
|
-
setContent: setContent
|
|
57
|
+
setContent: setContent,
|
|
58
|
+
setIsTextEditorOpen: setIsTextEditorOpen
|
|
67
59
|
}) : /*#__PURE__*/jsx("div", {
|
|
68
60
|
className: "f-all ql-editor".concat(isNotEmpty ? '' : ' isEmptyTextElement'),
|
|
69
61
|
dangerouslySetInnerHTML: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextEditor.js","sources":["../../../../src/components/TextEditor/TextEditor.js"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"TextEditor.js","sources":["../../../../src/components/TextEditor/TextEditor.js"],"sourcesContent":["import { useCallback, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport domPurify from 'dompurify';\nimport QuillEditor from './QuillEditor';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropState } from '../../utils/hooks';\n\nconst TextEditor = ({\n content = '',\n handleSave = () => {},\n isLocked = false,\n isSelected = false,\n placeholder,\n}) => {\n const [_content, setContent] = usePropState(content, domPurify.sanitize);\n\n const isTextEditorOpen = useBuilderStore(state => state.isTextEditorOpen);\n const setIsTextEditorOpen = useBuilderStore(state => state.setIsTextEditorOpen);\n\n const onClick = useCallback(() => {\n if (isSelected && !isLocked) {\n setIsTextEditorOpen(true);\n }\n }, [isSelected, isLocked, setIsTextEditorOpen]);\n\n const isNotEmpty = useMemo(() => {\n const el = document.createElement('div');\n el.innerHTML = _content;\n return !!el.innerText;\n }, [_content]);\n\n return isSelected && isTextEditorOpen ? (\n <QuillEditor\n content={_content}\n handleSave={handleSave}\n placeholder={placeholder}\n setContent={setContent}\n setIsTextEditorOpen={setIsTextEditorOpen}\n />\n ) : (\n <div\n className={`f-all ql-editor${isNotEmpty ? '' : ' isEmptyTextElement'}`}\n dangerouslySetInnerHTML={{\n __html: isNotEmpty ? _content : placeholder,\n }}\n onClick={onClick}\n onKeyDown={() => {}}\n />\n );\n};\n\nTextEditor.propTypes = {\n content: PropTypes.string,\n handleSave: PropTypes.func,\n isLocked: PropTypes.bool,\n isSelected: PropTypes.bool,\n placeholder: PropTypes.string.isRequired,\n};\n\nexport default TextEditor;\n"],"names":["TextEditor","content","handleSave","isLocked","isSelected","placeholder","usePropState","domPurify","sanitize","_content","setContent","isTextEditorOpen","useBuilderStore","state","setIsTextEditorOpen","onClick","useCallback","isNotEmpty","useMemo","el","document","createElement","innerHTML","innerText","_jsx","__html","propTypes","PropTypes","string","func","bool","isRequired"],"mappings":";;;;;;;;;;;;;;;;;;;;IAOMA,UAAU,GAAG,SAAbA,UAAa,OAMb;AAAA,0BALJC,OAKI;AAAA,MALJA,OAKI,6BALM,EAKN;AAAA,6BAJJC,UAII;AAAA,MAJJA,UAII,gCAJS,YAAM,EAIf;AAAA,2BAHJC,QAGI;AAAA,MAHJA,QAGI,8BAHO,KAGP;AAAA,6BAFJC,UAEI;AAAA,MAFJA,UAEI,gCAFS,KAET;AAAA,MADJC,WACI,QADJA,WACI;;AACJ,sBAA+BC,YAAY,CAACL,OAAD,EAAUM,SAAS,CAACC,QAApB,CAA3C;AAAA;AAAA,MAAOC,QAAP;AAAA,MAAiBC,UAAjB;;AAEA,MAAMC,gBAAgB,GAAGC,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,gBAAV;AAAA,GAAN,CAAxC;AACA,MAAMG,mBAAmB,GAAGF,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,mBAAV;AAAA,GAAN,CAA3C;AAEA,MAAMC,OAAO,GAAGC,WAAW,CAAC,YAAM;AAChC,QAAIZ,UAAU,IAAI,CAACD,QAAnB,EAA6B;AAC3BW,MAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD;AACF,GAJ0B,EAIxB,CAACV,UAAD,EAAaD,QAAb,EAAuBW,mBAAvB,CAJwB,CAA3B;AAMA,MAAMG,UAAU,GAAGC,OAAO,CAAC,YAAM;AAC/B,QAAMC,EAAE,GAAGC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAX;AACAF,IAAAA,EAAE,CAACG,SAAH,GAAeb,QAAf;AACA,WAAO,CAAC,CAACU,EAAE,CAACI,SAAZ;AACD,GAJyB,EAIvB,CAACd,QAAD,CAJuB,CAA1B;AAMA,SAAOL,UAAU,IAAIO,gBAAd,gBACLa,IAAC,WAAD;AACE,IAAA,OAAO,EAAEf,QADX;AAEE,IAAA,UAAU,EAAEP,UAFd;AAGE,IAAA,WAAW,EAAEG,WAHf;AAIE,IAAA,UAAU,EAAEK,UAJd;AAKE,IAAA,mBAAmB,EAAEI;AALvB,IADK,gBASLU;AACE,IAAA,SAAS,2BAAoBP,UAAU,GAAG,EAAH,GAAQ,qBAAtC,CADX;AAEE,IAAA,uBAAuB,EAAE;AACvBQ,MAAAA,MAAM,EAAER,UAAU,GAAGR,QAAH,GAAcJ;AADT,KAF3B;AAKE,IAAA,OAAO,EAAEU,OALX;AAME,IAAA,SAAS,EAAE,qBAAM;AANnB,IATF;AAkBD;;AAEDf,UAAU,CAAC0B,SAAX,GAAuB;AACrBzB,EAAAA,OAAO,EAAE0B,SAAS,CAACC,MADE;AAErB1B,EAAAA,UAAU,EAAEyB,SAAS,CAACE,IAFD;AAGrB1B,EAAAA,QAAQ,EAAEwB,SAAS,CAACG,IAHC;AAIrB1B,EAAAA,UAAU,EAAEuB,SAAS,CAACG,IAJD;AAKrBzB,EAAAA,WAAW,EAAEsB,SAAS,CAACC,MAAV,CAAiBG;AALT,CAAvB;;;;"}
|