fix(): fix minLines = 1 and placholder overflow

Author: SailorF

bricks/vs/src/code-editor/index.tsx

@@ -380,6 +380,8 @@ export function CodeEditorComponent({
   const maxLines = _maxLines ?? Infinity;
   const height = _height ?? 500;
   const [expanded, setExpanded] = useState(false);
+  const [placeholderInstance, setPlaceholderInstance] =
+    useState<PlaceholderContentWidget>();
   const workerId = useMemo(() => uniqueId("worker"), []);
 
   const { t } = useTranslation(NS);
@@ -909,11 +911,32 @@ export function CodeEditorComponent({
       editorRef.current!
     );
 
+    setPlaceholderInstance(placeholderWidget);
+
     return () => {
       placeholderWidget.dispose();
     };
   }, [placeholder]);
 
+  useEffect(() => {
+    if (
+      placeholderInstance &&
+      editorRef.current &&
+      editorRef.current.getDomNode
+    ) {
+      const node = placeholderInstance.getDomNode();
+      const rect = node.getBoundingClientRect();
+      const originWidth = editorRef.current
+        ?.getDomNode()
+        ?.getBoundingClientRect().width;
+
+      editorRef.current?.layout({
+        width: originWidth!,
+        height: rect.height + 25,
+      });
+    }
+  }, [placeholderInstance]);
+
   const handleCopyIconClick = useCallback(() => {
     if (editorRef.current) {
       const currentModel = editorRef.current.getModel()!;

bricks/vs/src/code-editor/widget/Placeholder.tsx

@@ -39,7 +39,7 @@ export class PlaceholderContentWidget implements monaco.editor.IContentWidget {
       this.domNode.style.fontStyle = "italic";
       this.domNode.style.color =
         "rgba(var(--theme-gray-color-rgb-channel), 0.4)";
-      this.editor.applyFontInfo(this.domNode);
+      this.editor?.applyFontInfo?.(this.domNode);
     }
 
     return this.domNode;