feat: tag 增加在线调试能力

src/packages/tag/doc.en-US.md

-# Tag 
+# Tag
 
 ### introduce
 
@@ -14,45 +14,133 @@ import { Tag } from '@nutui/nutui-react';
 
 ### Basic usage
 
+:::demo
+
 ```tsx
-<Tag type="primary">Label</Tag>
-<Tag type="success">Label</Tag>
-<Tag type="danger">Label</Tag>
-<Tag type="warning">Label</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag type="primary">Label</Tag>
+      <Tag type="success">Label</Tag>
+      <Tag type="danger">Label</Tag>
+      <Tag type="warning">Label</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### Hollow style
 
+:::demo
+
 ```tsx
-<Tag plain>Label</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag plain>Label</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### Rounded style
 
+:::demo
+
 ```tsx
-<Tag round type="primary">Label</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag round type="primary">Label</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### Label style
 
+:::demo
+
 ```tsx
-<Tag mark type="primary">Label</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag mark type="primary">Label</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### Can close label
 
+:::demo
+
 ```tsx
-<Tag isShow={isShow} closeable onClick={close} type="primary">Label</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  const [isShow, setIsShow] = useState(true)
+  const close = () => {
+    setIsShow(false)
+  }
+  return (
+    <>
+      <Tag isShow={isShow} closeable onClick={close} type="primary">Label</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### Custom color
 
+:::demo
+
 ```tsx
-<Tag color="#FA685D">Label</Tag>
-<Tag color="#E9E9E9" text-color="#999999">Label</Tag>
-<Tag color="#FA2400" plain>Label</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag color="#FA685D">Label</Tag>
+      <Tag color="#E9E9E9" text-color="#999999">Label</Tag>
+      <Tag color="#FA2400" plain>Label</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ## API
 
 ### Props
@@ -67,7 +155,6 @@ import { Tag } from '@nutui/nutui-react';
 | mark       | Whether it is a tag style                          | Boolean | `false`   |
 | closeable  | Whether it can be closed label                     | Boolean | `false`   |
 
-
 ### Event
 
 | Event name | illustrate  | Callback parameter |

src/packages/tag/doc.md

@@ -14,45 +14,133 @@ import { Tag } from '@nutui/nutui-react';
 
 ### 基础用法
 
+:::demo
+
 ```tsx
-<Tag type="primary">标签</Tag>
-<Tag type="success">标签</Tag>
-<Tag type="danger">标签</Tag>
-<Tag type="warning">标签</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag type="primary">标签</Tag>
+      <Tag type="success">标签</Tag>
+      <Tag type="danger">标签</Tag>
+      <Tag type="warning">标签</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### 空心样式
 
+:::demo
+
 ```tsx
-<Tag plain>标签</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag plain>标签</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### 圆角样式
 
+:::demo
+
 ```tsx
-<Tag round type="primary">标签</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag round type="primary">标签</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### 标记样式
 
+:::demo
+
 ```tsx
-<Tag mark type="primary">标签</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag mark type="primary">标签</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### 可关闭标签
 
+:::demo
+
 ```tsx
-<Tag isShow={isShow} closeable onClick={close} type="primary">标签</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  const [isShow, setIsShow] = useState(true)
+  const close = () => {
+    setIsShow(false)
+  }
+  return (
+    <>
+      <Tag isShow={isShow} closeable onClick={close} type="primary">标签</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ### 自定义颜色
 
+:::demo
+
 ```tsx
-<Tag color="#FA685D">标签</Tag>
-<Tag color="#E9E9E9" text-color="#999999">标签</Tag>
-<Tag color="#FA2400" plain>标签</Tag>
+import React from "react";
+import { Tag } from '@nutui/nutui-react';
+
+const App = () => {
+  return (
+    <>
+      <Tag color="#FA685D">标签</Tag>
+      <Tag color="#E9E9E9" text-color="#999999">标签</Tag>
+      <Tag color="#FA2400" plain>标签</Tag>
+    </>
+  )
+}
+export default App;
 ```
 
+:::
+
 ## API
 
 ### Props
@@ -67,7 +155,6 @@ import { Tag } from '@nutui/nutui-react';
 | mark       | 是否为标记样式                                   | Boolean | `false`   |
 | closeable  | 是否为可关闭标签                                 | Boolean | `false`   |
 
-
 ### Event
 
 | 事件名称 | 说明     | 回调参数 |