feat:加meta特殊标识

Author: SunLxy

core/README.md

@@ -93,12 +93,13 @@ export default (conf: Configuration, env: 'development' | 'production', options:
 
 ## markdown 设置 meta 值
 
-> 1. preview: 控制是否进行进行预览的
-> 2. preview:demo12:`demo12`是设置的一个保存渲染数据的变量名称，根据这个设置的变量名称获取渲染数据,默认这个值是所属code代码块开始行值
+> 1. dj: 特殊标识
+> 2. dj:preview: 控制是否进行进行预览的
+> 3. dj:preview:demo12:`demo12`是设置的一个保存渲染数据的变量名称，根据这个设置的变量名称获取渲染数据,默认这个值是所属code代码块开始行值
 
 ```markdown
 
-\```tsx preview
+\```tsx dj:preview
 import React from "react"
 const Demo = ()=>{
   return <div>测试</div>
@@ -108,7 +109,7 @@ export default Demo
 
 \```  
 
-\```tsx preview:demo12
+\```tsx dj:preview:demo12
 import React from "react"
 const Demo = ()=>{
   return <div>测试</div>

core/src/utils/index.ts

@@ -16,15 +16,9 @@ const getProcessor = (scope: string) => {
 const getMeta = (meta: string | null): Record<string, string | boolean> => {
   let metaData: Record<string, string | boolean> = {};
   if (meta) {
-    const [field, val] = meta.split(':');
+    const [metaItem] = /dj:(.[\w|:]+)/i.exec(meta) || [];
+    const [_, field, val] = (metaItem || '').split(':').map((item) => item.trim());
     metaData[field] = val || true;
-    // meta.split(/\|/).forEach((item) => {
-    //   const value = item.trim();
-    //   if (value) {
-    //     const [field, val] = value.split(':');
-    //     metaData[field] = val || true;
-    //   }
-    // });
   }
   return metaData;
 };

website/src/App-zh.md

@@ -14,9 +14,7 @@ import Alert from "@uiw/react-alert";
 
 ## 基本用法
 
-<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->
-
-```jsx preview
+```jsx dj:preview
 import React from "react";
 import ReactDOM from "react-dom";
 import { Alert, ButtonGroup, Button } from "uiw";
@@ -76,9 +74,7 @@ export default Demo;
 
 这里是利用 `Promise` 等它执行完成再去关闭窗口
 
-<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->
-
-```jsx preview
+```jsx dj:preview
 import React from "react";
 import ReactDOM from "react-dom";
 import { Alert, Button } from "uiw";
@@ -142,9 +138,7 @@ export default Demo;
 
 通过设置 `icon` 和 `type` 参数设置带状态的弹出对话框。
 
-<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->
-
-```jsx preview
+```jsx dj:preview
 import React from "react";
 import ReactDOM from "react-dom";
 import { Alert, ButtonGroup, Button } from "uiw";
@@ -256,9 +250,7 @@ import Alert from "@uiw/react-alert";
 
 ## 带标题的弹出框
 
-<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->
-
-```jsx preview
+```jsx dj:preview
 import React from "react";
 import ReactDOM from "react-dom";
 import { Alert, ButtonGroup, Button } from "uiw";
@@ -371,7 +363,7 @@ export default Demo;
 
 这个对话框有两个按钮，单击 **`确定按钮`** 或 **`取消按钮`** 后，此对话框将关闭，将不触发 ~~`onConfirm`~~ 或 ~~`onCancel`~~ 事件。因为这俩按钮是自定义按钮。你可以正对自定义按钮外面的对象定义 `className="w-alert-footer"` 将显示默认样式。
 
-```jsx preview:base23
+```jsx dj:preview:base23
 import React from "react";
 import ReactDOM from "react-dom";
 import { Alert, ButtonGroup, Button } from "uiw";
@@ -425,9 +417,7 @@ export default Demo;
 
 ### 不显示遮罩层
 
-<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->
-
-```jsx preview
+```jsx dj:preview
 import React from "react";
 import ReactDOM from "react-dom";
 import { Alert, ButtonGroup, Button } from "uiw";

website/src/App.md

@@ -2,7 +2,7 @@
 ## Basic 
 
 
-```jsx preview:base12
+```jsx dj:preview:base12
 import React from "react";
 import ReactDOM from "react-dom";
 import { Alert, ButtonGroup, Button } from "uiw";

website/src/App.tsx

@@ -16,10 +16,11 @@ const language = {
 
 const getMetaData = (meta: string) => {
   if (meta) {
+    const [metaItem] = /dj:(.[\w|:]+)/i.exec(meta) || [];
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const [field, name] = meta.split(':').map((item) => item.trim());
-    if (name) {
-      return name;
+    const [_, field, val] = (metaItem || '').split(':').map((item) => item.trim());
+    if (val) {
+      return val;
     }
   }
   return '';