ct-rich-text-editor 1.3.18 → 1.3.20

package/dist/assets/style.css

@@ -2504,6 +2504,10 @@ video {
   vertical-align: middle;
 }
 
+.cteditor-font-arial{
+  font-family: Arial, sans-serif;
+}
+
 .cteditor-font-mono{
   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
 }
@@ -4658,7 +4662,7 @@ body .EmojiPickerReact{
 
   .link {
     color: rgb(33, 111, 219);
-    text-decoration: none;
+    text-decoration: underline;
   }
 
   .link:hover {
@@ -5059,8 +5063,13 @@ body .EmojiPickerReact{
   }
 
   .PlaygroundEditorTheme__paragraph {
-    margin: 0;
+    margin: 0 0 1em 0;
     position: relative;
+    line-height: 1.5;
+  }
+
+  .PlaygroundEditorTheme__paragraph:last-child {
+    margin-bottom: 0;
   }
 
   .PlaygroundEditorTheme__quote {
@@ -5068,6 +5077,7 @@ body .EmojiPickerReact{
     margin-left: 20px;
     margin-bottom: 10px;
     font-size: 15px;
+    line-height: 1.5;
 
     border-left-width: 4px;
     border-left-style: solid;
@@ -5080,8 +5090,19 @@ body .EmojiPickerReact{
 .cteditor-content h5,
 .cteditor-content h6{
   font-weight:600;
+  margin: 0.67em 0 0.5em 0;
+  line-height: 1.5;
+  /* Don't clear floats - allow content to wrap around floated images */
 }
 
+.cteditor-content h1:first-child,
+.cteditor-content h2:first-child,
+.cteditor-content h3:first-child,
+.cteditor-content h4:first-child,
+.cteditor-content h5:first-child,
+.cteditor-content h6:first-child {
+  margin-top: 0;
+}
 
 .cteditor-content h1{
   font-size: 24px;
@@ -5103,6 +5124,43 @@ body .EmojiPickerReact{
   font-size: 11px;
 }
 
+  /* Heading styles - CKEditor-like margins for better visual hierarchy */
+  .PlaygroundEditorTheme__h1,
+  .PlaygroundEditorTheme__h2,
+  .PlaygroundEditorTheme__h3,
+  .PlaygroundEditorTheme__h4,
+  .PlaygroundEditorTheme__h5,
+  .PlaygroundEditorTheme__h6 {
+    /* Don't clear floats by default - allow text to wrap around floated images */
+    margin-top: 0.83em; /* ~33px at 40px heading = CKEditor style */
+    margin-bottom: 0.83em;
+  }
+
+  /* First heading in editor shouldn't have top margin */
+  .PlaygroundEditorTheme__h1:first-child,
+  .PlaygroundEditorTheme__h2:first-child,
+  .PlaygroundEditorTheme__h3:first-child,
+  .PlaygroundEditorTheme__h4:first-child,
+  .PlaygroundEditorTheme__h5:first-child,
+  .PlaygroundEditorTheme__h6:first-child {
+    margin-top: 0;
+  }
+
+  /* Paragraph spacing for better readability - CKEditor uses ~1em */
+  .PlaygroundEditorTheme__paragraph {
+    margin-bottom: 1em;
+  }
+
+  /* Heading after paragraph needs extra space above - CKEditor style */
+  .PlaygroundEditorTheme__paragraph + .PlaygroundEditorTheme__h1,
+  .PlaygroundEditorTheme__paragraph + .PlaygroundEditorTheme__h2,
+  .PlaygroundEditorTheme__paragraph + .PlaygroundEditorTheme__h3,
+  .PlaygroundEditorTheme__paragraph + .PlaygroundEditorTheme__h4,
+  .PlaygroundEditorTheme__paragraph + .PlaygroundEditorTheme__h5,
+  .PlaygroundEditorTheme__paragraph + .PlaygroundEditorTheme__h6 {
+    margin-top: 1.5em;
+  }
+
   .PlaygroundEditorTheme__indent {
     --lexical-indent-base-value: 40px;
   }
@@ -5213,7 +5271,7 @@ body .EmojiPickerReact{
 
   .PlaygroundEditorTheme__link {
     color: rgb(33, 111, 219);
-    text-decoration: none;
+    text-decoration: underline;
   }
 
   .PlaygroundEditorTheme__link:hover {
@@ -5843,6 +5901,89 @@ body .EmojiPickerReact{
     margin:6px;
   }
 
+  /* Float-based image positioning for text wrapping */
+  /* Floated images need display:block and appropriate margins */
+  .editor-image[style*="float: left"],
+  .editor-image[style*="float:left"] {
+    display: block;
+    margin: 0 1em 0.5em 0;
+  }
+
+  .editor-image[style*="float: right"],
+  .editor-image[style*="float:right"] {
+    display: block;
+    margin: 0 0 0.5em 1em;
+  }
+
+  /* Paragraphs containing only a floated image (no text/caption) should not create block formatting context */
+  /* This allows the float to affect subsequent sibling elements */
+  .PlaygroundEditorTheme__paragraph:has(> .editor-image[style*="float"]):not(:has([data-lexical-text])) {
+    display: contents;
+  }
+
+  /* Paragraphs with floated image AND caption text should float as a unit */
+  /* The paragraph itself becomes the float container with the image and caption inside */
+  .PlaygroundEditorTheme__paragraph:has(.editor-image[style*="float"]):has([data-lexical-text]) {
+    display: block;
+  }
+
+  /* Paragraphs with right text-align containing images should float right as a unit */
+  /* The paste plugin sets text-align on paragraphs with floated images + captions */
+  .PlaygroundEditorTheme__paragraph[style*="text-align: right"]:has(> .editor-image),
+  .PlaygroundEditorTheme__paragraph[style*="text-align:right"]:has(> .editor-image) {
+    float: right !important;
+    clear: right; /* Clear previous right floats so images stack vertically */
+    max-width: 50% !important;
+    margin-left: 1em !important;
+    margin-bottom: 0.5em !important;
+    text-align: center !important;
+    background-color: hsla(var(--cteditorf47ac10b-foreground) / 0.05);
+    padding: 0.5em;
+    border-radius: 4px;
+  }
+
+  /* Paragraphs with left text-align containing images should float left as a unit */
+  .PlaygroundEditorTheme__paragraph[style*="text-align: left"]:has(> .editor-image),
+  .PlaygroundEditorTheme__paragraph[style*="text-align:left"]:has(> .editor-image) {
+    float: left !important;
+    clear: left; /* Clear previous left floats so images stack vertically */
+    max-width: 50% !important;
+    margin-right: 1em !important;
+    margin-bottom: 0.5em !important;
+    text-align: center !important;
+    background-color: hsla(var(--cteditorf47ac10b-foreground) / 0.05);
+    padding: 0.5em;
+    border-radius: 4px;
+  }
+
+  /* Reset the float on the image when the paragraph handles floating */
+  .PlaygroundEditorTheme__paragraph[style*="text-align: right"]:has(> .editor-image) > .editor-image,
+  .PlaygroundEditorTheme__paragraph[style*="text-align:right"]:has(> .editor-image) > .editor-image,
+  .PlaygroundEditorTheme__paragraph[style*="text-align: left"]:has(> .editor-image) > .editor-image,
+  .PlaygroundEditorTheme__paragraph[style*="text-align:left"]:has(> .editor-image) > .editor-image {
+    float: none !important;
+    margin: 0 auto !important;
+    max-width: 100% !important;
+    display: block !important;
+  }
+
+  /* Caption styling for floated image paragraphs */
+  .PlaygroundEditorTheme__paragraph[style*="text-align: right"]:has(> .editor-image) > .PlaygroundEditorTheme__textItalic,
+  .PlaygroundEditorTheme__paragraph[style*="text-align:right"]:has(> .editor-image) > .PlaygroundEditorTheme__textItalic,
+  .PlaygroundEditorTheme__paragraph[style*="text-align: left"]:has(> .editor-image) > .PlaygroundEditorTheme__textItalic,
+  .PlaygroundEditorTheme__paragraph[style*="text-align:left"]:has(> .editor-image) > .PlaygroundEditorTheme__textItalic,
+  .PlaygroundEditorTheme__paragraph[style*="text-align: right"]:has(> .editor-image) > em,
+  .PlaygroundEditorTheme__paragraph[style*="text-align:right"]:has(> .editor-image) > em,
+  .PlaygroundEditorTheme__paragraph[style*="text-align: left"]:has(> .editor-image) > em,
+  .PlaygroundEditorTheme__paragraph[style*="text-align:left"]:has(> .editor-image) > em {
+    display: block;
+    font-size: 0.85em;
+    line-height: 1.4;
+    color: hsla(var(--cteditorf47ac10b-foreground) / 0.75);
+    padding: 0.5em 0.5em 0;
+    word-wrap: break-word;
+  }
+
   .editor-image img {
     max-width: 100%;
     cursor: default;

package/dist/components/ImageView/index.d.ts

@@ -1,6 +1,7 @@
 import { LexicalCommand, LexicalEditor, NodeKey } from '../../../node_modules/lexical';
+import { ImagePosition } from '../../nodes/ImageNode';
 export declare const RIGHT_CLICK_IMAGE_COMMAND: LexicalCommand<MouseEvent>;
-export default function ImageComponent({ src, altText, nodeKey, width, height, maxWidth, resizable, showCaption, caption, captionsEnabled, originalPrompt, }: {
+export default function ImageComponent({ src, altText, nodeKey, width, height, maxWidth, resizable, showCaption, caption, captionsEnabled, originalPrompt, position, }: {
     altText: string;
     caption: LexicalEditor;
     height: "inherit" | number;
@@ -12,4 +13,5 @@ export default function ImageComponent({ src, altText, nodeKey, width, height, m
     width: "inherit" | number;
     captionsEnabled: boolean;
     originalPrompt?: string;
+    position?: ImagePosition;
 }): JSX.Element;

package/dist/{html2pdf.bundle-0a42a49f.js → html2pdf.bundle-dea9d834.js}

@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { g as getDefaultExportFromCjs, c as commonjsGlobal } from "./index-dbb526cd.js";
+import { g as getDefaultExportFromCjs, c as commonjsGlobal } from "./index-c4b49ec3.js";
 function _mergeNamespaces(n, m) {
   for (var i = 0; i < m.length; i++) {
     const e = m[i];
@@ -46125,4 +46125,4 @@ const html2pdf_bundle$1 = /* @__PURE__ */ _mergeNamespaces({
 export {
   html2pdf_bundle$1 as h
 };
-//# sourceMappingURL=html2pdf.bundle-0a42a49f.js.map
+//# sourceMappingURL=html2pdf.bundle-dea9d834.js.map