From aa7b1f34a88910bacb1243a75e3ccc2c6a931a03 Mon Sep 17 00:00:00 2001
From: liweijie <674416404@qq.com>
Date: Mon, 26 Oct 2026 12:01:09 +0800
Subject: [PATCH] =?UTF-8?q?fix(site-components):=20=E4=BF=AE=E5=A4=8D=20td?=
 =?UTF-8?q?-doc-demo=20=E7=A4=BA=E4=BE=8B=E4=BB=A3=E7=A0=81=E9=AB=98?=
 =?UTF-8?q?=E5=BA=A6=E8=A2=AB=E7=BD=AE=200?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

td-doc-demo 在 mode="open" 下示例代码无法展示，原因是 show-code
布尔属性传入空字符串时被当作 false，导致 maxHeight 恒为 0。

- parseBoolean 将空字符串（HTML 布尔属性）解析为 true
- td-doc-demo 的 showCode 改为经 parseBoolean 解析，且 mode="open" 时始终展开
- td-doc-usage 的 showCode 同步修复
- 补充 showCode 解析单元测试
---
 .../src/__tests__/td-doc-demo.spec.ts               | 13 +++++++++++++
 .../src/components/td-doc-demo/index.ts             | 11 ++++++++---
 .../src/components/td-doc-usage/index.ts            |  5 ++++-
 packages/site-components/src/utils/index.ts         |  3 ++-
 4 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/packages/site-components/src/__tests__/td-doc-demo.spec.ts b/packages/site-components/src/__tests__/td-doc-demo.spec.ts
index fc2c1dbb7..21e2c55d0 100644
--- a/packages/site-components/src/__tests__/td-doc-demo.spec.ts
+++ b/packages/site-components/src/__tests__/td-doc-demo.spec.ts
@@ -39,6 +39,19 @@ vi.mock('prismjs/components/prism-jsx.js', () => ({}));
 vi.mock('prismjs/components/prism-javascript.js', () => ({}));
 vi.mock('prismjs/components/prism-typescript', () => ({}));
 
+const showCodeProp = docDemo.showCode as unknown as {
+  value: (host: { showCode?: boolean }, value: unknown) => boolean;
+};
+
+describe('td-doc-demo showCode parsing', () => {
+  it('treats the boolean attribute `show-code` (empty string) as true', () => {
+    expect(showCodeProp.value({}, '')).toBe(true);
+    expect(showCodeProp.value({}, 'true')).toBe(true);
+    expect(showCodeProp.value({}, 'false')).toBe(false);
+    expect(showCodeProp.value({}, undefined)).toBe(false);
+  });
+});
+
 describe('td-doc-demo theme synchronization', () => {
   let listeners: Map<string, EventListener>;
 
diff --git a/packages/site-components/src/components/td-doc-demo/index.ts b/packages/site-components/src/components/td-doc-demo/index.ts
index dc754ed05..59dcc1f2e 100644
--- a/packages/site-components/src/components/td-doc-demo/index.ts
+++ b/packages/site-components/src/components/td-doc-demo/index.ts
@@ -1,5 +1,6 @@
 import { html, define, dispatch } from 'hybrids';
 import Prism from 'prismjs';
+import { parseBoolean } from '@utils';
 import style from './style.less?inline';
 import codeIcon from '@images/code.svg?raw';
 import 'prismjs/components/prism-markup.js';
@@ -32,7 +33,9 @@ export default define<DemoHost>({
   tag: 'td-doc-demo',
   code: '',
   language: 'jsx',
-  showCode: false,
+  showCode: {
+    value: (_host, v) => parseBoolean(v, false),
+  },
   mode: 'auto', // auto open
   currentLangIndex: 0,
   languages: undefined, // multiple languages display
@@ -100,10 +103,12 @@ export default define<DemoHost>({
     const highlightCode = Prism.highlight(currentCode, Prism.languages[language], language);
     const activeStyle =
       activeStyleMap && languageArr.length ? getTabStyle(activeStyleMap, languageArr[currentLangIndex]) : {};
+    // mode 为 open 时始终保持展开，且不渲染切换按钮
+    const expanded = mode === 'open' || showCode;
     const showCodeStyle = {
       transitionDuration: '.2s',
-      maxHeight: showCode ? '560px' : 0,
-      transitionTimingFunction: showCode ? 'cubic-bezier(.82, 0, 1, .9)' : 'ease',
+      maxHeight: expanded ? '560px' : 0,
+      transitionTimingFunction: expanded ? 'cubic-bezier(.82, 0, 1, .9)' : 'ease',
     };
 
     const handleClick = (index: number) => {
diff --git a/packages/site-components/src/components/td-doc-usage/index.ts b/packages/site-components/src/components/td-doc-usage/index.ts
index 1b92412cf..2e31c3bec 100644
--- a/packages/site-components/src/components/td-doc-usage/index.ts
+++ b/packages/site-components/src/components/td-doc-usage/index.ts
@@ -1,4 +1,5 @@
 import { html, define, dispatch } from 'hybrids';
+import { parseBoolean } from '@utils';
 import style from './style.less?inline';
 import tipsIcon from '@images/tips.svg?raw';
 import codeIcon from '@images/code.svg?raw';
@@ -109,7 +110,9 @@ function renderConfig(configList: ConfigItem[] = []) {
 export default define<DocUsageProps>({
   tag: 'td-doc-usage',
   code: '',
-  showCode: false,
+  showCode: {
+    value: (_host, v) => parseBoolean(v, false),
+  },
   language: 'markup',
   panel: {
     value: (host, v) => v || host.panelList[0]?.value,
diff --git a/packages/site-components/src/utils/index.ts b/packages/site-components/src/utils/index.ts
index 145c22845..96aeeb612 100644
--- a/packages/site-components/src/utils/index.ts
+++ b/packages/site-components/src/utils/index.ts
@@ -124,7 +124,8 @@ export function parseBoolean(value: unknown, defaultValue = true) {
     return defaultValue;
   }
   if (typeof value === 'string') {
-    return value === 'true';
+    // 空字符串来自布尔属性（如 <td-doc-demo show-code>），应视为 true
+    return value === '' || value === 'true';
   }
   return Boolean(value);
 }