添加markdown预览支持

README.md

@@ -471,6 +471,31 @@ render(<BaseExample />);
 
 ```
 
+- MarkdownPreview
+- Markdown文件预览
+- _ReactFile(@kne/current-lib_react-file)[import * as _ReactFile from "@kne/react-file"],(@kne/current-lib_react-file/dist/index.css),remoteLoader(@kne/remote-loader)
+
+```jsx
+const { MarkdownPreview } = _ReactFile;
+const { createWithRemoteLoader, getPublicPath } = remoteLoader;
+
+const BaseExample = createWithRemoteLoader({
+  modules: ['components-core:InfoPage']
+})(({ remoteModules }) => {
+  const [InfoPage] = remoteModules;
+  return (
+    <InfoPage>
+      <InfoPage.Part title="基础用法">
+        <MarkdownPreview url="/mock/example.md" />
+      </InfoPage.Part>
+    </InfoPage>
+  );
+});
+
+render(<BaseExample />);
+
+```
+
 
 ### API
 
@@ -489,6 +514,18 @@ render(<BaseExample />);
 | maxSize  | number    | -         | 单个文件最大尺寸（字节）               |
 | children | ReactNode | -         | 自定义上传按钮内容                  |
 
+### MarkdownPreview
+
+Markdown文件预览组件，支持渲染Markdown格式的文档。
+
+#### 属性
+
+| 属性 | 类型 | 默认值 | 描述 |
+|------|------|-------|------|
+| url | string | - | Markdown文件的URL地址 |
+| className | string | - | 自定义容器类名 |
+| maxWidth | string/number | - | 容器最大宽度 |
+
 ### FilePreview
 
 文件预览组件，支持多种文件格式的预览。

doc/api.md

@@ -13,6 +13,18 @@
 | maxSize  | number    | -         | 单个文件最大尺寸（字节）               |
 | children | ReactNode | -         | 自定义上传按钮内容                  |
 
+### MarkdownPreview
+
+Markdown文件预览组件，支持渲染Markdown格式的文档。
+
+#### 属性
+
+| 属性 | 类型 | 默认值 | 描述 |
+|------|------|-------|------|
+| url | string | - | Markdown文件的URL地址 |
+| className | string | - | 自定义容器类名 |
+| maxWidth | string/number | - | 容器最大宽度 |
+
 ### FilePreview
 
 文件预览组件，支持多种文件格式的预览。

doc/example.json

@@ -157,6 +157,25 @@
           "packageName": "@kne/remote-loader"
         }
       ]
+    },
+    {
+      "title": "MarkdownPreview",
+      "description": "Markdown文件预览",
+      "code": "./markdown-preview.js",
+      "scope": [
+        {
+          "name": "_ReactFile",
+          "packageName": "@kne/current-lib_react-file",
+          "importStatement": "import * as _ReactFile from \"@kne/react-file\""
+        },
+        {
+          "packageName": "@kne/current-lib_react-file/dist/index.css"
+        },
+        {
+          "name": "remoteLoader",
+          "packageName": "@kne/remote-loader"
+        }
+      ]
     }
   ]
 }

doc/markdown-preview.js

@@ -0,0 +1,17 @@
+const { MarkdownPreview } = _ReactFile;
+const { createWithRemoteLoader, getPublicPath } = remoteLoader;
+
+const BaseExample = createWithRemoteLoader({
+  modules: ['components-core:InfoPage']
+})(({ remoteModules }) => {
+  const [InfoPage] = remoteModules;
+  return (
+    <InfoPage>
+      <InfoPage.Part title="基础用法">
+        <MarkdownPreview url="/mock/example.md" />
+      </InfoPage.Part>
+    </InfoPage>
+  );
+});
+
+render(<BaseExample />);

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kne/react-file",
-  "version": "0.1.30",
+  "version": "0.1.31",
   "description": "提供了文件上传，文件预览，文件批量管理等功能",
   "syntax": {
     "esmodules": true
@@ -90,11 +90,12 @@
     "@ant-design/icons": "^5.5.1",
     "@kne/button-group": "^0.1.3",
     "@kne/create-deferred": "^0.1.0",
-    "@kne/global-context": "^1.1.2",
+    "@kne/global-context": "^1.3.2",
     "@kne/iframe-resizer": "^0.1.3",
+    "@kne/markdown-components-render": "^0.1.8",
     "@kne/react-fetch": "^1.5.5",
     "@kne/react-file-type": "^1.0.7",
-    "@kne/react-intl": "^0.1.6",
+    "@kne/react-intl": "^0.1.12",
     "@kne/use-control-value": "^0.1.8",
     "@kne/use-ref-callback": "^0.1.2",
     "@kne/use-resize": "^0.1.1",

prompts/命名示例编写示例描述.md

@@ -0,0 +1 @@
+根据doc/example.json中code引用的代码实现内容完善doc/example.json中的title和description字段

prompts/生成文档.md

@@ -0,0 +1 @@
+根据代码帮我完成项目概述输出到doc/summary.md，api文档输出到doc/api.md markdown不要使用h1，h2对应的标签，doc/summary.md不需要项目概述标题，不需要依赖项说明，可以适当描述一下项目的特点吸引用户使用，doc/api.md不需要API文档标题，使用h3及之后，api文档优先使用table格式，api部分不需要示例代码，请严格遵守格式要求

prompts/生成语言包.md

@@ -0,0 +1 @@
+将代码中的中文文案抽取到src/locale/zh-CN.js中，输入一个locale对象，locale对象中为key和文案的键值对，然后再翻译到en-US.js中，不要修改原始文件的任何内容