fix: Fix highlightEnable props issue.

uiwjs · Jun 13, 2022 · ae6c9ff · ae6c9ff · vercel · Jun 13, 2022
1 parent 696d257
commit ae6c9ff
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 14 deletions.
diff --git a/core/src/components/TextArea/Markdown.tsx b/core/src/components/TextArea/Markdown.tsx
@@ -8,7 +8,7 @@ export interface MarkdownProps extends IProps, React.HTMLAttributes<HTMLPreEleme
 
 export default function Markdown(props: MarkdownProps) {
   const { prefixCls } = props;
-  const { markdown = '', dispatch } = useContext(EditorContext);
+  const { markdown = '', highlightEnable, dispatch } = useContext(EditorContext);
   const preRef = React.createRef<HTMLPreElement>();
   useEffect(() => {
     if (preRef.current && dispatch) {
@@ -34,17 +34,16 @@ export default function Markdown(props: MarkdownProps) {
     if (!markdown) {
       return <pre children={markdown || ''} ref={preRef} className={`${prefixCls}-text-pre wmde-markdown-color`} />;
     }
-    const str = rehype()
-      .data('settings', { fragment: true })
-      .use(rehypePrism, { ignoreMissing: true })
-      .processSync(
-        `<pre class="language-markdown ${prefixCls}-text-pre wmde-markdown-color"><code class="language-markdown">${html2Escape(
-          markdown,
-        )}\n</code></pre>`,
-      );
+    let mdStr = `<pre class="language-markdown ${prefixCls}-text-pre wmde-markdown-color"><code class="language-markdown">${html2Escape(
+      markdown,
+    )}\n</code></pre>`;
+    if (highlightEnable) {
+      mdStr = rehype().data('settings', { fragment: true }).use(rehypePrism, { ignoreMissing: true }).processSync(mdStr)
+        .value as string;
+    }
     return React.createElement('div', {
       className: 'wmde-markdown-color',
-      dangerouslySetInnerHTML: { __html: str.value as string },
+      dangerouslySetInnerHTML: { __html: mdStr },
     });
   }, [markdown, preRef, prefixCls]);
 }
diff --git a/core/src/components/TextArea/index.tsx b/core/src/components/TextArea/index.tsx
@@ -42,7 +42,7 @@ export type TextAreaRef = {
 
 export default function TextArea(props: ITextAreaProps) {
   const { prefixCls, className, onScroll, renderTextarea, ...otherProps } = props || {};
-  const { markdown, scrollTop, commands, highlightEnable, extraCommands, dispatch } = useContext(EditorContext);
+  const { markdown, scrollTop, commands, extraCommands, dispatch } = useContext(EditorContext);
   const textRef = React.useRef<HTMLTextAreaElement>(null);
   const executeRef = React.useRef<TextAreaCommandOrchestrator>();
   const warp = React.createRef<HTMLDivElement>();
@@ -68,7 +68,7 @@ export default function TextArea(props: ITextAreaProps) {
   }, []);
 
   // @ts-ignore
-  const textStyle: React.CSSProperties = highlightEnable ? {} : { '-webkit-text-fill-color': 'inherit' };
+  // const textStyle: React.CSSProperties = highlightEnable ? { WebkitTextFillColor: 'transparent' } : { };
 
   return (
     <div ref={warp} className={`${prefixCls}-aree ${className || ''}`} onScroll={onScroll}>
@@ -102,8 +102,8 @@ export default function TextArea(props: ITextAreaProps) {
           )
         ) : (
           <Fragment>
-            {highlightEnable && <Markdown prefixCls={prefixCls} />}
-            <Textarea prefixCls={prefixCls} {...otherProps} style={textStyle} />
+            <Markdown prefixCls={prefixCls} />
+            <Textarea prefixCls={prefixCls} {...otherProps} />
           </Fragment>
         )}
       </div>