fix: markdown support ellipsis (#257)

* fix: markdown add "format" props

* fix: markdown support ellipsis

packages/client/src/schema-component/antd/markdown/Markdown.Void.tsx

@@ -22,7 +22,7 @@ const MarkdownEditor = (props: any) => {
       <Space style={{ position: 'absolute', bottom: 5, right: 5 }}>
         <Button
           onClick={(e) => {
-            props.onCancel && props.onCancel(e);
+            props.onCancel?.(e);
           }}
         >
           {t('Cancel')}
@@ -30,7 +30,7 @@ const MarkdownEditor = (props: any) => {
         <Button
           type={'primary'}
           onClick={() => {
-            props.onSubmit && props.onSubmit(value);
+            props.onSubmit?.(value);
           }}
         >
           {t('Save')}

packages/client/src/schema-component/antd/markdown/Markdown.tsx

@@ -4,7 +4,7 @@ import { Input as AntdInput } from 'antd';
 import React from 'react';
 import { ReadPretty as InputReadPretty } from '../input';
 import { MarkdownVoid } from './Markdown.Void';
-import { markdown } from './util';
+import { convertToText, markdown } from './util';
 
 export const Markdown: any = connect(
   AntdInput.TextArea,
@@ -19,7 +19,7 @@ export const Markdown: any = connect(
     };
   }),
   mapReadPretty((props) => {
-    let text = props.value;
+    let text = convertToText(props.value);
     let value = <div className={'nb-markdown'} dangerouslySetInnerHTML={{ __html: markdown(text) }} />;
     return <InputReadPretty.TextArea {...props} text={text} value={value} />;
   }),

packages/client/src/schema-component/antd/markdown/util.ts

@@ -6,3 +6,11 @@ export function markdown(text) {
   }
   return marked.parse(text);
 }
+export function convertToText(markdownText: string) {
+  const content = markdown(markdownText);
+  let temp = document.createElement('div');
+  temp.innerHTML = content;
+  const text = temp.innerText;
+  temp = null;
+  return text.replace(/[\n\r]/g, '');
+}

packages/client/src/schema-initializer/Initializers/utils.ts

@@ -64,9 +64,13 @@ export const useTableColumnInitializerFields = () => {
     .filter((field) => field?.interface && field?.interface !== 'subTable')
     .map((field) => {
       const componentProps = {};
-      if (field?.uiSchema['x-component']?.startsWith?.('Input')) {
+      if (
+        field?.uiSchema['x-component']?.startsWith?.('Input') ||
+        field?.uiSchema['x-component']?.startsWith?.('Markdown')
+      ) {
         componentProps['ellipsis'] = true;
       }
+
       if (field.interface === 'attachment') {
         componentProps['size'] = 'small';
         return {

packages/client/src/schema-initializer/SchemaInitializer.tsx

@@ -7,7 +7,7 @@ import {
   SchemaInitializerButtonProps,
   SchemaInitializerItemComponent,
   SchemaInitializerItemOptions,
-  SchemaInitializerItemProps
+  SchemaInitializerItemProps,
 } from './types';
 
 const defaultWrap = (s: ISchema) => s;
@@ -88,7 +88,6 @@ SchemaInitializer.Button = observer((props: SchemaInitializerButtonProps) => {
       }
     });
   };
-
   const menu = <Menu>{renderItems(items)}</Menu>;
 
   if (!designable && props.designable !== true) {