@qwanyx/ai-editor 1.5.5 → 1.5.6
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":"OgilvyLayout.d.ts","sourceRoot":"","sources":["../../src/layouts/OgilvyLayout.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,aAAa,EAId,MAAM,eAAe,CAAA;AACtB,OAAO,EAAkB,oBAAoB,EAAE,MAAM,SAAS,CAAA;AA+H9D,wBAAgB,0BAA0B,IAAI,aAAa,CAqB1D;
|
|
1
|
+
{"version":3,"file":"OgilvyLayout.d.ts","sourceRoot":"","sources":["../../src/layouts/OgilvyLayout.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,aAAa,EAId,MAAM,eAAe,CAAA;AACtB,OAAO,EAAkB,oBAAoB,EAAE,MAAM,SAAS,CAAA;AA+H9D,wBAAgB,0BAA0B,IAAI,aAAa,CAqB1D;AAwMD,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,SAAS,EACT,eAAe,GAChB,EAAE,oBAAoB,CAAC,aAAa,CAAC,2CAoKrC"}
|
|
@@ -170,47 +170,16 @@ function EditableText({ value, onChange, isEditing, placeholder = 'Cliquez pour
|
|
|
170
170
|
}
|
|
171
171
|
return ((0, jsx_runtime_1.jsx)("input", { type: "text", value: value, onChange: (e) => onChange(e.target.value), placeholder: placeholder, style: combinedStyle, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false) }));
|
|
172
172
|
}
|
|
173
|
-
function
|
|
174
|
-
const [showDialog, setShowDialog] = (0, react_1.useState)(false);
|
|
175
|
-
const handleClick = () => {
|
|
176
|
-
if (isEditing) {
|
|
177
|
-
setShowDialog(true);
|
|
178
|
-
}
|
|
179
|
-
};
|
|
180
|
-
const handleSave = (metadata) => {
|
|
181
|
-
onChange({
|
|
182
|
-
src: metadata.src,
|
|
183
|
-
altText: metadata.alt,
|
|
184
|
-
title: metadata.title,
|
|
185
|
-
photographer: metadata.photographer,
|
|
186
|
-
copyright: metadata.copyright,
|
|
187
|
-
comment: metadata.comment,
|
|
188
|
-
});
|
|
189
|
-
setShowDialog(false);
|
|
190
|
-
};
|
|
173
|
+
function ImageDisplay({ image, isEditing, imageWidth, imageWidthUnit, onClickEdit }) {
|
|
191
174
|
const imageStyle = {
|
|
192
175
|
...styles.image,
|
|
193
176
|
width: `${imageWidth}${imageWidthUnit}`,
|
|
194
177
|
cursor: isEditing ? 'pointer' : 'default',
|
|
195
178
|
};
|
|
196
179
|
if (!image.src) {
|
|
197
|
-
return ((0, jsx_runtime_1.
|
|
198
|
-
src: '',
|
|
199
|
-
alt: '',
|
|
200
|
-
title: '',
|
|
201
|
-
photographer: '',
|
|
202
|
-
copyright: '',
|
|
203
|
-
comment: '',
|
|
204
|
-
} })] }));
|
|
180
|
+
return ((0, jsx_runtime_1.jsx)("div", { style: styles.imagePlaceholder, onClick: onClickEdit, children: isEditing ? 'Cliquez pour ajouter une image' : 'Aucune image' }));
|
|
205
181
|
}
|
|
206
|
-
return ((0, jsx_runtime_1.
|
|
207
|
-
src: image.src,
|
|
208
|
-
alt: image.altText || '',
|
|
209
|
-
title: image.title || '',
|
|
210
|
-
photographer: image.photographer || '',
|
|
211
|
-
copyright: image.copyright || '',
|
|
212
|
-
comment: image.comment || '',
|
|
213
|
-
} })] }));
|
|
182
|
+
return ((0, jsx_runtime_1.jsx)("div", { style: { ...styles.imageContainer, width: `${imageWidth}${imageWidthUnit}` }, children: (0, jsx_runtime_1.jsx)("img", { src: image.src, alt: image.altText || '', style: imageStyle, onClick: onClickEdit }) }));
|
|
214
183
|
}
|
|
215
184
|
function DropCapText({ text, dropCap }) {
|
|
216
185
|
if (!text || !dropCap.enabled) {
|
|
@@ -254,6 +223,8 @@ function Columns({ text, columns, dropCap }) {
|
|
|
254
223
|
// ============================================
|
|
255
224
|
function OgilvyLayout({ section, isEditing, onContentChange, }) {
|
|
256
225
|
const content = section.content;
|
|
226
|
+
// Dialog state - rendered at root level like GalleryLayout
|
|
227
|
+
const [showImageDialog, setShowImageDialog] = (0, react_1.useState)(false);
|
|
257
228
|
// Defaults for backward compatibility
|
|
258
229
|
const showImage = content.showImage !== false;
|
|
259
230
|
const imageWidth = content.imageWidth || 100;
|
|
@@ -266,12 +237,25 @@ function OgilvyLayout({ section, isEditing, onContentChange, }) {
|
|
|
266
237
|
[field]: value,
|
|
267
238
|
});
|
|
268
239
|
}, [content, onContentChange]);
|
|
240
|
+
// Handle image save from dialog
|
|
241
|
+
const handleSaveImage = (0, react_1.useCallback)((metadata) => {
|
|
242
|
+
const newImage = {
|
|
243
|
+
src: metadata.src,
|
|
244
|
+
altText: metadata.alt || '',
|
|
245
|
+
title: metadata.title,
|
|
246
|
+
photographer: metadata.photographer,
|
|
247
|
+
copyright: metadata.copyright,
|
|
248
|
+
comment: metadata.comment,
|
|
249
|
+
};
|
|
250
|
+
updateField('image', newImage);
|
|
251
|
+
setShowImageDialog(false);
|
|
252
|
+
}, [updateField]);
|
|
269
253
|
const endCommentStyle = {
|
|
270
254
|
...styles.endComment,
|
|
271
255
|
fontSize: `${endCommentFontSize}px`,
|
|
272
256
|
fontStyle: endCommentItalic ? 'italic' : 'normal',
|
|
273
257
|
};
|
|
274
|
-
return ((0, jsx_runtime_1.jsxs)("div", { style: styles.container, children: [showImage && ((0, jsx_runtime_1.jsx)(
|
|
258
|
+
return ((0, jsx_runtime_1.jsxs)("div", { style: styles.container, children: [showImage && ((0, jsx_runtime_1.jsx)(ImageDisplay, { image: content.image, isEditing: isEditing, imageWidth: imageWidth, imageWidthUnit: imageWidthUnit, onClickEdit: () => isEditing && setShowImageDialog(true) })), (0, jsx_runtime_1.jsxs)("div", { style: styles.titleContainer, children: [(0, jsx_runtime_1.jsx)(EditableText, { value: content.title, onChange: (v) => updateField('title', v), isEditing: isEditing, placeholder: "Titre", style: styles.title, inputStyle: styles.titleInput, as: "h1" }), (0, jsx_runtime_1.jsx)(EditableText, { value: content.subtitle, onChange: (v) => updateField('subtitle', v), isEditing: isEditing, placeholder: "Sous-titre", style: styles.subtitle, inputStyle: styles.subtitleInput, as: "h2" })] }), (0, jsx_runtime_1.jsxs)("div", { className: content.dropCap.enabled ? 'ogilvy-drop-cap' : '', style: {
|
|
275
259
|
['--drop-cap-size']: `${content.dropCap.fontSize || 3}em`,
|
|
276
260
|
['--drop-cap-color']: content.dropCap.color || 'inherit',
|
|
277
261
|
['--drop-cap-font']: content.dropCap.fontFamily || 'Georgia, serif',
|
|
@@ -285,7 +269,14 @@ function OgilvyLayout({ section, isEditing, onContentChange, }) {
|
|
|
285
269
|
margin-right: 0.1em;
|
|
286
270
|
margin-top: 0.1em;
|
|
287
271
|
}
|
|
288
|
-
` }), isEditing ? ((0, jsx_runtime_1.jsx)(RichTextEditor_1.RichTextEditor, { initialContent: content.bodyText, onChange: (_html, json) => updateField('bodyText', json), placeholder: "Corps du texte...", columns: content.columns, minHeight: content.columnLines ? `calc(${content.columnLines * 1.7}em + 60px)` : "200px", autoGrow: !content.columnLines })) : ((0, jsx_runtime_1.jsx)(RichTextViewer_1.RichTextViewer, { content: content.bodyText, columns: content.columns }))] }), (content.footnote || (isEditing && content.legendAsterisk)) && ((0, jsx_runtime_1.jsx)("div", { style: styles.footnote, children: (0, jsx_runtime_1.jsx)(EditableText, { value: content.footnote || '', onChange: (v) => updateField('footnote', v), isEditing: isEditing, placeholder: "* Note explicative...", style: styles.footnote }) })), (content.endComment || isEditing) && ((0, jsx_runtime_1.jsx)("div", { style: endCommentStyle, children: isEditing ? ((0, jsx_runtime_1.jsx)(RichTextEditor_1.RichTextEditor, { initialContent: content.endComment || '', onChange: (_html, json) => updateField('endComment', json), placeholder: "Commentaire de fin de section...", minHeight: "80px", autoGrow: true })) : (content.endComment && ((0, jsx_runtime_1.jsx)(RichTextViewer_1.RichTextViewer, { content: content.endComment }))) }))
|
|
272
|
+
` }), isEditing ? ((0, jsx_runtime_1.jsx)(RichTextEditor_1.RichTextEditor, { initialContent: content.bodyText, onChange: (_html, json) => updateField('bodyText', json), placeholder: "Corps du texte...", columns: content.columns, minHeight: content.columnLines ? `calc(${content.columnLines * 1.7}em + 60px)` : "200px", autoGrow: !content.columnLines })) : ((0, jsx_runtime_1.jsx)(RichTextViewer_1.RichTextViewer, { content: content.bodyText, columns: content.columns }))] }), (content.footnote || (isEditing && content.legendAsterisk)) && ((0, jsx_runtime_1.jsx)("div", { style: styles.footnote, children: (0, jsx_runtime_1.jsx)(EditableText, { value: content.footnote || '', onChange: (v) => updateField('footnote', v), isEditing: isEditing, placeholder: "* Note explicative...", style: styles.footnote }) })), (content.endComment || isEditing) && ((0, jsx_runtime_1.jsx)("div", { style: endCommentStyle, children: isEditing ? ((0, jsx_runtime_1.jsx)(RichTextEditor_1.RichTextEditor, { initialContent: content.endComment || '', onChange: (_html, json) => updateField('endComment', json), placeholder: "Commentaire de fin de section...", minHeight: "80px", autoGrow: true })) : (content.endComment && ((0, jsx_runtime_1.jsx)(RichTextViewer_1.RichTextViewer, { content: content.endComment }))) })), (0, jsx_runtime_1.jsx)(ImageMetadataDialog_1.ImageMetadataDialog, { isOpen: showImageDialog, onClose: () => setShowImageDialog(false), onSave: handleSaveImage, initialData: {
|
|
273
|
+
src: content.image.src,
|
|
274
|
+
alt: content.image.altText,
|
|
275
|
+
title: content.image.title,
|
|
276
|
+
photographer: content.image.photographer,
|
|
277
|
+
copyright: content.image.copyright,
|
|
278
|
+
comment: content.image.comment,
|
|
279
|
+
}, title: "Propri\u00E9t\u00E9s de l'image" })] }));
|
|
289
280
|
}
|
|
290
281
|
// ============================================
|
|
291
282
|
// Register Layout
|