From a9cc580d55f89d7e050a4488e0c134d4562565fd Mon Sep 17 00:00:00 2001 From: sakurayinfei <970412446@qq.com> Date: Tue, 26 Aug 2025 14:38:25 +0800 Subject: [PATCH 1/2] =?UTF-8?q?fix(doc):=20=E8=B0=83=E6=95=B4docs:install?= =?UTF-8?q?=E8=84=9A=E6=9C=AC=E5=91=BD=E4=BB=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index d9565ce9..fa2b72ac 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,7 @@ "test": "echo \"Error: no test specified\" && exit 1", "dev": "pnpm -C packages/portal dev", "dev:ak": "pnpm -C packages/portal-ak dev", - "docs:install": "pnpm i && pnpm -C packages/scripts build && pnpm i && pnpm -C packages/opendesign build && pnpm -C packages/docs gen:api ", + "docs:install": "pnpm i && pnpm -C packages/scripts build && pnpm i && pnpm -C packages/opendesign gen:icon && pnpm -C packages/themes gen:tokens && pnpm -C packages/docs gen:icon && pnpm -C packages/docs gen:api ", "docs:dev": "pnpm -C packages/docs dev", "docs:build": "pnpm -C packages/docs build" }, -- Gitee From 846d93c831fbb188dff678783f933ef445ca1175 Mon Sep 17 00:00:00 2001 From: sakurayinfei <970412446@qq.com> Date: Thu, 28 Aug 2025 14:50:45 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat(doc):=20=E6=96=87=E6=A1=A3=E6=94=AF?= =?UTF-8?q?=E6=8C=81=E4=B8=8D=E5=90=8C=E4=B8=BB=E9=A2=98=E4=B8=8B=E6=98=BE?= =?UTF-8?q?=E7=A4=BA=E4=B8=8D=E5=90=8C=E7=A4=BA=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../docs/plugins/generateComponentRouter.ts | 2 +- packages/docs/plugins/injectDemoAndApi.ts | 55 +- packages/docs/src/App.vue | 12 +- .../docs/src/assets/style/a.dark.token.css | 1949 ----------------- .../docs/src/assets/style/a.light.token.css | 1949 ----------------- packages/docs/src/assets/style/grid.scss | 57 - packages/docs/src/assets/style/index.ts | 6 +- .../docs/src/assets/style/k.dark.token.css | 1949 ----------------- .../docs/src/assets/style/k.light.token.css | 1949 ----------------- .../docs/src/components/CodeContainer.vue | 35 +- .../docs/src/components/DemoContainer.vue | 65 +- packages/docs/src/components/DemoUsage.vue | 5 +- .../docs/src/components/DocConfigProvide.vue | 8 + packages/docs/src/components/TheHeader.vue | 58 +- packages/docs/src/lang/en-US.ts | 7 +- packages/docs/src/lang/index.ts | 2 +- packages/docs/src/lang/zh-CN.ts | 1 + packages/docs/src/main.ts | 3 - packages/docs/src/stores/theme.ts | 101 + packages/docs/tsconfig.json | 2 +- packages/docs/vite.config.ts | 3 +- 21 files changed, 245 insertions(+), 7973 deletions(-) delete mode 100644 packages/docs/src/assets/style/a.dark.token.css delete mode 100644 packages/docs/src/assets/style/a.light.token.css delete mode 100644 packages/docs/src/assets/style/grid.scss delete mode 100644 packages/docs/src/assets/style/k.dark.token.css delete mode 100644 packages/docs/src/assets/style/k.light.token.css create mode 100644 packages/docs/src/components/DocConfigProvide.vue create mode 100644 packages/docs/src/stores/theme.ts diff --git a/packages/docs/plugins/generateComponentRouter.ts b/packages/docs/plugins/generateComponentRouter.ts index af75b4e4..61aac65e 100644 --- a/packages/docs/plugins/generateComponentRouter.ts +++ b/packages/docs/plugins/generateComponentRouter.ts @@ -66,7 +66,7 @@ ${res (info) => ` { path: '/${info.lang}/components/${info.name}', name: 'component/${info.name}/${info.lang}', - component: () => import('@components/${info.file}'), + component: () => import('@opensig/opendesign/${info.file}'), meta: ${JSON.stringify(info.meta)} }`, ) diff --git a/packages/docs/plugins/injectDemoAndApi.ts b/packages/docs/plugins/injectDemoAndApi.ts index 426f1732..97fdd90a 100644 --- a/packages/docs/plugins/injectDemoAndApi.ts +++ b/packages/docs/plugins/injectDemoAndApi.ts @@ -30,16 +30,29 @@ const resolveActiveTheme = (theme: string) => { if (_theme.startsWith(':')) { _theme = _theme.slice(1); } - if (['e', 'euler'].includes(_theme)) { - return 'e'; - } - if (['k', 'kunpeng'].includes(_theme)) { - return 'k'; - } - if (['a', 'ascend'].includes(_theme)) { - return 'a'; - } - return ''; + return Array.from( + new Set( + _theme + .split('|') + .map((_item) => { + const item = _item.trim().toLowerCase(); + if (['e', 'open-euler'].includes(item)) { + return 'e'; + } + if (['k', 'kunpeng'].includes(item)) { + return 'k'; + } + if (['a', 'ascend'].includes(item)) { + return 'a'; + } + if (['d', 'open-design'].includes(item)) { + return 'd'; + } + return ''; + }) + .filter(Boolean), + ), + ); }; /** @@ -51,7 +64,7 @@ const resolveActiveTheme = (theme: string) => { * @param viteDevServer vite开发服务器实例 * @returns 转化后的代码 */ -const transformVueDemo = (code: string, id: string, mode: 'dev' | 'build' | 'unknown', activeTheme?: string, viteDevServer?: ViteDevServer) => { +const transformVueDemo = (code: string, id: string, mode: 'dev' | 'build' | 'unknown', activeThemes?: string[], viteDevServer?: ViteDevServer) => { const imported: { default?: string; all?: string; @@ -92,7 +105,7 @@ const transformVueDemo = (code: string, id: string, mode: 'dev' | 'build' | 'unk } const docsJson = `{${imported.map((item) => `'${item.lang}': ${item.default}`).join(',')}}`; // 补充 usage 的 vue 文件的 template 块 - const template = ``; + const template = ``; return `${[...customBlocks, scriptSetup, ...styles] .filter(Boolean) .map((block) => { @@ -100,7 +113,13 @@ const transformVueDemo = (code: string, id: string, mode: 'dev' | 'build' | 'unk }) .join('\n')}\n${template}`; }; -const transformMdEntry = async (code: string, id: string, usageFiles: Map, mode: 'dev' | 'build' | 'unknown', viteDevServer?: ViteDevServer) => { +const transformMdEntry = async ( + code: string, + id: string, + usageFiles: Map, + mode: 'dev' | 'build' | 'unknown', + viteDevServer?: ViteDevServer, +) => { const imported: { default?: string; all?: string; @@ -110,12 +129,12 @@ const transformMdEntry = async (code: string, id: string, usageFiles: Map 注释替换成 // 将 注释替换成 - let newCode = await asyncReplace(code, //gi, async (match) => { + let newCode = await asyncReplace(code, //gi, async (match) => { const [, directive, _activeTheme, filePath] = match; const paths = filePath.split('/'); const dirs = paths.slice(0, -1); const fileName = paths[paths.length - 1]; - const activeTheme = resolveActiveTheme(_activeTheme || ''); + const activeThemes = resolveActiveTheme(_activeTheme || ''); if (directive === 'api') { // 拼接 api 文件 const apiFile = join(dirname(id), ...dirs, `${fileName}-api.${lang.lang}.md`); @@ -130,7 +149,7 @@ const transformMdEntry = async (code: string, id: string, usageFiles: Map`; + return ``; } else { // 此处只导入 usage 指令指定的 vue 模块。该 vue 模块的还需在 transformVueDemo 函数中转换 imported.push({ @@ -141,7 +160,7 @@ const transformMdEntry = async (code: string, id: string, usageFiles: Map`; } } @@ -162,7 +181,7 @@ export function injectDemoAndApi(): Plugin { * 缓存需要导入的usage模块 * Map */ - const usageFiles = new Map(); + const usageFiles = new Map(); let viteDevServer: ViteDevServer | null = null; return { name: 'portal:inject-demo-and-api', diff --git a/packages/docs/src/App.vue b/packages/docs/src/App.vue index 261d5b98..c88b89b4 100644 --- a/packages/docs/src/App.vue +++ b/packages/docs/src/App.vue @@ -1,5 +1,5 @@ @@ -40,7 +46,7 @@ const copyCode = async () => { position: relative; .lang-mark, - .copy-block { + .operation-block { position: absolute; z-index: 2; color: var(--o-color-info3); @@ -49,18 +55,24 @@ const copyCode = async () => { top: var(--o3-gap-3); right: var(--o3-gap-4); } - .copy-block { + .operation-block { display: none; top: var(--o3-gap-2); right: var(--o3-gap-4); - --btn-height: var(--o3-icon_size-l); + :deep(.o-btn) { + --btn-height: var(--o3-icon_size-l); + --btn-icon-size: var(--o3-icon_size-m); + & + .o-btn { + margin-left: var(--o3-gap-2); + } + } } &:hover { .lang-mark { display: none; } - .copy-block { + .operation-block { display: block; } } @@ -71,6 +83,9 @@ const copyCode = async () => { width: max-content; } } +.code-container-scroller { + max-height: 70vh; +} :deep(pre[data-linenumber-start]) { position: relative; padding-left: calc(2em + var(--o3-gap-4)); diff --git a/packages/docs/src/components/DemoContainer.vue b/packages/docs/src/components/DemoContainer.vue index 9739d75d..e7147561 100644 --- a/packages/docs/src/components/DemoContainer.vue +++ b/packages/docs/src/components/DemoContainer.vue @@ -1,10 +1,13 @@ diff --git a/packages/docs/src/components/DemoUsage.vue b/packages/docs/src/components/DemoUsage.vue index a4409c06..213e433d 100644 --- a/packages/docs/src/components/DemoUsage.vue +++ b/packages/docs/src/components/DemoUsage.vue @@ -13,6 +13,7 @@ import { compileComponent } from '@/utils/compileComponent'; import DemoContainer, { type DemoComponent } from './DemoContainer.vue'; import OperatorView, { type SchemeT } from './OperatorView'; +type ThemeKey = 'e' | 'a' | 'k' | 'd'; const props = defineProps<{ /** markdown文档 */ docs?: Record; @@ -24,7 +25,7 @@ const props = defineProps<{ style?: string; /** 传给 template 的上下文，在模板中使用 */ ctx?: any; - activeTheme?: string; + activeThemes?: ThemeKey[]; }>(); /** * 通过表单控制数据，生成表单控件响应式变量的默认值 @@ -135,7 +136,7 @@ watchEffect(() => { });