catchup-library-web 1.12.8 → 1.12.9

package/dist/index.js

@@ -3648,6 +3648,7 @@ var InputGroup = ({
   useMath
 }) => {
   const textAreaRef = (0, import_react10.useRef)(null);
+  const latexTextAreaRef = (0, import_react10.useRef)(null);
   const [showMathConstructor, setShowMathConstructor] = (0, import_react10.useState)(false);
   const [mathValue, setMathValue] = (0, import_react10.useState)("");
   const mathFieldRef = (0, import_react10.useRef)(null);
@@ -3660,6 +3661,15 @@ var InputGroup = ({
       textAreaRef.current.style.height = `44px`;
     }
   }, [textAreaRef, value]);
+  (0, import_react10.useEffect)(() => {
+    if (!latexTextAreaRef) return;
+    if (!latexTextAreaRef.current) return;
+    if (value) {
+      latexTextAreaRef.current.style.height = `${latexTextAreaRef.current.scrollHeight}px`;
+    } else {
+      latexTextAreaRef.current.style.height = `44px`;
+    }
+  }, [latexTextAreaRef, value]);
   (0, import_react10.useEffect)(() => {
     if (!useMath) return;
     import("mathlive").then(({ MathfieldElement }) => {
@@ -3764,9 +3774,10 @@ var InputGroup = ({
               /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                 "textarea",
                 {
+                  ref: latexTextAreaRef,
                   readOnly: true,
                   value: mathValue,
-                  className: "w-full py-2 px-4 bg-catchup-gray-50 border border-catchup-gray-100 rounded-catchup-large resize-none focus:outline-none",
+                  className: "w-full h-[44px] py-2 px-4 bg-catchup-gray-50 border border-catchup-gray-100 rounded-catchup-large resize-none focus:outline-none",
                   placeholder: i18n_default.t("latex_will_appear_here")
                 }
               ),

package/dist/index.mjs

@@ -3447,6 +3447,7 @@ var InputGroup = ({
   useMath
 }) => {
   const textAreaRef = useRef(null);
+  const latexTextAreaRef = useRef(null);
   const [showMathConstructor, setShowMathConstructor] = useState10(false);
   const [mathValue, setMathValue] = useState10("");
   const mathFieldRef = useRef(null);
@@ -3459,6 +3460,15 @@ var InputGroup = ({
       textAreaRef.current.style.height = `44px`;
     }
   }, [textAreaRef, value]);
+  useEffect2(() => {
+    if (!latexTextAreaRef) return;
+    if (!latexTextAreaRef.current) return;
+    if (value) {
+      latexTextAreaRef.current.style.height = `${latexTextAreaRef.current.scrollHeight}px`;
+    } else {
+      latexTextAreaRef.current.style.height = `44px`;
+    }
+  }, [latexTextAreaRef, value]);
   useEffect2(() => {
     if (!useMath) return;
     import("mathlive").then(({ MathfieldElement }) => {
@@ -3563,9 +3573,10 @@ var InputGroup = ({
               /* @__PURE__ */ jsx17(
                 "textarea",
                 {
+                  ref: latexTextAreaRef,
                   readOnly: true,
                   value: mathValue,
-                  className: "w-full py-2 px-4 bg-catchup-gray-50 border border-catchup-gray-100 rounded-catchup-large resize-none focus:outline-none",
+                  className: "w-full h-[44px] py-2 px-4 bg-catchup-gray-50 border border-catchup-gray-100 rounded-catchup-large resize-none focus:outline-none",
                   placeholder: i18n_default.t("latex_will_appear_here")
                 }
               ),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "catchup-library-web",
-  "version": "1.12.8",
+  "version": "1.12.9",
   "description": "",
   "main": "dist/index.js",
   "scripts": {

package/src/components/groups/InputGroup.tsx

@@ -67,6 +67,7 @@ const InputGroup = ({
   useMath,
 }: IInputGroupProps) => {
   const textAreaRef = useRef<HTMLTextAreaElement>(null);
+  const latexTextAreaRef = useRef<HTMLTextAreaElement>(null);
   const [showMathConstructor, setShowMathConstructor] =
     useState<boolean>(false);
   const [mathValue, setMathValue] = useState<string>("");
@@ -82,6 +83,16 @@ const InputGroup = ({
     }
   }, [textAreaRef, value]);
 
+  useEffect(() => {
+    if (!latexTextAreaRef) return;
+    if (!latexTextAreaRef.current) return;
+    if (value) {
+      latexTextAreaRef.current.style.height = `${latexTextAreaRef.current.scrollHeight}px`;
+    } else {
+      latexTextAreaRef.current.style.height = `44px`;
+    }
+  }, [latexTextAreaRef, value]);
+
   useEffect(() => {
     if (!useMath) return;
     import("mathlive").then(({ MathfieldElement }) => {
@@ -199,9 +210,10 @@ const InputGroup = ({
                 </p>
                 <div className="relative">
                   <textarea
+                    ref={latexTextAreaRef}
                     readOnly
                     value={mathValue}
-                    className="w-full py-2 px-4 bg-catchup-gray-50 border border-catchup-gray-100 rounded-catchup-large resize-none focus:outline-none"
+                    className="w-full h-[44px] py-2 px-4 bg-catchup-gray-50 border border-catchup-gray-100 rounded-catchup-large resize-none focus:outline-none"
                     placeholder={i18n.t("latex_will_appear_here")}
                   />
                   <button