diff --git a/package.json b/package.json
index 707e901a86a50ab57f3c549b74c194045170387b..349efb9d7ef84306e1feb60c59adabe605de0f55 100644
--- a/package.json
+++ b/package.json
@@ -14,8 +14,7 @@
   "dependencies": {
     "normalize.css": "catalog:css",
     "vue": "catalog:vue",
-    "vue-router": "catalog:vue",
-    "@opensig/opendesign": "workspace:^"
+    "vue-router": "catalog:vue"
   },
   "devDependencies": {
     "@rushstack/eslint-patch": "catalog:lint",
diff --git a/packages/docs/plugins/markdown/popover.ts b/packages/docs/plugins/markdown/popover.ts
index 047a17a09bb41e5b457fb1c78349828f1de927e4..bc6f5cde9e6fb5586a5438f325e2e8c96b3ba8c8 100644
--- a/packages/docs/plugins/markdown/popover.ts
+++ b/packages/docs/plugins/markdown/popover.ts
@@ -1,25 +1,33 @@
 import { MarkdownItAsync } from 'markdown-it-async';
-import { escapeHtml } from 'markdown-it/lib/common/utils.mjs';
 
+const HTML_REPLACEMENTS = {
+  // 避免xss注入
+  '<': '&lt;',
+  '>': '&gt;',
+  '"': '&quot;',
+  "'": '&apos;',
+};
+function replaceCellChar(ch: string) {
+  return HTML_REPLACEMENTS[ch];
+}
+function escapeHtml(value?: string) {
+  const HTML_ESCAPE_REPLACE_RE = /[<>"']/g;
+  return value ? value.replace(HTML_ESCAPE_REPLACE_RE, replaceCellChar) : '';
+}
 /**
  * markdown插件，通过 ^[标题]`内容` 语法，渲染popover，popover组件的target为 <OTag>标题</OTag>
  * @param md markdown-it 实例
  */
 export default function popover(md: MarkdownItAsync) {
   // 定义正则表达式，匹配 ^[内容]`提示信息` 语法
-  const popoverRegExp = /^\^\[([^\]]*)\](\(normal|primary|success|warning|danger\))?(`[^`]*`)?/;
+  const popoverRegExp = /^\^\[([^\]]*)\](?:\((normal|primary|success|warning|danger)\))?(`[^`]*`)?/;
 
   md.renderer.rules.popover = function (tokens, idx) {
     const token = tokens[idx];
     const content = escapeHtml(token.content);
     const info = escapeHtml(token.info);
-    const target = (icon?: boolean) =>
-      `<OTag color="${token.meta?.color || 'normal'}" class="tooltip">${icon ? '<template #icon><OIconInfo /></template>' : ''}${content}</OTag>`;
-    if (!info) {
-      return target();
-    }
     return `<OPopover>
-<template #target>${target(true)}</template>
+<template #target><OTag color="${token.meta?.color || 'normal'}" class="tooltip">${content}</OTag></template>
 ${info}
 </OPopover>`;
   };
diff --git a/packages/docs/plugins/markdown/wrapCodeContainer.ts b/packages/docs/plugins/markdown/wrapCodeContainer.ts
index 1f979b74836c05bc8086f9bb28887b8fddb60905..290a3507d42c1ffeedbd1b0397df89a0fa0c7e85 100644
--- a/packages/docs/plugins/markdown/wrapCodeContainer.ts
+++ b/packages/docs/plugins/markdown/wrapCodeContainer.ts
@@ -8,8 +8,10 @@ export default function wrapCodeContainer(md: MarkdownItAsync) {
   const fence = md.renderer.rules.fence;
   md.renderer.rules.fence = (tokens, idx, options, env, self) => {
     const token = tokens[idx];
+    if (!token.attrGet('v-pre')) {
+      token.attrSet('v-pre', '');
+    }
     const preCode = fence(tokens, idx, options, env, self);
-
     return `
 <CodeContainer lang="${token.info}" content-encoded="${encodeURIComponent(tokens[idx].content)}" :line-numbers="${Boolean(env.portal?.lineNumbers)}">
   ${preCode}
diff --git a/packages/docs/public/HarmonyOS_Hans_Medium.Bmj-cXYg.woff2 b/packages/docs/public/HarmonyOS_Hans_Medium.Bmj-cXYg.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..205ef04d277578649e63fc3be05f7e8933bcdfd4
Binary files /dev/null and b/packages/docs/public/HarmonyOS_Hans_Medium.Bmj-cXYg.woff2 differ
diff --git a/packages/docs/public/HarmonyOS_Sans_Bold_Italic.Bvb9oWs-.woff2 b/packages/docs/public/HarmonyOS_Sans_Bold_Italic.Bvb9oWs-.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..5dbbba7a8923c7c2729b2acb3963a25b8d0f3eee
Binary files /dev/null and b/packages/docs/public/HarmonyOS_Sans_Bold_Italic.Bvb9oWs-.woff2 differ
diff --git a/packages/docs/scripts/generateApi.ts b/packages/docs/scripts/generateApi.ts
index 8759d400c06268d651bad772f46248dac7e8402b..ca1ea2d6bc6c094458654e7938c8ae79605948be 100644
--- a/packages/docs/scripts/generateApi.ts
+++ b/packages/docs/scripts/generateApi.ts
@@ -16,7 +16,6 @@ const checker = createChecker(tsConfigPath, {
   noDeclarations: true,
   printer: { newLine: 1 },
 });
-const CELL_ESCAPE_REPLACE_RE = /[<>"'\|]/g;
 const CELL_REPLACEMENTS = {
   // 避免xss注入
   '<': '&lt;',
@@ -31,6 +30,7 @@ function replaceCellChar(ch: string) {
   return CELL_REPLACEMENTS[ch];
 }
 function escapeTableValue(value?: string) {
+  const CELL_ESCAPE_REPLACE_RE = /[<>"'\|]/g;
   return value ? value.replace(CELL_ESCAPE_REPLACE_RE, replaceCellChar) : '';
 }
 function cleanTableData(table: any[][]) {
@@ -128,6 +128,9 @@ async function applyTempFixForSlot(filename: string, componentMeta: ComponentMet
 const terminalWidth = process.stdout.columns || 80;
 const progressBarLength = Math.min(Math.floor(terminalWidth / 4), 30);
 const pathReg = /\/(O.*)\.vue/;
+const tagTypes = {
+  deprecated: '(warning)'
+}
 glob('*/O*.vue', { cwd: srcDir, posix: true }).then((files) => {
   files.forEach(async (file, index) => {
     const fullPath = join(srcDir, file);
@@ -163,7 +166,7 @@ glob('*/O*.vue', { cwd: srcDir, posix: true }).then((files) => {
             prop.tags.find((tag) => tag.name === lang)?.text || prop.description || '',
             prop.tags
               .filter((tag) => !excludeTag.includes(tag.name))
-              .map((tag) => `^[${tag.name}]${tag.text ? `\`${tag.text}\`` : ''}`)
+              .map((tag) => `^[${tag.name}]${tagTypes[tag.name] || ''}${tag.text ? `\`${tag.text}\`` : ''}`)
               .join(' '),
           ];
         });
@@ -185,7 +188,7 @@ glob('*/O*.vue', { cwd: srcDir, posix: true }).then((files) => {
             event.tags.find((tag) => tag.name === lang)?.text || event.description || '',
             event.tags
               .filter((tag) => !excludeTag.includes(tag.name))
-              .map((tag) => `^[${tag.name}]${tag.text ? `\`${tag.text}\`` : ''}`)
+              .map((tag) => `^[${tag.name}]${tagTypes[tag.name] || ''}${tag.text ? `\`${tag.text}\`` : ''}`)
               .join(' '),
           ];
         });
diff --git a/packages/docs/src/assets/style/markdown.scss b/packages/docs/src/assets/style/markdown.scss
index 58a1309ace12169f3e3e45aa40f71e5f774d7242..65d65ddaa23e45316cbb18b843c6a3b3692764b6 100644
--- a/packages/docs/src/assets/style/markdown.scss
+++ b/packages/docs/src/assets/style/markdown.scss
@@ -12,7 +12,7 @@
 [data-o-theme$='dark'] pre span {
   color: var(--shiki-dark);
 }
-p + .code-container {
+p + .code-container, p + .o-table {
   margin-top: 8px;
 }
 ol,
diff --git a/packages/docs/src/components/DemoUsage.vue b/packages/docs/src/components/DemoUsage.vue
index ae94c22a3ca94c51b2cb6b41c913feeb59de4d5e..5f591a093f843522291479b16c7c9f61802d0a43 100644
--- a/packages/docs/src/components/DemoUsage.vue
+++ b/packages/docs/src/components/DemoUsage.vue
@@ -266,12 +266,21 @@ Demo.DemoSource = () => {
     );
   }
 };
-const docs = shallowReactive<Record<string, string>>({});
+const docs = shallowReactive<Record<string, Component | string>>({});
 watchEffect(() => {
   showcaseComponent.value = createShowcaseComponent(state, props.style);
   if (props.docs) {
     Object.keys(props.docs).forEach((key) => {
-      docs[key] = md.render(props.docs![key]);
+      const htmlCode = md.render(props.docs![key]);
+      try {
+        docs[key] = compileComponent(htmlCode);
+      } catch (e) {
+        docs[key] = htmlCode;
+        if (process.env.NODE_ENV === 'development') {
+          console.warn(e);
+          console.warn(`${key}:\n${htmlCode}`);
+        }
+      }
     });
   } else {
     Object.keys(docs).forEach((key) => {
diff --git a/packages/docs/src/main.ts b/packages/docs/src/main.ts
index d2a82c5608857f23702d4719711994ff46c15e3a..0258ae706f3d593767cc0238685a74c381988cff 100644
--- a/packages/docs/src/main.ts
+++ b/packages/docs/src/main.ts
@@ -2,9 +2,9 @@ import { createApp } from 'vue';
 import { createPinia } from 'pinia';
 import 'normalize.css';
 
-import '@opensig/opendesign/es/index.css';
-import '@opensig/opendesign/es/_styles/light.token.css';
-import '@opensig/opendesign/es/_styles/dark.token.css';
+import '@opensig/opendesign/index.scss';
+import '@opensig/opendesign/_styles/light.token.css';
+import '@opensig/opendesign/_styles/dark.token.css';
 import '@/assets/style/index';
 
 import { router } from '@/router/index';
diff --git a/packages/docs/src/utils/compileComponent.ts b/packages/docs/src/utils/compileComponent.ts
index 9f1a10ff912612a90f32d5adee8b1a1a9da8e730..61fb54d02b0cd95566bd611a780608f0855c6cf9 100644
--- a/packages/docs/src/utils/compileComponent.ts
+++ b/packages/docs/src/utils/compileComponent.ts
@@ -8,7 +8,7 @@ import { compile, type CompilerOptions } from '@vue/compiler-dom';
  * @param options
  * @returns 组件
  */
-export function compileComponent(template: string, ctx: any, options: Omit<CompilerOptions, 'filename' | 'mode'> = {}): Vue.Component {
+export function compileComponent(template: string, ctx: any = {}, options: Omit<CompilerOptions, 'filename' | 'mode'> = {}): Vue.Component {
   const { code } = compile(template, {
     ...options,
     mode: 'function',
diff --git a/packages/docs/vite.config.ts b/packages/docs/vite.config.ts
index 888ba4740534cc941494a94661381ba83ec5eda6..7a6c99f3ae40a94be33826b46fe71e61411de77b 100644
--- a/packages/docs/vite.config.ts
+++ b/packages/docs/vite.config.ts
@@ -31,6 +31,7 @@ export default defineConfig({
       '@/': `${path.resolve(__dirname, './src')}/`,
       '@components': path.resolve(__dirname, '../opendesign/src'),
       '@assets': path.resolve(__dirname, './src/assets'),
+      '@opensig/opendesign': path.resolve(__dirname, '../opendesign/src'),
     },
   },
   server: {
diff --git a/packages/opendesign/src/_utils/types.ts b/packages/opendesign/src/_utils/types.ts
index bbef724f589ceeb2c866df219544e5e5fee2eec9..ac7cdca8e4e88271d3342517e47ed1c8b2f3e820 100644
--- a/packages/opendesign/src/_utils/types.ts
+++ b/packages/opendesign/src/_utils/types.ts
@@ -21,8 +21,7 @@ export const SizeTypes = ['large', 'medium', 'small'] as const;
 export type SizeT = (typeof SizeTypes)[number];
 
 // 圆角
-export type RoundT = 'pill' | string;
-
+export type RoundT = 'pill' | (string & {});
 // 方向
 export const DirectionTypes = ['h', 'v'] as const;
 export type DirectionT = (typeof DirectionTypes)[number];
diff --git a/packages/opendesign/tsconfig.json b/packages/opendesign/tsconfig.json
index a70af1174bd54e822dc8048aacab8e6311f9867c..1e52bd19c2a608b0de6b8c260b5986ce801f2551 100644
--- a/packages/opendesign/tsconfig.json
+++ b/packages/opendesign/tsconfig.json
@@ -22,7 +22,9 @@
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
     "baseUrl": "./",
-    "paths": {}
+    "paths": {
+      "@opensig/opendesign": ["./src"]
+    }
   },
   "include": [
     "src/**/*.ts",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e59c68fde7e6bb690dddf7d9cc3a8bc8b8c7f6e3..d1c6c364e00d3a602d3c94cb6e418f6588c79f1a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -144,9 +144,6 @@ importers:
 
   .:
     dependencies:
-      '@opensig/opendesign':
-        specifier: workspace:^
-        version: link:packages/opendesign
       normalize.css:
         specifier: catalog:css
         version: 8.0.1