redhotmagma-graphics-editor 1.41.1 → 1.42.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.
Files changed (82) hide show
  1. package/App.js +90 -165
  2. package/CanvasAdapters/Mock/Canvas.js +71 -125
  3. package/CanvasAdapters/Mock/Objects/CanvasObject.js +23 -40
  4. package/CanvasAdapters/Mock/Objects/Group.js +15 -46
  5. package/CanvasAdapters/Mock/Objects/Image.js +15 -46
  6. package/CanvasAdapters/Mock/Objects/Text.js +15 -51
  7. package/CanvasAdapters/Mock/index.js +0 -1
  8. package/CanvasAdapters/PaperJs/Canvas.js +268 -398
  9. package/CanvasAdapters/PaperJs/CanvasRepository.js +6 -23
  10. package/CanvasAdapters/PaperJs/Modifiers/FontSizeMin.js +2 -5
  11. package/CanvasAdapters/PaperJs/Objects/CanvasObject.js +33 -65
  12. package/CanvasAdapters/PaperJs/Objects/Group.js +14 -48
  13. package/CanvasAdapters/PaperJs/Objects/Image.js +58 -114
  14. package/CanvasAdapters/PaperJs/Objects/Text.js +43 -99
  15. package/CanvasAdapters/PaperJs/Utils/HTML2Paper.js +57 -108
  16. package/CanvasAdapters/PaperJs/Utils/SVGfix.js +9 -30
  17. package/CanvasAdapters/PaperJs/Utils/StyleParams.js +10 -21
  18. package/CanvasAdapters/PaperJs/Utils/TextToSVGRepository.js +53 -86
  19. package/CanvasAdapters/PaperJs/Utils/TextToSVGUtils.js +4 -14
  20. package/CanvasAdapters/PaperJs/Utils/UTF8Base64.js +3 -24
  21. package/CanvasAdapters/PaperJs/Utils/UseColorLayer.js +58 -0
  22. package/CanvasAdapters/PaperJs/Utils/UseMask.js +183 -279
  23. package/CanvasAdapters/PaperJs/Utils/__tests__/SVGfix.test.js +0 -1
  24. package/CanvasAdapters/PaperJs/Utils/__tests__/TextToSVGUtils.test.js +0 -1
  25. package/CanvasAdapters/PaperJs/Utils/__tests__/updateFontStyle.test.js +0 -1
  26. package/CanvasAdapters/PaperJs/Utils/updateFontStyle.js +5 -11
  27. package/CanvasAdapters/PaperJs/index.js +0 -1
  28. package/CanvasInterface/Canvas.js +145 -235
  29. package/CanvasInterface/CanvasProvider.js +25 -75
  30. package/CanvasInterface/Objects/CanvasObject.js +68 -148
  31. package/CanvasInterface/Objects/index.js +0 -1
  32. package/CanvasInterface/Observable.js +10 -29
  33. package/CanvasInterface/canvasConnect.js +12 -44
  34. package/CanvasInterface/index.js +1 -7
  35. package/Components/Canvas/Canvas.js +14 -41
  36. package/Components/Canvas/CanvasContainer.js +5 -18
  37. package/Components/Canvas/styles.js +2 -3
  38. package/Components/DelayedContainer.js +14 -39
  39. package/Components/Editor/Editor.js +47 -102
  40. package/Components/Editor/EditorContainer.js +47 -131
  41. package/Components/Editor/styles.js +2 -3
  42. package/Components/InlineToolbox/InlineToolbox.js +49 -142
  43. package/Components/InlineToolbox/InlineToolboxButton.js +9 -19
  44. package/Components/InlineToolbox/styles.js +2 -3
  45. package/Components/ManipulableContainer.js +15 -41
  46. package/Components/ResizeDetect/ResizeDetect.js +14 -47
  47. package/Components/Rulers/Ruler.js +20 -68
  48. package/Components/Rulers/Rulers.js +14 -46
  49. package/Components/Rulers/styles.js +2 -3
  50. package/Components/SelectionToolbox/ColorPalette.js +25 -73
  51. package/Components/SelectionToolbox/SelectionToolbox.js +39 -101
  52. package/Components/SelectionToolbox/TextTools.js +81 -157
  53. package/Components/SelectionToolbox/styles.js +2 -3
  54. package/Components/StandardToolbox/StandardToolbox.js +81 -144
  55. package/Components/TextEditor/TextEditor.js +67 -182
  56. package/Components/TextEditor/TextEditorStateProvider.js +20 -56
  57. package/Components/Toolbox/ToolboxContainer.js +5 -18
  58. package/Components/Toolbox/ToolboxRow.js +4 -16
  59. package/Components/Toolbox/styles.js +2 -3
  60. package/Utils/Calc2D.js +3 -9
  61. package/Utils/DOM.js +22 -80
  62. package/Utils/Device.js +2 -6
  63. package/Utils/Image.js +17 -11
  64. package/Utils/Logger.js +8 -32
  65. package/Utils/Range.js +6 -33
  66. package/Utils/String.js +2 -8
  67. package/Utils/UnitConversion.js +3 -9
  68. package/Utils/__tests__/Calc2D.test.js +1 -3
  69. package/Utils/__tests__/DOM.test.js +17 -25
  70. package/Utils/__tests__/Range.test.js +0 -1
  71. package/_demos/UsingExternalControls/App.js +13 -48
  72. package/_demos/UsingRenderProps/App.js +15 -54
  73. package/index.js +2 -6
  74. package/package.json +5 -7
  75. package/src/App.js +35 -38
  76. package/src/CanvasAdapters/PaperJs/Canvas.ts +11 -0
  77. package/src/CanvasAdapters/PaperJs/Utils/UseColorLayer.js +56 -0
  78. package/src/Components/InlineToolbox/InlineToolbox.js +2 -2
  79. package/src/Components/SelectionToolbox/TextTools.js +1 -1
  80. package/src/_demos/UsingExternalControls/App.js +25 -28
  81. package/src/_demos/UsingRenderProps/App.js +16 -19
  82. package/src/index.js +2 -2
@@ -1,66 +1,39 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
4
-
5
3
  Object.defineProperty(exports, "__esModule", {
6
4
  value: true
7
5
  });
8
6
  exports["default"] = exports.TextTools = void 0;
9
-
10
7
  var _react = _interopRequireDefault(require("react"));
11
-
12
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
13
-
14
9
  var _withStyles = _interopRequireDefault(require("@material-ui/core/styles/withStyles"));
15
-
16
10
  var _isObject = _interopRequireDefault(require("lodash/isObject"));
17
-
18
11
  var _get = _interopRequireDefault(require("lodash/get"));
19
-
20
12
  var _ToolboxRow = _interopRequireDefault(require("../Toolbox/ToolboxRow"));
21
-
22
13
  var _TextEditor = _interopRequireDefault(require("../TextEditor/TextEditor"));
23
-
24
14
  var _TextEditorStateProvider = require("../TextEditor/TextEditorStateProvider");
25
-
26
15
  var _ColorPalette = _interopRequireDefault(require("./ColorPalette"));
27
-
28
16
  var _Canvas = require("../../CanvasInterface/Canvas");
29
-
30
17
  var _styles = _interopRequireDefault(require("./styles"));
31
-
32
18
  var _StyleParams = require("../../CanvasAdapters/PaperJs/Utils/StyleParams");
33
-
34
19
  var _String = require("../../Utils/String");
35
-
36
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
37
-
38
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
39
-
40
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
41
-
21
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
22
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
23
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
42
24
  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
43
-
44
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
45
-
46
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
47
-
48
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
49
-
50
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
51
-
25
+ function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
26
+ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
27
+ function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
28
+ function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
52
29
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
53
-
54
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
55
-
30
+ function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
56
31
  function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
57
-
58
32
  function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
59
-
60
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
61
-
62
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
63
-
33
+ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
34
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
35
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
36
+ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
64
37
  var fontFamilyList = [{
65
38
  name: 'Arial',
66
39
  value: 'Arial, Helvetica, sans-serif'
@@ -75,64 +48,47 @@ var fontFamilyList = [{
75
48
  value: '"Courier New", Courier, monospace'
76
49
  }];
77
50
  var fontSizeList = [8, 9, 10, 11, 12, 14, 16, 18, 20, 22, 24, 26, 28, 36, 48, 72];
78
-
79
- var TextTools = /*#__PURE__*/function (_React$Component) {
51
+ var TextTools = exports.TextTools = /*#__PURE__*/function (_React$Component) {
80
52
  _inherits(TextTools, _React$Component);
81
-
82
53
  var _super = _createSuper(TextTools);
83
-
84
54
  function TextTools() {
85
55
  var _this;
86
-
87
56
  _classCallCheck(this, TextTools);
88
-
89
57
  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
90
58
  args[_key] = arguments[_key];
91
59
  }
92
-
93
60
  _this = _super.call.apply(_super, [this].concat(args));
94
-
95
61
  _defineProperty(_assertThisInitialized(_this), "rteRef", _this.props.rteRef || /*#__PURE__*/_react["default"].createRef());
96
-
97
62
  _defineProperty(_assertThisInitialized(_this), "handleCommand", function (evt, value) {
98
63
  evt.preventDefault();
99
-
100
64
  _this.props.textEditorState.formatDoc(evt.target.value, value);
101
65
  });
102
-
103
66
  _defineProperty(_assertThisInitialized(_this), "onChangeHTML", function (htmlElement) {
104
67
  var _assertThisInitialize = _assertThisInitialized(_this),
105
- selectedObject = _assertThisInitialize.props.canvas.selectedObject;
106
-
68
+ selectedObject = _assertThisInitialize.props.canvas.selectedObject;
107
69
  if (selectedObject) {
108
70
  selectedObject.contentHTML = htmlElement;
109
71
  }
110
72
  });
111
-
112
73
  _defineProperty(_assertThisInitialized(_this), "onChangeProp", function (prop, value) {
113
74
  var _assertThisInitialize2 = _assertThisInitialized(_this),
114
- selectedObject = _assertThisInitialize2.props.canvas.selectedObject;
115
-
75
+ selectedObject = _assertThisInitialize2.props.canvas.selectedObject;
116
76
  if (selectedObject) {
117
77
  selectedObject[prop] = value;
118
78
  }
119
-
120
79
  var _this$props$textEdito = _this.props.textEditorState,
121
- currentStyle = _this$props$textEdito.currentStyle,
122
- updateCurrentStyle = _this$props$textEdito.updateCurrentStyle;
80
+ currentStyle = _this$props$textEdito.currentStyle,
81
+ updateCurrentStyle = _this$props$textEdito.updateCurrentStyle;
123
82
  updateCurrentStyle(_objectSpread(_objectSpread({}, currentStyle), {}, _defineProperty({}, prop, value)));
124
83
  });
125
-
126
84
  _defineProperty(_assertThisInitialized(_this), "renderLineTools", function (renderObj) {
127
85
  var renderLineTools = _this.props.renderLineTools;
128
-
129
86
  if (renderLineTools) {
130
87
  return renderLineTools(renderObj);
131
- } // render default
132
-
133
-
88
+ }
89
+ // render default
134
90
  var handleCommand = renderObj.handleCommand,
135
- ToolboxRow = renderObj.components.ToolboxRow;
91
+ ToolboxRow = renderObj.components.ToolboxRow;
136
92
  return /*#__PURE__*/_react["default"].createElement(ToolboxRow, null, /*#__PURE__*/_react["default"].createElement("button", {
137
93
  type: "button",
138
94
  value: "justifyLeft",
@@ -147,33 +103,27 @@ var TextTools = /*#__PURE__*/function (_React$Component) {
147
103
  onMouseDown: handleCommand
148
104
  }, "Right"));
149
105
  });
150
-
151
106
  _defineProperty(_assertThisInitialized(_this), "renderInlineTools", function (renderObj) {
152
107
  var renderInlineTools = _this.props.renderInlineTools;
153
-
154
108
  if (!renderObj.textEditorState) {
155
109
  return null;
156
110
  }
157
-
158
111
  if (renderInlineTools) {
159
112
  return renderInlineTools(renderObj);
160
- } // render default
161
-
162
-
113
+ }
114
+ // render default
163
115
  var handleCommand = renderObj.handleCommand,
164
- ToolboxRow = renderObj.components.ToolboxRow,
165
- renderColorPalette = renderObj.renderColorPalette,
166
- fontFamilyList = renderObj.fontFamilyList,
167
- textEditorState = renderObj.textEditorState,
168
- selectedObject = renderObj.selectedObject;
116
+ ToolboxRow = renderObj.components.ToolboxRow,
117
+ renderColorPalette = renderObj.renderColorPalette,
118
+ fontFamilyList = renderObj.fontFamilyList,
119
+ textEditorState = renderObj.textEditorState,
120
+ selectedObject = renderObj.selectedObject;
169
121
  var formatDoc = textEditorState.formatDoc;
170
-
171
122
  var _textEditorState$getS = textEditorState.getStyleValues(),
172
- isBold = _textEditorState$getS.isBold,
173
- isItalic = _textEditorState$getS.isItalic,
174
- fontFamily = _textEditorState$getS.fontFamily,
175
- fontSize = _textEditorState$getS.fontSize;
176
-
123
+ isBold = _textEditorState$getS.isBold,
124
+ isItalic = _textEditorState$getS.isItalic,
125
+ fontFamily = _textEditorState$getS.fontFamily,
126
+ fontSize = _textEditorState$getS.fontSize;
177
127
  var fontSizeMin = selectedObject.fontSizeMin;
178
128
  return /*#__PURE__*/_react["default"].createElement(ToolboxRow, null, /*#__PURE__*/_react["default"].createElement("button", {
179
129
  type: "button",
@@ -212,17 +162,14 @@ var TextTools = /*#__PURE__*/function (_React$Component) {
212
162
  }, font.name);
213
163
  })), renderColorPalette(renderObj));
214
164
  });
215
-
216
165
  _defineProperty(_assertThisInitialized(_this), "renderColorPalette", function (renderObj) {
217
166
  var _this$props = _this.props,
218
- textEditorState = _this$props.textEditorState,
219
- renderColorPalette = _this$props.renderColorPalette;
220
-
167
+ textEditorState = _this$props.textEditorState,
168
+ renderColorPalette = _this$props.renderColorPalette;
221
169
  if (renderColorPalette) {
222
170
  return renderColorPalette(renderObj);
223
- } // render default
224
-
225
-
171
+ }
172
+ // render default
226
173
  var ColorPalette = renderObj.components.ColorPalette;
227
174
  return /*#__PURE__*/_react["default"].createElement(ColorPalette, {
228
175
  onChange: function onChange(evt, color) {
@@ -231,23 +178,21 @@ var TextTools = /*#__PURE__*/function (_React$Component) {
231
178
  value: textEditorState.currentStyle.color
232
179
  });
233
180
  });
234
-
235
181
  _defineProperty(_assertThisInitialized(_this), "renderTextEditor", function (renderObj) {
236
182
  var classes = renderObj.classes,
237
- rteRef = renderObj.rteRef,
238
- editorRef = renderObj.editorRef,
239
- selectedObject = renderObj.selectedObject,
240
- onChangeHTML = renderObj.onChangeHTML,
241
- onChangeProp = renderObj.onChangeProp,
242
- fullTextCommandList = renderObj.fullTextCommandList,
243
- autoFocusWhenMounted = renderObj.autoFocusWhenMounted,
244
- canvas = renderObj.canvas,
245
- textEditorElementProps = renderObj.textEditorElementProps,
246
- disableLinebreaks = renderObj.disableLinebreaks;
183
+ rteRef = renderObj.rteRef,
184
+ editorRef = renderObj.editorRef,
185
+ selectedObject = renderObj.selectedObject,
186
+ onChangeHTML = renderObj.onChangeHTML,
187
+ onChangeProp = renderObj.onChangeProp,
188
+ fullTextCommandList = renderObj.fullTextCommandList,
189
+ autoFocusWhenMounted = renderObj.autoFocusWhenMounted,
190
+ canvas = renderObj.canvas,
191
+ textEditorElementProps = renderObj.textEditorElementProps,
192
+ disableLinebreaks = renderObj.disableLinebreaks;
247
193
  var selectedCanvasObject = canvas.selectedObject;
248
194
  var explicitStyleParams = selectedCanvasObject ? selectedCanvasObject.getExplicitStyleParams() : {};
249
195
  var renderTextEditor = _this.props.renderTextEditor;
250
-
251
196
  if (renderTextEditor) {
252
197
  return renderTextEditor(_objectSpread(_objectSpread({}, renderObj), {}, {
253
198
  explicitStyleParams: explicitStyleParams,
@@ -256,7 +201,6 @@ var TextTools = /*#__PURE__*/function (_React$Component) {
256
201
  }
257
202
  }));
258
203
  }
259
-
260
204
  return /*#__PURE__*/_react["default"].createElement(_TextEditor["default"], {
261
205
  className: classes.textEditorContent,
262
206
  ref: editorRef,
@@ -271,21 +215,18 @@ var TextTools = /*#__PURE__*/function (_React$Component) {
271
215
  disableLinebreaks: disableLinebreaks
272
216
  });
273
217
  });
274
-
275
218
  return _this;
276
219
  }
277
-
278
220
  _createClass(TextTools, [{
279
221
  key: "componentDidMount",
280
222
  value: function componentDidMount() {
281
223
  // update the default style with the first font in the list
282
224
  var _this$props2 = this.props,
283
- fontFamilyList = _this$props2.fontFamilyList,
284
- _this$props2$textEdit = _this$props2.textEditorState,
285
- defaultStyle = _this$props2$textEdit.defaultStyle,
286
- updateDefaultStyle = _this$props2$textEdit.updateDefaultStyle,
287
- updateCurrentStyle = _this$props2$textEdit.updateCurrentStyle;
288
-
225
+ fontFamilyList = _this$props2.fontFamilyList,
226
+ _this$props2$textEdit = _this$props2.textEditorState,
227
+ defaultStyle = _this$props2$textEdit.defaultStyle,
228
+ updateDefaultStyle = _this$props2$textEdit.updateDefaultStyle,
229
+ updateCurrentStyle = _this$props2$textEdit.updateCurrentStyle;
289
230
  if (fontFamilyList.length > 0) {
290
231
  updateDefaultStyle(_objectSpread(_objectSpread({}, defaultStyle), {}, {
291
232
  fontFamily: fontFamilyList[0].value
@@ -299,24 +240,23 @@ var TextTools = /*#__PURE__*/function (_React$Component) {
299
240
  key: "componentDidUpdate",
300
241
  value: function componentDidUpdate(prevProps) {
301
242
  var _this$props3 = this.props,
302
- fontFamilyList = _this$props3.fontFamilyList,
303
- _this$props3$textEdit = _this$props3.textEditorState,
304
- defaultStyle = _this$props3$textEdit.defaultStyle,
305
- updateDefaultStyle = _this$props3$textEdit.updateDefaultStyle,
306
- updateCurrentStyle = _this$props3$textEdit.updateCurrentStyle,
307
- currentStyle = _this$props3$textEdit.currentStyle,
308
- resetDefaultStyle = _this$props3$textEdit.resetDefaultStyle,
309
- selectedObject = _this$props3.selectedObject;
243
+ fontFamilyList = _this$props3.fontFamilyList,
244
+ _this$props3$textEdit = _this$props3.textEditorState,
245
+ defaultStyle = _this$props3$textEdit.defaultStyle,
246
+ updateDefaultStyle = _this$props3$textEdit.updateDefaultStyle,
247
+ updateCurrentStyle = _this$props3$textEdit.updateCurrentStyle,
248
+ currentStyle = _this$props3$textEdit.currentStyle,
249
+ resetDefaultStyle = _this$props3$textEdit.resetDefaultStyle,
250
+ selectedObject = _this$props3.selectedObject;
310
251
  var editorContent = this.rteRef.current;
311
-
312
252
  if (fontFamilyList !== prevProps.fontFamilyList && fontFamilyList.length > 0) {
313
253
  updateDefaultStyle({
314
254
  fontFamily: fontFamilyList[0].value
315
255
  });
316
- } // when there is 0 span's in Text field cursor is always shown in default color even when new color is selected from colorPalette.
256
+ }
257
+ // when there is 0 span's in Text field cursor is always shown in default color even when new color is selected from colorPalette.
317
258
  // so required to change color of Text field to currentColor
318
259
 
319
-
320
260
  if (selectedObject.uuid !== prevProps.selectedObject.uuid) {
321
261
  var defaultColor = (0, _isObject["default"])(defaultStyle.color.identifier) ? defaultStyle.color.identifier : (0, _String.parseObjectSafe)(defaultStyle.color.identifier);
322
262
  var styleParams = (0, _StyleParams.collectStyleParams)(selectedObject.content);
@@ -331,21 +271,17 @@ var TextTools = /*#__PURE__*/function (_React$Component) {
331
271
  custom: !!isCustom
332
272
  }
333
273
  };
334
-
335
274
  if (colorObj.identifier.palette) {
336
275
  colorObj.identifier = JSON.stringify(colorObj.identifier);
337
276
  }
338
-
339
277
  updateCurrentStyle({
340
278
  color: colorObj,
341
279
  fontSize: selectedObject.fontSize
342
280
  });
343
281
  resetDefaultStyle();
344
282
  }
345
-
346
283
  var colorChanged = currentStyle.color.value !== prevProps.textEditorState.currentStyle.color.value;
347
-
348
- if (colorChanged && editorContent.innerText.trim() === '') {
284
+ if (colorChanged && editorContent && editorContent.innerText && editorContent.innerText.trim() === '') {
349
285
  updateDefaultStyle({
350
286
  color: currentStyle.color
351
287
  });
@@ -355,26 +291,25 @@ var TextTools = /*#__PURE__*/function (_React$Component) {
355
291
  key: "render",
356
292
  value: function render() {
357
293
  var handleCommand = this.handleCommand,
358
- renderColorPalette = this.renderColorPalette,
359
- renderLineTools = this.renderLineTools,
360
- renderInlineTools = this.renderInlineTools,
361
- onChangeHTML = this.onChangeHTML,
362
- onChangeProp = this.onChangeProp,
363
- rteRef = this.rteRef,
364
- props = this.props,
365
- updateCurrentStyle = this.updateCurrentStyle,
366
- renderTextEditor = this.renderTextEditor;
294
+ renderColorPalette = this.renderColorPalette,
295
+ renderLineTools = this.renderLineTools,
296
+ renderInlineTools = this.renderInlineTools,
297
+ onChangeHTML = this.onChangeHTML,
298
+ onChangeProp = this.onChangeProp,
299
+ rteRef = this.rteRef,
300
+ props = this.props,
301
+ updateCurrentStyle = this.updateCurrentStyle,
302
+ renderTextEditor = this.renderTextEditor;
367
303
  var canvas = props.canvas,
368
- selectedObject = props.selectedObject,
369
- classes = props.classes,
370
- fontFamilyList = props.fontFamilyList,
371
- fontSizeList = props.fontSizeList,
372
- children = props.children,
373
- fullTextCommandList = props.fullTextCommandList,
374
- autoFocusWhenMounted = props.autoFocusWhenMounted,
375
- textEditorState = props.textEditorState,
376
- editorRef = props.editorRef;
377
-
304
+ selectedObject = props.selectedObject,
305
+ classes = props.classes,
306
+ fontFamilyList = props.fontFamilyList,
307
+ fontSizeList = props.fontSizeList,
308
+ children = props.children,
309
+ fullTextCommandList = props.fullTextCommandList,
310
+ autoFocusWhenMounted = props.autoFocusWhenMounted,
311
+ textEditorState = props.textEditorState,
312
+ editorRef = props.editorRef;
378
313
  if (selectedObject) {
379
314
  var renderObj = {
380
315
  handleCommand: handleCommand,
@@ -399,23 +334,16 @@ var TextTools = /*#__PURE__*/function (_React$Component) {
399
334
  fontSizeList: fontSizeList,
400
335
  fullTextCommandList: fullTextCommandList
401
336
  };
402
-
403
337
  if (typeof children === 'function') {
404
338
  return children(renderObj);
405
339
  }
406
-
407
340
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, renderLineTools(renderObj), renderInlineTools(renderObj), /*#__PURE__*/_react["default"].createElement(_ToolboxRow["default"], null, renderTextEditor(renderObj)));
408
341
  }
409
-
410
342
  return null;
411
343
  }
412
344
  }]);
413
-
414
345
  return TextTools;
415
346
  }(_react["default"].Component);
416
-
417
- exports.TextTools = TextTools;
418
-
419
347
  _defineProperty(TextTools, "propTypes", {
420
348
  renderLineTools: _propTypes["default"].func,
421
349
  renderInlineTools: _propTypes["default"].func,
@@ -431,7 +359,6 @@ _defineProperty(TextTools, "propTypes", {
431
359
  fontSizeList: _propTypes["default"].arrayOf(_propTypes["default"].number.isRequired).isRequired,
432
360
  classes: _propTypes["default"].object.isRequired
433
361
  });
434
-
435
362
  _defineProperty(TextTools, "defaultProps", {
436
363
  fontFamilyList: fontFamilyList,
437
364
  fontSizeList: fontSizeList,
@@ -439,9 +366,6 @@ _defineProperty(TextTools, "defaultProps", {
439
366
  fullTextCommandList: [],
440
367
  withStateProvider: false
441
368
  });
442
-
443
- var _default = (0, _withStyles["default"])(_styles["default"], {
369
+ var _default = exports["default"] = (0, _withStyles["default"])(_styles["default"], {
444
370
  name: 'Designer-TextTools'
445
- })((0, _TextEditorStateProvider.withTextEditorState)(TextTools));
446
-
447
- exports["default"] = _default;
371
+ })((0, _TextEditorStateProvider.withTextEditorState)(TextTools));
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports["default"] = void 0;
7
- var _default = {
7
+ var _default = exports["default"] = {
8
8
  textEditorContent: {
9
9
  border: '1px solid black',
10
10
  background: '#FFF',
@@ -14,5 +14,4 @@ var _default = {
14
14
  position: 'fixed',
15
15
  bottom: 0
16
16
  }
17
- };
18
- exports["default"] = _default;
17
+ };