@kontakto/email-template-editor 2.2.0 → 2.2.1

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.
Files changed (5) hide show
  1. package/dist/index.cjs +44 -15
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +45 -16
  4. package/dist/index.js.map +1 -1
  5. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -6521,11 +6521,20 @@ function HeadingEditor({ style, props }) {
6521
6521
  const handleTextChange = (e) => {
6522
6522
  commitText(e.target.value);
6523
6523
  };
6524
+ const displayRef = React58.useRef(null);
6525
+ const lastDisplayHeightRef = React58.useRef(0);
6526
+ React58.useLayoutEffect(() => {
6527
+ if (!isSelected && displayRef.current) {
6528
+ const h = displayRef.current.offsetHeight;
6529
+ if (h > 0) lastDisplayHeightRef.current = h;
6530
+ }
6531
+ }, [isSelected, textContent, isMarkdown, level]);
6524
6532
  const adjustTextareaHeight = (element) => {
6525
- if (element) {
6526
- element.style.height = "auto";
6527
- element.style.height = `${element.scrollHeight}px`;
6528
- }
6533
+ if (!element) return;
6534
+ element.style.height = "auto";
6535
+ const scrollH = element.scrollHeight;
6536
+ const floor = lastDisplayHeightRef.current;
6537
+ element.style.height = `${Math.max(scrollH, floor)}px`;
6529
6538
  };
6530
6539
  const { textareaRef, trackFocus, handleKeyDown, toolbarProps } = useMarkdownToolbar({
6531
6540
  text: localText,
@@ -6540,9 +6549,9 @@ function HeadingEditor({ style, props }) {
6540
6549
  });
6541
6550
  }
6542
6551
  });
6543
- React58.useEffect(() => {
6552
+ React58.useLayoutEffect(() => {
6544
6553
  if (textareaRef.current) adjustTextareaHeight(textareaRef.current);
6545
- }, [localText, textareaRef]);
6554
+ }, [localText, isSelected]);
6546
6555
  if (isSelected) {
6547
6556
  return /* @__PURE__ */ React58__default.default.createElement(React58__default.default.Fragment, null, /* @__PURE__ */ React58__default.default.createElement(
6548
6557
  "textarea",
@@ -6564,7 +6573,11 @@ function HeadingEditor({ style, props }) {
6564
6573
  }
6565
6574
  ), /* @__PURE__ */ React58__default.default.createElement(InlineFormattingToolbar, __spreadValues({ anchorEl: textareaRef.current }, toolbarProps)));
6566
6575
  }
6567
- const headingProps = isMarkdown ? { style: hStyle, dangerouslySetInnerHTML: { __html: renderInlineMarkdownString(textContent) } } : { style: hStyle, children: textContent };
6576
+ const headingProps = isMarkdown ? {
6577
+ ref: displayRef,
6578
+ style: hStyle,
6579
+ dangerouslySetInnerHTML: { __html: renderInlineMarkdownString(textContent) }
6580
+ } : { ref: displayRef, style: hStyle, children: textContent };
6568
6581
  switch (level) {
6569
6582
  case "h1":
6570
6583
  return /* @__PURE__ */ React58__default.default.createElement("h1", __spreadValues({}, headingProps));
@@ -6996,11 +7009,20 @@ function TextEditor({ style, props }) {
6996
7009
  const handleTextChange = (e) => {
6997
7010
  commitText(e.target.value);
6998
7011
  };
7012
+ const displayRef = React58.useRef(null);
7013
+ const lastDisplayHeightRef = React58.useRef(0);
7014
+ React58.useLayoutEffect(() => {
7015
+ if (!isSelected && displayRef.current) {
7016
+ const h = displayRef.current.offsetHeight;
7017
+ if (h > 0) lastDisplayHeightRef.current = h;
7018
+ }
7019
+ }, [isSelected, textContent, isMarkdown]);
6999
7020
  const adjustTextareaHeight = (element) => {
7000
- if (element) {
7001
- element.style.height = "auto";
7002
- element.style.height = `${element.scrollHeight}px`;
7003
- }
7021
+ if (!element) return;
7022
+ element.style.height = "auto";
7023
+ const scrollH = element.scrollHeight;
7024
+ const floor = lastDisplayHeightRef.current;
7025
+ element.style.height = `${Math.max(scrollH, floor)}px`;
7004
7026
  };
7005
7027
  const { textareaRef, trackFocus, handleKeyDown, toolbarProps } = useMarkdownToolbar({
7006
7028
  text: localText,
@@ -7015,9 +7037,9 @@ function TextEditor({ style, props }) {
7015
7037
  });
7016
7038
  }
7017
7039
  });
7018
- React58.useEffect(() => {
7040
+ React58.useLayoutEffect(() => {
7019
7041
  if (textareaRef.current) adjustTextareaHeight(textareaRef.current);
7020
- }, [localText, textareaRef]);
7042
+ }, [localText, isSelected]);
7021
7043
  if (isSelected) {
7022
7044
  return /* @__PURE__ */ React58__default.default.createElement(React58__default.default.Fragment, null, /* @__PURE__ */ React58__default.default.createElement(
7023
7045
  "textarea",
@@ -7040,9 +7062,16 @@ function TextEditor({ style, props }) {
7040
7062
  ), /* @__PURE__ */ React58__default.default.createElement(InlineFormattingToolbar, __spreadValues({ anchorEl: textareaRef.current }, toolbarProps)));
7041
7063
  }
7042
7064
  if (isMarkdown) {
7043
- return /* @__PURE__ */ React58__default.default.createElement(EmailMarkdown, { style: wStyle, markdown: textContent });
7065
+ return /* @__PURE__ */ React58__default.default.createElement(
7066
+ "div",
7067
+ {
7068
+ ref: displayRef,
7069
+ style: wStyle,
7070
+ dangerouslySetInnerHTML: { __html: renderMarkdownString(textContent) }
7071
+ }
7072
+ );
7044
7073
  }
7045
- return /* @__PURE__ */ React58__default.default.createElement("div", { style: wStyle }, textContent);
7074
+ return /* @__PURE__ */ React58__default.default.createElement("div", { ref: displayRef, style: wStyle }, textContent);
7046
7075
  }
7047
7076
 
7048
7077
  // src/editor/core.tsx