fix: Fix noScroll props issue.

Author: jaywcjlove

src/index.tsx

@@ -104,7 +104,6 @@ const CodePreview = React.forwardRef<CodePreviewRef, CodePreviewProps>((props, r
   const {
     playerId,
     setDemoDom,
-    initHeight,
     code,
     setCode,
     fullScreen,
@@ -148,6 +147,22 @@ const CodePreview = React.forwardRef<CodePreviewRef, CodePreviewProps>((props, r
     );
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
+
+  const transitionend = () => setShowEdit(width !== 1);
+
+  useEffect(() => {
+    const dom = demoRef.current;
+    if (dom) {
+      dom.addEventListener('transitionend', transitionend);
+    }
+    return () => {
+      if (dom) {
+        dom.removeEventListener('transitionend', transitionend);
+      }
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [width]);
+
   const handleChange = (value: string, viewUpdate: ViewUpdate) => {
     setCode(value);
     if (editProps && editProps.onChange) {
@@ -170,12 +185,7 @@ const CodePreview = React.forwardRef<CodePreviewRef, CodePreviewProps>((props, r
     }
   };
   return (
-    <Split
-      visiable={visiable}
-      className={cls}
-      style={{ flex: 1, ...style, height: width === 1 ? initHeight : '' }}
-      {...otherProps}
-    >
+    <Split visiable={visiable} className={cls} style={{ flex: 1, ...style }} {...otherProps}>
       {!noPreview && !onlyEdit && (
         <div
           className={[

src/useCodePreview.ts

@@ -5,7 +5,6 @@ import { babelTransform } from './transform';
 import { CodePreviewProps } from './';
 
 export function useCodePreview(props: CodePreviewProps) {
-  const [initHeight, setInitHeight] = useState<number>();
   const [demoDom, setDemoDom] = useState<HTMLDivElement>();
   const playerId = useRef(`${parseInt(String(Math.random() * 1e9), 10).toString(36)}`);
   const [fullScreen, setFullScreen] = useState(false);
@@ -39,9 +38,6 @@ export function useCodePreview(props: CodePreviewProps) {
       // eslint-disable-next-line no-new-func
       new Function(...args).apply(null, argv);
       setErrorMessage('');
-      if (demoDom && !initHeight) {
-        setInitHeight(demoDom.clientHeight);
-      }
     } catch (err: any) {
       let message = '';
       if (err && err.message) {
@@ -58,8 +54,6 @@ export function useCodePreview(props: CodePreviewProps) {
     playerId,
     demoDom,
     setDemoDom,
-    initHeight,
-    setInitHeight,
     fullScreen,
     setFullScreen,
     errorMessage,