@qwanyx/ai-editor 1.3.6 → 1.3.7
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageNode.d.ts","sourceRoot":"","sources":["../../src/nodes/ImageNode.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,WAAW,EACX,OAAO,EACP,qBAAqB,EACrB,MAAM,
|
|
1
|
+
{"version":3,"file":"ImageNode.d.ts","sourceRoot":"","sources":["../../src/nodes/ImageNode.tsx"],"names":[],"mappings":"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"}
|
package/dist/nodes/ImageNode.js
CHANGED
|
@@ -7,6 +7,8 @@ exports.$isImageNode = $isImageNode;
|
|
|
7
7
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
8
|
const lexical_1 = require("lexical");
|
|
9
9
|
const LexicalComposerContext_1 = require("@lexical/react/LexicalComposerContext");
|
|
10
|
+
const useLexicalNodeSelection_1 = require("@lexical/react/useLexicalNodeSelection");
|
|
11
|
+
const utils_1 = require("@lexical/utils");
|
|
10
12
|
const react_1 = require("react");
|
|
11
13
|
const EditorModeContext_1 = require("../context/EditorModeContext");
|
|
12
14
|
// Font sizes: small=10px, medium=16px, large=24px (alt text gets +2px)
|
|
@@ -20,7 +22,7 @@ function ImageComponent({ src, altText, width, height, copyright: initialCopyrig
|
|
|
20
22
|
const { isViewer } = (0, EditorModeContext_1.useEditorMode)();
|
|
21
23
|
const containerRef = (0, react_1.useRef)(null);
|
|
22
24
|
const imageRef = (0, react_1.useRef)(null);
|
|
23
|
-
const [isSelected,
|
|
25
|
+
const [isSelected, setSelected, clearSelection] = (0, useLexicalNodeSelection_1.useLexicalNodeSelection)(nodeKey);
|
|
24
26
|
const [isHovered, setIsHovered] = (0, react_1.useState)(false);
|
|
25
27
|
const [isResizing, setIsResizing] = (0, react_1.useState)(false);
|
|
26
28
|
const [showMetadataEditor, setShowMetadataEditor] = (0, react_1.useState)(false);
|
|
@@ -65,52 +67,42 @@ function ImageComponent({ src, altText, width, height, copyright: initialCopyrig
|
|
|
65
67
|
};
|
|
66
68
|
const startX = (0, react_1.useRef)(0);
|
|
67
69
|
const startWidth = (0, react_1.useRef)(0);
|
|
68
|
-
//
|
|
70
|
+
// Delete handler for when image is selected
|
|
71
|
+
const onDelete = (0, react_1.useCallback)((payload) => {
|
|
72
|
+
if (isSelected && (0, lexical_1.$isNodeSelection)((0, lexical_1.$getSelection)())) {
|
|
73
|
+
const event = payload;
|
|
74
|
+
event.preventDefault();
|
|
75
|
+
const node = (0, lexical_1.$getNodeByKey)(nodeKey);
|
|
76
|
+
if ($isImageNode(node)) {
|
|
77
|
+
node.remove();
|
|
78
|
+
}
|
|
79
|
+
return true;
|
|
80
|
+
}
|
|
81
|
+
return false;
|
|
82
|
+
}, [isSelected, nodeKey]);
|
|
83
|
+
// Register commands for selection and deletion
|
|
84
|
+
(0, react_1.useEffect)(() => {
|
|
85
|
+
if (isViewer)
|
|
86
|
+
return;
|
|
87
|
+
return (0, utils_1.mergeRegister)(editor.registerCommand(lexical_1.CLICK_COMMAND, (payload) => {
|
|
88
|
+
const event = payload;
|
|
89
|
+
if (containerRef.current?.contains(event.target)) {
|
|
90
|
+
if (!event.shiftKey) {
|
|
91
|
+
clearSelection();
|
|
92
|
+
}
|
|
93
|
+
setSelected(true);
|
|
94
|
+
return true;
|
|
95
|
+
}
|
|
96
|
+
return false;
|
|
97
|
+
}, lexical_1.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical_1.KEY_DELETE_COMMAND, onDelete, lexical_1.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical_1.KEY_BACKSPACE_COMMAND, onDelete, lexical_1.COMMAND_PRIORITY_LOW));
|
|
98
|
+
}, [editor, isViewer, clearSelection, setSelected, onDelete]);
|
|
99
|
+
// Handle click in viewer mode (fullscreen)
|
|
69
100
|
const handleClick = (0, react_1.useCallback)((e) => {
|
|
70
|
-
e.stopPropagation();
|
|
71
101
|
if (isViewer) {
|
|
72
|
-
|
|
102
|
+
e.stopPropagation();
|
|
73
103
|
setShowFullscreen(true);
|
|
74
104
|
}
|
|
75
|
-
else {
|
|
76
|
-
setIsSelected(true);
|
|
77
|
-
}
|
|
78
105
|
}, [isViewer]);
|
|
79
|
-
// Click outside to deselect
|
|
80
|
-
(0, react_1.useEffect)(() => {
|
|
81
|
-
const handleClickOutside = (e) => {
|
|
82
|
-
if (containerRef.current && !containerRef.current.contains(e.target)) {
|
|
83
|
-
setIsSelected(false);
|
|
84
|
-
}
|
|
85
|
-
};
|
|
86
|
-
document.addEventListener('mousedown', handleClickOutside);
|
|
87
|
-
return () => document.removeEventListener('mousedown', handleClickOutside);
|
|
88
|
-
}, []);
|
|
89
|
-
// Handle Delete/Backspace to remove image when selected
|
|
90
|
-
(0, react_1.useEffect)(() => {
|
|
91
|
-
if (!isSelected || isViewer)
|
|
92
|
-
return;
|
|
93
|
-
const handleKeyDown = (e) => {
|
|
94
|
-
// Don't delete if modal is open or if user is typing in an input
|
|
95
|
-
if (showMetadataEditor)
|
|
96
|
-
return;
|
|
97
|
-
const target = e.target;
|
|
98
|
-
if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA')
|
|
99
|
-
return;
|
|
100
|
-
if (e.key === 'Delete' || e.key === 'Backspace') {
|
|
101
|
-
e.preventDefault();
|
|
102
|
-
e.stopPropagation();
|
|
103
|
-
editor.update(() => {
|
|
104
|
-
const node = (0, lexical_1.$getNodeByKey)(nodeKey);
|
|
105
|
-
if (node) {
|
|
106
|
-
node.remove();
|
|
107
|
-
}
|
|
108
|
-
});
|
|
109
|
-
}
|
|
110
|
-
};
|
|
111
|
-
document.addEventListener('keydown', handleKeyDown);
|
|
112
|
-
return () => document.removeEventListener('keydown', handleKeyDown);
|
|
113
|
-
}, [isSelected, isViewer, showMetadataEditor, editor, nodeKey]);
|
|
114
106
|
// Handle resize start
|
|
115
107
|
const handleResizeStart = (0, react_1.useCallback)((e) => {
|
|
116
108
|
e.preventDefault();
|
|
@@ -258,12 +250,13 @@ function ImageComponent({ src, altText, width, height, copyright: initialCopyrig
|
|
|
258
250
|
default: return 'center';
|
|
259
251
|
}
|
|
260
252
|
};
|
|
261
|
-
return ((0, jsx_runtime_1.jsxs)("span", { ref: containerRef, style: {
|
|
253
|
+
return ((0, jsx_runtime_1.jsxs)("span", { ref: containerRef, tabIndex: -1, style: {
|
|
262
254
|
display: displayCaptionPosition === 'beside' ? 'inline-flex' : 'inline-block',
|
|
263
255
|
flexDirection: displayCaptionPosition === 'beside' && displayCaptionAlign === 'right' ? 'row-reverse' : 'row',
|
|
264
256
|
gap: displayCaptionPosition === 'beside' ? '12px' : undefined,
|
|
265
257
|
alignItems: displayCaptionPosition === 'beside' ? getVerticalAlign() : undefined,
|
|
266
258
|
position: 'relative',
|
|
259
|
+
outline: 'none',
|
|
267
260
|
...getFloatStyles(),
|
|
268
261
|
}, onClick: handleClick, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), children: [(0, jsx_runtime_1.jsxs)("div", { style: { position: 'relative', flexShrink: 0 }, children: [(0, jsx_runtime_1.jsx)("img", { ref: imageRef, src: src, alt: altText, title: displayComment || undefined, style: {
|
|
269
262
|
maxWidth: '100%',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InsertObjectPlugin.d.ts","sourceRoot":"","sources":["../../src/plugins/InsertObjectPlugin.tsx"],"names":[],"mappings":"AAIA,OAAO,
|
|
1
|
+
{"version":3,"file":"InsertObjectPlugin.d.ts","sourceRoot":"","sources":["../../src/plugins/InsertObjectPlugin.tsx"],"names":[],"mappings":"AAIA,OAAO,EAQL,cAAc,EACf,MAAM,SAAS,CAAA;AAMhB,eAAO,MAAM,qBAAqB,EAAE,cAAc,CAAC,IAAI,CAA0C,CAAA;AA2ZjG,wBAAgB,kBAAkB,4CAuSjC"}
|
|
@@ -425,11 +425,19 @@ function InsertObjectPlugin() {
|
|
|
425
425
|
editor.update(() => {
|
|
426
426
|
const selection = (0, lexical_1.$getSelection)();
|
|
427
427
|
if ((0, lexical_1.$isRangeSelection)(selection)) {
|
|
428
|
+
// Create image in its own paragraph for better control
|
|
428
429
|
const imageNode = (0, ImageNode_1.$createImageNode)({
|
|
429
430
|
src: data.url,
|
|
430
431
|
altText: data.altText || '',
|
|
431
432
|
});
|
|
432
|
-
|
|
433
|
+
const paragraphNode = (0, lexical_1.$createParagraphNode)();
|
|
434
|
+
paragraphNode.append(imageNode);
|
|
435
|
+
// Get the anchor node's parent paragraph and insert after it
|
|
436
|
+
const anchorNode = selection.anchor.getNode();
|
|
437
|
+
const topLevelElement = anchorNode.getTopLevelElementOrThrow();
|
|
438
|
+
topLevelElement.insertAfter(paragraphNode);
|
|
439
|
+
// Select the image
|
|
440
|
+
imageNode.selectEnd();
|
|
433
441
|
}
|
|
434
442
|
});
|
|
435
443
|
}
|