phx-react 1.3.1793 → 1.3.1795
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/dist/cjs/components/Breadcrumb/Breadcrumb.js +1 -1
- package/dist/cjs/components/Breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/constants.d.ts +1 -1
- package/dist/cjs/components/TextEditorV2/constants.js +187 -1
- package/dist/cjs/components/TextEditorV2/constants.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/editor.js +4 -1
- package/dist/cjs/components/TextEditorV2/editor.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/nodes/ImageNode.d.ts +99 -3
- package/dist/cjs/components/TextEditorV2/nodes/ImageNode.js +143 -9
- package/dist/cjs/components/TextEditorV2/nodes/ImageNode.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/nodes/InlineImageComponent.d.ts +5 -5
- package/dist/cjs/components/TextEditorV2/nodes/InlineImageComponent.js +66 -66
- package/dist/cjs/components/TextEditorV2/nodes/InlineImageComponent.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/nodes/InlineImageNode.d.ts +90 -1
- package/dist/cjs/components/TextEditorV2/nodes/InlineImageNode.js +128 -5
- package/dist/cjs/components/TextEditorV2/nodes/InlineImageNode.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/nodes/MentionNode.js +2 -0
- package/dist/cjs/components/TextEditorV2/nodes/MentionNode.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/plugins/ImagesPlugin/index.js +1 -0
- package/dist/cjs/components/TextEditorV2/plugins/ImagesPlugin/index.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/plugins/InlineImagePlugin/index.d.ts +9 -0
- package/dist/cjs/components/TextEditorV2/plugins/InlineImagePlugin/index.js +71 -1
- package/dist/cjs/components/TextEditorV2/plugins/InlineImagePlugin/index.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/plugins/PreserveFontSizeOnEnterPlugin/index.d.ts +4 -0
- package/dist/cjs/components/TextEditorV2/plugins/PreserveFontSizeOnEnterPlugin/index.js +37 -0
- package/dist/cjs/components/TextEditorV2/plugins/PreserveFontSizeOnEnterPlugin/index.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/bullet.js +8 -0
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/bullet.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/heading.d.ts +11 -0
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/heading.js +41 -0
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/heading.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/number-bullet.js +8 -0
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/number-bullet.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/text-align.d.ts +7 -1
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/text-align.js +47 -3
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/components/text-align.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/index.js +42 -12
- package/dist/cjs/components/TextEditorV2/plugins/ToolbarPlugin/index.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/style.js +139 -0
- package/dist/cjs/components/TextEditorV2/style.js.map +1 -1
- package/dist/cjs/components/TextEditorV2/ui/ImageResizer.js +1 -1
- package/dist/cjs/components/TextEditorV2/ui/ImageResizer.js.map +1 -1
- package/dist/esm/components/Breadcrumb/Breadcrumb.js +1 -1
- package/dist/esm/components/Breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/esm/components/TextEditorV2/constants.d.ts +1 -1
- package/dist/esm/components/TextEditorV2/constants.js +187 -1
- package/dist/esm/components/TextEditorV2/constants.js.map +1 -1
- package/dist/esm/components/TextEditorV2/editor.js +4 -1
- package/dist/esm/components/TextEditorV2/editor.js.map +1 -1
- package/dist/esm/components/TextEditorV2/nodes/ImageNode.d.ts +99 -3
- package/dist/esm/components/TextEditorV2/nodes/ImageNode.js +143 -9
- package/dist/esm/components/TextEditorV2/nodes/ImageNode.js.map +1 -1
- package/dist/esm/components/TextEditorV2/nodes/InlineImageComponent.d.ts +5 -5
- package/dist/esm/components/TextEditorV2/nodes/InlineImageComponent.js +66 -65
- package/dist/esm/components/TextEditorV2/nodes/InlineImageComponent.js.map +1 -1
- package/dist/esm/components/TextEditorV2/nodes/InlineImageNode.d.ts +90 -1
- package/dist/esm/components/TextEditorV2/nodes/InlineImageNode.js +128 -5
- package/dist/esm/components/TextEditorV2/nodes/InlineImageNode.js.map +1 -1
- package/dist/esm/components/TextEditorV2/nodes/MentionNode.js +2 -0
- package/dist/esm/components/TextEditorV2/nodes/MentionNode.js.map +1 -1
- package/dist/esm/components/TextEditorV2/plugins/ImagesPlugin/index.js +1 -0
- package/dist/esm/components/TextEditorV2/plugins/ImagesPlugin/index.js.map +1 -1
- package/dist/esm/components/TextEditorV2/plugins/InlineImagePlugin/index.d.ts +9 -0
- package/dist/esm/components/TextEditorV2/plugins/InlineImagePlugin/index.js +71 -1
- package/dist/esm/components/TextEditorV2/plugins/InlineImagePlugin/index.js.map +1 -1
- package/dist/esm/components/TextEditorV2/plugins/PreserveFontSizeOnEnterPlugin/index.d.ts +4 -0
- package/dist/esm/components/TextEditorV2/plugins/PreserveFontSizeOnEnterPlugin/index.js +37 -0
- package/dist/esm/components/TextEditorV2/plugins/PreserveFontSizeOnEnterPlugin/index.js.map +1 -1
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/bullet.js +9 -1
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/bullet.js.map +1 -1
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/heading.d.ts +11 -0
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/heading.js +39 -0
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/heading.js.map +1 -1
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/number-bullet.js +9 -1
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/number-bullet.js.map +1 -1
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/text-align.d.ts +7 -1
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/text-align.js +48 -4
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/components/text-align.js.map +1 -1
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/index.js +43 -13
- package/dist/esm/components/TextEditorV2/plugins/ToolbarPlugin/index.js.map +1 -1
- package/dist/esm/components/TextEditorV2/style.js +139 -0
- package/dist/esm/components/TextEditorV2/style.js.map +1 -1
- package/dist/esm/components/TextEditorV2/ui/ImageResizer.js +1 -1
- package/dist/esm/components/TextEditorV2/ui/ImageResizer.js.map +1 -1
- package/package.json +1 -1
|
@@ -17,27 +17,66 @@ const react_1 = require("react");
|
|
|
17
17
|
const ImageComponent = React.lazy(
|
|
18
18
|
// @ts-ignore
|
|
19
19
|
() => Promise.resolve().then(() => tslib_1.__importStar(require('./ImageComponent'))));
|
|
20
|
+
/**
|
|
21
|
+
* Gets the image alignment position encoded in a wrapper class name.
|
|
22
|
+
* @param className Wrapper class name to inspect.
|
|
23
|
+
* @returns Matching image position, or undefined when no position class exists.
|
|
24
|
+
*/
|
|
25
|
+
function getPositionFromClassName(className) {
|
|
26
|
+
if (className.includes('position-left')) {
|
|
27
|
+
return 'left';
|
|
28
|
+
}
|
|
29
|
+
if (className.includes('position-right')) {
|
|
30
|
+
return 'right';
|
|
31
|
+
}
|
|
32
|
+
if (className.includes('position-center')) {
|
|
33
|
+
return 'center';
|
|
34
|
+
}
|
|
35
|
+
return undefined;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Converts an imported DOM image element into an ImageNode.
|
|
39
|
+
* @param domNode DOM node provided by Lexical import.
|
|
40
|
+
* @returns DOM conversion output for image nodes, or null for unsupported nodes.
|
|
41
|
+
*/
|
|
20
42
|
function convertImageElement(domNode) {
|
|
43
|
+
var _a;
|
|
21
44
|
if (domNode instanceof HTMLImageElement) {
|
|
22
45
|
const { alt: altText, height, src, width } = domNode;
|
|
23
|
-
const
|
|
46
|
+
const position = getPositionFromClassName(((_a = domNode.parentElement) === null || _a === void 0 ? void 0 : _a.className) || '');
|
|
47
|
+
const node = $createImageNode({ altText, height, position, src, width });
|
|
24
48
|
return { node };
|
|
25
49
|
}
|
|
26
50
|
return null;
|
|
27
51
|
}
|
|
28
52
|
class ImageNode extends lexical_1.DecoratorNode {
|
|
53
|
+
/**
|
|
54
|
+
* Gets the Lexical node type for image nodes.
|
|
55
|
+
* @returns Image node type.
|
|
56
|
+
*/
|
|
29
57
|
static getType() {
|
|
30
58
|
return 'image';
|
|
31
59
|
}
|
|
60
|
+
/**
|
|
61
|
+
* Clones an existing image node.
|
|
62
|
+
* @param node Image node to clone.
|
|
63
|
+
* @returns Cloned image node.
|
|
64
|
+
*/
|
|
32
65
|
static clone(node) {
|
|
33
|
-
return new ImageNode(node.__src, node.__altText, node.__maxWidth, node.__width, node.__height, node.__showCaption, node.__caption, node.__captionsEnabled, node.__key);
|
|
66
|
+
return new ImageNode(node.__src, node.__altText, node.__maxWidth, node.__width, node.__height, node.__showCaption, node.__caption, node.__position, node.__captionsEnabled, node.__key);
|
|
34
67
|
}
|
|
68
|
+
/**
|
|
69
|
+
* Imports a serialized image node into the editor state.
|
|
70
|
+
* @param serializedNode Serialized image node payload.
|
|
71
|
+
* @returns Hydrated image node.
|
|
72
|
+
*/
|
|
35
73
|
static importJSON(serializedNode) {
|
|
36
|
-
const { altText, caption, height, maxWidth, showCaption, src, width } = serializedNode;
|
|
74
|
+
const { altText, caption, height, maxWidth, position, showCaption, src, width } = serializedNode;
|
|
37
75
|
const node = $createImageNode({
|
|
38
76
|
altText,
|
|
39
77
|
height,
|
|
40
78
|
maxWidth,
|
|
79
|
+
position,
|
|
41
80
|
showCaption,
|
|
42
81
|
src,
|
|
43
82
|
width,
|
|
@@ -49,14 +88,25 @@ class ImageNode extends lexical_1.DecoratorNode {
|
|
|
49
88
|
}
|
|
50
89
|
return node;
|
|
51
90
|
}
|
|
91
|
+
/**
|
|
92
|
+
* Exports this image node to DOM.
|
|
93
|
+
* @returns DOM export output containing the image wrapper.
|
|
94
|
+
*/
|
|
52
95
|
exportDOM() {
|
|
96
|
+
const wrapper = document.createElement('span');
|
|
97
|
+
wrapper.className = `editor-image position-${this.__position || 'center'}`;
|
|
53
98
|
const element = document.createElement('img');
|
|
54
99
|
element.setAttribute('src', this.__src);
|
|
55
100
|
element.setAttribute('alt', this.__altText);
|
|
56
101
|
element.setAttribute('width', this.__width.toString());
|
|
57
102
|
element.setAttribute('height', this.__height.toString());
|
|
58
|
-
|
|
103
|
+
wrapper.appendChild(element);
|
|
104
|
+
return { element: wrapper };
|
|
59
105
|
}
|
|
106
|
+
/**
|
|
107
|
+
* Defines DOM import conversions for image elements.
|
|
108
|
+
* @returns DOM conversion map for image imports.
|
|
109
|
+
*/
|
|
60
110
|
static importDOM() {
|
|
61
111
|
return {
|
|
62
112
|
img: () => ({
|
|
@@ -65,7 +115,20 @@ class ImageNode extends lexical_1.DecoratorNode {
|
|
|
65
115
|
}),
|
|
66
116
|
};
|
|
67
117
|
}
|
|
68
|
-
|
|
118
|
+
/**
|
|
119
|
+
* Creates an image node instance.
|
|
120
|
+
* @param src Image source URL.
|
|
121
|
+
* @param altText Accessible alt text.
|
|
122
|
+
* @param maxWidth Maximum rendered image width.
|
|
123
|
+
* @param width Initial image width.
|
|
124
|
+
* @param height Initial image height.
|
|
125
|
+
* @param showCaption Whether the caption editor is visible.
|
|
126
|
+
* @param caption Nested caption editor.
|
|
127
|
+
* @param position Image alignment position.
|
|
128
|
+
* @param captionsEnabled Whether captions are enabled.
|
|
129
|
+
* @param key Optional Lexical node key.
|
|
130
|
+
*/
|
|
131
|
+
constructor(src, altText, maxWidth, width, height, showCaption, caption, position, captionsEnabled, key) {
|
|
69
132
|
super(key);
|
|
70
133
|
this.__src = src;
|
|
71
134
|
this.__altText = altText;
|
|
@@ -74,14 +137,20 @@ class ImageNode extends lexical_1.DecoratorNode {
|
|
|
74
137
|
this.__height = height || 'inherit';
|
|
75
138
|
this.__showCaption = showCaption || false;
|
|
76
139
|
this.__caption = caption || (0, lexical_1.createEditor)();
|
|
140
|
+
this.__position = position || 'center';
|
|
77
141
|
this.__captionsEnabled = captionsEnabled || captionsEnabled === undefined;
|
|
78
142
|
}
|
|
143
|
+
/**
|
|
144
|
+
* Serializes this image node.
|
|
145
|
+
* @returns Serialized image node payload.
|
|
146
|
+
*/
|
|
79
147
|
exportJSON() {
|
|
80
148
|
return {
|
|
81
149
|
altText: this.getAltText(),
|
|
82
150
|
caption: this.__caption.toJSON(),
|
|
83
151
|
height: this.__height === 'inherit' ? 0 : this.__height,
|
|
84
152
|
maxWidth: this.__maxWidth,
|
|
153
|
+
position: this.__position,
|
|
85
154
|
showCaption: this.__showCaption,
|
|
86
155
|
src: this.getSrc(),
|
|
87
156
|
type: 'image',
|
|
@@ -89,43 +158,108 @@ class ImageNode extends lexical_1.DecoratorNode {
|
|
|
89
158
|
width: this.__width === 'inherit' ? 0 : this.__width,
|
|
90
159
|
};
|
|
91
160
|
}
|
|
161
|
+
/**
|
|
162
|
+
* Updates the stored image dimensions.
|
|
163
|
+
* @param width Next image width.
|
|
164
|
+
* @param height Next image height.
|
|
165
|
+
*/
|
|
92
166
|
setWidthAndHeight(width, height) {
|
|
93
167
|
const writable = this.getWritable();
|
|
94
168
|
writable.__width = width;
|
|
95
169
|
writable.__height = height;
|
|
96
170
|
}
|
|
171
|
+
/**
|
|
172
|
+
* Updates caption visibility for this image.
|
|
173
|
+
* @param showCaption Whether the caption should be shown.
|
|
174
|
+
*/
|
|
97
175
|
setShowCaption(showCaption) {
|
|
98
176
|
const writable = this.getWritable();
|
|
99
177
|
writable.__showCaption = showCaption;
|
|
100
178
|
}
|
|
179
|
+
/**
|
|
180
|
+
* Gets the current image alignment position.
|
|
181
|
+
* @returns Current image position.
|
|
182
|
+
*/
|
|
183
|
+
getPosition() {
|
|
184
|
+
return this.__position;
|
|
185
|
+
}
|
|
186
|
+
/**
|
|
187
|
+
* Updates the image alignment position.
|
|
188
|
+
* @param position Next image position.
|
|
189
|
+
*/
|
|
190
|
+
setPosition(position) {
|
|
191
|
+
const writable = this.getWritable();
|
|
192
|
+
writable.__position = position || 'center';
|
|
193
|
+
}
|
|
101
194
|
// View
|
|
195
|
+
/**
|
|
196
|
+
* Creates the DOM wrapper for this image node.
|
|
197
|
+
* @param config Lexical editor config.
|
|
198
|
+
* @returns Image wrapper element.
|
|
199
|
+
*/
|
|
102
200
|
createDOM(config) {
|
|
103
201
|
const span = document.createElement('span');
|
|
104
202
|
const theme = config.theme;
|
|
105
|
-
const className = theme.image
|
|
203
|
+
const className = `${theme.image} position-${this.__position || 'center'}`;
|
|
106
204
|
if (className !== undefined) {
|
|
107
205
|
span.className = className;
|
|
108
206
|
}
|
|
109
207
|
return span;
|
|
110
208
|
}
|
|
111
|
-
|
|
209
|
+
/**
|
|
210
|
+
* Updates the DOM wrapper when node state changes.
|
|
211
|
+
* @param prevNode Previous image node state.
|
|
212
|
+
* @param dom Existing image wrapper element.
|
|
213
|
+
* @param config Lexical editor config.
|
|
214
|
+
* @returns False because the existing DOM element is reused.
|
|
215
|
+
*/
|
|
216
|
+
updateDOM(prevNode, dom, config) {
|
|
217
|
+
const position = this.__position;
|
|
218
|
+
if (position !== prevNode.__position) {
|
|
219
|
+
const className = `${config.theme.image} position-${position || 'center'}`;
|
|
220
|
+
if (className !== undefined) {
|
|
221
|
+
dom.className = className;
|
|
222
|
+
}
|
|
223
|
+
}
|
|
112
224
|
return false;
|
|
113
225
|
}
|
|
226
|
+
/**
|
|
227
|
+
* Gets the image source URL.
|
|
228
|
+
* @returns Image source URL.
|
|
229
|
+
*/
|
|
114
230
|
getSrc() {
|
|
115
231
|
return this.__src;
|
|
116
232
|
}
|
|
233
|
+
/**
|
|
234
|
+
* Gets the image alt text.
|
|
235
|
+
* @returns Image alt text.
|
|
236
|
+
*/
|
|
117
237
|
getAltText() {
|
|
118
238
|
return this.__altText;
|
|
119
239
|
}
|
|
240
|
+
/**
|
|
241
|
+
* Renders the React decorator for this image node.
|
|
242
|
+
* @returns Image decorator element.
|
|
243
|
+
*/
|
|
120
244
|
decorate() {
|
|
121
245
|
return (React.createElement(react_1.Suspense, { fallback: null },
|
|
122
246
|
React.createElement(ImageComponent, { altText: this.__altText, caption: this.__caption, height: this.__height, maxWidth: this.__maxWidth, nodeKey: this.getKey(), resizable: true, showCaption: this.__showCaption, src: this.__src, width: this.__width })));
|
|
123
247
|
}
|
|
124
248
|
}
|
|
125
249
|
exports.ImageNode = ImageNode;
|
|
126
|
-
|
|
127
|
-
|
|
250
|
+
/**
|
|
251
|
+
* Creates and inserts a replacement image node.
|
|
252
|
+
* @param payload Image node creation payload.
|
|
253
|
+
* @returns Created image node.
|
|
254
|
+
*/
|
|
255
|
+
function $createImageNode({ altText, caption, captionsEnabled, height, key, maxWidth = 500, position, showCaption, src, width, }) {
|
|
256
|
+
return (0, lexical_1.$applyNodeReplacement)(new ImageNode(src, altText, maxWidth, width, height, showCaption, caption, position || 'center', captionsEnabled, key));
|
|
128
257
|
}
|
|
258
|
+
/**
|
|
259
|
+
* Checks whether a Lexical node is an ImageNode.
|
|
260
|
+
* @param node Node to test.
|
|
261
|
+
* @returns True when the node is an ImageNode.
|
|
262
|
+
*/
|
|
129
263
|
function $isImageNode(node) {
|
|
130
264
|
return node instanceof ImageNode;
|
|
131
265
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageNode.js","sourceRoot":"","sources":["../../../../../src/components/TextEditorV2/nodes/ImageNode.tsx"],"names":[],"mappings":";AAAA;;;;;;GAMG;;;
|
|
1
|
+
{"version":3,"file":"ImageNode.js","sourceRoot":"","sources":["../../../../../src/components/TextEditorV2/nodes/ImageNode.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import type { Position } from './InlineImageNode';
|
|
2
2
|
import type { LexicalEditor, NodeKey } from 'lexical';
|
|
3
3
|
import * as React from 'react';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
4
|
+
/**
|
|
5
|
+
* Renders an inline image node with selection, resize, and caption behavior.
|
|
6
|
+
* @param props Inline image component props.
|
|
7
|
+
* @returns Inline image decorator element.
|
|
8
|
+
*/
|
|
9
9
|
export default function InlineImageComponent({ altText, caption, height, nodeKey, position, showCaption, src, width, }: {
|
|
10
10
|
altText: string;
|
|
11
11
|
caption: LexicalEditor;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.UpdateInlineImageDialog = UpdateInlineImageDialog;
|
|
4
3
|
exports.default = InlineImageComponent;
|
|
5
4
|
const tslib_1 = require("tslib");
|
|
6
5
|
const LexicalAutoFocusPlugin_1 = require("@lexical/react/LexicalAutoFocusPlugin");
|
|
@@ -12,19 +11,19 @@ const utils_1 = require("@lexical/utils");
|
|
|
12
11
|
const lexical_1 = require("lexical");
|
|
13
12
|
const React = tslib_1.__importStar(require("react"));
|
|
14
13
|
const react_1 = require("react");
|
|
15
|
-
const useModal_1 = tslib_1.__importDefault(require("../hooks/useModal"));
|
|
16
14
|
const FloatingLinkEditorPlugin_1 = tslib_1.__importDefault(require("../plugins/FloatingLinkEditorPlugin"));
|
|
17
15
|
const FloatingTextFormatToolbarPlugin_1 = tslib_1.__importDefault(require("../plugins/FloatingTextFormatToolbarPlugin"));
|
|
18
16
|
const LinkPlugin_1 = tslib_1.__importDefault(require("../plugins/LinkPlugin"));
|
|
19
|
-
const Button_1 = tslib_1.__importDefault(require("../ui/Button"));
|
|
20
17
|
const ContentEditable_1 = tslib_1.__importDefault(require("../ui/ContentEditable"));
|
|
21
|
-
const
|
|
18
|
+
const ImageResizer_1 = tslib_1.__importDefault(require("../ui/ImageResizer"));
|
|
22
19
|
const Placeholder_1 = tslib_1.__importDefault(require("../ui/Placeholder"));
|
|
23
|
-
const Select_1 = tslib_1.__importDefault(require("../ui/Select"));
|
|
24
|
-
const TextInput_1 = tslib_1.__importDefault(require("../ui/TextInput"));
|
|
25
20
|
const InlineImageNode_1 = require("./InlineImageNode");
|
|
26
21
|
const LexicalErrorBoundary_1 = require("../shared/LexicalErrorBoundary");
|
|
27
22
|
const imageCache = new Set();
|
|
23
|
+
/**
|
|
24
|
+
* Suspends rendering until an image source has loaded.
|
|
25
|
+
* @param src Image source URL to preload.
|
|
26
|
+
*/
|
|
28
27
|
function useSuspenseImage(src) {
|
|
29
28
|
if (!imageCache.has(src)) {
|
|
30
29
|
throw new Promise((resolve) => {
|
|
@@ -37,6 +36,11 @@ function useSuspenseImage(src) {
|
|
|
37
36
|
});
|
|
38
37
|
}
|
|
39
38
|
}
|
|
39
|
+
/**
|
|
40
|
+
* Renders an image after ensuring its source is loaded.
|
|
41
|
+
* @param props Lazy image render props.
|
|
42
|
+
* @returns Rendered image element.
|
|
43
|
+
*/
|
|
40
44
|
function LazyImage({ altText, className, height, imageRef, position, src, width, }) {
|
|
41
45
|
useSuspenseImage(src);
|
|
42
46
|
return (React.createElement("img", { ref: imageRef, alt: altText, className: className || undefined, "data-position": position, draggable: 'false', src: src, style: {
|
|
@@ -45,48 +49,23 @@ function LazyImage({ altText, className, height, imageRef, position, src, width,
|
|
|
45
49
|
width,
|
|
46
50
|
} }));
|
|
47
51
|
}
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
const [position, setPosition] = (0, react_1.useState)(node.getPosition());
|
|
54
|
-
const handleShowCaptionChange = (e) => {
|
|
55
|
-
setShowCaption(e.target.checked);
|
|
56
|
-
};
|
|
57
|
-
const handlePositionChange = (e) => {
|
|
58
|
-
setPosition(e.target.value);
|
|
59
|
-
};
|
|
60
|
-
const handleOnConfirm = () => {
|
|
61
|
-
const payload = { altText, position, showCaption };
|
|
62
|
-
if (node) {
|
|
63
|
-
activeEditor.update(() => {
|
|
64
|
-
node.update(payload);
|
|
65
|
-
});
|
|
66
|
-
}
|
|
67
|
-
onClose();
|
|
68
|
-
};
|
|
69
|
-
return (React.createElement(React.Fragment, null,
|
|
70
|
-
React.createElement("div", { style: { marginBottom: '1em' } },
|
|
71
|
-
React.createElement(TextInput_1.default, { "data-test-id": 'image-modal-alt-text-input', label: 'Alt Text', onChange: setAltText, placeholder: 'Descriptive alternative text', value: altText })),
|
|
72
|
-
React.createElement(Select_1.default, { id: 'position-select', label: 'Position', name: 'position', onChange: handlePositionChange, style: { marginBottom: '1em', width: '208px' }, value: position },
|
|
73
|
-
React.createElement("option", { value: 'left' }, "Left"),
|
|
74
|
-
React.createElement("option", { value: 'right' }, "Right"),
|
|
75
|
-
React.createElement("option", { value: 'full' }, "Full Width")),
|
|
76
|
-
React.createElement("div", { className: 'Input__wrapper' },
|
|
77
|
-
React.createElement("input", { checked: showCaption, id: 'caption', onChange: handleShowCaptionChange, type: 'checkbox' }),
|
|
78
|
-
React.createElement("label", { htmlFor: 'caption' }, "Show Caption")),
|
|
79
|
-
React.createElement(Dialog_1.DialogActions, null,
|
|
80
|
-
React.createElement(Button_1.default, { "data-test-id": 'image-modal-file-upload-btn', onClick: () => handleOnConfirm() }, "Confirm"))));
|
|
81
|
-
}
|
|
52
|
+
/**
|
|
53
|
+
* Renders an inline image node with selection, resize, and caption behavior.
|
|
54
|
+
* @param props Inline image component props.
|
|
55
|
+
* @returns Inline image decorator element.
|
|
56
|
+
*/
|
|
82
57
|
function InlineImageComponent({ altText, caption, height, nodeKey, position, showCaption, src, width, }) {
|
|
83
|
-
const [modal, showModal] = (0, useModal_1.default)();
|
|
84
58
|
const imageRef = (0, react_1.useRef)(null);
|
|
85
|
-
const buttonRef = (0, react_1.useRef)(null);
|
|
86
59
|
const [isSelected, setSelected, clearSelection] = (0, useLexicalNodeSelection_1.useLexicalNodeSelection)(nodeKey);
|
|
60
|
+
const [isResizing, setIsResizing] = (0, react_1.useState)(false);
|
|
87
61
|
const [editor] = (0, LexicalComposerContext_1.useLexicalComposerContext)();
|
|
88
62
|
const [selection, setSelection] = (0, react_1.useState)(null);
|
|
89
63
|
const activeEditorRef = (0, react_1.useRef)(null);
|
|
64
|
+
/**
|
|
65
|
+
* Removes the selected inline image when delete or backspace is pressed.
|
|
66
|
+
* @param payload Keyboard event from the editor command.
|
|
67
|
+
* @returns False to allow other command handlers to continue.
|
|
68
|
+
*/
|
|
90
69
|
const onDelete = (0, react_1.useCallback)((payload) => {
|
|
91
70
|
if (isSelected && (0, lexical_1.$isNodeSelection)((0, lexical_1.$getSelection)())) {
|
|
92
71
|
const event = payload;
|
|
@@ -98,27 +77,28 @@ function InlineImageComponent({ altText, caption, height, nodeKey, position, sho
|
|
|
98
77
|
}
|
|
99
78
|
return false;
|
|
100
79
|
}, [isSelected, nodeKey]);
|
|
80
|
+
/**
|
|
81
|
+
* Moves focus into the caption editor when enter is pressed on a selected image.
|
|
82
|
+
* @param event Keyboard event from the editor command.
|
|
83
|
+
* @returns True when focus moved into the caption editor.
|
|
84
|
+
*/
|
|
101
85
|
const onEnter = (0, react_1.useCallback)((event) => {
|
|
102
86
|
const latestSelection = (0, lexical_1.$getSelection)();
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
caption.focus();
|
|
110
|
-
return true;
|
|
111
|
-
}
|
|
112
|
-
else if (buttonElem !== null && buttonElem !== document.activeElement) {
|
|
113
|
-
event.preventDefault();
|
|
114
|
-
buttonElem.focus();
|
|
115
|
-
return true;
|
|
116
|
-
}
|
|
87
|
+
if (isSelected && showCaption && (0, lexical_1.$isNodeSelection)(latestSelection) && latestSelection.getNodes().length === 1) {
|
|
88
|
+
// Move focus into nested editor
|
|
89
|
+
(0, lexical_1.$setSelection)(null);
|
|
90
|
+
event.preventDefault();
|
|
91
|
+
caption.focus();
|
|
92
|
+
return true;
|
|
117
93
|
}
|
|
118
94
|
return false;
|
|
119
95
|
}, [caption, isSelected, showCaption]);
|
|
120
|
-
|
|
121
|
-
|
|
96
|
+
/**
|
|
97
|
+
* Restores focus from the caption editor back to the inline image node.
|
|
98
|
+
* @returns True when focus was restored to the parent editor.
|
|
99
|
+
*/
|
|
100
|
+
const onEscape = (0, react_1.useCallback)(() => {
|
|
101
|
+
if (activeEditorRef.current === caption) {
|
|
122
102
|
(0, lexical_1.$setSelection)(null);
|
|
123
103
|
editor.update(() => {
|
|
124
104
|
setSelected(true);
|
|
@@ -142,6 +122,9 @@ function InlineImageComponent({ altText, caption, height, nodeKey, position, sho
|
|
|
142
122
|
return false;
|
|
143
123
|
}, lexical_1.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical_1.CLICK_COMMAND, (payload) => {
|
|
144
124
|
const event = payload;
|
|
125
|
+
if (isResizing) {
|
|
126
|
+
return true;
|
|
127
|
+
}
|
|
145
128
|
if (event.target === imageRef.current) {
|
|
146
129
|
if (event.shiftKey) {
|
|
147
130
|
setSelected(!isSelected);
|
|
@@ -166,15 +149,32 @@ function InlineImageComponent({ altText, caption, height, nodeKey, position, sho
|
|
|
166
149
|
isMounted = false;
|
|
167
150
|
unregister();
|
|
168
151
|
};
|
|
169
|
-
}, [clearSelection, editor, isSelected, nodeKey, onDelete, onEnter, onEscape, setSelected]);
|
|
170
|
-
|
|
171
|
-
|
|
152
|
+
}, [clearSelection, editor, isResizing, isSelected, nodeKey, onDelete, onEnter, onEscape, setSelected]);
|
|
153
|
+
/**
|
|
154
|
+
* Persists resized image dimensions back to the Lexical node.
|
|
155
|
+
* @param nextWidth Next image width.
|
|
156
|
+
* @param nextHeight Next image height.
|
|
157
|
+
*/
|
|
158
|
+
const onResizeEnd = (nextWidth, nextHeight) => {
|
|
159
|
+
editor.update(() => {
|
|
160
|
+
const node = (0, lexical_1.$getNodeByKey)(nodeKey);
|
|
161
|
+
if ((0, InlineImageNode_1.$isInlineImageNode)(node)) {
|
|
162
|
+
node.setWidthAndHeight(nextWidth, nextHeight);
|
|
163
|
+
}
|
|
164
|
+
});
|
|
165
|
+
setIsResizing(false);
|
|
166
|
+
};
|
|
167
|
+
/**
|
|
168
|
+
* Marks the image as actively resizing.
|
|
169
|
+
*/
|
|
170
|
+
const onResizeStart = () => {
|
|
171
|
+
setIsResizing(true);
|
|
172
|
+
};
|
|
173
|
+
const draggable = isSelected && (0, lexical_1.$isNodeSelection)(selection) && !isResizing;
|
|
174
|
+
const isFocused = isSelected || isResizing;
|
|
172
175
|
return (React.createElement(react_1.Suspense, { fallback: null },
|
|
173
176
|
React.createElement(React.Fragment, null,
|
|
174
177
|
React.createElement("div", { draggable: draggable },
|
|
175
|
-
React.createElement("button", { ref: buttonRef, className: 'image-edit-button', onClick: () => {
|
|
176
|
-
showModal('Update Inline Image', (onClose) => (React.createElement(UpdateInlineImageDialog, { activeEditor: editor, nodeKey: nodeKey, onClose: onClose })));
|
|
177
|
-
}, type: 'button' }, "Edit"),
|
|
178
178
|
React.createElement(LazyImage, { altText: altText, className: isFocused ? `focused ${(0, lexical_1.$isNodeSelection)(selection) ? 'draggable' : ''}` : null, height: height, imageRef: imageRef, position: position, src: src, width: width })),
|
|
179
179
|
showCaption && (React.createElement("div", { className: 'image-caption-container' },
|
|
180
180
|
React.createElement(LexicalNestedComposer_1.LexicalNestedComposer, { initialEditor: caption },
|
|
@@ -184,7 +184,7 @@ function InlineImageComponent({ altText, caption, height, nodeKey, position, sho
|
|
|
184
184
|
console.log('FloatingLinkEditorPlugin');
|
|
185
185
|
} }),
|
|
186
186
|
React.createElement(FloatingTextFormatToolbarPlugin_1.default, null),
|
|
187
|
-
React.createElement(LexicalRichTextPlugin_1.RichTextPlugin, { contentEditable: React.createElement(ContentEditable_1.default, { className: 'InlineImageNode__contentEditable' }), ErrorBoundary: LexicalErrorBoundary_1.LexicalErrorBoundary, placeholder: React.createElement(Placeholder_1.default, { className: 'InlineImageNode__placeholder' }, "Enter a caption...") }))))
|
|
188
|
-
|
|
187
|
+
React.createElement(LexicalRichTextPlugin_1.RichTextPlugin, { contentEditable: React.createElement(ContentEditable_1.default, { className: 'InlineImageNode__contentEditable' }), ErrorBoundary: LexicalErrorBoundary_1.LexicalErrorBoundary, placeholder: React.createElement(Placeholder_1.default, { className: 'InlineImageNode__placeholder' }, "Enter a caption...") })))),
|
|
188
|
+
(0, lexical_1.$isNodeSelection)(selection) && isFocused && (React.createElement(ImageResizer_1.default, { editor: editor, imageRef: imageRef, onResizeEnd: onResizeEnd, onResizeStart: onResizeStart })))));
|
|
189
189
|
}
|
|
190
190
|
//# sourceMappingURL=InlineImageComponent.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InlineImageComponent.js","sourceRoot":"","sources":["../../../../../src/components/TextEditorV2/nodes/InlineImageComponent.tsx"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"InlineImageComponent.js","sourceRoot":"","sources":["../../../../../src/components/TextEditorV2/nodes/InlineImageComponent.tsx"],"names":[],"mappings":"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"}
|