@pie-lib/editable-html 7.22.4 → 8.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/CHANGELOG.md +34 -0
- package/lib/editor.js +127 -100
- package/lib/editor.js.map +1 -1
- package/lib/plugins/characters/custom-popover.js +73 -0
- package/lib/plugins/characters/custom-popover.js.map +1 -0
- package/lib/plugins/characters/index.js +271 -0
- package/lib/plugins/characters/index.js.map +1 -0
- package/lib/plugins/characters/utils.js +362 -0
- package/lib/plugins/characters/utils.js.map +1 -0
- package/lib/plugins/image/component.js +190 -29
- package/lib/plugins/image/component.js.map +1 -1
- package/lib/plugins/image/image-toolbar.js +4 -58
- package/lib/plugins/image/image-toolbar.js.map +1 -1
- package/lib/plugins/image/index.js +3 -1
- package/lib/plugins/image/index.js.map +1 -1
- package/lib/plugins/index.js +19 -4
- package/lib/plugins/index.js.map +1 -1
- package/package.json +5 -5
- package/src/editor.jsx +52 -15
- package/src/plugins/characters/custom-popover.js +45 -0
- package/src/plugins/characters/index.jsx +237 -0
- package/src/plugins/characters/utils.js +444 -0
- package/src/plugins/image/component.jsx +171 -19
- package/src/plugins/image/image-toolbar.jsx +2 -32
- package/src/plugins/image/index.jsx +3 -1
- package/src/plugins/index.jsx +3 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/plugins/characters/utils.js"],"names":["spanishConfig","characters","autoClose","specialConfig","hasPreview","unicode","description","write","label","String","fromCodePoint","characterIcons","spanish","special"],"mappings":"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","sourcesContent":["export const spanishConfig = {\n characters: [\n ['á', 'é', 'í', 'ó', 'ú'],\n ['Á', 'É', 'Í', 'Ó', 'Ú'],\n ['—', '«', '»', 'ñ', 'ü'],\n ['-', '¿', '¡', 'Ñ', 'Ü']\n ],\n autoClose: true\n};\n\nexport const specialConfig = {\n hasPreview: true,\n characters: [\n [\n {\n unicode: 'U+00A2',\n description: 'CENT SIGN',\n write: '¢',\n label: '¢'\n },\n {\n unicode: 'U+00BF',\n description: 'INVERTED QUESTION MARK',\n write: '¿',\n label: '¿'\n },\n {\n unicode: 'U+00B4',\n description: 'ACUTE ACCENT',\n write: '´',\n label: '´'\n },\n {\n unicode: 'U+00E1',\n description: 'LATIN SMALL LETTER A WITH ACUTE',\n write: 'á',\n label: 'á'\n },\n {\n unicode: 'U+00E9',\n description: 'LATIN SMALL LETTER E WITH ACUTE',\n write: 'é',\n label: 'é'\n },\n {\n unicode: 'U+00ED',\n description: 'LATIN SMALL LETTER I WITH ACUTE',\n write: 'í',\n label: 'í'\n },\n {\n unicode: 'U+00F3',\n description: 'LATIN SMALL LETTER O WITH ACUTE',\n write: 'ó',\n label: 'ó'\n },\n {\n unicode: 'U+00FA',\n description: 'LATIN SMALL LETTER U WITH ACUTE',\n write: 'ú',\n label: 'ú'\n },\n {\n unicode: 'U+00F1',\n description: 'LATIN SMALL LETTER N WITH TILDE',\n write: 'ñ',\n label: 'ñ'\n }\n ],\n [\n {\n unicode: 'U+20AC',\n description: 'EURO SIGN',\n write: '€',\n label: '€'\n },\n {\n unicode: 'U+00A1',\n description: 'INVERTED EXCLAMATION MARK',\n write: '¡',\n label: '¡'\n },\n {\n unicode: 'U+00C1',\n description: 'LATIN CAPITAL LETTER A WITH ACUTE',\n write: 'Á',\n label: 'Á'\n },\n {\n unicode: 'U+00C9',\n description: 'LATIN CAPITAL LETTER E WITH ACUTE',\n write: 'É',\n label: 'É'\n },\n {\n unicode: 'U+00CD',\n description: 'LATIN CAPITAL LETTER I WITH ACUTE',\n write: 'Í',\n label: 'Í'\n },\n {\n unicode: 'U+00D3',\n description: 'LATIN CAPITAL LETTER O WITH ACUTE',\n write: 'Ó',\n label: 'Ó'\n },\n {\n unicode: 'U+00DA',\n description: 'LATIN CAPITAL LETTER U WITH ACUTE',\n write: 'Ú',\n label: 'Ú'\n },\n {\n unicode: 'U+00D1',\n description: 'LATIN CAPITAL LETTER N WITH TILDE',\n write: 'Ñ',\n label: 'Ñ'\n }\n ],\n [\n {\n unicode: 'U+00A3',\n description: 'POUND SIGN',\n write: '£',\n label: '£'\n },\n {\n unicode: 'U+00AB',\n description: 'LEFT-POINTING DOUBLE ANGLE QUOTATION MARK',\n write: '«',\n label: '«'\n },\n {\n unicode: 'U+005E',\n description: 'CIRCUMFLEX ACCENT',\n write: '^',\n label: '^'\n },\n {\n unicode: 'U+00E2',\n description: 'LATIN SMALL LETTER A WITH CIRCUMFLEX',\n write: 'â',\n label: 'â'\n },\n {\n unicode: 'U+00EA',\n description: 'LATIN SMALL LETTER E WITH CIRCUMFLEX',\n write: 'ê',\n label: 'ê'\n },\n {\n unicode: 'U+00EE',\n description: 'LATIN SMALL LETTER I WITH CIRCUMFLEX',\n write: 'î',\n label: 'î'\n },\n {\n unicode: 'U+00F4',\n description: 'LATIN SMALL LETTER O WITH CIRCUMFLEX',\n write: 'ô',\n label: 'ô'\n },\n {\n unicode: 'U+00FB',\n description: 'LATIN SMALL LETTER U WITH CIRCUMFLEX',\n write: 'û',\n label: 'û'\n },\n {\n unicode: 'U+00E7',\n description: 'LATIN SMALL LETTER C WITH CEDILLA',\n write: 'ç',\n label: 'ç'\n }\n ],\n [\n {\n unicode: 'U+00A5',\n description: 'YEN SIGN',\n write: '¥',\n label: '¥'\n },\n {\n unicode: 'U+00BB',\n description: 'RIGHT-POINTING DOUBLE ANGLE QUOTATION MARK',\n write: '»',\n label: '»'\n },\n {\n unicode: 'U+00C2',\n description: 'LATIN CAPITAL LETTER A WITH CIRCUMFLEX',\n write: 'Â',\n label: 'Â'\n },\n {\n unicode: 'U+00CA',\n description: 'LATIN CAPITAL LETTER E WITH CIRCUMFLEX',\n write: 'Ê',\n label: 'Ê'\n },\n {\n unicode: 'U+00CE',\n description: 'LATIN CAPITAL LETTER I WITH CIRCUMFLEX',\n write: 'Î',\n label: 'Î'\n },\n {\n unicode: 'U+00D4',\n description: 'LATIN CAPITAL LETTER O WITH CIRCUMFLEX',\n write: 'Ô',\n label: 'Ô'\n },\n {\n unicode: 'U+00DB',\n description: 'LATIN CAPITAL LETTER U WITH CIRCUMFLEX',\n write: 'Û',\n label: 'Û'\n },\n {\n unicode: 'U+00C7',\n description: 'LATIN CAPITAL LETTER C WITH CEDILLA',\n write: 'Ç',\n label: 'Ç'\n }\n ],\n [\n {\n unicode: 'U+00A0',\n description: 'NO-BREAK SPACE',\n write: String.fromCodePoint('0x00A0'),\n label: ' '\n },\n {\n unicode: 'U+00A7',\n description: 'SECTION SIGN',\n write: '§',\n label: '§'\n },\n {\n unicode: 'U+00A8',\n description: 'DIAERESIS',\n write: '¨',\n label: '¨'\n },\n {\n unicode: 'U+00E4',\n description: 'LATIN SMALL LETTER A WITH DIAERESIS',\n write: 'ä',\n label: 'ä'\n },\n {\n unicode: 'U+00EB',\n description: 'LATIN SMALL LETTER E WITH DIAERESIS',\n write: 'ë',\n label: 'ë'\n },\n {\n unicode: 'U+00EF',\n description: 'LATIN SMALL LETTER I WITH DIAERESIS',\n write: 'ï',\n label: 'ï'\n },\n {\n unicode: 'U+00F6',\n description: 'LATIN SMALL LETTER O WITH DIAERESIS',\n write: 'ö',\n label: 'ö'\n },\n {\n unicode: 'U+00FC',\n description: 'LATIN SMALL LETTER U WITH DIAERESIS',\n write: 'ü',\n label: 'ü'\n },\n {\n unicode: 'U+00DF',\n description: 'LATIN SMALL LETTER SHARP S',\n write: 'ß',\n label: 'ß'\n }\n ],\n [\n {\n unicode: 'U+2009',\n description: 'THIN SPACE',\n write: String.fromCodePoint('0x2009'),\n label: ' '\n },\n {\n unicode: 'U+2026',\n description: 'HORIZONTAL ELLIPSIS',\n write: '…',\n label: '…'\n },\n {\n unicode: 'U+00C4',\n description: 'LATIN CAPITAL LETTER A WITH DIAERESIS',\n write: 'Ä',\n label: 'Ä'\n },\n {\n unicode: 'U+00CB',\n description: 'LATIN CAPITAL LETTER E WITH DIAERESIS',\n write: 'Ë',\n label: 'Ë'\n },\n {\n unicode: 'U+00CF',\n description: 'LATIN CAPITAL LETTER I WITH DIAERESIS',\n write: 'Ï',\n label: 'Ï'\n },\n {\n unicode: 'U+00D6',\n description: 'LATIN CAPITAL LETTER O WITH DIAERESIS',\n write: 'Ö',\n label: 'Ö'\n },\n {\n unicode: 'U+00DC',\n description: 'LATIN CAPITAL LETTER U WITH DIAERESIS',\n write: 'Ü',\n label: 'Ü'\n },\n {\n unicode: 'U+2212',\n description: 'MINUS SIGN',\n write: '−',\n label: '−'\n }\n ],\n [\n {\n unicode: 'U+200A',\n description: 'HAIR SPACE',\n write: String.fromCodePoint('0x200A'),\n label: ' '\n },\n {\n unicode: 'U+2022',\n description: 'BULLET',\n write: '•',\n label: '•'\n },\n {\n unicode: 'U+0060',\n description: 'GRAVE ACCENT',\n write: '`',\n label: '`'\n },\n {\n unicode: 'U+00E0',\n description: 'LATIN SMALL LETTER A WITH GRAVE',\n write: 'à',\n label: 'à'\n },\n {\n unicode: 'U+00E8',\n description: 'LATIN SMALL LETTER E WITH GRAVE',\n write: 'è',\n label: 'è'\n },\n {\n unicode: 'U+00EC',\n description: 'LATIN SMALL LETTER I WITH GRAVE',\n write: 'ì',\n label: 'ì'\n },\n {\n unicode: 'U+00F2',\n description: 'LATIN SMALL LETTER O WITH GRAVE',\n write: 'ò',\n label: 'ò'\n },\n {\n unicode: 'U+00F9',\n description: 'LATIN SMALL LETTER U WITH GRAVE',\n write: 'ù',\n label: 'ù'\n },\n {\n unicode: 'U+2013',\n description: 'EN DASH',\n write: '–',\n label: '–'\n }\n ],\n [\n {\n unicode: 'U+0009',\n description: 'TAB',\n write: String.fromCodePoint('0x0009'),\n label: 'TAB'\n },\n {\n unicode: 'U+25E6',\n description: 'WHITE BULLET',\n write: '◦',\n label: '◦'\n },\n {\n unicode: 'U+00C0',\n description: 'LATIN CAPITAL LETTER A WITH GRAVE',\n write: 'À',\n label: 'À'\n },\n {\n unicode: 'U+00C8',\n description: 'LATIN CAPITAL LETTER E WITH GRAVE',\n write: 'È',\n label: 'È'\n },\n {\n unicode: 'U+00CC',\n description: 'LATIN CAPITAL LETTER I WITH GRAVE',\n write: 'Ì',\n label: 'Ì'\n },\n {\n unicode: 'U+00D2',\n description: 'LATIN CAPITAL LETTER O WITH GRAVE',\n write: 'Ò',\n label: 'Ò'\n },\n {\n unicode: 'U+00D9',\n description: 'LATIN CAPITAL LETTER U WITH GRAVE',\n write: 'Ù',\n label: 'Ù'\n },\n {\n unicode: 'U+2014',\n description: 'EM DASH',\n write: '—',\n label: '—'\n }\n ]\n ]\n};\n\nexport const characterIcons = {\n spanish: 'ñ',\n special: '€'\n};\n"],"file":"utils.js"}
|
|
@@ -88,22 +88,14 @@ var Component = /*#__PURE__*/function (_React$Component) {
|
|
|
88
88
|
var _this$props = _this.props,
|
|
89
89
|
node = _this$props.node,
|
|
90
90
|
editor = _this$props.editor;
|
|
91
|
-
var resizePercent = node.data.get('resizePercent');
|
|
92
|
-
log('[applySizeData]: resizePercent: ', resizePercent);
|
|
93
91
|
var update = node.data;
|
|
92
|
+
var w = update.get('width');
|
|
94
93
|
|
|
95
|
-
if (
|
|
96
|
-
update = update.set('
|
|
97
|
-
update = update.set('height', _this.getHeight(resizePercent));
|
|
98
|
-
} else {
|
|
99
|
-
var w = update.get('width');
|
|
100
|
-
|
|
101
|
-
if (w) {
|
|
102
|
-
update = update.set('resizePercent', _this.getPercentFromWidth(w));
|
|
103
|
-
}
|
|
94
|
+
if (w) {
|
|
95
|
+
update = update.set('resizePercent', _this.getPercentFromWidth(w));
|
|
104
96
|
}
|
|
105
97
|
|
|
106
|
-
log(
|
|
98
|
+
log("[applySizeData] update: ", update);
|
|
107
99
|
|
|
108
100
|
if (!update.equals(node.data)) {
|
|
109
101
|
editor.change(function (c) {
|
|
@@ -114,6 +106,138 @@ var Component = /*#__PURE__*/function (_React$Component) {
|
|
|
114
106
|
}
|
|
115
107
|
});
|
|
116
108
|
|
|
109
|
+
_defineProperty(_assertThisInitialized(_this), "initialiseResize", function () {
|
|
110
|
+
window.addEventListener('mousemove', _this.startResizing, false);
|
|
111
|
+
window.addEventListener('mouseup', _this.stopResizing, false);
|
|
112
|
+
});
|
|
113
|
+
|
|
114
|
+
_defineProperty(_assertThisInitialized(_this), "loadImage", function () {
|
|
115
|
+
var _ref = _this.props || {},
|
|
116
|
+
maxImageWidth = _ref.maxImageWidth,
|
|
117
|
+
maxImageHeight = _ref.maxImageHeight;
|
|
118
|
+
|
|
119
|
+
maxImageWidth = maxImageWidth || 700;
|
|
120
|
+
maxImageHeight = maxImageHeight || 900;
|
|
121
|
+
var box = _this.img; //on first load
|
|
122
|
+
|
|
123
|
+
if (!box.style.width || box.style.width === 'auto') {
|
|
124
|
+
var dimensions = {
|
|
125
|
+
width: box && box.naturalWidth || 100,
|
|
126
|
+
height: box && box.naturalHeight || 100
|
|
127
|
+
};
|
|
128
|
+
|
|
129
|
+
var _this$updateImageDime = _this.updateImageDimensions(dimensions, {
|
|
130
|
+
width: dimensions.width < maxImageWidth ? dimensions.width : maxImageWidth,
|
|
131
|
+
height: dimensions.height < maxImageHeight ? dimensions.height : maxImageHeight
|
|
132
|
+
}, true),
|
|
133
|
+
width = _this$updateImageDime.width,
|
|
134
|
+
height = _this$updateImageDime.height;
|
|
135
|
+
|
|
136
|
+
box.style.width = "".concat(width, "px");
|
|
137
|
+
box.style.height = "".concat(height, "px");
|
|
138
|
+
|
|
139
|
+
_this.setState({
|
|
140
|
+
dimensions: {
|
|
141
|
+
height: height,
|
|
142
|
+
width: width
|
|
143
|
+
}
|
|
144
|
+
});
|
|
145
|
+
|
|
146
|
+
var _this$props2 = _this.props,
|
|
147
|
+
node = _this$props2.node,
|
|
148
|
+
editor = _this$props2.editor;
|
|
149
|
+
var update = node.data;
|
|
150
|
+
update = update.set('width', width);
|
|
151
|
+
update = update.set('height', height);
|
|
152
|
+
|
|
153
|
+
if (!update.equals(node.data)) {
|
|
154
|
+
editor.change(function (c) {
|
|
155
|
+
return c.setNodeByKey(node.key, {
|
|
156
|
+
data: update
|
|
157
|
+
});
|
|
158
|
+
});
|
|
159
|
+
}
|
|
160
|
+
}
|
|
161
|
+
});
|
|
162
|
+
|
|
163
|
+
_defineProperty(_assertThisInitialized(_this), "startResizing", function (e) {
|
|
164
|
+
var bounds = e.target.getBoundingClientRect();
|
|
165
|
+
var box = _this.img;
|
|
166
|
+
var dimensions = {
|
|
167
|
+
width: box && box.naturalWidth || 100,
|
|
168
|
+
height: box && box.naturalHeight || 100
|
|
169
|
+
};
|
|
170
|
+
|
|
171
|
+
var _this$updateImageDime2 = _this.updateImageDimensions(dimensions, {
|
|
172
|
+
width: e.clientX - bounds.left,
|
|
173
|
+
height: e.clientY - bounds.top
|
|
174
|
+
}, true),
|
|
175
|
+
width = _this$updateImageDime2.width,
|
|
176
|
+
height = _this$updateImageDime2.height;
|
|
177
|
+
|
|
178
|
+
var hasMinimumWidth = width > 50 && height > 50;
|
|
179
|
+
var hasDimensionsConstraints = width <= 700 && height <= 900;
|
|
180
|
+
|
|
181
|
+
if (hasMinimumWidth && hasDimensionsConstraints && box) {
|
|
182
|
+
box.style.width = "".concat(width, "px");
|
|
183
|
+
box.style.height = "".concat(height, "px");
|
|
184
|
+
|
|
185
|
+
_this.setState({
|
|
186
|
+
dimensions: {
|
|
187
|
+
height: height,
|
|
188
|
+
width: width
|
|
189
|
+
}
|
|
190
|
+
});
|
|
191
|
+
|
|
192
|
+
var _this$props3 = _this.props,
|
|
193
|
+
node = _this$props3.node,
|
|
194
|
+
editor = _this$props3.editor;
|
|
195
|
+
var update = node.data;
|
|
196
|
+
update = update.set('width', width);
|
|
197
|
+
update = update.set('height', height);
|
|
198
|
+
|
|
199
|
+
if (!update.equals(node.data)) {
|
|
200
|
+
editor.change(function (c) {
|
|
201
|
+
return c.setNodeByKey(node.key, {
|
|
202
|
+
data: update
|
|
203
|
+
});
|
|
204
|
+
});
|
|
205
|
+
}
|
|
206
|
+
}
|
|
207
|
+
});
|
|
208
|
+
|
|
209
|
+
_defineProperty(_assertThisInitialized(_this), "stopResizing", function () {
|
|
210
|
+
window.removeEventListener('mousemove', _this.startResizing, false);
|
|
211
|
+
window.removeEventListener('mouseup', _this.stopResizing, false);
|
|
212
|
+
});
|
|
213
|
+
|
|
214
|
+
_defineProperty(_assertThisInitialized(_this), "updateImageDimensions", function (initialDim, nextDim, keepAspectRatio, resizeType) {
|
|
215
|
+
// if we want to keep image aspect ratio
|
|
216
|
+
if (keepAspectRatio) {
|
|
217
|
+
var imageAspectRatio = initialDim.width / initialDim.height;
|
|
218
|
+
|
|
219
|
+
if (resizeType === 'height') {
|
|
220
|
+
// if we want to change image height => we update the width accordingly
|
|
221
|
+
return {
|
|
222
|
+
width: nextDim.height * imageAspectRatio,
|
|
223
|
+
height: nextDim.height
|
|
224
|
+
};
|
|
225
|
+
} // if we want to change image width => we update the height accordingly
|
|
226
|
+
|
|
227
|
+
|
|
228
|
+
return {
|
|
229
|
+
width: nextDim.width,
|
|
230
|
+
height: nextDim.width / imageAspectRatio
|
|
231
|
+
};
|
|
232
|
+
} // if we don't want to keep aspect ratio, we just update both values
|
|
233
|
+
|
|
234
|
+
|
|
235
|
+
return {
|
|
236
|
+
width: nextDim.width,
|
|
237
|
+
height: nextDim.height
|
|
238
|
+
};
|
|
239
|
+
});
|
|
240
|
+
|
|
117
241
|
return _this;
|
|
118
242
|
}
|
|
119
243
|
|
|
@@ -121,6 +245,11 @@ var Component = /*#__PURE__*/function (_React$Component) {
|
|
|
121
245
|
key: "componentDidMount",
|
|
122
246
|
value: function componentDidMount() {
|
|
123
247
|
this.applySizeData();
|
|
248
|
+
var resizeHandle = this.resize;
|
|
249
|
+
|
|
250
|
+
if (resizeHandle) {
|
|
251
|
+
resizeHandle.addEventListener('mousedown', this.initialiseResize, false);
|
|
252
|
+
}
|
|
124
253
|
}
|
|
125
254
|
}, {
|
|
126
255
|
key: "componentDidUpdate",
|
|
@@ -141,12 +270,12 @@ var Component = /*#__PURE__*/function (_React$Component) {
|
|
|
141
270
|
value: function render() {
|
|
142
271
|
var _this2 = this;
|
|
143
272
|
|
|
144
|
-
var _this$
|
|
145
|
-
node = _this$
|
|
146
|
-
editor = _this$
|
|
147
|
-
classes = _this$
|
|
148
|
-
attributes = _this$
|
|
149
|
-
onFocus = _this$
|
|
273
|
+
var _this$props4 = this.props,
|
|
274
|
+
node = _this$props4.node,
|
|
275
|
+
editor = _this$props4.editor,
|
|
276
|
+
classes = _this$props4.classes,
|
|
277
|
+
attributes = _this$props4.attributes,
|
|
278
|
+
onFocus = _this$props4.onFocus;
|
|
150
279
|
var active = editor.value.isFocused && editor.value.selection.hasEdgeIn(node);
|
|
151
280
|
var src = node.data.get('src');
|
|
152
281
|
var percent = node.data.get('percent');
|
|
@@ -155,7 +284,7 @@ var Component = /*#__PURE__*/function (_React$Component) {
|
|
|
155
284
|
log('[render] node.data:', node.data);
|
|
156
285
|
var size = this.getSize(node.data);
|
|
157
286
|
log('[render] style:', size);
|
|
158
|
-
var className = (0, _classnames["default"])(classes.root,
|
|
287
|
+
var className = (0, _classnames["default"])(classes.root, !loaded && classes.loading, deleteStatus === 'pending' && classes.pendingDelete);
|
|
159
288
|
var progressClasses = (0, _classnames["default"])(classes.progress, loaded && classes.hideProgress);
|
|
160
289
|
return [/*#__PURE__*/_react["default"].createElement("span", {
|
|
161
290
|
key: 'sp1'
|
|
@@ -167,13 +296,21 @@ var Component = /*#__PURE__*/function (_React$Component) {
|
|
|
167
296
|
mode: "determinate",
|
|
168
297
|
value: percent > 0 ? percent : 0,
|
|
169
298
|
className: progressClasses
|
|
170
|
-
}), /*#__PURE__*/_react["default"].createElement("
|
|
171
|
-
|
|
172
|
-
}, attributes, {
|
|
173
|
-
|
|
174
|
-
|
|
299
|
+
}), /*#__PURE__*/_react["default"].createElement("div", {
|
|
300
|
+
className: classes.imageContainer
|
|
301
|
+
}, /*#__PURE__*/_react["default"].createElement("img", _extends({}, attributes, {
|
|
302
|
+
className: (0, _classnames["default"])(classes.image, active && classes.active),
|
|
303
|
+
ref: function ref(_ref2) {
|
|
304
|
+
_this2.img = _ref2;
|
|
305
|
+
},
|
|
306
|
+
src: src,
|
|
307
|
+
style: size,
|
|
308
|
+
onLoad: this.loadImage
|
|
309
|
+
})), /*#__PURE__*/_react["default"].createElement("div", {
|
|
310
|
+
ref: function ref(_ref3) {
|
|
311
|
+
_this2.resize = _ref3;
|
|
175
312
|
},
|
|
176
|
-
|
|
313
|
+
className: (0, _classnames["default"])(classes.resize, 'resize')
|
|
177
314
|
}))), /*#__PURE__*/_react["default"].createElement("span", {
|
|
178
315
|
key: 'sp2'
|
|
179
316
|
}, "\xA0")];
|
|
@@ -194,7 +331,9 @@ _defineProperty(Component, "propTypes", {
|
|
|
194
331
|
classes: _propTypes["default"].object.isRequired,
|
|
195
332
|
attributes: _propTypes["default"].object,
|
|
196
333
|
onFocus: _propTypes["default"].func,
|
|
197
|
-
onBlur: _propTypes["default"].func
|
|
334
|
+
onBlur: _propTypes["default"].func,
|
|
335
|
+
maxImageWidth: _propTypes["default"].number,
|
|
336
|
+
maxImageHeight: _propTypes["default"].number
|
|
198
337
|
});
|
|
199
338
|
|
|
200
339
|
var styles = function styles(theme) {
|
|
@@ -234,12 +373,34 @@ var styles = function styles(theme) {
|
|
|
234
373
|
display: 'inline-block',
|
|
235
374
|
transition: 'opacity 200ms linear'
|
|
236
375
|
},
|
|
237
|
-
active: {
|
|
238
|
-
border: "solid 1px ".concat(theme.palette.primary.main)
|
|
239
|
-
},
|
|
240
376
|
"delete": {
|
|
241
377
|
position: 'absolute',
|
|
242
378
|
right: 0
|
|
379
|
+
},
|
|
380
|
+
imageContainer: {
|
|
381
|
+
position: 'relative',
|
|
382
|
+
width: 'fit-content',
|
|
383
|
+
display: 'flex',
|
|
384
|
+
alignItems: 'center',
|
|
385
|
+
'&&:hover > .resize': {
|
|
386
|
+
display: 'block'
|
|
387
|
+
}
|
|
388
|
+
},
|
|
389
|
+
active: {
|
|
390
|
+
border: "solid 1px ".concat(theme.palette.primary.main)
|
|
391
|
+
},
|
|
392
|
+
resize: {
|
|
393
|
+
backgroundColor: theme.palette.primary.main,
|
|
394
|
+
cursor: 'col-resize',
|
|
395
|
+
height: '35px',
|
|
396
|
+
width: '5px',
|
|
397
|
+
borderRadius: 8,
|
|
398
|
+
marginLeft: '5px',
|
|
399
|
+
marginRight: '10px',
|
|
400
|
+
display: 'none'
|
|
401
|
+
},
|
|
402
|
+
drawableHeight: {
|
|
403
|
+
minHeight: 350
|
|
243
404
|
}
|
|
244
405
|
};
|
|
245
406
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/plugins/image/component.jsx"],"names":["log","size","s","Component","percent","multiplier","img","naturalWidth","naturalHeight","width","floored","parseInt","toFixed","props","node","editor","resizePercent","data","get","update","set","getWidth","getHeight","w","getPercentFromWidth","equals","change","c","setNodeByKey","key","applySizeData","height","objectFit","classes","attributes","onFocus","active","value","isFocused","selection","hasEdgeIn","src","loaded","deleteStatus","getSize","className","root","loading","pendingDelete","progressClasses","progress","hideProgress","r","React","SlatePropTypes","isRequired","PropTypes","shape","func","object","onBlur","styles","theme","portal","position","opacity","transition","floatingButtonRow","backgroundColor","borderRadius","display","padding","border","boxShadow","left","top","palette","primary","main","right"],"mappings":"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","sourcesContent":["import LinearProgress from '@material-ui/core/LinearProgress';\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport classNames from 'classnames';\nimport debug from 'debug';\nimport { withStyles } from '@material-ui/core/styles';\nimport SlatePropTypes from 'slate-prop-types';\n\nconst log = debug('@pie-lib:editable-html:plugins:image:component');\n\nconst size = s => (s ? `${s}px` : 'auto');\n\nexport class Component extends React.Component {\n static propTypes = {\n node: SlatePropTypes.node.isRequired,\n editor: PropTypes.shape({\n change: PropTypes.func.isRequired,\n value: PropTypes.object\n }).isRequired,\n classes: PropTypes.object.isRequired,\n attributes: PropTypes.object,\n onFocus: PropTypes.func,\n onBlur: PropTypes.func\n };\n\n getWidth = percent => {\n const multiplier = percent / 100;\n return this.img.naturalWidth * multiplier;\n };\n\n getHeight = percent => {\n const multiplier = percent / 100;\n return this.img.naturalHeight * multiplier;\n };\n\n getPercentFromWidth = width => {\n var floored = (width / this.img.naturalWidth) * 4;\n return parseInt(floored.toFixed(0) * 25, 10);\n };\n\n applySizeData = () => {\n const { node, editor } = this.props;\n\n const resizePercent = node.data.get('resizePercent');\n log('[applySizeData]: resizePercent: ', resizePercent);\n\n let update = node.data;\n\n if (resizePercent) {\n update = update.set('width', this.getWidth(resizePercent));\n update = update.set('height', this.getHeight(resizePercent));\n } else {\n const w = update.get('width');\n if (w) {\n update = update.set('resizePercent', this.getPercentFromWidth(w));\n }\n }\n\n log('[applySizeData] update: ', update);\n\n if (!update.equals(node.data)) {\n editor.change(c => c.setNodeByKey(node.key, { data: update }));\n }\n };\n\n componentDidMount() {\n this.applySizeData();\n }\n\n componentDidUpdate() {\n this.applySizeData();\n }\n\n getSize(data) {\n return {\n width: size(data.get('width')),\n height: size(data.get('height')),\n objectFit: 'contain'\n };\n }\n\n render() {\n const { node, editor, classes, attributes, onFocus } = this.props;\n const active = editor.value.isFocused && editor.value.selection.hasEdgeIn(node);\n const src = node.data.get('src');\n const percent = node.data.get('percent');\n const loaded = node.data.get('loaded') !== false;\n const deleteStatus = node.data.get('deleteStatus');\n\n log('[render] node.data:', node.data);\n\n const size = this.getSize(node.data);\n\n log('[render] style:', size);\n\n const className = classNames(\n classes.root,\n active && classes.active,\n !loaded && classes.loading,\n deleteStatus === 'pending' && classes.pendingDelete\n );\n\n const progressClasses = classNames(classes.progress, loaded && classes.hideProgress);\n\n return [\n <span key={'sp1'}> </span>,\n <div key={'comp'} onFocus={onFocus} className={className}>\n <LinearProgress\n mode=\"determinate\"\n value={percent > 0 ? percent : 0}\n className={progressClasses}\n />\n <img src={src} {...attributes} ref={r => (this.img = r)} style={size} />\n </div>,\n <span key={'sp2'}> </span>\n ];\n }\n}\n\nconst styles = theme => ({\n portal: {\n position: 'absolute',\n opacity: 0,\n transition: 'opacity 200ms linear'\n },\n floatingButtonRow: {\n backgroundColor: 'white',\n borderRadius: '1px',\n display: 'flex',\n padding: '10px',\n border: 'solid 1px #eeeeee',\n boxShadow:\n '0px 1px 5px 0px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 3px 1px -2px rgba(0, 0, 0, 0.12)'\n },\n progress: {\n position: 'absolute',\n left: '0',\n width: '100%',\n top: '0%',\n transition: 'opacity 200ms linear'\n },\n hideProgress: {\n opacity: 0\n },\n loading: {\n opacity: 0.3\n },\n pendingDelete: {\n opacity: 0.3\n },\n root: {\n position: 'relative',\n border: 'solid 1px white',\n display: 'inline-block',\n transition: 'opacity 200ms linear'\n },\n active: {\n border: `solid 1px ${theme.palette.primary.main}`\n },\n delete: {\n position: 'absolute',\n right: 0\n }\n});\n\nexport default withStyles(styles)(Component);\n"],"file":"component.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/plugins/image/component.jsx"],"names":["log","size","s","Component","percent","multiplier","img","naturalWidth","naturalHeight","width","floored","parseInt","toFixed","props","node","editor","update","data","w","get","set","getPercentFromWidth","equals","change","c","setNodeByKey","key","window","addEventListener","startResizing","stopResizing","maxImageWidth","maxImageHeight","box","style","dimensions","height","updateImageDimensions","setState","e","bounds","target","getBoundingClientRect","clientX","left","clientY","top","hasMinimumWidth","hasDimensionsConstraints","removeEventListener","initialDim","nextDim","keepAspectRatio","resizeType","imageAspectRatio","applySizeData","resizeHandle","resize","initialiseResize","objectFit","classes","attributes","onFocus","active","value","isFocused","selection","hasEdgeIn","src","loaded","deleteStatus","getSize","className","root","loading","pendingDelete","progressClasses","progress","hideProgress","imageContainer","image","ref","loadImage","React","SlatePropTypes","isRequired","PropTypes","shape","func","object","onBlur","number","styles","theme","portal","position","opacity","transition","floatingButtonRow","backgroundColor","borderRadius","display","padding","border","boxShadow","right","alignItems","palette","primary","main","cursor","marginLeft","marginRight","drawableHeight","minHeight"],"mappings":"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","sourcesContent":["import LinearProgress from '@material-ui/core/LinearProgress';\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport classNames from 'classnames';\nimport debug from 'debug';\nimport { withStyles } from '@material-ui/core/styles';\nimport SlatePropTypes from 'slate-prop-types';\n\nconst log = debug('@pie-lib:editable-html:plugins:image:component');\n\nconst size = s => (s ? `${s}px` : 'auto');\n\nexport class Component extends React.Component {\n static propTypes = {\n node: SlatePropTypes.node.isRequired,\n editor: PropTypes.shape({\n change: PropTypes.func.isRequired,\n value: PropTypes.object\n }).isRequired,\n classes: PropTypes.object.isRequired,\n attributes: PropTypes.object,\n onFocus: PropTypes.func,\n onBlur: PropTypes.func,\n maxImageWidth: PropTypes.number,\n maxImageHeight: PropTypes.number,\n };\n\n getWidth = percent => {\n const multiplier = percent / 100;\n return this.img.naturalWidth * multiplier;\n };\n\n getHeight = percent => {\n const multiplier = percent / 100;\n return this.img.naturalHeight * multiplier;\n };\n\n getPercentFromWidth = width => {\n var floored = (width / this.img.naturalWidth) * 4;\n return parseInt(floored.toFixed(0) * 25, 10);\n };\n\n applySizeData = () => {\n const { node, editor } = this.props;\n\n let update = node.data;\n\n const w = update.get('width');\n if (w) {\n update = update.set('resizePercent', this.getPercentFromWidth(w));\n }\n\n log(\"[applySizeData] update: \", update);\n\n if (!update.equals(node.data)) {\n editor.change(c => c.setNodeByKey(node.key, { data: update }));\n }\n };\n\n initialiseResize = () => {\n window.addEventListener('mousemove', this.startResizing, false);\n window.addEventListener('mouseup', this.stopResizing, false);\n };\n\n componentDidMount() {\n this.applySizeData();\n\n const resizeHandle = this.resize;\n\n if (resizeHandle) {\n resizeHandle.addEventListener('mousedown', this.initialiseResize, false);\n }\n }\n\n componentDidUpdate() {\n this.applySizeData();\n }\n\n getSize(data) {\n return {\n width: size(data.get('width')),\n height: size(data.get('height')),\n objectFit: 'contain'\n };\n }\n\n loadImage = () => {\n let { maxImageWidth, maxImageHeight } = this.props || {};\n maxImageWidth = maxImageWidth || 700;\n maxImageHeight = maxImageHeight || 900;\n\n const box = this.img;\n\n //on first load\n if (!box.style.width || box.style.width === 'auto') {\n const dimensions = { width: box && box.naturalWidth || 100, height: box && box.naturalHeight || 100 };\n\n const { width, height } = this.updateImageDimensions(\n dimensions,\n {\n width: dimensions.width < maxImageWidth ? dimensions.width : maxImageWidth,\n height: dimensions.height < maxImageHeight ? dimensions.height : maxImageHeight\n },\n true\n );\n\n box.style.width = `${width}px`;\n box.style.height = `${height}px`;\n\n this.setState({\n dimensions: { height: height, width: width },\n });\n\n const { node, editor } = this.props;\n\n let update = node.data;\n\n update = update.set('width', width);\n update = update.set('height', height);\n\n if (!update.equals(node.data)) {\n editor.change(c => c.setNodeByKey(node.key, { data: update }));\n }\n }\n };\n\n startResizing = (e) => {\n const bounds = e.target.getBoundingClientRect();\n const box = this.img;\n const dimensions = { width: box && box.naturalWidth || 100, height: box && box.naturalHeight || 100};\n\n const { width, height } = this.updateImageDimensions(\n dimensions,\n {\n width: e.clientX - bounds.left,\n height: e.clientY - bounds.top\n },\n true\n );\n\n const hasMinimumWidth = width > 50 && height > 50;\n const hasDimensionsConstraints = width <= 700 && height <= 900;\n\n if (hasMinimumWidth && hasDimensionsConstraints && box) {\n box.style.width = `${width}px`;\n box.style.height = `${height}px`;\n\n this.setState({\n dimensions: { height: height, width: width }\n });\n\n const { node, editor } = this.props;\n\n let update = node.data;\n\n update = update.set('width', width);\n update = update.set('height', height);\n\n if (!update.equals(node.data)) {\n editor.change(c => c.setNodeByKey(node.key, { data: update }));\n }\n }\n };\n\n stopResizing = () => {\n window.removeEventListener('mousemove', this.startResizing, false);\n window.removeEventListener('mouseup', this.stopResizing, false);\n };\n\n updateImageDimensions = (initialDim, nextDim, keepAspectRatio, resizeType) => {\n // if we want to keep image aspect ratio\n if (keepAspectRatio) {\n const imageAspectRatio = initialDim.width / initialDim.height;\n\n if (resizeType === 'height') {\n // if we want to change image height => we update the width accordingly\n return {\n width: nextDim.height * imageAspectRatio,\n height: nextDim.height\n }\n }\n\n // if we want to change image width => we update the height accordingly\n return {\n width: nextDim.width,\n height: nextDim.width / imageAspectRatio\n }\n }\n\n // if we don't want to keep aspect ratio, we just update both values\n return {\n width: nextDim.width,\n height: nextDim.height\n }\n };\n\n\n render() {\n const { node, editor, classes, attributes, onFocus } = this.props;\n const active = editor.value.isFocused && editor.value.selection.hasEdgeIn(node);\n const src = node.data.get('src');\n const percent = node.data.get('percent');\n const loaded = node.data.get('loaded') !== false;\n const deleteStatus = node.data.get('deleteStatus');\n\n log('[render] node.data:', node.data);\n\n const size = this.getSize(node.data);\n\n log('[render] style:', size);\n\n const className = classNames(\n classes.root,\n !loaded && classes.loading,\n deleteStatus === 'pending' && classes.pendingDelete\n );\n\n const progressClasses = classNames(classes.progress, loaded && classes.hideProgress);\n\n return [\n <span key={'sp1'}> </span>,\n <div key={'comp'} onFocus={onFocus} className={className}>\n <LinearProgress\n mode=\"determinate\"\n value={percent > 0 ? percent : 0}\n className={progressClasses}\n />\n <div className={classes.imageContainer}>\n <img\n {...attributes}\n className={classNames(classes.image, active && classes.active)}\n ref={ref => {\n this.img = ref;\n }}\n src={src}\n style={size}\n onLoad={this.loadImage}\n />\n <div ref={ref => {\n this.resize = ref;\n }} className={classNames(classes.resize, 'resize')}/>\n </div>\n </div>,\n <span key={'sp2'}> </span>\n ];\n }\n}\n\nconst styles = theme => ({\n portal: {\n position: 'absolute',\n opacity: 0,\n transition: 'opacity 200ms linear'\n },\n floatingButtonRow: {\n backgroundColor: 'white',\n borderRadius: '1px',\n display: 'flex',\n padding: '10px',\n border: 'solid 1px #eeeeee',\n boxShadow:\n '0px 1px 5px 0px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 3px 1px -2px rgba(0, 0, 0, 0.12)'\n },\n progress: {\n position: 'absolute',\n left: '0',\n width: '100%',\n top: '0%',\n transition: 'opacity 200ms linear'\n },\n hideProgress: {\n opacity: 0\n },\n loading: {\n opacity: 0.3\n },\n pendingDelete: {\n opacity: 0.3\n },\n root: {\n position: 'relative',\n border: 'solid 1px white',\n display: 'inline-block',\n transition: 'opacity 200ms linear'\n },\n delete: {\n position: 'absolute',\n right: 0\n },\n imageContainer: {\n position: 'relative',\n width: 'fit-content',\n display: 'flex',\n alignItems: 'center',\n\n '&&:hover > .resize': {\n display: 'block'\n }\n },\n active: {\n border: `solid 1px ${theme.palette.primary.main}`\n },\n resize: {\n backgroundColor: theme.palette.primary.main,\n cursor: 'col-resize',\n height: '35px',\n width: '5px',\n borderRadius: 8,\n marginLeft: '5px',\n marginRight: '10px',\n display: 'none'\n },\n drawableHeight: {\n minHeight: 350,\n },\n});\n\nexport default withStyles(styles)(Component);\n"],"file":"component.js"}
|
|
@@ -7,8 +7,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports["default"] = exports.ImageToolbar = void 0;
|
|
9
9
|
|
|
10
|
-
var _toolbarButtons = require("../toolbar/toolbar-buttons");
|
|
11
|
-
|
|
12
10
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
11
|
|
|
14
12
|
var _react = _interopRequireDefault(require("react"));
|
|
@@ -43,76 +41,25 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
43
41
|
|
|
44
42
|
var log = (0, _debug["default"])('@pie-lib:editable-html:plugins:image:image-toolbar');
|
|
45
43
|
|
|
46
|
-
var PercentButton = function PercentButton(_ref) {
|
|
47
|
-
var percent = _ref.percent,
|
|
48
|
-
active = _ref.active,
|
|
49
|
-
onClick = _ref.onClick;
|
|
50
|
-
var label = "".concat(percent, "%");
|
|
51
|
-
return /*#__PURE__*/_react["default"].createElement(_toolbarButtons.MarkButton, {
|
|
52
|
-
active: active,
|
|
53
|
-
onToggle: function onToggle() {
|
|
54
|
-
return onClick(percent);
|
|
55
|
-
},
|
|
56
|
-
label: label
|
|
57
|
-
}, label);
|
|
58
|
-
};
|
|
59
|
-
|
|
60
|
-
PercentButton.propTypes = {
|
|
61
|
-
percent: _propTypes["default"].number.isRequired,
|
|
62
|
-
active: _propTypes["default"].bool.isRequired,
|
|
63
|
-
onClick: _propTypes["default"].func.isRequired
|
|
64
|
-
};
|
|
65
|
-
|
|
66
44
|
var ImageToolbar = /*#__PURE__*/function (_React$Component) {
|
|
67
45
|
_inherits(ImageToolbar, _React$Component);
|
|
68
46
|
|
|
69
47
|
var _super = _createSuper(ImageToolbar);
|
|
70
48
|
|
|
71
49
|
function ImageToolbar() {
|
|
72
|
-
var _this;
|
|
73
|
-
|
|
74
50
|
_classCallCheck(this, ImageToolbar);
|
|
75
51
|
|
|
76
|
-
|
|
77
|
-
args[_key] = arguments[_key];
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
_this = _super.call.apply(_super, [this].concat(args));
|
|
81
|
-
|
|
82
|
-
_defineProperty(_assertThisInitialized(_this), "onPercentClick", function (percent) {
|
|
83
|
-
log('[onPercentClick]: percent:', percent);
|
|
84
|
-
|
|
85
|
-
_this.props.onChange(percent);
|
|
86
|
-
});
|
|
87
|
-
|
|
88
|
-
return _this;
|
|
52
|
+
return _super.apply(this, arguments);
|
|
89
53
|
}
|
|
90
54
|
|
|
91
55
|
_createClass(ImageToolbar, [{
|
|
92
56
|
key: "render",
|
|
93
57
|
value: function render() {
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
percent = _this$props.percent;
|
|
58
|
+
// Don't remove toolbar since we will have other new buttons
|
|
59
|
+
var classes = this.props.classes;
|
|
97
60
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
98
61
|
className: classes.holder
|
|
99
|
-
}
|
|
100
|
-
percent: 25,
|
|
101
|
-
active: percent === 25,
|
|
102
|
-
onClick: this.onPercentClick
|
|
103
|
-
}), /*#__PURE__*/_react["default"].createElement(PercentButton, {
|
|
104
|
-
percent: 50,
|
|
105
|
-
active: percent === 50,
|
|
106
|
-
onClick: this.onPercentClick
|
|
107
|
-
}), /*#__PURE__*/_react["default"].createElement(PercentButton, {
|
|
108
|
-
active: percent === 75,
|
|
109
|
-
percent: 75,
|
|
110
|
-
onClick: this.onPercentClick
|
|
111
|
-
}), /*#__PURE__*/_react["default"].createElement(PercentButton, {
|
|
112
|
-
percent: 100,
|
|
113
|
-
active: percent === 100 || !percent,
|
|
114
|
-
onClick: this.onPercentClick
|
|
115
|
-
}));
|
|
62
|
+
});
|
|
116
63
|
}
|
|
117
64
|
}]);
|
|
118
65
|
|
|
@@ -122,7 +69,6 @@ var ImageToolbar = /*#__PURE__*/function (_React$Component) {
|
|
|
122
69
|
exports.ImageToolbar = ImageToolbar;
|
|
123
70
|
|
|
124
71
|
_defineProperty(ImageToolbar, "propTypes", {
|
|
125
|
-
percent: _propTypes["default"].number.isRequired,
|
|
126
72
|
onChange: _propTypes["default"].func.isRequired,
|
|
127
73
|
classes: _propTypes["default"].object.isRequired
|
|
128
74
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/plugins/image/image-toolbar.jsx"],"names":["log","
|
|
1
|
+
{"version":3,"sources":["../../../src/plugins/image/image-toolbar.jsx"],"names":["log","ImageToolbar","classes","props","holder","React","Component","onChange","PropTypes","func","isRequired","object","styles","theme","paddingLeft","spacing","unit","display","alignItems"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,oDAAN,CAAZ;;IAEaC,Y;;;;;;;;;;;;;WAMX,kBAAS;AACP;AACA,UAAQC,OAAR,GAAoB,KAAKC,KAAzB,CAAQD,OAAR;AACA,0BACE;AAAK,QAAA,SAAS,EAAEA,OAAO,CAACE;AAAxB,QADF;AAID;;;;EAb+BC,kBAAMC,S;;;;gBAA3BL,Y,eACQ;AACjBM,EAAAA,QAAQ,EAAEC,sBAAUC,IAAV,CAAeC,UADR;AAEjBR,EAAAA,OAAO,EAAEM,sBAAUG,MAAV,CAAiBD;AAFT,C;;AAerB,IAAME,MAAM,GAAG,SAATA,MAAS,CAAAC,KAAK;AAAA,SAAK;AACvBT,IAAAA,MAAM,EAAE;AACNU,MAAAA,WAAW,EAAED,KAAK,CAACE,OAAN,CAAcC,IADrB;AAENC,MAAAA,OAAO,EAAE,MAFH;AAGNC,MAAAA,UAAU,EAAE;AAHN;AADe,GAAL;AAAA,CAApB;;eAQe,wBAAWN,MAAX,EAAmBX,YAAnB,C","sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\nimport debug from 'debug';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst log = debug('@pie-lib:editable-html:plugins:image:image-toolbar');\n\nexport class ImageToolbar extends React.Component {\n static propTypes = {\n onChange: PropTypes.func.isRequired,\n classes: PropTypes.object.isRequired\n };\n\n render() {\n // Don't remove toolbar since we will have other new buttons\n const { classes } = this.props;\n return (\n <div className={classes.holder}>\n </div>\n );\n }\n}\n\nconst styles = theme => ({\n holder: {\n paddingLeft: theme.spacing.unit,\n display: 'flex',\n alignItems: 'center'\n }\n});\n\nexport default withStyles(styles)(ImageToolbar);\n"],"file":"image-toolbar.js"}
|
|
@@ -128,7 +128,9 @@ function ImagePlugin(opts) {
|
|
|
128
128
|
var all = Object.assign({
|
|
129
129
|
onDelete: opts.onDelete,
|
|
130
130
|
onFocus: opts.onFocus,
|
|
131
|
-
onBlur: opts.onBlur
|
|
131
|
+
onBlur: opts.onBlur,
|
|
132
|
+
maxImageWidth: opts.maxImageWidth,
|
|
133
|
+
maxImageHeight: opts.maxImageHeight
|
|
132
134
|
}, props);
|
|
133
135
|
return /*#__PURE__*/_react["default"].createElement(_component["default"], all);
|
|
134
136
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/plugins/image/index.jsx"],"names":["log","ImagePlugin","opts","toolbar","insertImageRequested","icon","onClick","value","onChange","inline","Inline","create","type","isVoid","data","loaded","src","undefined","change","insertInline","getValue","InsertImageHandler","supports","node","object","customToolbar","onToolbarDone","percent","get","resizePercent","update","toObject","setNodeByKey","key","Tb","showDone","name","deleteNode","e","preventDefault","onDelete","merge","Data","deleteStatus","err","v","removeNodeByKey","stopReset","imgPendingInsertion","document","findDescendant","n","renderNode","props","all","Object","assign","onFocus","onBlur","normalizeNode","textNodeMap","updateNodesArray","index","d","text","push","length","withoutNormalization","forEach","insertTextByKey","serialization","deserialize","el","tagName","toLowerCase","style","width","height","parseInt","replace","out","getAttribute","serialize","objectFit"],"mappings":"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","sourcesContent":["import { Data, Inline } from 'slate';\n\nimport Image from '@material-ui/icons/Image';\nimport ImageComponent from './component';\nimport ImageToolbar from './image-toolbar';\nimport InsertImageHandler from './insert-image-handler';\nimport React from 'react';\nimport debug from 'debug';\n\nconst log = debug('@pie-lib:editable-html:plugins:image');\n\nexport default function ImagePlugin(opts) {\n const toolbar = opts.insertImageRequested && {\n icon: <Image />,\n onClick: (value, onChange) => {\n log('[toolbar] onClick');\n const inline = Inline.create({\n type: 'image',\n isVoid: true,\n data: {\n loaded: false,\n src: undefined\n }\n });\n\n const change = value.change().insertInline(inline);\n onChange(change);\n opts.insertImageRequested(getValue => new InsertImageHandler(inline, getValue, onChange));\n },\n supports: node => node.object === 'inline' && node.type === 'image',\n customToolbar: (node, value, onToolbarDone) => {\n const percent = node.data.get('resizePercent');\n\n const onChange = resizePercent => {\n const update = {\n ...node.data.toObject(),\n resizePercent\n };\n\n const change = value.change().setNodeByKey(node.key, { data: update });\n onToolbarDone(change, false);\n };\n\n const Tb = () => <ImageToolbar percent={percent || 100} onChange={onChange} />;\n return Tb;\n },\n showDone: true\n };\n\n return {\n name: 'image',\n toolbar,\n deleteNode: (e, node, value, onChange) => {\n e.preventDefault();\n if (opts.onDelete) {\n const update = node.data.merge(Data.create({ deleteStatus: 'pending' }));\n\n let change = value.change().setNodeByKey(node.key, { data: update });\n\n onChange(change);\n opts.onDelete(node.data.get('src'), (err, v) => {\n if (!err) {\n change = v.change().removeNodeByKey(node.key);\n } else {\n log('[error]: ', err);\n change = v\n .change()\n .setNodeByKey(node.key, node.data.merge(Data.create({ deleteStatus: 'failed' })));\n }\n onChange(change);\n });\n } else {\n let change = value.change().removeNodeByKey(node.key);\n onChange(change);\n }\n },\n stopReset: value => {\n const imgPendingInsertion = value.document.findDescendant(n => {\n if (n.type !== 'image') {\n return;\n }\n return n.data.get('loaded') === false;\n });\n /** don't reset if there is an image pending insertion */\n return imgPendingInsertion !== undefined && imgPendingInsertion !== null;\n },\n renderNode(props) {\n if (props.node.type === 'image') {\n const all = Object.assign(\n {\n onDelete: opts.onDelete,\n onFocus: opts.onFocus,\n onBlur: opts.onBlur\n },\n props\n );\n return <ImageComponent {...all} />;\n }\n },\n normalizeNode: node => {\n const textNodeMap = {};\n const updateNodesArray = [];\n let index = 0;\n\n if (node.object !== 'document') return;\n\n node.findDescendant(d => {\n if (d.object === 'text') {\n textNodeMap[index] = d;\n }\n\n if (d.type === 'image') {\n if (index > 0 && textNodeMap[index - 1] && textNodeMap[index - 1].text === '') {\n updateNodesArray.push(textNodeMap[index - 1]);\n }\n }\n\n index++;\n });\n\n if (!updateNodesArray.length) return;\n\n return change => {\n change.withoutNormalization(() => {\n updateNodesArray.forEach(n => change.insertTextByKey(n.key, 0, ' '));\n });\n };\n }\n };\n}\n\nexport const serialization = {\n deserialize(el /*, next*/) {\n const name = el.tagName.toLowerCase();\n if (name !== 'img') return;\n\n log('deserialize: ', name);\n const style = el.style || { width: '', height: '' };\n const width = parseInt(style.width.replace('px', ''), 10) || null;\n const height = parseInt(style.height.replace('px', ''), 10) || null;\n\n const out = {\n object: 'inline',\n type: 'image',\n isVoid: true,\n data: {\n src: el.getAttribute('src'),\n width,\n height\n }\n };\n log('return object: ', out);\n return out;\n },\n serialize(object /*, children*/) {\n if (object.type !== 'image') return;\n\n const { data } = object;\n const src = data.get('src');\n const width = data.get('width');\n const height = data.get('height');\n const style = {};\n if (width) {\n style.width = `${width}px`;\n }\n\n if (height) {\n style.height = `${height}px`;\n }\n\n style.objectFit = 'contain';\n\n const props = {\n src,\n style\n };\n\n return <img {...props} />;\n }\n};\n"],"file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/plugins/image/index.jsx"],"names":["log","ImagePlugin","opts","toolbar","insertImageRequested","icon","onClick","value","onChange","inline","Inline","create","type","isVoid","data","loaded","src","undefined","change","insertInline","getValue","InsertImageHandler","supports","node","object","customToolbar","onToolbarDone","percent","get","resizePercent","update","toObject","setNodeByKey","key","Tb","showDone","name","deleteNode","e","preventDefault","onDelete","merge","Data","deleteStatus","err","v","removeNodeByKey","stopReset","imgPendingInsertion","document","findDescendant","n","renderNode","props","all","Object","assign","onFocus","onBlur","maxImageWidth","maxImageHeight","normalizeNode","textNodeMap","updateNodesArray","index","d","text","push","length","withoutNormalization","forEach","insertTextByKey","serialization","deserialize","el","tagName","toLowerCase","style","width","height","parseInt","replace","out","getAttribute","serialize","objectFit"],"mappings":"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","sourcesContent":["import { Data, Inline } from 'slate';\n\nimport Image from '@material-ui/icons/Image';\nimport ImageComponent from './component';\nimport ImageToolbar from './image-toolbar';\nimport InsertImageHandler from './insert-image-handler';\nimport React from 'react';\nimport debug from 'debug';\n\nconst log = debug('@pie-lib:editable-html:plugins:image');\n\nexport default function ImagePlugin(opts) {\n const toolbar = opts.insertImageRequested && {\n icon: <Image />,\n onClick: (value, onChange) => {\n log('[toolbar] onClick');\n const inline = Inline.create({\n type: 'image',\n isVoid: true,\n data: {\n loaded: false,\n src: undefined\n }\n });\n\n const change = value.change().insertInline(inline);\n onChange(change);\n opts.insertImageRequested(getValue => new InsertImageHandler(inline, getValue, onChange));\n },\n supports: node => node.object === 'inline' && node.type === 'image',\n customToolbar: (node, value, onToolbarDone) => {\n const percent = node.data.get('resizePercent');\n\n const onChange = resizePercent => {\n const update = {\n ...node.data.toObject(),\n resizePercent\n };\n\n const change = value.change().setNodeByKey(node.key, { data: update });\n onToolbarDone(change, false);\n };\n\n const Tb = () => <ImageToolbar percent={percent || 100} onChange={onChange} />;\n return Tb;\n },\n showDone: true\n };\n\n return {\n name: 'image',\n toolbar,\n deleteNode: (e, node, value, onChange) => {\n e.preventDefault();\n if (opts.onDelete) {\n const update = node.data.merge(Data.create({ deleteStatus: 'pending' }));\n\n let change = value.change().setNodeByKey(node.key, { data: update });\n\n onChange(change);\n opts.onDelete(node.data.get('src'), (err, v) => {\n if (!err) {\n change = v.change().removeNodeByKey(node.key);\n } else {\n log('[error]: ', err);\n change = v\n .change()\n .setNodeByKey(node.key, node.data.merge(Data.create({ deleteStatus: 'failed' })));\n }\n onChange(change);\n });\n } else {\n let change = value.change().removeNodeByKey(node.key);\n onChange(change);\n }\n },\n stopReset: value => {\n const imgPendingInsertion = value.document.findDescendant(n => {\n if (n.type !== 'image') {\n return;\n }\n return n.data.get('loaded') === false;\n });\n /** don't reset if there is an image pending insertion */\n return imgPendingInsertion !== undefined && imgPendingInsertion !== null;\n },\n renderNode(props) {\n if (props.node.type === 'image') {\n const all = Object.assign(\n {\n onDelete: opts.onDelete,\n onFocus: opts.onFocus,\n onBlur: opts.onBlur,\n maxImageWidth: opts.maxImageWidth,\n maxImageHeight: opts.maxImageHeight,\n },\n props\n );\n return <ImageComponent {...all} />;\n }\n },\n normalizeNode: node => {\n const textNodeMap = {};\n const updateNodesArray = [];\n let index = 0;\n\n if (node.object !== 'document') return;\n\n node.findDescendant(d => {\n if (d.object === 'text') {\n textNodeMap[index] = d;\n }\n\n if (d.type === 'image') {\n if (index > 0 && textNodeMap[index - 1] && textNodeMap[index - 1].text === '') {\n updateNodesArray.push(textNodeMap[index - 1]);\n }\n }\n\n index++;\n });\n\n if (!updateNodesArray.length) return;\n\n return change => {\n change.withoutNormalization(() => {\n updateNodesArray.forEach(n => change.insertTextByKey(n.key, 0, ' '));\n });\n };\n }\n };\n}\n\nexport const serialization = {\n deserialize(el /*, next*/) {\n const name = el.tagName.toLowerCase();\n if (name !== 'img') return;\n\n log('deserialize: ', name);\n const style = el.style || { width: '', height: '' };\n const width = parseInt(style.width.replace('px', ''), 10) || null;\n const height = parseInt(style.height.replace('px', ''), 10) || null;\n\n const out = {\n object: 'inline',\n type: 'image',\n isVoid: true,\n data: {\n src: el.getAttribute('src'),\n width,\n height\n }\n };\n log('return object: ', out);\n return out;\n },\n serialize(object /*, children*/) {\n if (object.type !== 'image') return;\n\n const { data } = object;\n const src = data.get('src');\n const width = data.get('width');\n const height = data.get('height');\n const style = {};\n if (width) {\n style.width = `${width}px`;\n }\n\n if (height) {\n style.height = `${height}px`;\n }\n\n style.objectFit = 'contain';\n\n const props = {\n src,\n style\n };\n\n return <img {...props} />;\n }\n};\n"],"file":"index.js"}
|