From 2148d333cda327c77e6b55e3835904d22a8aec32 Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Fri, 12 Jun 2026 19:30:45 +0800
Subject: [PATCH 01/11] =?UTF-8?q?fix(message):=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E8=BF=9E=E7=BB=AD=E7=82=B9=E5=87=BB=E6=97=B6=E7=9A=84=E6=8A=A5?=
 =?UTF-8?q?=E9=94=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../message-item/message-item.vue             | 10 ++-
 .../uniapp-components/message/message.vue     | 84 +++++++++++++++----
 2 files changed, 75 insertions(+), 19 deletions(-)

diff --git a/packages/uniapp-components/message-item/message-item.vue b/packages/uniapp-components/message-item/message-item.vue
index fbac4de06..de838a648 100644
--- a/packages/uniapp-components/message-item/message-item.vue
+++ b/packages/uniapp-components/message-item/message-item.vue
@@ -120,6 +120,7 @@ const rawData = {
   fadeClass: '',
 
   closeTimeoutContext: 0,
+  hideTimeoutContext: 0,
   nextAnimationContext: 0,
   resetAnimation: uni.createAnimation({
     duration: 0,
@@ -328,9 +329,10 @@ export default {
         this.reset();
         this.fadeClass = `${name}__fade`;
 
-        setTimeout(() => {
+        this.hideTimeoutContext = setTimeout(() => {
           this.visible = false;
           this.animation = [];
+          this.hideTimeoutContext = 0;
         }, SHOW_DURATION);
         if (typeof this.onHide === 'function') {
           this.onHide();
@@ -344,6 +346,12 @@ export default {
         }
         clearTimeout(this.closeTimeoutContext);
         this.closeTimeoutContext = 0;
+        // 同时清掉上一次 hide 中用于延迟将 visible 置 false 的定时器，
+        // 避免连续快速调用 hide 后又调 show 时，旧的 timeout 把新消息 hide 掉。
+        if (this.hideTimeoutContext) {
+          clearTimeout(this.hideTimeoutContext);
+          this.hideTimeoutContext = 0;
+        }
       },
 
       handleClose() {
diff --git a/packages/uniapp-components/message/message.vue b/packages/uniapp-components/message/message.vue
index 348300ebc..3cc2ee6f1 100644
--- a/packages/uniapp-components/message/message.vue
+++ b/packages/uniapp-components/message/message.vue
@@ -1,30 +1,43 @@
 <template>
   <view>
     <t-message-item
-      v-for="(item) in messageList"
+      v-for="(item, idx) in messageList"
       :key="item.id"
       :ref="item.id"
       @close-btn-click="(e) => handleClose(e, { tagId: item.id })"
       @link-click="(e) => handleLinkClick(e, { tagId: item.id })"
       @duration-end="(e) => handleDurationEnd(e, { tagId: item.id })"
     >
-      <template #icon>
+      <!-- slot 仅透传给第一条消息，避免 v-for 中产生多个同名 slot 的警告 -->
+      <template
+        v-if="idx === 0"
+        #icon
+      >
         <slot
           name="icon"
         />
       </template>
-      <template #content>
+      <template
+        v-if="idx === 0"
+        #content
+      >
         <slot
           name="content"
         />
       </template>
-      <slot />
-      <template #link>
+      <slot v-if="idx === 0" />
+      <template
+        v-if="idx === 0"
+        #link
+      >
         <slot
           name="link"
         />
       </template>
-      <template #close-btn>
+      <template
+        v-if="idx === 0"
+        #close-btn
+      >
         <slot
           name="close-btn"
         />
@@ -92,26 +105,36 @@ export default {
 
     created() {
       this.instances = [];
+      // 记录各 id 对应的延迟移除 messageList 占位的定时器，避免连续点击时上一次 close 的
+      // 延迟移除在复用过程中把新占位也干掉导致 ref 实例释放、新消息闪退。
+      this.removeMsgTimers = {};
     },
     mounted() {
     },
 
     methods: {
-    /**
-   * 设置消息信息
-   * @param msg
-   * @param theme
-   */
+      /**
+       * 设置消息信息
+       * @param msg
+       * @param theme
+       */
       setMessage(msg, theme = MessageType.info) {
         if (!this.instances) {
           this.instances = [];
         }
+        // 过滤掉之前可能 push 进来的 undefined，避免 findIndex 报错
+        this.instances = this.instances.filter(Boolean);
 
         let id = `${name}_${this.index}`;
         if (msg.single) {
         // 不能与外层的 ref 相同，否则抖音小程序报错
           id = `${name}_inner`;
         }
+        // 若存在同 id 的 pending removeMsg 定时器，先取消掉，避免复用后被延迟销毁。
+        if (this.removeMsgTimers && this.removeMsgTimers[id]) {
+          clearTimeout(this.removeMsgTimers[id]);
+          delete this.removeMsgTimers[id];
+        }
         const gap = unitConvert(msg.gap || this.gap);
         const msgObj = {
           ...msg,
@@ -119,13 +142,21 @@ export default {
           id,
           gap,
         };
-        const instanceIndex = this.instances.findIndex(x => x.id === id);
+        const instanceIndex = this.instances.findIndex(x => x && x.id === id);
         if (instanceIndex < 0) {
           this.addMessage(msgObj);
         } else {
           // 更新消息
           const instance = this.instances[instanceIndex];
           const offsetHeight = this.getOffsetHeight(instanceIndex);
+          // 复用实例前先清掉上一次 show 启动的 duration/animation 定时器，
+          // 否则 resetData 只是把 closeTimeoutContext 字段重置为 0，原 timeout 仍会触发 hide，
+          // 导致新展示的消息不到 duration 就消失。
+          if (typeof instance.reset === 'function') {
+            instance.reset();
+          }
+          // 旧的 onHide 也要清掉，避免旧回调把新消息从 instances 中移除
+          instance.onHide = null;
           instance.resetData(() => {
             Object.keys(msgObj).forEach((key) => {
               instance[key] = msgObj[key];
@@ -145,13 +176,17 @@ export default {
    * @param msgObj
    */
       addMessage(msgObj) {
-        const list = [...this.messageList, { id: msgObj.id }];
-        this.messageList = list;
+        // single 模式下若已经有同 id 的占位，直接复用并跳过 add，避免列表中出现重复 id
+        const existIndex = this.messageList.findIndex(x => x.id === msgObj.id);
+        if (existIndex < 0) {
+          this.messageList = [...this.messageList, { id: msgObj.id }];
+        }
 
         setTimeout(() => {
           const offsetHeight = this.getOffsetHeight();
           const instance = this.showMessageItem(msgObj, msgObj.id, offsetHeight);
-          if (this.instances) {
+          // instance 可能为 undefined，避免污染 instances 导致后续 findIndex 异常
+          if (this.instances && instance) {
             this.instances.push(instance);
             this.index += 1;
           }
@@ -190,6 +225,11 @@ export default {
         }
 
         if (instance) {
+          // 复用同一 ref 时同样要先清掉旧定时器与旧 onHide，避免互相干扰
+          if (typeof instance.reset === 'function') {
+            instance.reset();
+          }
+          instance.onHide = null;
           instance.resetData(() => {
             Object.keys(options).forEach((key) => {
               instance[key] = options[key];
@@ -208,8 +248,16 @@ export default {
       },
 
       close(id) {
-        setTimeout(() => {
+        if (!this.removeMsgTimers) {
+          this.removeMsgTimers = {};
+        }
+        // 多次 close 同一 id 时，先清掉旧的 pending removeMsg 定时器
+        if (this.removeMsgTimers[id]) {
+          clearTimeout(this.removeMsgTimers[id]);
+        }
+        this.removeMsgTimers[id] = setTimeout(() => {
           this.removeMsg(id);
+          delete this.removeMsgTimers[id];
         }, SHOW_DURATION);
         this.removeInstance(id);
       },
@@ -222,7 +270,7 @@ export default {
         if (!id) {
           this.hideAll();
         }
-        const instance = this.instances.find(x => x.id === id);
+        const instance = this.instances.find(x => x && x.id === id);
         if (instance) {
           instance.hide();
         }
@@ -243,7 +291,7 @@ export default {
    * 移除message实例
    */
       removeInstance(id) {
-        const index = this.instances.findIndex(x => x.id === id);
+        const index = this.instances.findIndex(x => x && x.id === id);
         if (index < 0) return;
         const instance = this.instances[index];
         const removedHeight = instance.height;

From 7163c2dfc9198d8ecb977c1a1fac19a1041d382f Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Fri, 12 Jun 2026 19:44:45 +0800
Subject: [PATCH 02/11] chore: update UniApp to Uniapp

---
 packages/tdesign-uniapp-chat/package.json          |  2 +-
 packages/tdesign-uniapp-chat/script/postinstall.js |  6 +++---
 .../tdesign-uniapp-chat/site/docs/custom-style.md  |  4 ++--
 .../tdesign-uniapp-chat/site/docs/custom-theme.md  |  4 ++--
 .../tdesign-uniapp-chat/site/docs/dark-mode.md     |  2 +-
 packages/tdesign-uniapp-chat/site/docs/faq.md      |  6 +++---
 .../site/docs/getting-started.en-US.md             |  4 ++--
 .../site/docs/getting-started.md                   |  4 ++--
 .../site/web/stackblitz/content.ts                 |  4 ++--
 packages/tdesign-uniapp/README.md                  | 10 +++++-----
 packages/tdesign-uniapp/example/index.html         |  2 +-
 packages/tdesign-uniapp/example/src/manifest.json  |  4 ++--
 packages/tdesign-uniapp/example/src/pages.json     |  4 ++--
 packages/tdesign-uniapp/package.json               |  2 +-
 packages/tdesign-uniapp/script/postinstall.js      |  6 +++---
 packages/tdesign-uniapp/site/docs/custom-style.md  |  4 ++--
 packages/tdesign-uniapp/site/docs/custom-theme.md  |  4 ++--
 packages/tdesign-uniapp/site/docs/dark-mode.md     |  2 +-
 packages/tdesign-uniapp/site/docs/faq.md           |  2 +-
 .../site/docs/getting-started.en-US.md             | 14 +++++++-------
 .../tdesign-uniapp/site/docs/getting-started.md    | 14 +++++++-------
 .../tdesign-uniapp/site/web/stackblitz/content.ts  |  4 ++--
 22 files changed, 54 insertions(+), 54 deletions(-)

diff --git a/packages/tdesign-uniapp-chat/package.json b/packages/tdesign-uniapp-chat/package.json
index 5f85cfff0..845a3bd4c 100644
--- a/packages/tdesign-uniapp-chat/package.json
+++ b/packages/tdesign-uniapp-chat/package.json
@@ -3,7 +3,7 @@
   "version": "0.2.4",
   "id": "tdesign-uniapp-chat",
   "title": "tdesign-uniapp-chat",
-  "description": "TDesign Chat Component for UniApp",
+  "description": "TDesign Chat Component for Uniapp",
   "author": "tdesign",
   "license": "MIT",
   "keywords": [
diff --git a/packages/tdesign-uniapp-chat/script/postinstall.js b/packages/tdesign-uniapp-chat/script/postinstall.js
index 91eed1a8f..4422bddbf 100644
--- a/packages/tdesign-uniapp-chat/script/postinstall.js
+++ b/packages/tdesign-uniapp-chat/script/postinstall.js
@@ -17,7 +17,7 @@ function isUserInstall() {
 
 function printVue2PostCSSWarning() {
   console.warn('\n');
-  console.warn('⚠️  [TDesign UniApp Chat] 检测到当前使用 Vue2 环境');
+  console.warn('⚠️  [TDesign Uniapp Chat] 检测到当前使用 Vue2 环境');
   console.warn('   Vue2 项目需要在 postcss.config.js 中进行适配，否则样式可能无法正常工作。');
   console.warn('');
   console.warn('   📖 适配指南: https://juejin.cn/post/7602901195154030644');
@@ -73,14 +73,14 @@ function main() {
   const version = detectVueVersion();
 
   if (!version) {
-    console.warn('[TDesign UniApp Chat] Vue is not found. Please run "npm install vue" to install.');
+    console.warn('[TDesign Uniapp Chat] Vue is not found. Please run "npm install vue" to install.');
     return;
   }
 
   if (isVue2(version)) {
     printVue2PostCSSWarning();
   } else if (!isVue3(version)) {
-    console.warn(`[TDesign UniApp Chat] Vue version ${version} is not supported.`);
+    console.warn(`[TDesign Uniapp Chat] Vue version ${version} is not supported.`);
   }
 }
 
diff --git a/packages/tdesign-uniapp-chat/site/docs/custom-style.md b/packages/tdesign-uniapp-chat/site/docs/custom-style.md
index 4f3df2fae..e14bbee2f 100644
--- a/packages/tdesign-uniapp-chat/site/docs/custom-style.md
+++ b/packages/tdesign-uniapp-chat/site/docs/custom-style.md
@@ -4,7 +4,7 @@ description: TDesign 提供了多种方式可以实现样式覆盖
 spline: explain
 ---
 
-TDesign UniApp 提供了 4 种方式用于样式覆盖
+TDesign Uniapp 提供了 4 种方式用于样式覆盖
 
 ## 1 使用 Custom Style
 
@@ -108,7 +108,7 @@ TDesign 在每个组件的内部都预置了许多外部样式类供开发者使
 }
 ```
 
-**实现上，TDesign UniApp 将外部样式类都转成了 `props`**
+**实现上，TDesign Uniapp 将外部样式类都转成了 `props`**
 
 ## 4 使用 CSS 变量
 
diff --git a/packages/tdesign-uniapp-chat/site/docs/custom-theme.md b/packages/tdesign-uniapp-chat/site/docs/custom-theme.md
index c1c9390c6..abcf0fb74 100644
--- a/packages/tdesign-uniapp-chat/site/docs/custom-theme.md
+++ b/packages/tdesign-uniapp-chat/site/docs/custom-theme.md
@@ -8,7 +8,7 @@ spline: explain
 
 ## 全局自定义
 
-TDesign UniApp 的 CSS Variables 全部定义可以在这里看到: [_variables.less](https://github.com/Tencent/tdesign-miniprogram/tree/develop/packages/uniapp-components/common/style/_variables.less)
+TDesign Uniapp 的 CSS Variables 全部定义可以在这里看到: [_variables.less](https://github.com/Tencent/tdesign-miniprogram/tree/develop/packages/uniapp-components/common/style/_variables.less)
 
 如果你想改变主题色，主要改变这几个变量即可：
 
@@ -31,7 +31,7 @@ page {
 
 ## 局部自定义
 
-在 TDesign UniApp 里，你也可以只给某个组件修改主题，下面以 `Rate` 举例：
+在 TDesign Uniapp 里，你也可以只给某个组件修改主题，下面以 `Rate` 举例：
 
 ```css
 page {
diff --git a/packages/tdesign-uniapp-chat/site/docs/dark-mode.md b/packages/tdesign-uniapp-chat/site/docs/dark-mode.md
index b9723f5cd..faddc08db 100644
--- a/packages/tdesign-uniapp-chat/site/docs/dark-mode.md
+++ b/packages/tdesign-uniapp-chat/site/docs/dark-mode.md
@@ -17,7 +17,7 @@ spline: design-mode
 
 ## 实现方案
 
-TDesign UniApp 基于 Design Token 变量和媒体查询 `prefers-color-scheme` 实现了深色模式。默认情况下，每个组件自带了组件级别 light 样式变量，无需手动引入。如需使用深色模式，请按照以下步骤操作。
+TDesign Uniapp 基于 Design Token 变量和媒体查询 `prefers-color-scheme` 实现了深色模式。默认情况下，每个组件自带了组件级别 light 样式变量，无需手动引入。如需使用深色模式，请按照以下步骤操作。
 
 ## 使用方式
 
diff --git a/packages/tdesign-uniapp-chat/site/docs/faq.md b/packages/tdesign-uniapp-chat/site/docs/faq.md
index 911d40bfa..b120cf804 100644
--- a/packages/tdesign-uniapp-chat/site/docs/faq.md
+++ b/packages/tdesign-uniapp-chat/site/docs/faq.md
@@ -4,11 +4,11 @@ description: 看看有没有你想要的。
 spline: explain
 ---
 
-### 与 TDesign UniApp 库的关系
+### 与 TDesign Uniapp 库的关系
 
-[TDsign UniApp](https://www.npmjs.com/package/@tdesign/uniapp) 和 [TDesign UniApp Chat](https://www.npmjs.com/package/@tdesign/uniapp-chat) 是两个不同的包，后者依赖前者。
+[TDesign Uniapp](https://www.npmjs.com/package/@tdesign/uniapp) 和 [TDesign Uniapp Chat](https://www.npmjs.com/package/@tdesign/uniapp-chat) 是两个不同的包，后者依赖前者。
 
-样式文件从 TDesign UniApp 引入一份即可。
+样式文件从 TDesign Uniapp 引入一份即可。
 
 ```js
 import '@tdesign/uniapp/theme.css';
diff --git a/packages/tdesign-uniapp-chat/site/docs/getting-started.en-US.md b/packages/tdesign-uniapp-chat/site/docs/getting-started.en-US.md
index 7425fff09..3fbc1b098 100644
--- a/packages/tdesign-uniapp-chat/site/docs/getting-started.en-US.md
+++ b/packages/tdesign-uniapp-chat/site/docs/getting-started.en-US.md
@@ -1,6 +1,6 @@
 ---
 title: Uni App Chat
-description: TDesign UniApp Chat is a UI component library for Uni App.
+description: TDesign Uniapp Chat is a UI component library for Uni App.
 spline: explain
 ---
 
@@ -8,7 +8,7 @@ spline: explain
   <svg fill="none" viewBox="0 0 16 16" width="16px" height="16px" style="margin-right: 5px">
     <path fill="#0052d9" d="M8 15A7 7 0 108 1a7 7 0 000 14zM7.4 4h1.2v1.2H7.4V4zm.1 2.5h1V12h-1V6.5z" fillOpacity="0.9"></path>
   </svg>
-  Starting from version 0.2.0, the npm package name for the TDesign UniApp Chat component library has changed from tdesign-uniapp-chat to @tdesign/uniapp-chat.
+  Starting from version 0.2.0, the npm package name for the TDesign Uniapp Chat component library has changed from tdesign-uniapp-chat to @tdesign/uniapp-chat.
 </div>
 
 ## Preview
diff --git a/packages/tdesign-uniapp-chat/site/docs/getting-started.md b/packages/tdesign-uniapp-chat/site/docs/getting-started.md
index 9acdfdabb..39c4e9a30 100644
--- a/packages/tdesign-uniapp-chat/site/docs/getting-started.md
+++ b/packages/tdesign-uniapp-chat/site/docs/getting-started.md
@@ -1,6 +1,6 @@
 ---
 title: Uni App Chat
-description: TDesign UniApp Chat 组件库。
+description: TDesign Uniapp Chat 组件库。
 spline: explain
 ---
 
@@ -8,7 +8,7 @@ spline: explain
   <svg fill="none" viewBox="0 0 16 16" width="16px" height="16px" style="margin-right: 5px">
     <path fill="#0052d9" d="M8 15A7 7 0 108 1a7 7 0 000 14zM7.4 4h1.2v1.2H7.4V4zm.1 2.5h1V12h-1V6.5z" fillOpacity="0.9"></path>
   </svg>
-  TDesign UniApp Chat 组件库 npm 包名自 0.2.0 版本开始，从 tdesign-uniapp-chat 变更为 @tdesign/uniapp-chat
+  TDesign Uniapp Chat 组件库 npm 包名自 0.2.0 版本开始，从 tdesign-uniapp-chat 变更为 @tdesign/uniapp-chat
 </div>
 
 ## 预览
diff --git a/packages/tdesign-uniapp-chat/site/web/stackblitz/content.ts b/packages/tdesign-uniapp-chat/site/web/stackblitz/content.ts
index 3a862aa0c..db4ea9288 100644
--- a/packages/tdesign-uniapp-chat/site/web/stackblitz/content.ts
+++ b/packages/tdesign-uniapp-chat/site/web/stackblitz/content.ts
@@ -42,7 +42,7 @@ export function createApp() {
 `;
 
 export const MANIFEST_JSON_CONTENT = JSON.stringify({
-  name: 'TDesign UniApp',
+  name: 'TDesign Uniapp',
   appid: '',
   description: '',
   versionName: '1.0.0',
@@ -111,7 +111,7 @@ export const PAGES_JSON_CONTENT = JSON.stringify({
     {
       path: 'pages/index/index',
       style: {
-        navigationBarTitleText: 'TDesign UniApp',
+        navigationBarTitleText: 'TDesign Uniapp',
       },
     },
   ],
diff --git a/packages/tdesign-uniapp/README.md b/packages/tdesign-uniapp/README.md
index 8f090c808..e6c344a61 100644
--- a/packages/tdesign-uniapp/README.md
+++ b/packages/tdesign-uniapp/README.md
@@ -167,11 +167,11 @@ import TLoading from '@tdesign/uniapp/loading/loading.vue';
 
 | 模板 | 描述 | 预览 |
 | --- | --- | --- |
-| [TDesign UniApp Starter](https://github.com/TDesignOteam/tdesign-uniapp-starter/) | Vue3 + CLI 模式模板 - 通用类 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-h5.png" height="100" /> |
-| [TDesign UniApp Starter Apply](https://github.com/TDesignOteam/tdesign-uniapp-starter-apply/) | Vue3 + CLI 模式模板 - 活动报名 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-apply-h5.png" height="100" /> |
-| [TDesign UniApp Starter Vue3 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue3-hx/) | Vue3 + HBuilderX 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue3-hx-h5.png" height="100" /> |
-| [TDesign UniApp Starter Vue2 CLI](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-cli/) | Vue2 + CLI 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-cli-h5.png" height="100" /> |
-| [TDesign UniApp Starter Vue2 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-hx/) | Vue2 + HBuilderX 模式模板 |<img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-hx-h5.png" height="100" /> |
+| [TDesign Uniapp Starter](https://github.com/TDesignOteam/tdesign-uniapp-starter/) | Vue3 + CLI 模式模板 - 通用类 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Apply](https://github.com/TDesignOteam/tdesign-uniapp-starter-apply/) | Vue3 + CLI 模式模板 - 活动报名 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-apply-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Vue3 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue3-hx/) | Vue3 + HBuilderX 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue3-hx-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Vue2 CLI](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-cli/) | Vue2 + CLI 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-cli-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Vue2 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-hx/) | Vue2 + HBuilderX 模式模板 |<img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-hx-h5.png" height="100" /> |
 ## 反馈
 
 有任何问题，建议通过 [Github issues](https://github.com/Tencent/tdesign-miniprogram/issues) 反馈或扫码加入用户微信群。
diff --git a/packages/tdesign-uniapp/example/index.html b/packages/tdesign-uniapp/example/index.html
index 0edcb8889..ddf7f982b 100644
--- a/packages/tdesign-uniapp/example/index.html
+++ b/packages/tdesign-uniapp/example/index.html
@@ -13,7 +13,7 @@
           '" />',
       );
     </script>
-    <title>TDesign UniApp</title>
+    <title>TDesign Uniapp</title>
     <!--preload-links-->
     <!--app-context-->
   </head>
diff --git a/packages/tdesign-uniapp/example/src/manifest.json b/packages/tdesign-uniapp/example/src/manifest.json
index 89747bb91..c401325f4 100644
--- a/packages/tdesign-uniapp/example/src/manifest.json
+++ b/packages/tdesign-uniapp/example/src/manifest.json
@@ -1,5 +1,5 @@
 {
-  "name": "TDesign UniApp",
+  "name": "TDesign Uniapp",
   "appid": "",
   "description": "",
   "versionName": "1.0.0",
@@ -123,4 +123,4 @@
     "enable": false
   },
   "vueVersion": "3"
-}
+}
\ No newline at end of file
diff --git a/packages/tdesign-uniapp/example/src/pages.json b/packages/tdesign-uniapp/example/src/pages.json
index 13723f139..52716ea72 100644
--- a/packages/tdesign-uniapp/example/src/pages.json
+++ b/packages/tdesign-uniapp/example/src/pages.json
@@ -450,7 +450,7 @@
   "globalStyle": {
     "pageOrientation": "portrait",
     "navigationBarTextStyle": "black",
-    "navigationBarTitleText": "TDesign UniApp",
+    "navigationBarTitleText": "TDesign Uniapp",
     "backgroundColor": "#F8F8F8",
     "navigationStyle": "custom"
   },
@@ -801,4 +801,4 @@
       ]
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/tdesign-uniapp/package.json b/packages/tdesign-uniapp/package.json
index 01e746e3b..84e04ec57 100644
--- a/packages/tdesign-uniapp/package.json
+++ b/packages/tdesign-uniapp/package.json
@@ -3,7 +3,7 @@
   "version": "0.9.1",
   "id": "tdesign-uniapp",
   "title": "tdesign-uniapp",
-  "description": "TDesign Component for UniApp",
+  "description": "TDesign Component for Uniapp",
   "author": "tdesign",
   "license": "MIT",
   "keywords": [
diff --git a/packages/tdesign-uniapp/script/postinstall.js b/packages/tdesign-uniapp/script/postinstall.js
index 15d214b06..b060f637c 100644
--- a/packages/tdesign-uniapp/script/postinstall.js
+++ b/packages/tdesign-uniapp/script/postinstall.js
@@ -17,7 +17,7 @@ function isUserInstall() {
 
 function printVue2PostCSSWarning() {
   console.warn('\n');
-  console.warn('⚠️  [TDesign UniApp] 检测到当前使用 Vue2 环境');
+  console.warn('⚠️  [TDesign Uniapp] 检测到当前使用 Vue2 环境');
   console.warn('   Vue2 项目需要在 postcss.config.js 中进行适配，否则样式可能无法正常工作。');
   console.warn('');
   console.warn('   📖 适配指南: https://juejin.cn/post/7602901195154030644');
@@ -73,14 +73,14 @@ function main() {
   const version = detectVueVersion();
 
   if (!version) {
-    console.warn('[TDesign UniApp] Vue is not found. Please run "npm install vue" to install.');
+    console.warn('[TDesign Uniapp] Vue is not found. Please run "npm install vue" to install.');
     return;
   }
 
   if (isVue2(version)) {
     printVue2PostCSSWarning();
   } else if (!isVue3(version)) {
-    console.warn(`[TDesign UniApp] Vue version ${version} is not supported.`);
+    console.warn(`[TDesign Uniapp] Vue version ${version} is not supported.`);
   }
 }
 
diff --git a/packages/tdesign-uniapp/site/docs/custom-style.md b/packages/tdesign-uniapp/site/docs/custom-style.md
index 4f3df2fae..e14bbee2f 100644
--- a/packages/tdesign-uniapp/site/docs/custom-style.md
+++ b/packages/tdesign-uniapp/site/docs/custom-style.md
@@ -4,7 +4,7 @@ description: TDesign 提供了多种方式可以实现样式覆盖
 spline: explain
 ---
 
-TDesign UniApp 提供了 4 种方式用于样式覆盖
+TDesign Uniapp 提供了 4 种方式用于样式覆盖
 
 ## 1 使用 Custom Style
 
@@ -108,7 +108,7 @@ TDesign 在每个组件的内部都预置了许多外部样式类供开发者使
 }
 ```
 
-**实现上，TDesign UniApp 将外部样式类都转成了 `props`**
+**实现上，TDesign Uniapp 将外部样式类都转成了 `props`**
 
 ## 4 使用 CSS 变量
 
diff --git a/packages/tdesign-uniapp/site/docs/custom-theme.md b/packages/tdesign-uniapp/site/docs/custom-theme.md
index c1c9390c6..abcf0fb74 100644
--- a/packages/tdesign-uniapp/site/docs/custom-theme.md
+++ b/packages/tdesign-uniapp/site/docs/custom-theme.md
@@ -8,7 +8,7 @@ spline: explain
 
 ## 全局自定义
 
-TDesign UniApp 的 CSS Variables 全部定义可以在这里看到: [_variables.less](https://github.com/Tencent/tdesign-miniprogram/tree/develop/packages/uniapp-components/common/style/_variables.less)
+TDesign Uniapp 的 CSS Variables 全部定义可以在这里看到: [_variables.less](https://github.com/Tencent/tdesign-miniprogram/tree/develop/packages/uniapp-components/common/style/_variables.less)
 
 如果你想改变主题色，主要改变这几个变量即可：
 
@@ -31,7 +31,7 @@ page {
 
 ## 局部自定义
 
-在 TDesign UniApp 里，你也可以只给某个组件修改主题，下面以 `Rate` 举例：
+在 TDesign Uniapp 里，你也可以只给某个组件修改主题，下面以 `Rate` 举例：
 
 ```css
 page {
diff --git a/packages/tdesign-uniapp/site/docs/dark-mode.md b/packages/tdesign-uniapp/site/docs/dark-mode.md
index b9723f5cd..faddc08db 100644
--- a/packages/tdesign-uniapp/site/docs/dark-mode.md
+++ b/packages/tdesign-uniapp/site/docs/dark-mode.md
@@ -17,7 +17,7 @@ spline: design-mode
 
 ## 实现方案
 
-TDesign UniApp 基于 Design Token 变量和媒体查询 `prefers-color-scheme` 实现了深色模式。默认情况下，每个组件自带了组件级别 light 样式变量，无需手动引入。如需使用深色模式，请按照以下步骤操作。
+TDesign Uniapp 基于 Design Token 变量和媒体查询 `prefers-color-scheme` 实现了深色模式。默认情况下，每个组件自带了组件级别 light 样式变量，无需手动引入。如需使用深色模式，请按照以下步骤操作。
 
 ## 使用方式
 
diff --git a/packages/tdesign-uniapp/site/docs/faq.md b/packages/tdesign-uniapp/site/docs/faq.md
index c365f5cea..e44ef3e9f 100644
--- a/packages/tdesign-uniapp/site/docs/faq.md
+++ b/packages/tdesign-uniapp/site/docs/faq.md
@@ -6,7 +6,7 @@ spline: explain
 
 ## 写在前面
 
-TDesign UniApp 的实现原理，可以查看[这篇文章](https://juejin.cn/post/7571650164844068898)。
+TDesign Uniapp 的实现原理，可以查看[这篇文章](https://juejin.cn/post/7571650164844068898)。
 
 ### 外部样式类
 
diff --git a/packages/tdesign-uniapp/site/docs/getting-started.en-US.md b/packages/tdesign-uniapp/site/docs/getting-started.en-US.md
index 196b83e53..5f6992e55 100644
--- a/packages/tdesign-uniapp/site/docs/getting-started.en-US.md
+++ b/packages/tdesign-uniapp/site/docs/getting-started.en-US.md
@@ -1,6 +1,6 @@
 ---
 title: Uni App
-description: TDesign UniApp is a UI component library for Uni App.
+description: TDesign Uniapp is a UI component library for Uni App.
 spline: explain
 ---
 
@@ -8,7 +8,7 @@ spline: explain
   <svg fill="none" viewBox="0 0 16 16" width="16px" height="16px" style="margin-right: 5px">
     <path fill="#0052d9" d="M8 15A7 7 0 108 1a7 7 0 000 14zM7.4 4h1.2v1.2H7.4V4zm.1 2.5h1V12h-1V6.5z" fillOpacity="0.9"></path>
   </svg>
-  Starting with version 0.7.0, the npm package name for the TDesign UniApp component library has changed from tdesign-uniapp to @tdesign/uniapp.
+  Starting with version 0.7.0, the npm package name for the TDesign Uniapp component library has changed from tdesign-uniapp to @tdesign/uniapp.
 </div>
 
 ## Preview
@@ -149,11 +149,11 @@ We provide a variety of out-of-the-box template projects to help you get started
 
 | Template | Description | Preview |
 | --- | --- | --- |
-| [TDesign UniApp Starter](https://github.com/TDesignOteam/tdesign-uniapp-starter/) | Vue3 + CLI Mode - General | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-h5.png" height="100" /> |
-| [TDesign UniApp Starter Apply](https://github.com/TDesignOteam/tdesign-uniapp-starter-apply/) | Vue3 + CLI Mode - Event Registration | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-apply-h5.png" height="100" /> |
-| [TDesign UniApp Starter Vue3 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue3-hx/) | Vue3 + HBuilderX Mode | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue3-hx-h5.png" height="100" /> |
-| [TDesign UniApp Starter Vue2 CLI](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-cli/) | Vue2 + CLI Mode | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-cli-h5.png" height="100" /> |
-| [TDesign UniApp Starter Vue2 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-hx/) | Vue2 + HBuilderX Mode |<img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-hx-h5.png" height="100" /> |
+| [TDesign Uniapp Starter](https://github.com/TDesignOteam/tdesign-uniapp-starter/) | Vue3 + CLI Mode - General | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Apply](https://github.com/TDesignOteam/tdesign-uniapp-starter-apply/) | Vue3 + CLI Mode - Event Registration | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-apply-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Vue3 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue3-hx/) | Vue3 + HBuilderX Mode | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue3-hx-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Vue2 CLI](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-cli/) | Vue2 + CLI Mode | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-cli-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Vue2 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-hx/) | Vue2 + HBuilderX Mode |<img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-hx-h5.png" height="100" /> |
 
 ## Development
 
diff --git a/packages/tdesign-uniapp/site/docs/getting-started.md b/packages/tdesign-uniapp/site/docs/getting-started.md
index 5bcadd4e8..29a8678e3 100644
--- a/packages/tdesign-uniapp/site/docs/getting-started.md
+++ b/packages/tdesign-uniapp/site/docs/getting-started.md
@@ -1,6 +1,6 @@
 ---
 title: Uni App
-description: TDesign UniApp 组件库。
+description: TDesign Uniapp 组件库。
 spline: explain
 ---
 
@@ -8,7 +8,7 @@ spline: explain
   <svg fill="none" viewBox="0 0 16 16" width="16px" height="16px" style="margin-right: 5px">
     <path fill="#0052d9" d="M8 15A7 7 0 108 1a7 7 0 000 14zM7.4 4h1.2v1.2H7.4V4zm.1 2.5h1V12h-1V6.5z" fillOpacity="0.9"></path>
   </svg>
-  TDesign UniApp 组件库 npm 包名自 0.7.0 版本开始，从 tdesign-uniapp 变更为 @tdesign/uniapp
+  TDesign Uniapp 组件库 npm 包名自 0.7.0 版本开始，从 tdesign-uniapp 变更为 @tdesign/uniapp
 </div>
 
 ## 预览
@@ -149,11 +149,11 @@ import TLoading from '@tdesign/uniapp/loading/loading.vue';
 
 | 模板 | 描述 | 预览 |
 | --- | --- | --- |
-| [TDesign UniApp Starter](https://github.com/TDesignOteam/tdesign-uniapp-starter/) | Vue3 + CLI 模式模板 - 通用类 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-h5.png" height="100" /> |
-| [TDesign UniApp Starter Apply](https://github.com/TDesignOteam/tdesign-uniapp-starter-apply/) | Vue3 + CLI 模式模板 - 活动报名 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-apply-h5.png" height="100" /> |
-| [TDesign UniApp Starter Vue3 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue3-hx/) | Vue3 + HBuilderX 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue3-hx-h5.png" height="100" /> |
-| [TDesign UniApp Starter Vue2 CLI](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-cli/) | Vue2 + CLI 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-cli-h5.png" height="100" /> |
-| [TDesign UniApp Starter Vue2 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-hx/) | Vue2 + HBuilderX 模式模板 |<img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-hx-h5.png" height="100" /> |
+| [TDesign Uniapp Starter](https://github.com/TDesignOteam/tdesign-uniapp-starter/) | Vue3 + CLI 模式模板 - 通用类 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Apply](https://github.com/TDesignOteam/tdesign-uniapp-starter-apply/) | Vue3 + CLI 模式模板 - 活动报名 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-apply-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Vue3 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue3-hx/) | Vue3 + HBuilderX 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue3-hx-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Vue2 CLI](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-cli/) | Vue2 + CLI 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-cli-h5.png" height="100" /> |
+| [TDesign Uniapp Starter Vue2 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-hx/) | Vue2 + HBuilderX 模式模板 |<img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-hx-h5.png" height="100" /> |
 
 ## 开发
 
diff --git a/packages/tdesign-uniapp/site/web/stackblitz/content.ts b/packages/tdesign-uniapp/site/web/stackblitz/content.ts
index dab1ea2ed..4b2d7d108 100644
--- a/packages/tdesign-uniapp/site/web/stackblitz/content.ts
+++ b/packages/tdesign-uniapp/site/web/stackblitz/content.ts
@@ -42,7 +42,7 @@ export function createApp() {
 `;
 
 export const MANIFEST_JSON_CONTENT = JSON.stringify({
-  name: 'TDesign UniApp',
+  name: 'TDesign Uniapp',
   appid: '',
   description: '',
   versionName: '1.0.0',
@@ -111,7 +111,7 @@ export const PAGES_JSON_CONTENT = JSON.stringify({
     {
       path: 'pages/index/index',
       style: {
-        navigationBarTitleText: 'TDesign UniApp',
+        navigationBarTitleText: 'TDesign Uniapp',
       },
     },
   ],

From ee2b92c21022d50239ccb14a396113cc0b26a1cb Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Sat, 13 Jun 2026 01:44:05 +0800
Subject: [PATCH 03/11] feat(cascader): support filter

---
 .../cascader/README.en-US.md                  |   3 +
 packages/uniapp-components/cascader/README.md |   3 +
 .../cascader/_example/cascader.vue            |   6 +
 .../cascader/_example/filterable/index.vue    | 140 ++++++
 .../uniapp-components/cascader/cascader.less  |  48 ++
 .../uniapp-components/cascader/cascader.vue   | 409 ++++++++++++++----
 packages/uniapp-components/cascader/props.ts  |  13 +-
 packages/uniapp-components/cascader/type.ts   |  24 +-
 8 files changed, 566 insertions(+), 80 deletions(-)
 create mode 100644 packages/uniapp-components/cascader/_example/filterable/index.vue

diff --git a/packages/uniapp-components/cascader/README.en-US.md b/packages/uniapp-components/cascader/README.en-US.md
index e0c4f2c50..f03d32863 100644
--- a/packages/uniapp-components/cascader/README.en-US.md
+++ b/packages/uniapp-components/cascader/README.en-US.md
@@ -9,6 +9,9 @@ name | type | default | description | required
 custom-style | Object | - | CSS(Cascading Style Sheets) | N
 check-strictly | Boolean | false | \- | N
 close-btn | Boolean | true | \- | N
+filter | Function | - | Typescript: `CascaderFilterFunction ` `type CascaderFilterFunction<CascaderOption extends TreeOptionData = TreeOptionData> = (keyword: string, option: CascaderOption, path: CascaderOption[]) => boolean`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/common/common.ts)。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/cascader/type.ts) | N
+filter-placeholder | String | - | \- | N
+filterable | Boolean | false | \- | N
 keys | Object | - | Typescript: `CascaderKeysType` `type CascaderKeysType = TreeKeysType`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/common/common.ts)。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/cascader/type.ts) | N
 options | Array | [] | Typescript: `Array<CascaderOption>` | N
 placeholder | String | - | \- | N
diff --git a/packages/uniapp-components/cascader/README.md b/packages/uniapp-components/cascader/README.md
index 288a69674..441ea1494 100644
--- a/packages/uniapp-components/cascader/README.md
+++ b/packages/uniapp-components/cascader/README.md
@@ -51,6 +51,9 @@ import TCascader from '@tdesign/uniapp/cascader/cascader.vue';
 custom-style | Object | - | 自定义样式 | N
 check-strictly | Boolean | false | 父子节点选中状态不再关联，可各自选中或取消 | N
 close-btn | Boolean | true | 关闭按钮 | N
+filter | Function | - |  自定义过滤函数。返回 true 表示匹配，未设置时使用内置匹配规则：对路径中所有 label 拼接后做大小写不敏感的 includes 匹配。TS 类型：`CascaderFilterFunction ` `type CascaderFilterFunction<CascaderOption extends TreeOptionData = TreeOptionData> = (keyword: string, option: CascaderOption, path: CascaderOption[]) => boolean`。[通用类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/common/common.ts)。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/cascader/type.ts) | N
+filter-placeholder | String | - | 搜索框占位符描述文本 | N
+filterable | Boolean | false | 是否可搜索，开启后顶部会展示一个搜索框  | N
 keys | Object | - | 用来定义 value / label / children / disabled 在 `options` 中对应的字段别名。TS 类型：`CascaderKeysType` `type CascaderKeysType = TreeKeysType`。[通用类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/common/common.ts)。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/cascader/type.ts) | N
 options | Array | [] | 可选项数据源。TS 类型：`Array<CascaderOption>` | N
 placeholder | String | - | 未选中时的提示文案。组件内置默认值为：'选择选项' | N
diff --git a/packages/uniapp-components/cascader/_example/cascader.vue b/packages/uniapp-components/cascader/_example/cascader.vue
index d20c6e32d..a3440b9c3 100644
--- a/packages/uniapp-components/cascader/_example/cascader.vue
+++ b/packages/uniapp-components/cascader/_example/cascader.vue
@@ -36,6 +36,10 @@
       <t-demo desc="选择任意一项">
         <check-strictly />
       </t-demo>
+
+      <t-demo desc="可搜索">
+        <filterable-demo />
+      </t-demo>
     </view>
   </view>
 </template>
@@ -43,6 +47,7 @@
 <script>
 import BaseDemo from './base';
 import CheckStrictly from './check-strictly';
+import FilterableDemo from './filterable';
 import KeysDemo from './keys';
 import ThemeTab from './theme-tab';
 import WithTitle from './with-title';
@@ -55,6 +60,7 @@ export default {
     KeysDemo,
     WithTitle,
     CheckStrictly,
+    FilterableDemo,
   },
   data() {
     return {};
diff --git a/packages/uniapp-components/cascader/_example/filterable/index.vue b/packages/uniapp-components/cascader/_example/filterable/index.vue
new file mode 100644
index 000000000..abbc3dff8
--- /dev/null
+++ b/packages/uniapp-components/cascader/_example/filterable/index.vue
@@ -0,0 +1,140 @@
+<template>
+  <view>
+    <t-cell
+      title="地址"
+      :note="note"
+      arrow
+      @click="showCascader"
+    />
+
+    <t-cascader
+      :visible="visible"
+      :value="value"
+      :options="options"
+      title="请选择地址"
+      filterable
+      filter-placeholder="搜索省/市/区"
+      @update:visible="(e) => visible = e"
+      @change="onChange"
+      @pick="onPick"
+    />
+  </view>
+</template>
+
+<script>
+import TCascader from '@tdesign/uniapp/cascader/cascader.vue';
+import TCell from '@tdesign/uniapp/cell/cell.vue';
+const data = {
+  areaList: [
+    {
+      label: '北京市',
+      value: '110000',
+      children: [
+        {
+          value: '110100',
+          label: '北京市',
+          children: [
+            { value: '110101', label: '东城区' },
+            { value: '110102', label: '西城区' },
+            { value: '110105', label: '朝阳区' },
+            { value: '110106', label: '丰台区' },
+            { value: '110107', label: '石景山区' },
+            { value: '110108', label: '海淀区' },
+            { value: '110109', label: '门头沟区' },
+            { value: '110111', label: '房山区' },
+            { value: '110112', label: '通州区' },
+            { value: '110113', label: '顺义区' },
+            { value: '110114', label: '昌平区' },
+            { value: '110115', label: '大兴区' },
+            { value: '110116', label: '怀柔区' },
+            { value: '110117', label: '平谷区' },
+            { value: '110118', label: '密云区' },
+            { value: '110119', label: '延庆区' },
+          ],
+        },
+      ],
+    },
+    {
+      label: '上海市',
+      value: '310000',
+      children: [
+        {
+          value: '310100',
+          label: '上海市',
+          children: [
+            { value: '310101', label: '黄浦区' },
+            { value: '310104', label: '徐汇区' },
+            { value: '310105', label: '长宁区' },
+            { value: '310106', label: '静安区' },
+            { value: '310107', label: '普陀区' },
+            { value: '310109', label: '虹口区' },
+            { value: '310110', label: '杨浦区' },
+            { value: '310112', label: '闵行区' },
+            { value: '310113', label: '宝山区' },
+            { value: '310114', label: '嘉定区' },
+            { value: '310115', label: '浦东新区' },
+          ],
+        },
+      ],
+    },
+    {
+      label: '广东省',
+      value: '440000',
+      children: [
+        {
+          value: '440100',
+          label: '广州市',
+          children: [
+            { value: '440103', label: '荔湾区' },
+            { value: '440104', label: '越秀区' },
+            { value: '440105', label: '海珠区' },
+            { value: '440106', label: '天河区' },
+            { value: '440111', label: '白云区' },
+          ],
+        },
+        {
+          value: '440300',
+          label: '深圳市',
+          children: [
+            { value: '440303', label: '罗湖区' },
+            { value: '440304', label: '福田区' },
+            { value: '440305', label: '南山区' },
+            { value: '440306', label: '宝安区' },
+            { value: '440307', label: '龙岗区' },
+          ],
+        },
+      ],
+    },
+  ],
+};
+export default {
+  components: {
+    TCell,
+    TCascader,
+  },
+  data() {
+    return {
+      options: data.areaList,
+      note: '请选择地址',
+      visible: false,
+      value: '',
+    };
+  },
+  methods: {
+    showCascader() {
+      this.visible = true;
+    },
+    onPick(e) {
+      console.log('pick: ', e);
+    },
+    onChange(e) {
+      const { selectedOptions, value } = e;
+      this.value = value;
+      this.note = selectedOptions.map(item => item.label).join('/');
+      this.visible = false;
+    },
+  },
+};
+</script>
+<style>
+</style>
diff --git a/packages/uniapp-components/cascader/cascader.less b/packages/uniapp-components/cascader/cascader.less
index 66f5e1b05..df8b9f6fc 100644
--- a/packages/uniapp-components/cascader/cascader.less
+++ b/packages/uniapp-components/cascader/cascader.less
@@ -12,6 +12,15 @@
 @cascader-border-color: var(--td-cascader-border-color, @component-stroke);
 @cascader-content-height: var(--td-cascader-content-height, 78vh);
 @cascader-options-height: var(--td-cascader-options-height, calc(100% - @cascader-step-height));
+// filter (search)
+@cascader-filter-padding: var(--td-cascader-filter-padding, 0 @spacer-2 @spacer-1);
+@cascader-filter-item-padding: var(--td-cascader-filter-item-padding, 24rpx 32rpx);
+@cascader-filter-item-color: var(--td-cascader-filter-item-color, @text-color-primary);
+@cascader-filter-item-hover-bg: var(--td-cascader-filter-item-hover-bg, @bg-color-secondarycontainer);
+@cascader-filter-item-disabled-color: var(--td-cascader-filter-item-disabled-color, @text-color-disabled);
+@cascader-filter-highlight-color: var(--td-cascader-filter-highlight-color, @brand-color);
+@cascader-filter-empty-color: var(--td-cascader-filter-empty-color, @text-color-placeholder);
+@cascader-filter-empty-padding: var(--td-cascader-filter-empty-padding, 96rpx @spacer-2);
 // steps
 @cascader-step-height: var(--td-cascader-step-height, 88rpx);
 @cascader-step-dot-size: var(--td-cascader-step-dot-size, 16rpx);
@@ -116,4 +125,43 @@
       margin-left: auto;
     }
   }
+
+  &__filter {
+    padding: @cascader-filter-padding;
+    box-sizing: border-box;
+
+    &-result {
+      flex: 1;
+      width: 100%;
+      box-sizing: border-box;
+    }
+
+    &-result-item {
+      padding: @cascader-filter-item-padding;
+      color: @cascader-filter-item-color;
+      font: @font-body-medium;
+      box-sizing: border-box;
+      .border(bottom, @cascader-border-color);
+
+      &--hover {
+        background-color: @cascader-filter-item-hover-bg;
+      }
+
+      &--disabled {
+        color: @cascader-filter-item-disabled-color;
+      }
+    }
+
+    &-highlight {
+      color: @cascader-filter-highlight-color;
+      font-weight: 600;
+    }
+
+    &-empty {
+      padding: @cascader-filter-empty-padding;
+      text-align: center;
+      color: @cascader-filter-empty-color;
+      font: @font-body-medium;
+    }
+  }
 }
diff --git a/packages/uniapp-components/cascader/cascader.vue b/packages/uniapp-components/cascader/cascader.vue
index 4349cedb1..d2cc6acae 100644
--- a/packages/uniapp-components/cascader/cascader.vue
+++ b/packages/uniapp-components/cascader/cascader.vue
@@ -33,99 +33,145 @@
         <slot name="header" />
 
         <view :class="classPrefix + '__content'">
-          <block v-if="steps && steps.length">
-            <view
-              v-if="theme == 'step'"
-              :class="classPrefix + '__steps'"
-            >
+          <view
+            v-if="filterable"
+            :class="classPrefix + '__filter'"
+          >
+            <t-search
+              :value="filterKeyword"
+              :placeholder="filterPlaceholder || globalConfig.filterPlaceholder"
+              @change="onFilterChange"
+              @clear="onFilterClear"
+            />
+          </view>
+
+          <block v-if="!isSearching">
+            <block v-if="steps && steps.length">
               <view
-                v-for="(item, index) in steps"
-                :key="index"
-                :class="classPrefix + '__step'"
-                :data-index="index"
-                @click="() => onStepClick(index)"
+                v-if="theme == 'step'"
+                :class="classPrefix + '__steps'"
               >
                 <view
-                  :class="
-                    classPrefix +
-                      '__step-dot ' +
-                      classPrefix +
-                      '__step-dot--' +
-                      (item !== placeholder ? 'active' : '') +
-                      ' ' +
+                  v-for="(item, index) in steps"
+                  :key="index"
+                  :class="classPrefix + '__step'"
+                  :data-index="index"
+                  @click="() => onStepClick(index)"
+                >
+                  <view
+                    :class="
                       classPrefix +
-                      '__step-dot--' +
-                      (index === steps.length - 1 ? 'last' : '')
-                  "
-                />
-
-                <view :class="classPrefix + '__step-label ' + classPrefix + '__step-label--' + (index === stepIndex ? 'active' : '')">
-                  {{ item }}
+                        '__step-dot ' +
+                        classPrefix +
+                        '__step-dot--' +
+                        (item !== placeholder ? 'active' : '') +
+                        ' ' +
+                        classPrefix +
+                        '__step-dot--' +
+                        (index === steps.length - 1 ? 'last' : '')
+                    "
+                  />
+
+                  <view :class="classPrefix + '__step-label ' + classPrefix + '__step-label--' + (index === stepIndex ? 'active' : '')">
+                    {{ item }}
+                  </view>
+
+                  <t-icon
+                    name="chevron-right"
+                    size="44rpx"
+                    :t-class="classPrefix + '__step-arrow'"
+                    :custom-style="stepArrowCustomStyle"
+                    style="margin-left: auto"
+                  />
                 </view>
+              </view>
 
-                <t-icon
-                  name="chevron-right"
-                  size="44rpx"
-                  :t-class="classPrefix + '__step-arrow'"
-                  :custom-style="stepArrowCustomStyle"
-                  style="margin-left: auto"
+              <t-tabs
+                v-if="theme == 'tab'"
+                ref="tabs"
+                :value="stepIndex"
+                :space-evenly="false"
+                @change="({value}) => onTabChange(value)"
+              >
+                <t-tab-panel
+                  v-for="(item, index) in steps"
+                  :key="index"
+                  :ref="`tab-${index}`"
+                  :value="index"
+                  :label="item"
                 />
-              </view>
+              </t-tabs>
+            </block>
+
+            <slot name="middle-content" />
+
+            <view
+              v-if="subTitles && subTitles[stepIndex]"
+              :class="classPrefix + '__options-title'"
+            >
+              {{ subTitles[stepIndex] }}
             </view>
 
-            <t-tabs
-              v-if="theme == 'tab'"
-              ref="tabs"
-              :value="stepIndex"
-              :space-evenly="false"
-              @change="({value}) => onTabChange(value)"
+            <view
+              :class="classPrefix + '__options-container'"
+              :style="'' + `width: ${items.length + 1 }00vw; transform: translateX(-${stepIndex}00vw)`"
             >
-              <t-tab-panel
-                v-for="(item, index) in steps"
+              <scroll-view
+                v-for="(options, index) in items"
                 :key="index"
-                :ref="`tab-${index}`"
-                :value="index"
-                :label="item"
-              />
-            </t-tabs>
+                :class="classPrefix + '__options'"
+                scroll-y
+                :scroll-top="scrollTopList[index]"
+                type="list"
+                :style="'height: ' + optionsHeight + 'px'"
+              >
+                <view :class="'cascader-radio-group-' + index">
+                  <t-radio-group
+                    :value="selectedValue[index]"
+                    :keys="keys"
+                    :options="options"
+                    :data-level="index"
+                    placement="right"
+                    icon="line"
+                    borderless
+                    @change="(e) => handleSelect(e, { level: index, value: e.value })"
+                  />
+                </view>
+              </scroll-view>
+            </view>
           </block>
 
-          <slot name="middle-content" />
-
-          <view
-            v-if="subTitles && subTitles[stepIndex]"
-            :class="classPrefix + '__options-title'"
-          >
-            {{ subTitles[stepIndex] }}
-          </view>
-
-          <view
-            :class="classPrefix + '__options-container'"
-            :style="'' + `width: ${items.length + 1 }00vw; transform: translateX(-${stepIndex}00vw)`"
-          >
+          <block v-else>
             <scroll-view
-              v-for="(options, index) in items"
-              :key="index"
-              :class="classPrefix + '__options'"
+              v-if="filterResults.length"
+              :class="classPrefix + '__filter-result'"
               scroll-y
-              :scroll-top="scrollTopList[index]"
               type="list"
-              :style="'height: ' + optionsHeight + 'px'"
             >
-              <view :class="'cascader-radio-group-' + index">
-                <t-radio-group
-                  :value="selectedValue[index]"
-                  :keys="keys"
-                  :options="options"
-                  :data-level="index"
-                  placement="right"
-                  icon="line"
-                  borderless
-                  @change="(e) => handleSelect(e, { level: index, value: e.value })"
-                />
+              <view
+                v-for="item in filterResults"
+                :key="item.key"
+                :class="classPrefix + '__filter-result-item' + (item.disabled ? ' ' + classPrefix + '__filter-result-item--disabled' : '')"
+                :hover-class="item.disabled ? '' : classPrefix + '__filter-result-item--hover'"
+                :data-key="item.key"
+                @click="() => onFilterResultTap(item.key)"
+              >
+                <text
+                  v-for="frag in item.fragments"
+                  :key="frag.id"
+                  :class="frag.highlight ? classPrefix + '__filter-highlight' : ''"
+                >
+                  {{ frag.text }}
+                </text>
               </view>
             </scroll-view>
-          </view>
+            <view
+              v-else
+              :class="classPrefix + '__filter-empty'"
+            >
+              {{ globalConfig.empty }}
+            </view>
+          </block>
         </view>
       </view>
     </t-popup>
@@ -134,12 +180,13 @@
 <script>
 import { prefix } from '../common/config';
 import { uniComponent } from '../common/src/index';
-import { getRect, coalesce, nextTick } from '../common/utils';
+import { getRect, coalesce, nextTick, debounce } from '../common/utils';
 import tools from '../common/utils.wxs';
 import TIcon from '../icon/icon';
 import usingConfig from '../mixins/using-config';
 import TPopup from '../popup/popup';
 import TRadioGroup from '../radio-group/radio-group';
+import TSearch from '../search/search.vue';
 import TTabPanel from '../tab-panel/tab-panel.vue';
 import TTabs from '../tabs/tabs';
 
@@ -161,12 +208,83 @@ function parseOptions(options, keys) {
   }));
 }
 
+function flattenPaths(options, keys) {
+  const labelKey = coalesce(keys?.label, 'label');
+  const valueKey = coalesce(keys?.value, 'value');
+  const childrenKey = coalesce(keys?.children, 'children');
+  const disabledKey = coalesce(keys?.disabled, 'disabled');
+  const result = [];
+
+  const walk = (list, path, indexes) => {
+    list.forEach((item, idx) => {
+      const nextPath = [...path, item];
+      const nextIndexes = [...indexes, idx];
+      const children = item?.[childrenKey];
+      if (Array.isArray(children) && children.length > 0) {
+        walk(children, nextPath, nextIndexes);
+      } else {
+        const labels = nextPath.map(node => String(coalesce(node?.[labelKey], '')));
+        const text = [labels.join(''), String(coalesce(item?.text, ''))].filter(Boolean).join('');
+        result.push({
+          key: nextPath.map(node => String(coalesce(node?.[valueKey], ''))).join('/'),
+          path: nextPath,
+          indexes: nextIndexes,
+          labels,
+          text,
+          disabled: nextPath.some(node => node?.[disabledKey]),
+        });
+      }
+    });
+  };
+
+  walk(options || [], [], []);
+  return result;
+}
+
+function buildFragments(labels, keyword) {
+  const joined = labels.join(' / ');
+  const push = (acc, text, highlight) => {
+    if (!text) return;
+    acc.push({ id: acc.length, text, highlight });
+  };
+
+  if (!keyword) return [{ id: 0, text: joined, highlight: false }];
+
+  const fragments = [];
+  const haystack = joined.toLowerCase();
+  const needle = keyword.toLowerCase();
+  let cursor = 0;
+  while (cursor < joined.length) {
+    const hit = haystack.indexOf(needle, cursor);
+    if (hit === -1) {
+      push(fragments, joined.slice(cursor), false);
+      break;
+    }
+    push(fragments, joined.slice(cursor, hit), false);
+    push(fragments, joined.slice(hit, hit + needle.length), true);
+    cursor = hit + needle.length;
+  }
+  return fragments.length ? fragments : [{ id: 0, text: joined, highlight: false }];
+}
+
+function defaultFilter(keyword, _option, path, labelKey) {
+  const lower = keyword.toLowerCase();
+  const joined = path
+    .map(node => String(coalesce(node?.[labelKey], '')))
+    .join('')
+    .toLowerCase();
+  const text = String(coalesce(path[path.length - 1]?.text, '')).toLowerCase();
+  return joined.includes(lower) || (!!text && text.includes(lower));
+}
+
 const defaultState = {
   contentHeight: 0,
   stepHeight: 0,
   tabsHeight: 0,
   subTitlesHeight: 0,
   stepsInitHeight: 0,
+  filterHeight: 0,
+  flatPaths: [],
 };
 
 export default {
@@ -176,6 +294,7 @@ export default {
     TTabs,
     TTabPanel,
     TRadioGroup,
+    TSearch,
   },
   ...uniComponent({
     name,
@@ -213,6 +332,9 @@ export default {
         dataVisible: this.visible,
         dataValue: coalesce(this.value, this.defaultValue),
         items: [],
+        filterKeyword: '',
+        filterResults: [],
+        isSearching: false,
       };
     },
     computed: {
@@ -249,6 +371,9 @@ export default {
             });
           } else {
             this.state = { ...defaultState };
+            if (this.isSearching) {
+              this.resetFilter();
+            }
           }
         },
         immediate: true,
@@ -278,10 +403,31 @@ export default {
           this.selectedValue = selectedValue;
           this.stepIndex = items.length - 1;
           this.setTabParent();
+
+          this.invalidateFlatPaths();
+          if (this.isSearching) {
+            this.applyFilter(this.filterKeyword);
+          }
         },
         immediate: true,
         deep: true,
       },
+      keys: {
+        handler() {
+          this.invalidateFlatPaths();
+          if (this.isSearching) {
+            this.applyFilter(this.filterKeyword);
+          }
+        },
+        deep: true,
+      },
+      filterable: {
+        handler(v) {
+          if (!v && this.isSearching) {
+            this.resetFilter();
+          }
+        },
+      },
       selectedIndexes: {
         handler() {
           const { visible, theme } = this;
@@ -321,6 +467,7 @@ export default {
       this.state = {
         ...defaultState,
       };
+      this.filterDebounced = null;
     },
     mounted() {
 
@@ -343,7 +490,7 @@ export default {
       },
 
       async initOptionsHeight(steps) {
-        const { theme, subTitles, classPrefix } = this;
+        const { theme, subTitles, filterable, classPrefix } = this;
 
         const { height } = await getRect(this, `.${classPrefix}__content`);
         this.state.contentHeight = height;
@@ -366,7 +513,15 @@ export default {
           this.state.subTitlesHeight = height;
         }
 
-        const optionsInitHeight = this.state.contentHeight - this.state.subTitlesHeight;
+        if (filterable) {
+          await getRect(this, `.${classPrefix}__filter`).then((filterRect) => {
+            this.state.filterHeight = filterRect.height;
+          })
+            .catch(() => {
+            });
+        }
+
+        const optionsInitHeight = this.state.contentHeight - this.state.subTitlesHeight - this.state.filterHeight;
         this.optionsHeight = theme === 'step'
           ? optionsInitHeight - this.state.stepsInitHeight - (steps - 1) * this.state.stepHeight
           : optionsInitHeight - this.state.tabsHeight;
@@ -426,6 +581,106 @@ export default {
         }
         this.hide('close-btn');
       },
+      invalidateFlatPaths() {
+        this.state.flatPaths = [];
+      },
+      ensureFlatPaths() {
+        let { flatPaths } = this.state;
+        if (!flatPaths || flatPaths.length === 0) {
+          flatPaths = flattenPaths(this.options, this.keys);
+          this.state.flatPaths = flatPaths;
+        }
+        return flatPaths;
+      },
+      resetFilter() {
+        this.filterKeyword = '';
+        this.filterResults = [];
+        this.isSearching = false;
+      },
+      onFilterChange(e) {
+        const value = e?.value ?? e?.detail?.value ?? '';
+        if (!this.filterDebounced) {
+          this.filterDebounced = debounce(kw => this.applyFilter(kw), 200);
+        }
+        this.filterDebounced(value);
+      },
+      onFilterClear() {
+        this.resetFilter();
+      },
+      applyFilter(rawKeyword) {
+        const keyword = String(rawKeyword ?? '').trim();
+        if (!keyword) {
+          this.resetFilter();
+          return;
+        }
+
+        const { keys, filter } = this;
+        const labelKey = coalesce(keys?.label, 'label');
+        const userFilter = filter;
+        const flat = this.ensureFlatPaths();
+        const results = [];
+
+        flat.forEach((entry) => {
+          const leaf = entry.path[entry.path.length - 1];
+          const matched = typeof userFilter === 'function'
+            ? !!userFilter(keyword, leaf, entry.path)
+            : defaultFilter(keyword, leaf, entry.path, labelKey);
+          if (matched) {
+            results.push({
+              key: entry.key,
+              indexes: entry.indexes,
+              disabled: entry.disabled,
+              fragments: buildFragments(entry.labels, keyword),
+            });
+          }
+        });
+
+        this.filterKeyword = rawKeyword;
+        this.filterResults = results;
+        this.isSearching = true;
+      },
+      onFilterResultTap(key) {
+        const target = this.filterResults.find(item => item.key === key);
+        if (!target || target.disabled) return;
+
+        const { indexes } = target;
+        const { items: newItems } = this.regenItemsByIndexes(indexes);
+
+        this.resetFilter();
+        this.items = newItems;
+        this.selectedIndexes = indexes;
+        this.stepIndex = indexes.length - 1;
+        setTimeout(() => this.triggerChange());
+        this.hide('finish');
+      },
+      regenItemsByIndexes(selectedIndexes) {
+        const { options, keys, placeholder, globalConfig } = this;
+        const selectedValue = [];
+        const steps = [];
+        const items = [parseOptions(options, keys)];
+        const labelKey = coalesce(keys?.label, 'label');
+        const valueKey = coalesce(keys?.value, 'value');
+        const childrenKey = coalesce(keys?.children, 'children');
+
+        let current = options;
+        for (let i = 0, size = selectedIndexes.length; i < size; i += 1) {
+          const index = selectedIndexes[i];
+          const next = current[index];
+          selectedValue.push(next[valueKey]);
+          steps.push(next[labelKey]);
+          const children = next[childrenKey];
+          if (Array.isArray(children) && children.length > 0) {
+            items.push(parseOptions(children, keys));
+            current = children;
+          }
+        }
+
+        if (steps.length < items.length) {
+          steps.push(placeholder || globalConfig.placeholder);
+        }
+
+        return { selectedValue, steps, items };
+      },
       onStepClick(index) {
         this.stepIndex = index;
       },
diff --git a/packages/uniapp-components/cascader/props.ts b/packages/uniapp-components/cascader/props.ts
index 5522dedea..17d698bd1 100644
--- a/packages/uniapp-components/cascader/props.ts
+++ b/packages/uniapp-components/cascader/props.ts
@@ -13,6 +13,17 @@ export default {
     type: Boolean,
     default: true as TdCascaderProps['closeBtn'],
   },
+  /**  自定义过滤函数。返回 true 表示匹配，未设置时使用内置匹配规则：对路径中所有 label 拼接后做大小写不敏感的 includes 匹配 */
+  filter: {
+    type: Function,
+  },
+  /** 搜索框占位符描述文本 */
+  filterPlaceholder: {
+    type: String,
+    default: '',
+  },
+  /** 是否可搜索，开启后顶部会展示一个搜索框  */
+  filterable: Boolean,
   /** 用来定义 value / label / children / disabled 在 `options` 中对应的字段别名 */
   keys: {
     type: Object,
@@ -22,7 +33,7 @@ export default {
     type: Array,
     default: (): TdCascaderProps['options'] => [],
   },
-  /** 未选中时的提示文案 */
+  /** 未选中时的提示文案。组件内置默认值为：'选择选项' */
   placeholder: {
     type: String,
     default: '',
diff --git a/packages/uniapp-components/cascader/type.ts b/packages/uniapp-components/cascader/type.ts
index 5e33a85b4..6cfdbc08a 100644
--- a/packages/uniapp-components/cascader/type.ts
+++ b/packages/uniapp-components/cascader/type.ts
@@ -18,6 +18,20 @@ export interface TdCascaderProps<CascaderOption extends TreeOptionData = TreeOpt
    * @default true
    */
   closeBtn?: boolean;
+  /**
+   *  自定义过滤函数。返回 true 表示匹配，未设置时使用内置匹配规则：对路径中所有 label 拼接后做大小写不敏感的 includes 匹配
+   */
+  filter?: CascaderFilterFunction;
+  /**
+   * 搜索框占位符描述文本
+   * @default ''
+   */
+  filterPlaceholder?: string;
+  /**
+   * 是否可搜索，开启后顶部会展示一个搜索框
+   * @default false
+   */
+  filterable?: boolean;
   /**
    * 用来定义 value / label / children / disabled 在 `options` 中对应的字段别名
    */
@@ -28,8 +42,8 @@ export interface TdCascaderProps<CascaderOption extends TreeOptionData = TreeOpt
    */
   options?: Array<CascaderOption>;
   /**
-   * 未选中时的提示文案
-   * @default 选择选项
+   * 未选中时的提示文案。组件内置默认值为：'选择选项'
+   * @default ''
    */
   placeholder?: string;
   /**
@@ -78,6 +92,12 @@ export interface TdCascaderProps<CascaderOption extends TreeOptionData = TreeOpt
   onPick?: (context: { value: string | number; label: string; index: number; level: number }) => void;
 }
 
+export type CascaderFilterFunction<CascaderOption extends TreeOptionData = TreeOptionData> = (
+  keyword: string,
+  option: CascaderOption,
+  path: CascaderOption[],
+) => boolean;
+
 export type CascaderKeysType = TreeKeysType;
 
 export type CascaderTriggerSource = 'overlay' | 'close-btn' | 'finish';

From c352a5e719984bf7b075c73d3201209e5a4cd293 Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Sat, 13 Jun 2026 01:45:19 +0800
Subject: [PATCH 04/11] chore(fab): update docs

---
 packages/uniapp-components/fab/README.en-US.md | 8 ++++----
 packages/uniapp-components/fab/README.md       | 6 +++---
 packages/uniapp-components/fab/props.ts        | 2 +-
 packages/uniapp-components/fab/type.ts         | 2 +-
 4 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/packages/uniapp-components/fab/README.en-US.md b/packages/uniapp-components/fab/README.en-US.md
index 27dd54062..6dc1d0c29 100644
--- a/packages/uniapp-components/fab/README.en-US.md
+++ b/packages/uniapp-components/fab/README.en-US.md
@@ -7,13 +7,13 @@
 name | type | default | description | required
 -- | -- | -- | -- | --
 custom-style | Object | - | CSS(Cascading Style Sheets) | N
-button-props | Object | - | Typescript：`ButtonProps`，[Button API Documents](./button?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/packages/uniapp-components/fab/type.ts) | N
-draggable | String / Boolean | false | Typescript：`boolean \| FabDirectionEnum ` `type FabDirectionEnum = 'all' \| 'vertical' \| 'horizontal'`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/packages/uniapp-components/fab/type.ts) | N
-icon | String | - | \- | N
+button-props | Object | - | Typescript: `ButtonProps`，[Button API Documents](./button?tab=api)。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/fab/type.ts) | N
+draggable | String / Boolean | false | Typescript: `boolean \| FabDirectionEnum ` `type FabDirectionEnum = 'all' \| 'vertical' \| 'horizontal'`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/fab/type.ts) | N
+icon | String / Object | - | icon name | N
 style | String | right: 16px; bottom: 32px; | \- | N
 text | String | - | \- | N
 using-custom-navbar | Boolean | false | \- | N
-y-bounds | Array | - | Typescript：`Array<string \| number>` | N
+y-bounds | Array | - | Typescript: `Array<string \| number>` | N
 
 ### Fab Events
 
diff --git a/packages/uniapp-components/fab/README.md b/packages/uniapp-components/fab/README.md
index 55c58ec10..82065e6f6 100644
--- a/packages/uniapp-components/fab/README.md
+++ b/packages/uniapp-components/fab/README.md
@@ -53,9 +53,9 @@ Fab 组件默认定位 `right: 16px; bottom: 32px;`，且拖拽功能也是通
 名称 | 类型 | 默认值 | 描述 | 必传
 -- | -- | -- | -- | --
 custom-style | Object | - | 自定义样式 | N
-button-props | Object | - | 透传至 Button 组件。TS 类型：`ButtonProps`，[Button API Documents](./button?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/packages/uniapp-components/fab/type.ts) | N
-draggable | String / Boolean | false | 是否可拖拽。`true` / `'all'`可拖动<br>`'vertical'`可垂直拖动<br>`'horizontal'`可水平拖动<br>`false`禁止拖动。TS 类型：`boolean \| FabDirectionEnum ` `type FabDirectionEnum = 'all' \| 'vertical' \| 'horizontal'`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/packages/uniapp-components/fab/type.ts) | N
-icon | String | - | 图标 | N
+button-props | Object | - | 透传至 Button 组件。TS 类型：`ButtonProps`，[Button API Documents](./button?tab=api)。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/fab/type.ts) | N
+draggable | String / Boolean | false | 是否可拖拽。`true` / `'all'`可拖动<br>`'vertical'`可垂直拖动<br>`'horizontal'`可水平拖动<br>`false`禁止拖动。TS 类型：`boolean \| FabDirectionEnum ` `type FabDirectionEnum = 'all' \| 'vertical' \| 'horizontal'`。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/fab/type.ts) | N
+icon | String / Object | - | 图标名称。值为字符串表示图标名称，值为 `Object` 类型，表示透传至 `icon` 组件 | N
 style | String | right: 16px; bottom: 32px; | 悬浮按钮的样式，常用于调整位置（即将废弃，建议使用 `style`） | N
 text | String | - | 文本内容 | N
 using-custom-navbar | Boolean | false | 是否使用了自定义导航栏 | N
diff --git a/packages/uniapp-components/fab/props.ts b/packages/uniapp-components/fab/props.ts
index 2cb193d43..ffc811f12 100644
--- a/packages/uniapp-components/fab/props.ts
+++ b/packages/uniapp-components/fab/props.ts
@@ -15,7 +15,7 @@ export default {
     type: [String, Boolean],
     default: false as TdFabProps['draggable'],
   },
-  /** 图标 */
+  /** 图标名称。值为字符串表示图标名称，值为 `Object` 类型，表示透传至 `icon` 组件 */
   icon: {
     type: [String, Object],
     default: '',
diff --git a/packages/uniapp-components/fab/type.ts b/packages/uniapp-components/fab/type.ts
index 3e176e665..ba8989849 100644
--- a/packages/uniapp-components/fab/type.ts
+++ b/packages/uniapp-components/fab/type.ts
@@ -17,7 +17,7 @@ export interface TdFabProps {
    */
   draggable?: boolean | FabDirectionEnum;
   /**
-   * 图标
+   * 图标名称。值为字符串表示图标名称，值为 `Object` 类型，表示透传至 `icon` 组件
    * @default ''
    */
   icon?: string | Record<string, any>;

From 10ef3f42d4ed711864e02150fe465913951ce487 Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Sat, 13 Jun 2026 01:47:13 +0800
Subject: [PATCH 05/11] =?UTF-8?q?feat(stepper):=20=E8=B0=83=E6=95=B4?=
 =?UTF-8?q?=E6=89=8B=E5=8A=A8=E8=BE=93=E5=85=A5=E9=80=BB=E8=BE=91=EF=BC=8C?=
 =?UTF-8?q?=E8=BE=93=E5=85=A5=E6=97=B6=E4=BB=85=E8=BF=87=E6=BB=A4=E9=9D=9E?=
 =?UTF-8?q?=E6=B3=95=E5=AD=97=E7=AC=A6=EF=BC=8C=E8=8C=83=E5=9B=B4=E6=A0=A1?=
 =?UTF-8?q?=E9=AA=8C&=E8=B5=8B=E5=80=BC=E7=A7=BB=E8=87=B3=E5=A4=B1?=
 =?UTF-8?q?=E7=84=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/uniapp-components/stepper/stepper.vue | 15 ++++++---------
 1 file changed, 6 insertions(+), 9 deletions(-)

diff --git a/packages/uniapp-components/stepper/stepper.vue b/packages/uniapp-components/stepper/stepper.vue
index 6964bd91e..fde50dfcf 100644
--- a/packages/uniapp-components/stepper/stepper.vue
+++ b/packages/uniapp-components/stepper/stepper.vue
@@ -201,6 +201,9 @@ export default {
         this.$emit('focus', { value });
       },
 
+      /**
+       * 输入过程中仅过滤非法字符并更新显示值，不做 min/max 边界约束。范围校验和 change 事件统一在 handleBlur 中处理
+       */
       handleInput(e) {
         const { value } = e.detail;
         // 允许输入空值
@@ -209,21 +212,15 @@ export default {
         }
 
         const formatted = this.filterIllegalChar(value);
-        const newValue = this.format(formatted);
 
-        const displayValue = this.integer ? newValue : formatted;
         // 当过滤后的值与当前值相同时，需要先清空再回填，强制触发视图更新
-        if (String(this.currentValue) === String(displayValue)) {
+        if (String(this.currentValue) === String(formatted)) {
           this.updateCurrentValue('');
           nextTick().then(() => {
-            this.updateCurrentValue(displayValue);
+            this.updateCurrentValue(formatted);
           });
         } else {
-          this.updateCurrentValue(displayValue);
-        }
-
-        if (this.integer || /\.\d*[1-9]/.test(formatted)) {
-          this.setValue(formatted);
+          this.updateCurrentValue(formatted);
         }
       },
 

From b8f44623a20e37a6f5be2d58a06c8a099b15f00b Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Sat, 13 Jun 2026 01:51:05 +0800
Subject: [PATCH 06/11] feat(upload): support allowUploadDuplicateFile and
 theme

---
 .../uniapp-components/upload/README.en-US.md  |   4 +-
 packages/uniapp-components/upload/README.md   |   4 +-
 packages/uniapp-components/upload/props.ts    |  11 +
 packages/uniapp-components/upload/type.ts     |  12 +-
 .../upload/upload.computed.js                 |  75 +++++
 packages/uniapp-components/upload/upload.less | 248 ++++++++++++++++-
 packages/uniapp-components/upload/upload.vue  | 262 +++++++++++++++++-
 7 files changed, 600 insertions(+), 16 deletions(-)

diff --git a/packages/uniapp-components/upload/README.en-US.md b/packages/uniapp-components/upload/README.en-US.md
index be032f292..1f608d230 100644
--- a/packages/uniapp-components/upload/README.en-US.md
+++ b/packages/uniapp-components/upload/README.en-US.md
@@ -9,6 +9,7 @@ name | type | default | description | required
 custom-style | Object | - | CSS(Cascading Style Sheets) | N
 add-btn | Boolean | true | \- | N
 add-content | String | - | \- | N
+allow-upload-duplicate-file | Boolean | false | allow to upload duplicate name files | N
 config | Object | - | Typescript: `UploadMpConfig` `type UploadMpConfig = UploadImageConfig \| UploadVideoConfig` `interface UploadImageConfig { count?: number; sizeType?: Array<SizeTypeValues>; sourceType?: Array<SourceTypeValues> }` `type SizeTypeValues = 'original' \| 'compressed'` `type SourceTypeValues = 'album' \| 'camera'` `interface UploadVideoConfig { sourceType?: Array<SourceTypeValues>; compressed?: boolean; maxDuration?: number; camera?: 'back' \| 'front' }`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 disabled | Boolean | undefined | make upload to be disabled | N
 draggable | Boolean / Object | - | Typescript: `boolean \| {vibrate?: boolean; collisionVibrate?: boolean}` | N
@@ -18,12 +19,13 @@ grid-config | Object | - | Typescript: `{column?: number;  width?: number; heigh
 gutter | Number | 16 | \- | N
 image-props | Object | - | Typescript: `ImageProps`，[Image API Documents](./image?tab=api)。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 max | Number | 0 | max count of files limit | N
-media-type | Array | ['image', 'video'] | Typescript: `Array<MediaType>` `type MediaType = 'image' \| 'video'`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
+media-type | Array | ['image', 'video'] | Typescript: `Array<MediaType>` `type MediaType = 'image' \| 'video' \| 'mix'`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 preview | Boolean | true | \- | N
 remove-btn | Boolean | true | \- | N
 request-method | Function | - | Typescript: `(files: UploadFile \| UploadFile[]) => Promise<RequestMethodResponse>` `interface RequestMethodResponse { status: 'success' \| 'fail'; error?: string; response: { url?: string; files?: UploadFile[]; [key: string]: any } }`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 size-limit | Number / Object | - | files size limit。Typescript: `number \| SizeLimitObj` `interface SizeLimitObj { size: number; unit: SizeUnit ; message?: string }` `type SizeUnitArray = ['B', 'KB', 'MB', 'GB']` `type SizeUnit = SizeUnitArray[number]`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 source | String | media | options: media/messageFile | N
+theme | String | grid | options: grid/list | N
 transition | Object | { backTransition: true, duration: 300, timingFunction: 'ease' } | Typescript: `Transition` `interface Transition { backTransition?: boolean, duration?: number, timingFunction?: string }`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 
 ### Upload Events
diff --git a/packages/uniapp-components/upload/README.md b/packages/uniapp-components/upload/README.md
index 6a4746472..e0fc44bb4 100644
--- a/packages/uniapp-components/upload/README.md
+++ b/packages/uniapp-components/upload/README.md
@@ -64,6 +64,7 @@ import TUpload from '@tdesign/uniapp/upload/upload.vue';
 custom-style | Object | - | 自定义样式 | N
 add-btn | Boolean | true | 添加按钮 | N
 add-content | String | - | 添加按钮内容 | N
+allow-upload-duplicate-file | Boolean | false | 是否允许重复上传相同文件名的文件 | N
 config | Object | - | 图片上传配置，视频上传配置，文件上传配置等，包含图片尺寸、图片来源、视频来源、视频拍摄最长时间等。更多细节查看小程序官网。[图片上传](https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.chooseImage.html)。[视频上传](https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseVideo.html)。TS 类型：`UploadMpConfig` `type UploadMpConfig = UploadImageConfig \| UploadVideoConfig` `interface UploadImageConfig { count?: number; sizeType?: Array<SizeTypeValues>; sourceType?: Array<SourceTypeValues> }` `type SizeTypeValues = 'original' \| 'compressed'` `type SourceTypeValues = 'album' \| 'camera'` `interface UploadVideoConfig { sourceType?: Array<SourceTypeValues>; compressed?: boolean; maxDuration?: number; camera?: 'back' \| 'front' }`。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 disabled | Boolean | undefined | 是否禁用组件 | N
 draggable | Boolean / Object | - | 是否支持拖拽排序。长按时是否振动，碰撞时是否振动。示例一：`true`。示例二：`{ vibrate: true, collisionVibrate: true }`。TS 类型：`boolean \| {vibrate?: boolean; collisionVibrate?: boolean}` | N
@@ -73,12 +74,13 @@ grid-config | Object | - | upload组件每行上传图片列数以及图片的
 gutter | Number | 16 | 预览窗格的 `gutter` 大小，单位 rpx | N
 image-props | Object | - | 透传 Image 组件全部属性。TS 类型：`ImageProps`，[Image API Documents](./image?tab=api)。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 max | Number | 0 | 用于控制文件上传数量，值为 0 则不限制 | N
-media-type | Array | ['image', 'video'] | 支持上传的文件类型，图片或视频。TS 类型：`Array<MediaType>` `type MediaType = 'image' \| 'video'`。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
+media-type | Array | ['image', 'video'] | 支持上传的文件类型，图片或视频。TS 类型：`Array<MediaType>` `type MediaType = 'image' \| 'video' \| 'mix'`。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 preview | Boolean | true | 是否支持图片预览，文件没有预览 | N
 remove-btn | Boolean | true | 移除按钮 | N
 request-method | Function | - | 自定义上传方法。TS 类型：`(files: UploadFile \| UploadFile[]) => Promise<RequestMethodResponse>` `interface RequestMethodResponse { status: 'success' \| 'fail'; error?: string; response: { url?: string; files?: UploadFile[]; [key: string]: any } }`。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 size-limit | Number / Object | - | 图片文件大小限制，默认单位 KB。可选单位有：`'B' \| 'KB' \| 'MB' \| 'GB'`。示例一：`1000`。示例二：`{ size: 2, unit: 'MB', message: '图片大小不超过 {sizeLimit} MB' }`。TS 类型：`number \| SizeLimitObj` `interface SizeLimitObj { size: number; unit: SizeUnit ; message?: string }` `type SizeUnitArray = ['B', 'KB', 'MB', 'GB']` `type SizeUnit = SizeUnitArray[number]`。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 source | String | media | 来源。可选项：media/messageFile | N
+theme | String | grid | 组件风格。提供宫格和列表两种布局风格。可选项：grid/list | N
 transition | Object | { backTransition: true, duration: 300, timingFunction: 'ease' } | 拖拽位置移动时的过渡参数,`duration`单位为ms。TS 类型：`Transition` `interface Transition { backTransition?: boolean, duration?: number, timingFunction?: string }`。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/upload/type.ts) | N
 
 ### Upload Events
diff --git a/packages/uniapp-components/upload/props.ts b/packages/uniapp-components/upload/props.ts
index 5b18b57c7..79890b14a 100644
--- a/packages/uniapp-components/upload/props.ts
+++ b/packages/uniapp-components/upload/props.ts
@@ -15,6 +15,8 @@ export default {
   addContent: {
     type: String,
   },
+  /** 是否允许重复上传相同文件名的文件 */
+  allowUploadDuplicateFile: Boolean,
   /** 图片上传配置，视频上传配置，文件上传配置等，包含图片尺寸、图片来源、视频来源、视频拍摄最长时间等。更多细节查看小程序官网。[图片上传](https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.chooseImage.html)。[视频上传](https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseVideo.html) */
   config: {
     type: Object,
@@ -86,6 +88,15 @@ export default {
       return ['media', 'messageFile'].includes(val);
     },
   },
+  /** 组件风格。提供宫格和列表两种布局风格 */
+  theme: {
+    type: String,
+    default: 'grid' as TdUploadProps['theme'],
+    validator(val: TdUploadProps['theme']): boolean {
+      if (!val) return true;
+      return ['grid', 'list'].includes(val);
+    },
+  },
   /** 拖拽位置移动时的过渡参数,`duration`单位为ms */
   transition: {
     type: Object,
diff --git a/packages/uniapp-components/upload/type.ts b/packages/uniapp-components/upload/type.ts
index 56f9b02cb..e6b2b8f5d 100644
--- a/packages/uniapp-components/upload/type.ts
+++ b/packages/uniapp-components/upload/type.ts
@@ -16,6 +16,11 @@ export interface TdUploadProps {
    * 添加按钮内容
    */
   addContent?: string;
+  /**
+   * 是否允许重复上传相同文件名的文件
+   * @default false
+   */
+  allowUploadDuplicateFile?: boolean;
   /**
    * 图片上传配置，视频上传配置，文件上传配置等，包含图片尺寸、图片来源、视频来源、视频拍摄最长时间等。更多细节查看小程序官网。[图片上传](https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.chooseImage.html)。[视频上传](https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseVideo.html)
    */
@@ -82,6 +87,11 @@ export interface TdUploadProps {
    * @default media
    */
   source?: 'media' | 'messageFile';
+  /**
+   * 组件风格。提供宫格和列表两种布局风格
+   * @default grid
+   */
+  theme?: 'grid' | 'list';
   /**
    * 拖拽位置移动时的过渡参数,`duration`单位为ms
    * @default { backTransition: true, duration: 300, timingFunction: 'ease' }
@@ -149,7 +159,7 @@ export interface UploadFile {
   status: 'loading' | 'reload' | 'failed' | 'done';
 }
 
-export type MediaType = 'image' | 'video';
+export type MediaType = 'image' | 'video' | 'mix';
 
 export interface RequestMethodResponse {
   status: 'success' | 'fail';
diff --git a/packages/uniapp-components/upload/upload.computed.js b/packages/uniapp-components/upload/upload.computed.js
index e510763e4..6eafbeafa 100644
--- a/packages/uniapp-components/upload/upload.computed.js
+++ b/packages/uniapp-components/upload/upload.computed.js
@@ -11,3 +11,78 @@ export function getWrapperAriaLabel(file) {
   }
   return file.type === 'video' ? '视频' : '图像';
 }
+
+export function isImageType(file) {
+  if (file.type === 'image') return true;
+  if (file.url) {
+    const imageExts = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg', 'tiff'];
+    const url = String(file.url).toLowerCase();
+    for (let i = 0; i < imageExts.length; i++) {
+      if (url.indexOf(`.${imageExts[i]}`) !== -1) return true;
+    }
+  }
+  return false;
+}
+
+function getFileExt(file) {
+  const name = file.name || '';
+  const url = file.url || '';
+  let ext = '';
+  const dotIndex = name.lastIndexOf('.');
+  if (dotIndex !== -1) {
+    ext = name.substring(dotIndex).toLowerCase();
+  }
+  if (ext === '' && url) {
+    const urlDotIndex = url.lastIndexOf('.');
+    if (urlDotIndex !== -1) {
+      const qIndex = url.indexOf('?', urlDotIndex);
+      if (qIndex !== -1) {
+        ext = url.substring(urlDotIndex, qIndex).toLowerCase();
+      } else {
+        ext = url.substring(urlDotIndex).toLowerCase();
+      }
+    }
+  }
+  return ext;
+}
+
+function getFileCategory(ext) {
+  if (ext === '.pdf') return 'pdf';
+  if (['.xlsx', '.xls', '.csv', '.xlc', '.xlm', '.xlt', '.xlw'].includes(ext)) return 'excel';
+  if (['.pptx', '.ppt', '.key'].includes(ext)) return 'ppt';
+  if (['.docx', '.doc', '.document', '.wps', '.wdb', '.msword'].includes(ext)) return 'word';
+  if (['.avi', '.mp4', '.wmv', '.mpg', '.mpeg', '.mov', '.rm', '.ram', '.swf', '.flv', '.rmvb', '.3gp', '.mp2', '.mp3', '.ogg', '.3gpp', '.ac3', '.au'].includes(ext)) return 'media';
+  if (['.zip', '.rar', '.7z', '.tar', '.gz', '.bz2', '.xz'].includes(ext)) return 'zip';
+  return 'other';
+}
+
+const FILE_CATEGORY_ICON_MAP = {
+  pdf: 'file-pdf-filled',
+  excel: 'file-excel-filled',
+  ppt: 'file-powerpoint-filled',
+  word: 'file-word-filled',
+  media: 'video-filled',
+  zip: 'file-zip-filled',
+  other: 'file-1',
+};
+
+export function getFileTypeIcon(file) {
+  const ext = getFileExt(file);
+  const category = getFileCategory(ext);
+  return FILE_CATEGORY_ICON_MAP[category];
+}
+
+export function getFileTypeIconColorClass(file, classPrefix) {
+  const ext = getFileExt(file);
+  const category = getFileCategory(ext);
+  return `${classPrefix}__file-type--${category}`;
+}
+
+export function formatSize(size) {
+  if (size == null || size === undefined) return '';
+  const num = +size;
+  if (num < 1024) return `${num}B`;
+  if (num < 1024 * 1024) return `${(num / 1024).toFixed(1)}KB`;
+  if (num < 1024 * 1024 * 1024) return `${(num / (1024 * 1024)).toFixed(1)}MB`;
+  return `${(num / (1024 * 1024 * 1024)).toFixed(1)}GB`;
+}
diff --git a/packages/uniapp-components/upload/upload.less b/packages/uniapp-components/upload/upload.less
index c112e7cf9..3acfc3704 100644
--- a/packages/uniapp-components/upload/upload.less
+++ b/packages/uniapp-components/upload/upload.less
@@ -6,7 +6,8 @@
 @upload-radius: var(--td-upload-radius, @radius-default);
 @upload-add-icon-size: var(--td-upload-add-icon-size, 56rpx);
 @upload-add-icon-disabled-color: var(--td-upload-add-icon-disabled-color, @text-color-disabled);
-@upload-disabled-mask: var(--td-upload-disabled-mask, rgba(0, 0, 0, 0.6));
+@upload-disabled-mask: var(--td-upload-disabled-mask, @mask-disabled);
+@upload-background: var(--td-upload-background, @upload-add-bg-color);
 @upload-drag-z-index: var(--td-upload-drag-z-index, 999);
 
 .@{prefix}-upload {
@@ -54,6 +55,10 @@
     border-radius: @upload-radius;
     overflow: hidden;
 
+    &--file {
+      background-color: @upload-background;
+    }
+
     &--disabled::before {
       content: '';
       position: absolute;
@@ -66,6 +71,61 @@
     }
   }
 
+  &__file-content {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 16rpx 8rpx;
+    box-sizing: border-box;
+  }
+
+  &__file-icon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 8rpx;
+  }
+
+  &__file-name {
+    width: 100%;
+    font: @font-body-small;
+    color: @text-color-secondary;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    text-align: center;
+    padding: 0 4rpx;
+    box-sizing: border-box;
+  }
+
+  &__file-type {
+    font-size: 48rpx;
+
+    &--pdf,
+    &--media {
+      color: @error-color;
+    }
+
+    &--excel {
+      color: @success-color;
+    }
+
+    &--word {
+      color: @brand-color;
+    }
+
+    &--ppt {
+      color: @warning-color;
+    }
+
+    &--other {
+      color: @text-color-primary;
+    }
+  }
+
   &__close-btn {
     position: absolute;
     top: 0;
@@ -96,6 +156,10 @@
       color: @text-color-anti;
       padding: 32rpx 0;
       box-sizing: border-box;
+
+      &--file {
+        background-color: @font-gray-2;
+      }
     }
 
     &-text {
@@ -108,6 +172,10 @@
     }
   }
 
+  &__list-item-loading {
+    animation: spin infinite linear 0.6s;
+  }
+
   &__drag {
     position: relative;
     width: 100%;
@@ -133,6 +201,184 @@
       z-index: @upload-drag-z-index;
     }
   }
+
+  // ========== list 布局 ==========
+  &--list {
+    display: flex;
+    flex-direction: column;
+    row-gap: 24rpx;
+  }
+
+  &__list {
+    display: flex;
+    flex-direction: column;
+    row-gap: 24rpx;
+  }
+
+  &__list-drag {
+    position: relative;
+    width: 100%;
+  }
+
+  &__list-drag-item {
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    left: 0;
+    width: 100%;
+    padding-bottom: 24rpx;
+    box-sizing: border-box;
+
+    .@{prefix}-upload__list-item {
+      margin: 0;
+    }
+  }
+
+  &__list-item {
+    position: relative;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    column-gap: 24rpx;
+    padding: 16rpx 24rpx;
+    background: @upload-background;
+    border-radius: @upload-radius;
+    box-sizing: border-box;
+
+    &-loading {
+      flex-shrink: 0;
+      font-size: 48rpx;
+      color: @brand-color;
+    }
+
+    &-error-icon {
+      flex-shrink: 0;
+      font-size: 48rpx;
+      color: @error-color;
+    }
+
+    &-icon {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      flex-shrink: 0;
+    }
+
+    &-thumbnail {
+      flex-shrink: 0;
+      width: 48rpx;
+      height: 48rpx;
+      border-radius: @radius-small;
+      overflow: hidden;
+    }
+
+    &-content {
+      flex: 1;
+      min-width: 0;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+    }
+
+    &-name {
+      font: @font-body-medium;
+      color: @text-color-primary;
+    }
+
+    &-size {
+      font: @font-body-small;
+      color: @text-color-placeholder;
+    }
+
+    &-name,
+    &-size {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    &-action {
+      display: flex;
+      align-items: center;
+      flex-shrink: 0;
+      column-gap: 8rpx;
+    }
+
+    &-delete {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 36rpx;
+      color: @text-color-placeholder;
+    }
+
+    &--progress &-name,
+    &--progress &-size {
+      color: @text-color-placeholder;
+    }
+
+    &--fail &-name {
+      color: @error-color;
+    }
+  }
+
+  // grid 布局：无 progress-mask 的图片加 disabled-mask 遮罩
+  // list 布局：缩略图加 disabled-mask 遮罩
+  &__disabled-mask {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    background-color: @upload-disabled-mask;
+  }
+
+  &--disabled {
+    pointer-events: none;
+
+    .@{prefix}-upload__add-icon,
+    .@{prefix}-upload__file-name,
+    .@{prefix}-upload__list-item-name,
+    .@{prefix}-upload__list-item-size {
+      color: @text-color-disabled;
+    }
+
+    .@{prefix}-upload__file-type {
+      &--pdf,
+      &--media {
+        color: @error-color-disabled;
+      }
+
+      &--excel {
+        color: @success-color-disabled;
+      }
+
+      &--word {
+        color: @brand-color-disabled;
+      }
+
+      &--ppt {
+        color: @warning-color-disabled;
+      }
+
+      &--other {
+        color: @text-color-disabled;
+      }
+    }
+
+    .@{prefix}-upload__close-btn,
+    .@{prefix}-upload__list-item-action {
+      display: none;
+    }
+
+    .@{prefix}-upload__list-item-loading {
+      color: @brand-color-disabled;
+    }
+
+    .@{prefix}-upload__list-item-error-icon {
+      color: @error-color-disabled;
+    }
+  }
 }
 
 @keyframes spin {
diff --git a/packages/uniapp-components/upload/upload.vue b/packages/uniapp-components/upload/upload.vue
index 3865f397b..4fbdb4481 100644
--- a/packages/uniapp-components/upload/upload.vue
+++ b/packages/uniapp-components/upload/upload.vue
@@ -1,9 +1,118 @@
 <template>
   <view
     :style="'' + tools._style([customStyle])"
-    :class="classPrefix + ' ' + tClass"
+    :class="classPrefix + ' ' + classPrefix + '--' + (theme || 'grid') + ' ' + (disabled ? classPrefix + '--disabled' : '') + ' ' + tClass"
   >
+    <!-- ========== list 布局 ========== -->
+    <block v-if="theme === 'list'">
+      <!-- 上传触发按钮 -->
+      <view
+        v-if="addBtn && customLimit > 0"
+        :class="classPrefix + '__list-trigger'"
+        @click="onAddTap"
+      >
+        <slot name="add-content" />
+        <block v-if="addContent">
+          {{ addContent }}
+        </block>
+        <t-button
+          v-else
+          theme="primary"
+          size="medium"
+          :disabled="disabled"
+          icon="upload"
+          @click="onAddTap"
+        >
+          上传
+        </t-button>
+      </view>
+      <!-- 文件列表（非拖拽模式） -->
+      <block v-if="!dragLayout">
+        <view
+          v-if="customFiles.length > 0"
+          :class="classPrefix + '__list'"
+        >
+          <view
+            v-for="(file, index) in customFiles"
+            :key="file.url"
+            :class="classPrefix + '__list-item' + (file.status == 'failed' || file.status == 'reload' ? ' ' + classPrefix + '__list-item--fail' : '') + (file.status == 'loading' ? ' ' + classPrefix + '__list-item--progress' : '')"
+            :data-file="file"
+            :data-index="index"
+            @click="(e) => onPreview(e, { file, index })"
+          >
+            <!-- 左侧图标/缩略图 -->
+            <block v-if="file.status == 'loading'">
+              <t-icon
+                :t-class="classPrefix + '__list-item-loading'"
+                name="loading"
+                size="48rpx"
+                aria-hidden
+              />
+            </block>
+            <block v-else-if="file.status == 'failed' || file.status == 'reload'">
+              <t-icon
+                :t-class="classPrefix + '__list-item-error-icon'"
+                name="error-circle-filled"
+                aria-hidden
+              />
+            </block>
+            <block v-else-if="isImageType(file) && file.url">
+              <view style="position: relative; flex-shrink: 0">
+                <t-image
+                  :t-class="classPrefix + '__list-item-thumbnail'"
+                  :src="file.thumb || file.url"
+                  :mode="(imageProps && imageProps.mode) || 'aspectFill'"
+                  shape="round"
+                />
+                <view
+                  v-if="disabled"
+                  :class="classPrefix + '__disabled-mask'"
+                />
+              </view>
+            </block>
+            <block v-else>
+              <view :class="classPrefix + '__list-item-icon'">
+                <t-icon
+                  :t-class="classPrefix + '__file-type ' + getFileTypeIconColorClass(file, classPrefix)"
+                  :name="getFileTypeIcon(file)"
+                />
+              </view>
+            </block>
+            <!-- 文件名与副文本 -->
+            <view :class="classPrefix + '__list-item-content'">
+              <view :class="classPrefix + '__list-item-name'">
+                {{ file.name || '' }}
+              </view>
+              <view :class="classPrefix + '__list-item-size'">
+                {{ file.status == 'loading'
+                  ? (file.percent ? globalConfig.progress.uploadingText + ' ' + file.percent + '%' : globalConfig.progress.uploadingText)
+                  : file.status == 'failed' || file.status == 'reload'
+                    ? globalConfig.progress.failText
+                    : formatSize(file.size) }}
+              </view>
+            </view>
+            <!-- 删除按钮 -->
+            <view
+              v-if="(tools.isBoolean(file.removeBtn) ? file.removeBtn : removeBtn)"
+              :class="classPrefix + '__list-item-action'"
+              :data-index="index"
+              aria-role="button"
+              aria-label="删除"
+              @click.stop="(e) => onDelete(e, {index})"
+            >
+              <t-icon
+                :t-class="classPrefix + '__list-item-delete'"
+                name="delete"
+              />
+            </view>
+          </view>
+        </view>
+      </block>
+    </block>
+
+    <!-- ========== grid 布局（默认） ========== -->
     <t-grid
+      v-else
       :gutter="gutter"
       :border="false"
       align="center"
@@ -19,13 +128,14 @@
           aria-role="presentation"
         >
           <view
-            :class="classPrefix + '__wrapper ' + (disabled ? classPrefix + '__wrapper--disabled' : '')"
+            :class="classPrefix + '__wrapper ' + (!isImageType(file) && file.type !== 'video' ? classPrefix + '__wrapper--file' : '')"
             :style="gridItemStyle"
             :aria-role="ariaRole || getWrapperAriaRole(file)"
             :aria-label="ariaLabel || getWrapperAriaLabel(file)"
           >
+            <!-- 图片 -->
             <t-image
-              v-if="file.type !== 'video'"
+              v-if="isImageType(file)"
               :data-file="file"
               :data-index="index"
               :t-class="classPrefix + '__thumbnail'"
@@ -40,8 +150,9 @@
               :show-menu-by-longpress="(imageProps && imageProps.showMenuByLongpress) || false"
               @click="(e) => onPreview(e, { file, index })"
             />
+            <!-- 视频 -->
             <video
-              v-if="file.type === 'video'"
+              v-else-if="file.type === 'video'"
               :class="classPrefix + '__thumbnail'"
               :src="file.url"
               :poster="file.thumb"
@@ -49,10 +160,64 @@
               :autoplay="false"
               objectFit="contain"
               :data-file="file"
-              @click.stop="(e) => onFileClick(e, {file, index})"
+              :data-index="index"
+              @click.stop="(e) => onPreview(e, { file, index })"
             />
+            <!-- 非图片文件：上传成功显示文件图标 + 文件名 -->
+            <view
+              v-else-if="!file.status || file.status == 'done'"
+              :class="classPrefix + '__file-content'"
+              :data-file="file"
+              :data-index="index"
+              @click.stop="(e) => onFileClick(e, {file, index})"
+            >
+              <view :class="classPrefix + '__file-icon'">
+                <t-icon
+                  :t-class="classPrefix + '__file-type ' + getFileTypeIconColorClass(file, classPrefix)"
+                  :name="getFileTypeIcon(file)"
+                />
+              </view>
+              <view :class="classPrefix + '__file-name'">
+                {{ file.name || '' }}
+              </view>
+            </view>
+
+            <!-- 非图片文件：上传中/失败/重试 -->
+            <view
+              v-if="!isImageType(file) && file.type !== 'video' && file.status && file.status != 'done'"
+              :class="classPrefix + '__progress-mask ' + classPrefix + '__progress-mask--file'"
+              :data-index="index"
+              :data-file="file"
+              @click.stop="(e) => onFileClick(e, {file, index})"
+            >
+              <block v-if="file.status == 'loading'">
+                <t-icon
+                  :t-class="classPrefix + '__progress-loading'"
+                  name="loading"
+                  size="48rpx"
+                  aria-hidden
+                />
+                <view :class="classPrefix + '__progress-text'">
+                  {{ file.percent ? file.percent + '%' : globalConfig.progress.uploadingText }}
+                </view>
+              </block>
+              <t-icon
+                v-else
+                :name="file.status == 'reload' ? 'refresh' : 'close-circle'"
+                size="48rpx"
+                aria-hidden
+              />
+              <view
+                v-if="file.status == 'reload' || file.status == 'failed'"
+                :class="classPrefix + '__progress-text'"
+              >
+                {{ file.status == 'reload' ? globalConfig.progress.reloadText : globalConfig.progress.failText }}
+              </view>
+            </view>
+
+            <!-- 图片/视频：失败重试遮罩 -->
             <view
-              v-if="file.status && file.status != 'done'"
+              v-if="(isImageType(file) || file.type === 'video') && file.status && file.status != 'done'"
               :class="classPrefix + '__progress-mask'"
               :data-index="index"
               :data-file="file"
@@ -82,6 +247,13 @@
                 {{ file.status == 'reload' ? globalConfig.progress.reloadText : globalConfig.progress.failText }}
               </view>
             </view>
+
+            <!-- 禁用遮罩：图片/视频且非 loading/失败时显示 -->
+            <view
+              v-if="disabled && (isImageType(file) || file.type === 'video') && file.status !== 'loading' && file.status !== 'failed' && file.status !== 'reload'"
+              :class="classPrefix + '__disabled-mask'"
+            />
+
             <view
               v-if="tools.isBoolean(file.removeBtn) ? file.removeBtn : removeBtn"
               :class="classPrefix + '__close-btn hotspot-expanded'"
@@ -147,13 +319,13 @@
               custom-style="width: 100%"
             >
               <view
-                :class="classPrefix + '__wrapper ' + (disabled ? classPrefix + '__wrapper--disabled' : '')"
+                :class="classPrefix + '__wrapper ' + (!isImageType(file) && file.type !== 'video' ? classPrefix + '__wrapper--file' : '')"
                 :style="gridItemStyle + ';'"
                 :aria-role="ariaRole || getWrapperAriaRole(file)"
                 :aria-label="ariaLabel || getWrapperAriaLabel(file)"
               >
                 <t-image
-                  v-if="file.type !== 'video'"
+                  v-if="isImageType(file)"
                   :data-file="file"
                   :data-index="index"
                   :t-class="classPrefix + '__thumbnail'"
@@ -169,7 +341,7 @@
                   @click="(e) => onPreview(e, { file, index })"
                 />
                 <video
-                  v-if="file.type === 'video'"
+                  v-else-if="file.type === 'video'"
                   :class="classPrefix + '__thumbnail'"
                   :src="file.url"
                   :poster="file.thumb"
@@ -180,7 +352,57 @@
                   @click.stop="(e) => onFileClick(e, {file, index})"
                 />
                 <view
-                  v-if="file.status && file.status != 'done'"
+                  v-else-if="!file.status || file.status == 'done'"
+                  :class="classPrefix + '__file-content'"
+                  :data-file="file"
+                  :data-index="index"
+                  @click.stop="(e) => onFileClick(e, {file, index})"
+                >
+                  <view :class="classPrefix + '__file-icon'">
+                    <t-icon
+                      :t-class="classPrefix + '__file-type ' + getFileTypeIconColorClass(file, classPrefix)"
+                      :name="getFileTypeIcon(file)"
+                    />
+                  </view>
+                  <view :class="classPrefix + '__file-name'">
+                    {{ file.name || '' }}
+                  </view>
+                </view>
+
+                <view
+                  v-if="!isImageType(file) && file.type !== 'video' && file.status && file.status != 'done'"
+                  :class="classPrefix + '__progress-mask ' + classPrefix + '__progress-mask--file'"
+                  :data-index="index"
+                  :data-file="file"
+                  @click.stop="(e) => onFileClick(e, {file, index})"
+                >
+                  <block v-if="file.status == 'loading'">
+                    <t-icon
+                      :t-class="classPrefix + '__progress-loading'"
+                      name="loading"
+                      size="48rpx"
+                      aria-hidden
+                    />
+                    <view :class="classPrefix + '__progress-text'">
+                      {{ file.percent ? file.percent + '%' : globalConfig.progress.uploadingText }}
+                    </view>
+                  </block>
+                  <t-icon
+                    v-else
+                    :name="file.status == 'reload' ? 'refresh' : 'close-circle'"
+                    size="48rpx"
+                    aria-hidden
+                  />
+                  <view
+                    v-if="file.status == 'reload' || file.status == 'failed'"
+                    :class="classPrefix + '__progress-text'"
+                  >
+                    {{ file.status == 'reload' ? globalConfig.progress.reloadText : globalConfig.progress.failText }}
+                  </view>
+                </view>
+
+                <view
+                  v-if="(isImageType(file) || file.type === 'video') && file.status && file.status != 'done'"
                   :class="classPrefix + '__progress-mask'"
                   :data-index="index"
                   :data-file="file"
@@ -210,6 +432,12 @@
                     {{ file.status == 'reload' ? globalConfig.progress.reloadText : globalConfig.progress.failText }}
                   </view>
                 </view>
+
+                <view
+                  v-if="disabled && (isImageType(file) || file.type === 'video') && file.status !== 'loading' && file.status !== 'failed' && file.status !== 'reload'"
+                  :class="classPrefix + '__disabled-mask'"
+                />
+
                 <view
                   v-if="tools.isBoolean(file.removeBtn) ? file.removeBtn : removeBtn"
                   :class="classPrefix + '__close-btn hotspot-expanded'"
@@ -264,6 +492,7 @@
   </view>
 </template>
 <script>
+import TButton from '../button/button';
 import { prefix } from '../common/config';
 import { parseEventDynamicCode } from '../common/event/dynamic';
 import { uniComponent } from '../common/src/index';
@@ -290,6 +519,10 @@ import props from './props';
 import {
   getWrapperAriaRole,
   getWrapperAriaLabel,
+  isImageType,
+  getFileTypeIcon,
+  getFileTypeIconColorClass,
+  formatSize,
 } from './upload.computed.js';
 
 
@@ -319,6 +552,7 @@ export default {
     TGridItem,
     TIcon,
     TImage,
+    TButton,
   },
   ...uniComponent({
     name,
@@ -406,6 +640,10 @@ export default {
     methods: {
       getWrapperAriaRole,
       getWrapperAriaLabel,
+      isImageType,
+      getFileTypeIcon,
+      getFileTypeIconColorClass,
+      formatSize,
 
       ...makeMethods(),
 
@@ -441,8 +679,8 @@ export default {
    */
       getFileType(mediaType, tempFilePath, fileType) {
         if (fileType) return fileType; // 如果有返回fileType就直接用
-        if (mediaType.length === 1) {
-          // 在单选媒体类型的时候直接使用单选媒体类型
+        if (mediaType.length === 1 && mediaType[0] !== 'mix') {
+          // 在单选媒体类型（非 mix）的时候直接使用单选媒体类型
           return mediaType[0];
         }
         // 否则根据文件后缀进行判读

From d46444f32f49ef6f0e6ed2977994a96d8887b3d9 Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Sat, 13 Jun 2026 01:51:58 +0800
Subject: [PATCH 07/11] fix(search): add update:value emits

---
 packages/tdesign-uniapp/example/src/pages.json         |  9 ++++++++-
 .../example/src/pages/home/data/base.json              |  5 +++++
 packages/tdesign-uniapp/site/docs.config.js            |  9 +++++++++
 packages/tdesign-uniapp/site/docs/overview.en-US.md    | 10 +++++++++-
 packages/tdesign-uniapp/site/docs/overview.md          | 10 +++++++++-
 packages/uniapp-components/locale/ar_KW.ts             |  5 +++++
 packages/uniapp-components/locale/en_US.ts             |  5 +++++
 packages/uniapp-components/locale/it_IT.ts             |  5 +++++
 packages/uniapp-components/locale/ja_JP.ts             |  5 +++++
 packages/uniapp-components/locale/ko_KR.ts             |  5 +++++
 packages/uniapp-components/locale/ru_RU.ts             |  5 +++++
 packages/uniapp-components/locale/zh_CN.ts             |  5 +++++
 packages/uniapp-components/locale/zh_TW.ts             |  5 +++++
 packages/uniapp-components/search/search.vue           |  1 +
 14 files changed, 81 insertions(+), 3 deletions(-)

diff --git a/packages/tdesign-uniapp/example/src/pages.json b/packages/tdesign-uniapp/example/src/pages.json
index 52716ea72..6d58c839f 100644
--- a/packages/tdesign-uniapp/example/src/pages.json
+++ b/packages/tdesign-uniapp/example/src/pages.json
@@ -45,6 +45,9 @@
     {
       "path": "pages-more/col/col"
     },
+    {
+      "path": "pages-more/paragraph/paragraph"
+    },
     {
       "path": "pages-more/back-top/back-top"
     },
@@ -481,6 +484,10 @@
         "name": "layout",
         "pathName": "pages-more/col/col"
       },
+      {
+        "name": "typography",
+        "pathName": "pages-more/paragraph/paragraph"
+      },
       {
         "name": "back-top",
         "pathName": "pages-more/back-top/back-top"
@@ -801,4 +808,4 @@
       ]
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/tdesign-uniapp/example/src/pages/home/data/base.json b/packages/tdesign-uniapp/example/src/pages/home/data/base.json
index fdc1fd38b..e8eddc953 100644
--- a/packages/tdesign-uniapp/example/src/pages/home/data/base.json
+++ b/packages/tdesign-uniapp/example/src/pages/home/data/base.json
@@ -27,6 +27,11 @@
         "name": "Layout",
         "label": "布局",
         "path": "/pages-more/col/col"
+      },
+      {
+        "name": "Typography",
+        "label": "排版",
+        "path": "/pages-more/paragraph/paragraph"
       }
     ]
   },
diff --git a/packages/tdesign-uniapp/site/docs.config.js b/packages/tdesign-uniapp/site/docs.config.js
index 4a9cdac97..e7f9707f8 100644
--- a/packages/tdesign-uniapp/site/docs.config.js
+++ b/packages/tdesign-uniapp/site/docs.config.js
@@ -160,6 +160,15 @@ export const docs = [
         component: () => import('@/link/README.md'),
         componentEn: () => import('@/link/README.en-US.md'),
       },
+      {
+        title: 'Typography 排版',
+        titleEn: 'Typography',
+        name: 'typography',
+        meta: { docType: 'base' },
+        path: '/uniapp/components/typography',
+        component: () => import('@/paragraph/README.md'),
+        componentEn: () => import('@/paragraph/README.en-US.md'),
+      },
     ],
   },
   {
diff --git a/packages/tdesign-uniapp/site/docs/overview.en-US.md b/packages/tdesign-uniapp/site/docs/overview.en-US.md
index fd25ead9e..1e6896373 100644
--- a/packages/tdesign-uniapp/site/docs/overview.en-US.md
+++ b/packages/tdesign-uniapp/site/docs/overview.en-US.md
@@ -5,7 +5,7 @@ spline: explain
 ---
 
 
-<h3>Base<em class="tag">6</em></h3>
+<h3>Base<em class="tag">7</em></h3>
 <section class="image-group">
   <div class="image-wrapper">
     <a class="item" href="/uniapp/components/button-en">
@@ -54,6 +54,14 @@ spline: explain
       <p class="name">Link</p>
     </a>
   </div>
+
+  <div class="image-wrapper">
+    <a class="item" href="/uniapp/components/typography-en">
+      <img class="__light__" src="https://tdesign.gtimg.com/site/mobile/doc-typography.png" />
+      <img class="__dark__" src="https://tdesign.gtimg.com/site/mobile/doc-typography-dark.png" />
+      <p class="name">Typography 排版</p>
+    </a>
+  </div>
 </section>
 
 <h3>Navigation<em class="tag">8</em></h3>
diff --git a/packages/tdesign-uniapp/site/docs/overview.md b/packages/tdesign-uniapp/site/docs/overview.md
index 337641b52..802e81d06 100644
--- a/packages/tdesign-uniapp/site/docs/overview.md
+++ b/packages/tdesign-uniapp/site/docs/overview.md
@@ -4,7 +4,7 @@ description: 将根据业务实践持续新增组件类型，敬请留意组件
 spline: explain
 ---
 
-<h3>基础<em class="tag">6</em></h3>
+<h3>基础<em class="tag">7</em></h3>
 <section class="image-group">
   <div class="image-wrapper">
     <a class="item" href="/uniapp/components/button">
@@ -53,6 +53,14 @@ spline: explain
       <p class="name">Link 链接</p>
     </a>
   </div>
+
+  <div class="image-wrapper">
+    <a class="item" href="/uniapp/components/typography">
+      <img class="__light__" src="https://tdesign.gtimg.com/site/mobile/doc-typography.png" />
+      <img class="__dark__" src="https://tdesign.gtimg.com/site/mobile/doc-typography-dark.png" />
+      <p class="name">Typography 排版</p>
+    </a>
+  </div>
 </section>
 
 <h3>导航<em class="tag">8</em></h3>
diff --git a/packages/uniapp-components/locale/ar_KW.ts b/packages/uniapp-components/locale/ar_KW.ts
index 8e6275893..d5397a4c1 100644
--- a/packages/uniapp-components/locale/ar_KW.ts
+++ b/packages/uniapp-components/locale/ar_KW.ts
@@ -121,6 +121,11 @@ export default {
     finish: 'أنهي',
     back: 'العودة',
   },
+  typography: {
+    expandText: 'توسيع',
+    collapseText: 'طي',
+    copiedText: 'النسخ اكتمل',
+  },
   qrcode: {
     expiredText: 'منتهي الصلاحية',
     refreshText: 'ينعش',
diff --git a/packages/uniapp-components/locale/en_US.ts b/packages/uniapp-components/locale/en_US.ts
index 59896565c..0d28d2487 100644
--- a/packages/uniapp-components/locale/en_US.ts
+++ b/packages/uniapp-components/locale/en_US.ts
@@ -110,6 +110,11 @@ export default {
     finish: 'Finish',
     back: 'Back',
   },
+  typography: {
+    expandText: 'more',
+    collapseText: 'collapse',
+    copiedText: 'copied',
+  },
   qrcode: {
     expiredText: 'expired',
     refreshText: 'refresh',
diff --git a/packages/uniapp-components/locale/it_IT.ts b/packages/uniapp-components/locale/it_IT.ts
index f0e7a39f3..76cc7234a 100644
--- a/packages/uniapp-components/locale/it_IT.ts
+++ b/packages/uniapp-components/locale/it_IT.ts
@@ -109,6 +109,11 @@ export default {
     finish: 'Finisci',
     back: 'Indietro',
   },
+  typography: {
+    expandText: 'Espandere',
+    collapseText: 'ripiegare',
+    copiedText: 'Copia completata',
+  },
   qrcode: {
     expiredText: 'scaduto',
     refreshText: 'aggiornare',
diff --git a/packages/uniapp-components/locale/ja_JP.ts b/packages/uniapp-components/locale/ja_JP.ts
index b1087a283..765b6d313 100644
--- a/packages/uniapp-components/locale/ja_JP.ts
+++ b/packages/uniapp-components/locale/ja_JP.ts
@@ -96,6 +96,11 @@ export default {
     finish: '完了',
     back: '戻る',
   },
+  typography: {
+    expandText: 'もっと拡大する',
+    collapseText: '畳む',
+    copiedText: 'コピー成功',
+  },
   qrcode: {
     expiredText: '期限切れ',
     refreshText: 'リフレッシュ',
diff --git a/packages/uniapp-components/locale/ko_KR.ts b/packages/uniapp-components/locale/ko_KR.ts
index 5776eba8f..c0996b772 100644
--- a/packages/uniapp-components/locale/ko_KR.ts
+++ b/packages/uniapp-components/locale/ko_KR.ts
@@ -96,6 +96,11 @@ export default {
     finish: '완료',
     back: '뒤로',
   },
+  typography: {
+    expandText: '더보기',
+    collapseText: '접기',
+    copiedText: '복사 성공',
+  },
   qrcode: {
     expiredText: '만료됨',
     refreshText: '새로 고치다',
diff --git a/packages/uniapp-components/locale/ru_RU.ts b/packages/uniapp-components/locale/ru_RU.ts
index c0345dddf..e8211cb32 100644
--- a/packages/uniapp-components/locale/ru_RU.ts
+++ b/packages/uniapp-components/locale/ru_RU.ts
@@ -121,6 +121,11 @@ export default {
     finish: 'Готово',
     back: 'Назад',
   },
+  typography: {
+    expandText: 'Развернуть',
+    collapseText: 'Свернуть',
+    copiedText: 'Скопировано',
+  },
   qrcode: {
     expiredText: 'истекший',
     refreshText: 'обновить',
diff --git a/packages/uniapp-components/locale/zh_CN.ts b/packages/uniapp-components/locale/zh_CN.ts
index 67a4bece1..6fa54e98f 100644
--- a/packages/uniapp-components/locale/zh_CN.ts
+++ b/packages/uniapp-components/locale/zh_CN.ts
@@ -97,6 +97,11 @@ export default {
     finish: '完成',
     back: '返回',
   },
+  typography: {
+    expandText: '展开',
+    collapseText: '收起',
+    copiedText: '复制成功',
+  },
   qrcode: {
     expiredText: '二维码过期',
     refreshText: '点击刷新',
diff --git a/packages/uniapp-components/locale/zh_TW.ts b/packages/uniapp-components/locale/zh_TW.ts
index 8dc4095a5..d080a73ea 100644
--- a/packages/uniapp-components/locale/zh_TW.ts
+++ b/packages/uniapp-components/locale/zh_TW.ts
@@ -96,6 +96,11 @@ export default {
     finish: '完成',
     back: '返回',
   },
+  typography: {
+    expandText: '展開',
+    collapseText: '收起',
+    copiedText: '復製成功',
+  },
   qrcode: {
     expiredText: '二維碼過期',
     refreshText: '點擊刷新',
diff --git a/packages/uniapp-components/search/search.vue b/packages/uniapp-components/search/search.vue
index e280a7696..309c84076 100644
--- a/packages/uniapp-components/search/search.vue
+++ b/packages/uniapp-components/search/search.vue
@@ -140,6 +140,7 @@ export default {
       ...props,
     },
     emits: [
+      'update:value',
     ],
     data() {
       return {

From a59b32a2123a9c58c54c9a2468e66d7cc853d7f6 Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Sat, 13 Jun 2026 01:58:55 +0800
Subject: [PATCH 08/11] feat: add text/title/paragraph components

---
 .../paragraph/README.en-US.md                 |  99 ++++++++++
 .../uniapp-components/paragraph/README.md     |  99 ++++++++++
 .../paragraph/_example/base/index.vue         |  20 ++
 .../paragraph/_example/combination/index.vue  |  83 +++++++++
 .../paragraph/_example/copyable/index.vue     |  46 +++++
 .../paragraph/_example/ellipsis/index.vue     |  61 ++++++
 .../paragraph/_example/paragraph.less         |  27 +++
 .../paragraph/_example/paragraph.vue          |  55 ++++++
 .../paragraph/_example/theme/index.vue        |  37 ++++
 .../uniapp-components/paragraph/computed.js   |  42 +++++
 .../paragraph/paragraph.less                  | 168 +++++++++++++++++
 .../uniapp-components/paragraph/paragraph.vue | 105 +++++++++++
 packages/uniapp-components/paragraph/props.ts |  18 ++
 packages/uniapp-components/paragraph/type.ts  |  19 ++
 packages/uniapp-components/text/props.ts      |  50 +++++
 packages/uniapp-components/text/text.less     |   1 +
 packages/uniapp-components/text/text.vue      | 175 ++++++++++++++++++
 packages/uniapp-components/text/type.ts       |  78 ++++++++
 packages/uniapp-components/title/props.ts     |  27 +++
 packages/uniapp-components/title/title.less   |   1 +
 packages/uniapp-components/title/title.vue    |  94 ++++++++++
 packages/uniapp-components/title/type.ts      |  24 +++
 22 files changed, 1329 insertions(+)
 create mode 100644 packages/uniapp-components/paragraph/README.en-US.md
 create mode 100644 packages/uniapp-components/paragraph/README.md
 create mode 100644 packages/uniapp-components/paragraph/_example/base/index.vue
 create mode 100644 packages/uniapp-components/paragraph/_example/combination/index.vue
 create mode 100644 packages/uniapp-components/paragraph/_example/copyable/index.vue
 create mode 100644 packages/uniapp-components/paragraph/_example/ellipsis/index.vue
 create mode 100644 packages/uniapp-components/paragraph/_example/paragraph.less
 create mode 100644 packages/uniapp-components/paragraph/_example/paragraph.vue
 create mode 100644 packages/uniapp-components/paragraph/_example/theme/index.vue
 create mode 100644 packages/uniapp-components/paragraph/computed.js
 create mode 100644 packages/uniapp-components/paragraph/paragraph.less
 create mode 100644 packages/uniapp-components/paragraph/paragraph.vue
 create mode 100644 packages/uniapp-components/paragraph/props.ts
 create mode 100644 packages/uniapp-components/paragraph/type.ts
 create mode 100644 packages/uniapp-components/text/props.ts
 create mode 100644 packages/uniapp-components/text/text.less
 create mode 100644 packages/uniapp-components/text/text.vue
 create mode 100644 packages/uniapp-components/text/type.ts
 create mode 100644 packages/uniapp-components/title/props.ts
 create mode 100644 packages/uniapp-components/title/title.less
 create mode 100644 packages/uniapp-components/title/title.vue
 create mode 100644 packages/uniapp-components/title/type.ts

diff --git a/packages/uniapp-components/paragraph/README.en-US.md b/packages/uniapp-components/paragraph/README.en-US.md
new file mode 100644
index 000000000..23f02402b
--- /dev/null
+++ b/packages/uniapp-components/paragraph/README.en-US.md
@@ -0,0 +1,99 @@
+---
+title: Typography
+description: Typography is used for the basic layout and styling of text, allowing users to quickly format text content within a page. It works with other components to maintain a consistent style across themes such as dark and light modes.
+spline: base
+isComponent: true
+---
+
+
+## Import
+
+Recommend using easycom mode. After configuration, you can directly use `<t-text />`, `<t-paragraph />` and `<t-title />` in templates without manual import. See [Getting Started](../getting-started) for details.
+
+For manual import:
+
+```js
+import TText from '@tdesign/uniapp/text/text.vue';
+import TParagraph from '@tdesign/uniapp/paragraph/paragraph.vue';
+import TTitle from '@tdesign/uniapp/title/title.vue';
+```
+
+## Demos
+
+### Basic Text
+
+{{ base }}
+
+### Combined Usage
+
+{{ combination }}
+
+### Theme
+
+{{ theme }}
+
+### Copyable
+
+{{ copyable }}
+
+### Ellipsis
+
+{{ ellipsis }}
+
+
+## API
+
+### Paragraph Props
+
+name | type | default | description | required
+-- | -- | -- | -- | --
+custom-style | Object | - | CSS(Cascading Style Sheets) | N
+content | String | - | content of paragraph | N
+ellipsis | Boolean / Object | false | add ellipsis style。Typescript: `boolean \| TypographyEllipsis `，[Text API Documents](./text?tab=api)。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/paragraph/type.ts) | N
+
+### Paragraph Slots
+
+name | Description
+-- | --
+content | content of paragraph
+
+
+### Text Props
+
+name | type | default | description | required
+-- | -- | -- | -- | --
+custom-style | Object | - | CSS(Cascading Style Sheets) | N
+code | Boolean | false | add code style | N
+content | String | - | content of text | N
+copyable | Boolean / Object | false | Typescript: `boolean \| TypographyCopyable ` `interface TypographyCopyable { text?: string, suffix?: boolean; }`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/text/type.ts) | N
+delete | Boolean | false | add delete line style | N
+disabled | Boolean | false | add disabled style | N
+ellipsis | Boolean / Object | false | add ellipsis style。Typescript: `boolean \| TypographyEllipsis ` `interface TypographyEllipsis { collapsible?: boolean; expandable?: boolean; row?: number;suffix?: boolean;}`。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/text/type.ts) | N
+italic | Boolean | false | add italic style | N
+keyboard | Boolean | false | add keyboard style | N
+mark | String / Boolean | false | add mark style | N
+strong | Boolean | false | add bold style | N
+theme | String | - | theme of text。options: primary/secondary/success/warning/error | N
+underline | Boolean | false | add underline style | N
+
+### Text Slots
+
+name | Description
+-- | --
+content | content of text
+
+
+### Title Props
+
+name | type | default | description | required
+-- | -- | -- | -- | --
+custom-style | Object | - | CSS(Cascading Style Sheets) | N
+content | String | - | content of title | N
+ellipsis | Boolean / Object | false | add ellipsis style。Typescript: `boolean \| TypographyEllipsis `，[Text API Documents](./text?tab=api)。[see more ts definition](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/title/type.ts) | N
+level | String | h1 | level of title。options: h1/h2/h3/h4/h5/h6 | N
+
+### Title Slots
+
+name | Description
+-- | --
+content | content of title
diff --git a/packages/uniapp-components/paragraph/README.md b/packages/uniapp-components/paragraph/README.md
new file mode 100644
index 000000000..59a93dde3
--- /dev/null
+++ b/packages/uniapp-components/paragraph/README.md
@@ -0,0 +1,99 @@
+---
+title: Typography 排版
+description: 排版用于文本基础编排和样式，使用排版组件，可以快速完成页面中的文本内容制作，同时配合其他组件完成深色与浅色模式切换等风格统一的需求。
+spline: base
+isComponent: true
+---
+
+
+## 引入
+
+推荐使用 easycom 模式引入组件，配置后无需手动 import 即可直接在模板中使用 `<t-text />`、`<t-paragraph />`、`<t-title />`。详细配置请参考 [快速开始](../getting-started)。
+
+如需手动引入：
+
+```js
+import TText from '@tdesign/uniapp/text/text.vue';
+import TParagraph from '@tdesign/uniapp/paragraph/paragraph.vue';
+import TTitle from '@tdesign/uniapp/title/title.vue';
+```
+
+## 代码演示
+
+### 基础文本
+
+{{ base }}
+
+### 组合用法
+
+{{ combination }}
+
+### 主题样式
+
+{{ theme }}
+
+### 可复制
+
+{{ copyable }}
+
+### 文本省略
+
+{{ ellipsis }}
+
+
+## API
+
+### Paragraph Props
+
+名称 | 类型 | 默认值 | 描述 | 必传
+-- | -- | -- | -- | --
+custom-style | Object | - | 自定义样式 | N
+content | String | - | 段落内容 | N
+ellipsis | Boolean / Object | false | 是否省略展示，可通过配置参数自定义省略操作的具体功能和样式。TS 类型：`boolean \| TypographyEllipsis `，[Text API Documents](./text?tab=api)。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/paragraph/type.ts) | N
+
+### Paragraph Slots
+
+名称 | 描述
+-- | --
+content | 自定义 `content` 显示内容
+
+
+### Text Props
+
+名称 | 类型 | 默认值 | 描述 | 必传
+-- | -- | -- | -- | --
+custom-style | Object | - | 自定义样式 | N
+code | Boolean | false | 是否添加代码样式 | N
+content | String | - | 文本内容 | N
+copyable | Boolean / Object | false | 是否可复制。TS 类型：`boolean \| TypographyCopyable ` `interface TypographyCopyable { text?: string, suffix?: boolean; }`。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/text/type.ts) | N
+delete | Boolean | false | 是否添加删除线样式 | N
+disabled | Boolean | false | 是否添加不可用样式 | N
+ellipsis | Boolean / Object | false | 是否省略展示，可通过配置参数自定义省略操作的具体功能和样式。TS 类型：`boolean \| TypographyEllipsis ` `interface TypographyEllipsis { collapsible?: boolean; expandable?: boolean; row?: number;suffix?: boolean;}`。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/text/type.ts) | N
+italic | Boolean | false | 文本是否为斜体 | N
+keyboard | Boolean | false | 是否添加键盘样式 | N
+mark | String / Boolean | false | 是否添加标记样式，默认为黄色，可通过配置颜色修改标记样式，如#0052D9 | N
+strong | Boolean | false | 文本是否加粗 | N
+theme | String | - | 主题。可选项：primary/secondary/success/warning/error | N
+underline | Boolean | false | 是否添加下划线样式 | N
+
+### Text Slots
+
+名称 | 描述
+-- | --
+content | 自定义 `content` 显示内容
+
+
+### Title Props
+
+名称 | 类型 | 默认值 | 描述 | 必传
+-- | -- | -- | -- | --
+custom-style | Object | - | 自定义样式 | N
+content | String | - | 段落内容 | N
+ellipsis | Boolean / Object | false | 是否省略展示，可通过配置参数自定义省略操作的具体功能和样式。TS 类型：`boolean \| TypographyEllipsis `，[Text API Documents](./text?tab=api)。[详细类型定义](https://github.com/tencent/tdesign-miniprogram/blob/develop/packages/uniapp-components/title/type.ts) | N
+level | String | h1 | 标题等级。可选项：h1/h2/h3/h4/h5/h6 | N
+
+### Title Slots
+
+名称 | 描述
+-- | --
+content | 自定义 `content` 显示内容
diff --git a/packages/uniapp-components/paragraph/_example/base/index.vue b/packages/uniapp-components/paragraph/_example/base/index.vue
new file mode 100644
index 000000000..da28e6d3a
--- /dev/null
+++ b/packages/uniapp-components/paragraph/_example/base/index.vue
@@ -0,0 +1,20 @@
+<template>
+  <view>
+    <view class="typography-example">
+      <t-text content="TDesign 是腾讯各业务团队在服务业务过程中沉淀的一套企业级设计体系。" />
+    </view>
+  </view>
+</template>
+
+<script>
+import TText from '@tdesign/uniapp/text/text.vue';
+export default {
+  components: {
+    TText,
+  },
+};
+</script>
+
+<style lang="less">
+@import '../paragraph.less';
+</style>
diff --git a/packages/uniapp-components/paragraph/_example/combination/index.vue b/packages/uniapp-components/paragraph/_example/combination/index.vue
new file mode 100644
index 000000000..66e55b7ef
--- /dev/null
+++ b/packages/uniapp-components/paragraph/_example/combination/index.vue
@@ -0,0 +1,83 @@
+<template>
+  <view>
+    <view class="typography-example typography-example--inline">
+      <t-title content="What is TDesign" />
+      <t-text
+        mark
+        content="TDesign is an enterprise-level design system accumulated by Tencent's various business teams."
+      />
+      <t-paragraph>
+        <t-text strong>
+          TDesign features a unified design values, consistent design language, and visual style, helping users form
+          continuous and coherent perceptions of the experience.
+        </t-text>
+        Based on this, TDesign offers out-typography-of-the-box UI component libraries, design guidelines, and design
+        assets, elegantly and efficiently freeing design and development from repetitive tasks. Simultaneously, it
+        facilitates easy extension on top of TDesign, enabling a better alignment with business requirements.
+      </t-paragraph>
+
+      <t-title>
+        Comprehensive
+      </t-title>
+      <t-paragraph>
+        TDesign Support
+        <t-text code>
+          Vue 2
+        </t-text>,
+        <t-text code>
+          Vue 3
+        </t-text>,
+        <t-text code>
+          React
+        </t-text>
+        components for Desktop Application and
+        <t-text code>
+          Vue 3
+        </t-text>,
+        <t-text code>
+          Wechat MiniProgram
+        </t-text>
+        components for Mobile Application.
+      </t-paragraph>
+      <t-paragraph>
+        <view>• Features</view>
+        <view>• Comprehensive</view>
+        <view style="padding-left: 24rpx">
+          • Consistency
+        </view>
+        <view style="padding-left: 24rpx">
+          • Usability
+        </view>
+        <view>• Join TDesign</view>
+      </t-paragraph>
+      <t-paragraph>
+        <view>1. Features</view>
+        <view>2. Comprehensive</view>
+        <view style="padding-left: 24rpx">
+          1. Consistency
+        </view>
+        <view style="padding-left: 24rpx">
+          2. Usability
+        </view>
+        <view>3. Join TDesign</view>
+      </t-paragraph>
+    </view>
+  </view>
+</template>
+
+<script>
+import TParagraph from '@tdesign/uniapp/paragraph/paragraph.vue';
+import TText from '@tdesign/uniapp/text/text.vue';
+import TTitle from '@tdesign/uniapp/title/title.vue';
+export default {
+  components: {
+    TText,
+    TTitle,
+    TParagraph,
+  },
+};
+</script>
+
+<style lang="less">
+@import '../paragraph.less';
+</style>
diff --git a/packages/uniapp-components/paragraph/_example/copyable/index.vue b/packages/uniapp-components/paragraph/_example/copyable/index.vue
new file mode 100644
index 000000000..de4776794
--- /dev/null
+++ b/packages/uniapp-components/paragraph/_example/copyable/index.vue
@@ -0,0 +1,46 @@
+<template>
+  <view>
+    <view class="typography-example typography-example--border">
+      <t-text
+        copyable
+        content="这是一段可复制的文本"
+      />
+    </view>
+
+    <view class="typography-example">
+      <t-text
+        :copyable="copyableCustomSuffix"
+        content="这是一段带自定义图标的可复制的文本"
+      >
+        <template #suffix>
+          <t-icon
+            name="smile"
+            color="#0052D9"
+          />
+        </template>
+      </t-text>
+    </view>
+  </view>
+</template>
+
+<script>
+import TIcon from '@tdesign/uniapp/icon/icon.vue';
+import TText from '@tdesign/uniapp/text/text.vue';
+export default {
+  components: {
+    TText,
+    TIcon,
+  },
+  data() {
+    return {
+      copyableCustomSuffix: {
+        suffix: true,
+      },
+    };
+  },
+};
+</script>
+
+<style lang="less">
+@import '../paragraph.less';
+</style>
diff --git a/packages/uniapp-components/paragraph/_example/ellipsis/index.vue b/packages/uniapp-components/paragraph/_example/ellipsis/index.vue
new file mode 100644
index 000000000..9f6a0aa93
--- /dev/null
+++ b/packages/uniapp-components/paragraph/_example/ellipsis/index.vue
@@ -0,0 +1,61 @@
+<template>
+  <view>
+    <view class="typography-example typography-example--border">
+      <t-paragraph
+        ellipsis
+        :content="content"
+      />
+    </view>
+
+    <view class="typography-example typography-example--border">
+      <t-paragraph
+        :ellipsis="ellipsisExpandable"
+        :content="content"
+      />
+    </view>
+
+    <view class="typography-example">
+      <t-paragraph
+        :ellipsis="ellipsisCustomSuffix"
+        :content="content"
+      >
+        <template #suffix>
+          <t-icon
+            name="chevron-down"
+          />
+        </template>
+      </t-paragraph>
+    </view>
+  </view>
+</template>
+
+<script>
+import TIcon from '@tdesign/uniapp/icon/icon.vue';
+import TParagraph from '@tdesign/uniapp/paragraph/paragraph.vue';
+export default {
+  components: {
+    TParagraph,
+    TIcon,
+  },
+  data() {
+    return {
+      content: 'TDesign 秉承开放的设计理念从创立之初就采用开源协作的方式进行设计和开发。协作方案讨论、组件设计以及 API 设计，包括源代码在内均在公司内部完全开放，赢得了内部开发者和设计师的广泛关注。TDesign 遵循平等、开放、严格的原则，不论参与者的角色如何。',
+      ellipsisExpandable: {
+        row: 2,
+        expandable: true,
+        collapsible: true,
+      },
+      ellipsisCustomSuffix: {
+        row: 1,
+        expandable: true,
+        collapsible: false,
+        suffix: true,
+      },
+    };
+  },
+};
+</script>
+
+<style lang="less">
+@import '../paragraph.less';
+</style>
diff --git a/packages/uniapp-components/paragraph/_example/paragraph.less b/packages/uniapp-components/paragraph/_example/paragraph.less
new file mode 100644
index 000000000..1af7bc8bf
--- /dev/null
+++ b/packages/uniapp-components/paragraph/_example/paragraph.less
@@ -0,0 +1,27 @@
+.typography-example {
+  display: flex;
+  padding: 0 32rpx;
+  background-color: var(--bg-color-demo, #fff);
+
+  &--inline {
+    display: inline-block;
+  }
+
+  &--theme {
+    gap: 24px;
+  }
+
+  &--border {
+    position: relative;
+
+    &::after {
+      content: '';
+      position: absolute;
+      bottom: 0;
+      left: 16px;
+      right: 16px;
+      border-bottom: 1px solid var(--td-stroke-color, #e7e7e7);
+      transform: scaleY(0.5);
+    }
+  }
+}
diff --git a/packages/uniapp-components/paragraph/_example/paragraph.vue b/packages/uniapp-components/paragraph/_example/paragraph.vue
new file mode 100644
index 000000000..be7a1959a
--- /dev/null
+++ b/packages/uniapp-components/paragraph/_example/paragraph.vue
@@ -0,0 +1,55 @@
+<template>
+  <view>
+    <t-demo-navbar title="Typography" />
+    <view class="demo">
+      <t-demo-header
+        title="Typography 排版"
+        desc="排版用于文本基础编排和样式，使用排版组件，可以快速完成页面中的文本内容制作，同时配合其他组件完成深色与浅色模式切换等风格统一的需求。"
+        notice="渲染框架支持情况：WebView"
+      />
+      <t-demo
+        title="01 组件类型"
+        desc="基础文本"
+      >
+        <base-demo />
+      </t-demo>
+      <t-demo desc="组合用法">
+        <combination-demo />
+      </t-demo>
+      <t-demo desc="主题样式">
+        <theme-demo />
+      </t-demo>
+      <t-demo desc="可复制">
+        <copyable-demo />
+      </t-demo>
+      <t-demo desc="文本省略">
+        <ellipsis-demo />
+      </t-demo>
+    </view>
+  </view>
+</template>
+
+<script>
+import BaseDemo from './base/index.vue';
+import CombinationDemo from './combination/index.vue';
+import CopyableDemo from './copyable/index.vue';
+import EllipsisDemo from './ellipsis/index.vue';
+import ThemeDemo from './theme/index.vue';
+export default {
+  components: {
+    BaseDemo,
+    CombinationDemo,
+    ThemeDemo,
+    CopyableDemo,
+    EllipsisDemo,
+  },
+  data() {
+    return {};
+  },
+  methods: {},
+};
+</script>
+
+<style lang="less">
+@import './paragraph.less';
+</style>
diff --git a/packages/uniapp-components/paragraph/_example/theme/index.vue b/packages/uniapp-components/paragraph/_example/theme/index.vue
new file mode 100644
index 000000000..81a3ea005
--- /dev/null
+++ b/packages/uniapp-components/paragraph/_example/theme/index.vue
@@ -0,0 +1,37 @@
+<template>
+  <view class="typography-example typography-example--theme">
+    <t-text
+      theme="primary"
+      content="主色"
+    />
+    <t-text
+      theme="success"
+      content="成功"
+    />
+    <t-text
+      theme="warning"
+      content="警告"
+    />
+    <t-text
+      theme="error"
+      content="错误"
+    />
+    <t-text
+      mark
+      content="标记"
+    />
+  </view>
+</template>
+
+<script>
+import TText from '@tdesign/uniapp/text/text.vue';
+export default {
+  components: {
+    TText,
+  },
+};
+</script>
+
+<style lang="less">
+@import '../paragraph.less';
+</style>
diff --git a/packages/uniapp-components/paragraph/computed.js b/packages/uniapp-components/paragraph/computed.js
new file mode 100644
index 000000000..19415b33e
--- /dev/null
+++ b/packages/uniapp-components/paragraph/computed.js
@@ -0,0 +1,42 @@
+/* typography 公共计算逻辑 */
+
+/* 计算省略内容的内联样式 */
+export function ellipsisStyle(ellipsis, isExpanded) {
+  if (!ellipsis || isExpanded) return '';
+  const row = typeof ellipsis === 'object' && ellipsis.row ? ellipsis.row : 1;
+  return (
+    `overflow:hidden;text-overflow:ellipsis;white-space:normal;display:-webkit-box;-webkit-line-clamp:${
+      row
+    };-webkit-box-orient:vertical;`
+  );
+}
+
+/* 计算外层容器 class */
+export function wrapperClass(classPrefix, ellipsis) {
+  if (ellipsis) {
+    return `${classPrefix}__ellipsis-wrapper`;
+  }
+  return '';
+}
+
+/* 根据装饰属性拼接内层 class */
+export function decorClass(classPrefix, strong, underline, del, code, mark, keyboard, italic) {
+  const list = [];
+  if (strong) list.push(`${classPrefix}--strong`);
+  if (underline) list.push(`${classPrefix}--underline`);
+  if (del) list.push(`${classPrefix}--delete`);
+  if (code) list.push(`${classPrefix}--code`);
+  if (mark) list.push(`${classPrefix}--mark`);
+  if (keyboard) list.push(`${classPrefix}--keyboard`);
+  if (italic) list.push(`${classPrefix}--italic`);
+  return list.join(' ');
+}
+
+/* mark 自定义颜色 */
+export function markStyle(mark) {
+  if (!mark || mark === true || mark === 'true') return '';
+  if (mark && mark !== 'false' && mark !== false) {
+    return `background-color:${mark};`;
+  }
+  return '';
+}
diff --git a/packages/uniapp-components/paragraph/paragraph.less b/packages/uniapp-components/paragraph/paragraph.less
new file mode 100644
index 000000000..244f2cd93
--- /dev/null
+++ b/packages/uniapp-components/paragraph/paragraph.less
@@ -0,0 +1,168 @@
+@import '../common/style/base.less';
+
+@typography-text-primary-color: @text-color-primary;
+@typography-text-secondary-color: @text-color-secondary;
+@typography-text-disabled-color: @text-color-disabled;
+@typography-text-success-color: @success-color;
+@typography-text-error-color: @error-color;
+@typography-text-warning-color: @warning-color;
+@typography-text-mark-color: #fcdf47;
+@typography-icon-color: @brand-color;
+
+@typography-text-strong: 600;
+
+@typography-text-font: @font-body-medium;
+@typography-code-font: @font-body-small;
+@typography-h1-font: @font-headline-large;
+@typography-h2-font: @font-headline-medium;
+@typography-h3-font: @font-headline-small;
+@typography-h4-font: @font-title-large;
+@typography-h5-font: @font-title-medium;
+@typography-h6-font: @font-title-small;
+
+@typography-code-family:
+  Source Code Pro,
+  -apple-system,
+  BlinkMacSystemFont,
+  Segoe UI,
+  Roboto,
+  Hiragino Sans GB,
+  Microsoft YaHei UI,
+  Microsoft YaHei;
+
+// ==================== 主样式 ====================
+.@{prefix}-typography {
+  color: @typography-text-primary-color;
+  font: @font-body-medium;
+  margin: @spacer-2 0;
+
+  &--h1 {
+    font: @typography-h1-font;
+    margin-top: @spacer-4;
+    margin-bottom: @spacer-3;
+  }
+
+  &--h2 {
+    font: @typography-h2-font;
+    margin-top: @spacer-4;
+    margin-bottom: @spacer-3;
+  }
+
+  &--h3 {
+    font: @typography-h3-font;
+    margin-top: @spacer-4;
+    margin-bottom: @spacer-2;
+  }
+
+  &--h4 {
+    font: @typography-h4-font;
+    margin-top: @spacer-3;
+    margin-bottom: @spacer-2;
+  }
+
+  &--h5 {
+    font: @typography-h5-font;
+    margin-top: @spacer-3;
+    margin-bottom: @spacer-2;
+  }
+
+  &--h6 {
+    font: @typography-h6-font;
+  }
+
+  &--strong {
+    font-weight: @typography-text-strong;
+  }
+
+  &--mark {
+    background-color: @typography-text-mark-color;
+  }
+
+  &--code {
+    border-radius: @radius-default;
+    border: 1px solid @component-border;
+    margin: 0 @spacer;
+    background-color: @bg-color-secondarycontainer;
+    padding: 0 @spacer;
+    transition: background-color 0.2s;
+    white-space: nowrap;
+    font: @typography-code-font;
+    font-family: @typography-code-family;
+    display: inline-block;
+  }
+
+  &--keyboard {
+    border-radius: @radius-default;
+    border: 1px solid @component-border;
+    margin: 0 calc(@spacer / 2);
+    background-color: @bg-color-secondarycontainer;
+    padding: 0 @spacer;
+    box-shadow: 0 1px 0 0 @component-border;
+    font: @typography-code-font;
+    font-family: @typography-code-family;
+    display: inline-block;
+  }
+
+  &--disabled {
+    color: @typography-text-disabled-color;
+    cursor: not-allowed;
+  }
+
+  &--success {
+    color: @typography-text-success-color;
+  }
+
+  &--warning {
+    color: @typography-text-warning-color;
+  }
+
+  &--error {
+    color: @typography-text-error-color;
+  }
+
+  &--secondary {
+    color: @typography-text-secondary-color;
+  }
+
+  &-ellipsis-symbol {
+    color: @typography-icon-color;
+    cursor: pointer;
+    text-decoration: none;
+    white-space: nowrap;
+    flex: 1;
+  }
+
+  &--italic {
+    font-style: italic;
+  }
+
+  &--underline {
+    text-decoration: underline;
+  }
+
+  &--delete {
+    text-decoration: line-through;
+  }
+
+  &__ellipsis-wrapper {
+    display: flex;
+    align-items: flex-end;
+  }
+
+  &__ellipsis-content {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: normal;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+  }
+
+  &__copy {
+    display: inline-flex;
+    align-items: center;
+    margin-left: 16rpx;
+    flex-shrink: 0;
+    color: @typography-icon-color;
+    cursor: pointer;
+  }
+}
diff --git a/packages/uniapp-components/paragraph/paragraph.vue b/packages/uniapp-components/paragraph/paragraph.vue
new file mode 100644
index 000000000..cc8149ac7
--- /dev/null
+++ b/packages/uniapp-components/paragraph/paragraph.vue
@@ -0,0 +1,105 @@
+<template>
+  <view
+    :class="classPrefix + ' ' + tClass + ' ' + (ellipsis ? classPrefix + '__ellipsis-wrapper' : '')"
+    :style="'' + tools._style([customStyle])"
+  >
+    <view
+      v-if="ellipsis"
+      :class="classPrefix + '__ellipsis-content'"
+      :style="'' + ellipsisStyle(ellipsis, isExpanded)"
+    >
+      <text v-if="content">
+        {{ content }}
+      </text>
+      <slot v-else />
+    </view>
+    <block v-else>
+      <text v-if="content">
+        {{ content }}
+      </text>
+      <slot v-else />
+    </block>
+
+    <!-- 展开/收起按钮 -->
+    <block v-if="ellipsis && !isExpanded && ellipsis.expandable && ellipsis.suffix">
+      <view
+        :class="classPrefix + '-ellipsis-symbol'"
+        @click="onExpand"
+      >
+        <slot name="suffix" />
+      </view>
+    </block>
+    <block v-else>
+      <view
+        v-if="ellipsis && !isExpanded && ellipsis.expandable"
+        :class="classPrefix + '-ellipsis-symbol'"
+        @click="onExpand"
+      >
+        {{ globalConfig.expandText }}
+      </view>
+      <view
+        v-else-if="ellipsis && isExpanded && ellipsis.expandable && ellipsis.collapsible"
+        :class="classPrefix + '-ellipsis-symbol'"
+        @click="onCollapse"
+      >
+        {{ globalConfig.collapseText }}
+      </view>
+    </block>
+  </view>
+</template>
+<script>
+import { prefix } from '../common/config';
+import { uniComponent } from '../common/src/index';
+
+import tools from '../common/utils.wxs';
+import usingConfig from '../mixins/using-config';
+
+import { ellipsisStyle } from './computed.js';
+import props from './props';
+
+const componentName = 'typography';
+const name = `${prefix}-${componentName}`;
+
+export default {
+  ...uniComponent({
+    name,
+    mixins: [usingConfig({ componentName })],
+    options: {
+      styleIsolation: 'shared',
+    },
+    externalClasses: [
+      `${prefix}-class`,
+    ],
+    props: {
+      ...props,
+    },
+    emits: [
+      'expand',
+    ],
+    data() {
+      return {
+        prefix,
+        classPrefix: name,
+        tools,
+        isExpanded: false,
+      };
+    },
+    methods: {
+      ellipsisStyle,
+      onExpand() {
+        this.isExpanded = true;
+        if (typeof this.ellipsis === 'object') {
+          this.$emit('expand', { expanded: true });
+        }
+      },
+      onCollapse() {
+        this.isExpanded = false;
+        if (typeof this.ellipsis === 'object') {
+          this.$emit('expand', { expanded: false });
+        }
+      },
+    },
+  }),
+};
+</script>
+<style scoped src="./paragraph.css"></style>
diff --git a/packages/uniapp-components/paragraph/props.ts b/packages/uniapp-components/paragraph/props.ts
new file mode 100644
index 000000000..e6ca51080
--- /dev/null
+++ b/packages/uniapp-components/paragraph/props.ts
@@ -0,0 +1,18 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import type { TdParagraphProps } from './type';
+export default {
+  /** 段落内容 */
+  content: {
+    type: String,
+  },
+  /** 是否省略展示，可通过配置参数自定义省略操作的具体功能和样式 */
+  ellipsis: {
+    type: [Boolean, Object],
+    default: false as TdParagraphProps['ellipsis'],
+  },
+};
diff --git a/packages/uniapp-components/paragraph/type.ts b/packages/uniapp-components/paragraph/type.ts
new file mode 100644
index 000000000..757697e1d
--- /dev/null
+++ b/packages/uniapp-components/paragraph/type.ts
@@ -0,0 +1,19 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import type { TypographyEllipsis } from '../text/type';
+
+export interface TdParagraphProps {
+  /**
+   * 段落内容
+   */
+  content?: string;
+  /**
+   * 是否省略展示，可通过配置参数自定义省略操作的具体功能和样式
+   * @default false
+   */
+  ellipsis?: boolean | TypographyEllipsis;
+}
diff --git a/packages/uniapp-components/text/props.ts b/packages/uniapp-components/text/props.ts
new file mode 100644
index 000000000..ce93987f0
--- /dev/null
+++ b/packages/uniapp-components/text/props.ts
@@ -0,0 +1,50 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import type { TdTextProps } from './type';
+export default {
+  /** 是否添加代码样式 */
+  code: Boolean,
+  /** 文本内容 */
+  content: {
+    type: String,
+  },
+  /** 是否可复制 */
+  copyable: {
+    type: [Boolean, Object],
+    default: false as TdTextProps['copyable'],
+  },
+  /** 是否添加删除线样式 */
+  delete: Boolean,
+  /** 是否添加不可用样式 */
+  disabled: Boolean,
+  /** 是否省略展示，可通过配置参数自定义省略操作的具体功能和样式 */
+  ellipsis: {
+    type: [Boolean, Object],
+    default: false as TdTextProps['ellipsis'],
+  },
+  /** 文本是否为斜体 */
+  italic: Boolean,
+  /** 是否添加键盘样式 */
+  keyboard: Boolean,
+  /** 是否添加标记样式，默认为黄色，可通过配置颜色修改标记样式，如#0052D9 */
+  mark: {
+    type: [String, Boolean],
+    default: false as TdTextProps['mark'],
+  },
+  /** 文本是否加粗 */
+  strong: Boolean,
+  /** 主题 */
+  theme: {
+    type: String,
+    validator(val: TdTextProps['theme']): boolean {
+      if (!val) return true;
+      return ['primary', 'secondary', 'success', 'warning', 'error'].includes(val);
+    },
+  },
+  /** 是否添加下划线样式 */
+  underline: Boolean,
+};
diff --git a/packages/uniapp-components/text/text.less b/packages/uniapp-components/text/text.less
new file mode 100644
index 000000000..d20abff77
--- /dev/null
+++ b/packages/uniapp-components/text/text.less
@@ -0,0 +1 @@
+@import '../paragraph/paragraph.less';
diff --git a/packages/uniapp-components/text/text.vue b/packages/uniapp-components/text/text.vue
new file mode 100644
index 000000000..cfd3481bf
--- /dev/null
+++ b/packages/uniapp-components/text/text.vue
@@ -0,0 +1,175 @@
+<template>
+  <view
+    :class="className + ' ' + tClass + ' ' + wrapperClass(classPrefix, ellipsis)"
+    :style="(ellipsis ? '' : 'display:inline;') + tools._style([customStyle]) + (ellipsis ? '' : markStyle(mark))"
+  >
+    <view
+      v-if="ellipsis"
+      :class="classPrefix + '__ellipsis-content ' + decorClass(classPrefix, strong, underline, dataDelete, code, mark, keyboard, italic)"
+      :style="ellipsisStyle(ellipsis, isExpanded) + markStyle(mark)"
+    >
+      <text v-if="content">
+        {{ content }}
+      </text>
+      <slot v-else />
+    </view>
+    <block v-else>
+      <view
+        :class="'' + decorClass(classPrefix, strong, underline, dataDelete, code, mark, keyboard, italic)"
+        style="display: inline"
+      >
+        <text v-if="content">
+          {{ content }}
+        </text>
+        <slot v-else />
+      </view>
+    </block>
+
+    <!-- 展开/收起按钮 -->
+    <view
+      v-if="ellipsis && !isExpanded && ellipsis.expandable"
+      :class="classPrefix + '-ellipsis-symbol'"
+      :style="copyable ? 'margin-right:16rpx;' : ''"
+      @click="onExpand"
+    >
+      {{ globalConfig.expandText }}
+    </view>
+    <view
+      v-else-if="ellipsis && isExpanded && ellipsis.expandable && ellipsis.collapsible"
+      :class="classPrefix + '-ellipsis-symbol'"
+      :style="copyable ? 'margin-right:16rpx;' : ''"
+      @click="onCollapse"
+    >
+      {{ globalConfig.collapseText }}
+    </view>
+
+    <!-- 复制按钮 -->
+    <view
+      v-if="copyable"
+      :class="classPrefix + '__copy ' + tClassCopy"
+      @click="onCopy"
+    >
+      <block v-if="isCopied">
+        <t-icon name="check" />
+      </block>
+      <block v-else-if="copyable && copyable.suffix">
+        <slot name="suffix" />
+      </block>
+      <block v-else>
+        <t-icon name="file-copy" />
+      </block>
+    </view>
+  </view>
+</template>
+<script>
+import { prefix } from '../common/config';
+import { uniComponent } from '../common/src/index';
+
+import tools from '../common/utils.wxs';
+import TIcon from '../icon/icon';
+import usingConfig from '../mixins/using-config';
+import { ellipsisStyle, wrapperClass, decorClass, markStyle } from '../paragraph/computed.js';
+
+import props from './props';
+
+const componentName = 'typography';
+const name = `${prefix}-${componentName}`;
+
+export default {
+  components: {
+    TIcon,
+  },
+  ...uniComponent({
+    name,
+    mixins: [usingConfig({ componentName })],
+    options: {
+      styleIsolation: 'shared',
+    },
+    externalClasses: [
+      `${prefix}-class`,
+      `${prefix}-class-copy`,
+    ],
+    props: {
+      ...props,
+    },
+    emits: [
+      'expand',
+      'copy',
+    ],
+    data() {
+      return {
+        prefix,
+        classPrefix: name,
+        tools,
+        className: '',
+        // delete 是 JS 关键字，避免使用，使用 dataDelete 透传
+        dataDelete: this.delete,
+        isExpanded: false,
+        isCopied: false,
+      };
+    },
+    watch: {
+      theme: 'updateClass',
+      disabled: 'updateClass',
+      delete(val) {
+        this.dataDelete = val;
+      },
+    },
+    mounted() {
+      this.updateClass();
+    },
+    methods: {
+      ellipsisStyle,
+      wrapperClass,
+      decorClass,
+      markStyle,
+      updateClass() {
+        const { classPrefix, theme, disabled } = this;
+        const classList = [classPrefix];
+
+        if (disabled) {
+          classList.push(`${classPrefix}--disabled`);
+        } else if (theme && ['primary', 'secondary', 'success', 'warning', 'error'].includes(theme)) {
+          classList.push(`${classPrefix}--${theme}`);
+        }
+
+        this.className = classList.join(' ');
+      },
+      onExpand() {
+        this.isExpanded = true;
+        if (typeof this.ellipsis === 'object') {
+          this.$emit('expand', { expanded: true });
+        }
+      },
+      onCollapse() {
+        this.isExpanded = false;
+        if (typeof this.ellipsis === 'object') {
+          this.$emit('expand', { expanded: false });
+        }
+      },
+      onCopy() {
+        if (this.isCopied) return;
+
+        const { copyable, content } = this;
+        let text = content || '';
+
+        if (typeof copyable === 'object' && copyable !== null && copyable.text) {
+          text = copyable.text;
+        }
+
+        uni.setClipboardData({
+          data: text,
+          success: () => {
+            this.isCopied = true;
+            this.$emit('copy', { text });
+            setTimeout(() => {
+              this.isCopied = false;
+            }, 1500);
+          },
+        });
+      },
+    },
+  }),
+};
+</script>
+<style scoped src="./text.css"></style>
diff --git a/packages/uniapp-components/text/type.ts b/packages/uniapp-components/text/type.ts
new file mode 100644
index 000000000..fa2014004
--- /dev/null
+++ b/packages/uniapp-components/text/type.ts
@@ -0,0 +1,78 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+export interface TdTextProps {
+  /**
+   * 是否添加代码样式
+   * @default false
+   */
+  code?: boolean;
+  /**
+   * 文本内容
+   */
+  content?: string;
+  /**
+   * 是否可复制
+   * @default false
+   */
+  copyable?: boolean | TypographyCopyable;
+  /**
+   * 是否添加删除线样式
+   * @default false
+   */
+  delete?: boolean;
+  /**
+   * 是否添加不可用样式
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * 是否省略展示，可通过配置参数自定义省略操作的具体功能和样式
+   * @default false
+   */
+  ellipsis?: boolean | TypographyEllipsis;
+  /**
+   * 文本是否为斜体
+   * @default false
+   */
+  italic?: boolean;
+  /**
+   * 是否添加键盘样式
+   * @default false
+   */
+  keyboard?: boolean;
+  /**
+   * 是否添加标记样式，默认为黄色，可通过配置颜色修改标记样式，如#0052D9
+   * @default false
+   */
+  mark?: string | boolean;
+  /**
+   * 文本是否加粗
+   * @default false
+   */
+  strong?: boolean;
+  /**
+   * 主题
+   */
+  theme?: 'primary' | 'secondary' | 'success' | 'warning' | 'error';
+  /**
+   * 是否添加下划线样式
+   * @default false
+   */
+  underline?: boolean;
+}
+
+export interface TypographyCopyable {
+  text?: string;
+  suffix?: boolean;
+}
+
+export interface TypographyEllipsis {
+  collapsible?: boolean;
+  expandable?: boolean;
+  row?: number;
+  suffix?: boolean;
+}
diff --git a/packages/uniapp-components/title/props.ts b/packages/uniapp-components/title/props.ts
new file mode 100644
index 000000000..a615830b8
--- /dev/null
+++ b/packages/uniapp-components/title/props.ts
@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import type { TdTitleProps } from './type';
+export default {
+  /** 段落内容 */
+  content: {
+    type: String,
+  },
+  /** 是否省略展示，可通过配置参数自定义省略操作的具体功能和样式 */
+  ellipsis: {
+    type: [Boolean, Object],
+    default: false as TdTitleProps['ellipsis'],
+  },
+  /** 标题等级 */
+  level: {
+    type: String,
+    default: 'h1' as TdTitleProps['level'],
+    validator(val: TdTitleProps['level']): boolean {
+      if (!val) return true;
+      return ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].includes(val);
+    },
+  },
+};
diff --git a/packages/uniapp-components/title/title.less b/packages/uniapp-components/title/title.less
new file mode 100644
index 000000000..d20abff77
--- /dev/null
+++ b/packages/uniapp-components/title/title.less
@@ -0,0 +1 @@
+@import '../paragraph/paragraph.less';
diff --git a/packages/uniapp-components/title/title.vue b/packages/uniapp-components/title/title.vue
new file mode 100644
index 000000000..fd3dbd164
--- /dev/null
+++ b/packages/uniapp-components/title/title.vue
@@ -0,0 +1,94 @@
+<template>
+  <view
+    :class="classPrefix + ' ' + classPrefix + '--' + level + ' ' + tClass + ' ' + (ellipsis ? classPrefix + '__ellipsis-wrapper' : '')"
+    :style="'' + tools._style([customStyle])"
+  >
+    <view
+      v-if="ellipsis"
+      :class="classPrefix + '__ellipsis-content'"
+      :style="'' + ellipsisStyle(ellipsis, isExpanded)"
+    >
+      <text v-if="content">
+        {{ content }}
+      </text>
+      <slot v-else />
+    </view>
+    <block v-else>
+      <text v-if="content">
+        {{ content }}
+      </text>
+      <slot v-else />
+    </block>
+
+    <view
+      v-if="ellipsis && !isExpanded && ellipsis.expandable"
+      :class="classPrefix + '-ellipsis-symbol'"
+      @click="onExpand"
+    >
+      {{ globalConfig.expandText }}
+    </view>
+    <view
+      v-else-if="ellipsis && isExpanded && ellipsis.expandable && ellipsis.collapsible"
+      :class="classPrefix + '-ellipsis-symbol'"
+      @click="onCollapse"
+    >
+      {{ globalConfig.collapseText }}
+    </view>
+  </view>
+</template>
+<script>
+import { prefix } from '../common/config';
+import { uniComponent } from '../common/src/index';
+
+import tools from '../common/utils.wxs';
+import usingConfig from '../mixins/using-config';
+import { ellipsisStyle } from '../paragraph/computed.js';
+
+import props from './props';
+
+const componentName = 'typography';
+const name = `${prefix}-${componentName}`;
+
+export default {
+  ...uniComponent({
+    name,
+    mixins: [usingConfig({ componentName })],
+    options: {
+      styleIsolation: 'shared',
+    },
+    externalClasses: [
+      `${prefix}-class`,
+    ],
+    props: {
+      ...props,
+    },
+    emits: [
+      'expand',
+    ],
+    data() {
+      return {
+        prefix,
+        classPrefix: name,
+        tools,
+        isExpanded: false,
+      };
+    },
+    methods: {
+      ellipsisStyle,
+      onExpand() {
+        this.isExpanded = true;
+        if (typeof this.ellipsis === 'object') {
+          this.$emit('expand', { expanded: true });
+        }
+      },
+      onCollapse() {
+        this.isExpanded = false;
+        if (typeof this.ellipsis === 'object') {
+          this.$emit('expand', { expanded: false });
+        }
+      },
+    },
+  }),
+};
+</script>
+<style scoped src="./title.css"></style>
diff --git a/packages/uniapp-components/title/type.ts b/packages/uniapp-components/title/type.ts
new file mode 100644
index 000000000..06df8fdd9
--- /dev/null
+++ b/packages/uniapp-components/title/type.ts
@@ -0,0 +1,24 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import type { TypographyEllipsis } from '../text/type';
+
+export interface TdTitleProps {
+  /**
+   * 段落内容
+   */
+  content?: string;
+  /**
+   * 是否省略展示，可通过配置参数自定义省略操作的具体功能和样式
+   * @default false
+   */
+  ellipsis?: boolean | TypographyEllipsis;
+  /**
+   * 标题等级
+   * @default h1
+   */
+  level?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+}

From 5bb7fe7100d5621eb7437f1042a808c7eb02fc5a Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Sat, 13 Jun 2026 12:04:38 +0800
Subject: [PATCH 09/11] chore: add text/title/paragraph types

---
 packages/tdesign-uniapp-chat/package.json     |  2 +-
 .../example/script/types/index.js             | 35 +++++++++++++++++++
 packages/tdesign-uniapp/global.d.ts           |  3 ++
 packages/tdesign-uniapp/package.json          | 17 ++++++++-
 packages/uniapp-components/types/index.d.ts   |  3 ++
 .../uniapp-components/types/paragraph.d.ts    |  7 ++++
 packages/uniapp-components/types/text.d.ts    |  7 ++++
 packages/uniapp-components/types/title.d.ts   |  7 ++++
 8 files changed, 79 insertions(+), 2 deletions(-)
 create mode 100644 packages/uniapp-components/types/paragraph.d.ts
 create mode 100644 packages/uniapp-components/types/text.d.ts
 create mode 100644 packages/uniapp-components/types/title.d.ts

diff --git a/packages/tdesign-uniapp-chat/package.json b/packages/tdesign-uniapp-chat/package.json
index 845a3bd4c..c3dba1ef7 100644
--- a/packages/tdesign-uniapp-chat/package.json
+++ b/packages/tdesign-uniapp-chat/package.json
@@ -145,4 +145,4 @@
       "eslint --fix"
     ]
   }
-}
\ No newline at end of file
+}
diff --git a/packages/tdesign-uniapp/example/script/types/index.js b/packages/tdesign-uniapp/example/script/types/index.js
index ff9c634e1..4cfb82121 100644
--- a/packages/tdesign-uniapp/example/script/types/index.js
+++ b/packages/tdesign-uniapp/example/script/types/index.js
@@ -1,3 +1,4 @@
+const { execSync } = require('child_process');
 const fs = require('fs');
 const path = require('path');
 
@@ -117,6 +118,37 @@ function checkFileExists(filePath, label) {
   }
 }
 
+function runEslintFix(targets, label) {
+  // 过滤掉不存在的路径，避免 eslint 直接报错退出
+  const existing = targets.filter(p => fs.existsSync(p));
+  if (existing.length === 0) {
+    console.warn(`[types][${label}] 跳过 eslint --fix: 无可处理的目标文件`);
+    return;
+  }
+
+  const args = [
+    'eslint',
+    '--fix',
+    '--no-error-on-unmatched-pattern',
+    '--ext',
+    '.ts,.d.ts',
+    ...existing.map(p => `"${p}"`),
+  ].join(' ');
+
+  console.log(`[types][${label}] 执行 eslint --fix 处理 ${existing.length} 个目标...`);
+  try {
+    execSync(`npx ${args}`, {
+      cwd: PROJECT_ROOT,
+      stdio: 'inherit',
+    });
+    console.log(`[types][${label}] eslint --fix 完成 ✅`);
+  } catch (err) {
+    // eslint 在仅有 warning（或个别非 --fix 可处理的 error）时也会非零退出，
+    // 不应阻断生成流程，仅打印提示
+    console.warn(`[types][${label}] eslint --fix 退出码非零（可能存在无法自动修复的问题，请手动检查）`);
+  }
+}
+
 async function genOnProject({
   pkgGlob,
   pkgJsonPath,
@@ -158,6 +190,9 @@ async function genOnProject({
   genIndexContent(fileNames, indexPath, isChat, label);
   getGlobalDTS(fileNames, globalDTSPath, isChat, label);
 
+  // 对生成的文件自动执行 eslint --fix，避免再手动跑 lint
+  runEslintFix([dtsDir, globalDTSPath], label);
+
   console.log(`[types][${label}] 生成完毕 ✅`);
 }
 
diff --git a/packages/tdesign-uniapp/global.d.ts b/packages/tdesign-uniapp/global.d.ts
index 4aff571c7..6059de61e 100644
--- a/packages/tdesign-uniapp/global.d.ts
+++ b/packages/tdesign-uniapp/global.d.ts
@@ -45,6 +45,7 @@ declare module 'vue' {
     TNavbar: typeof import('@tdesign/uniapp/navbar/navbar.vue').default;
     TNoticeBar: typeof import('@tdesign/uniapp/notice-bar/notice-bar.vue').default;
     TOverlay: typeof import('@tdesign/uniapp/overlay/overlay.vue').default;
+    TParagraph: typeof import('@tdesign/uniapp/paragraph/paragraph.vue').default;
     TPicker: typeof import('@tdesign/uniapp/picker/picker.vue').default;
     TPickerItem: typeof import('@tdesign/uniapp/picker-item/picker-item.vue').default;
     TPopover: typeof import('@tdesign/uniapp/popover/popover.vue').default;
@@ -77,7 +78,9 @@ declare module 'vue' {
     TTable: typeof import('@tdesign/uniapp/table/table.vue').default;
     TTabs: typeof import('@tdesign/uniapp/tabs/tabs.vue').default;
     TTag: typeof import('@tdesign/uniapp/tag/tag.vue').default;
+    TText: typeof import('@tdesign/uniapp/text/text.vue').default;
     TTextarea: typeof import('@tdesign/uniapp/textarea/textarea.vue').default;
+    TTitle: typeof import('@tdesign/uniapp/title/title.vue').default;
     TToast: typeof import('@tdesign/uniapp/toast/toast.vue').default;
     TTreeSelect: typeof import('@tdesign/uniapp/tree-select/tree-select.vue').default;
     TUpload: typeof import('@tdesign/uniapp/upload/upload.vue').default;
diff --git a/packages/tdesign-uniapp/package.json b/packages/tdesign-uniapp/package.json
index 84e04ec57..6436c8307 100644
--- a/packages/tdesign-uniapp/package.json
+++ b/packages/tdesign-uniapp/package.json
@@ -309,6 +309,11 @@
       "import": "./dist/overlay/overlay.vue",
       "default": "./dist/overlay/overlay.vue"
     },
+    "./paragraph/paragraph.vue": {
+      "types": "./dist/types/paragraph.d.ts",
+      "import": "./dist/paragraph/paragraph.vue",
+      "default": "./dist/paragraph/paragraph.vue"
+    },
     "./picker/picker.vue": {
       "types": "./dist/types/picker.d.ts",
       "import": "./dist/picker/picker.vue",
@@ -469,11 +474,21 @@
       "import": "./dist/tag/tag.vue",
       "default": "./dist/tag/tag.vue"
     },
+    "./text/text.vue": {
+      "types": "./dist/types/text.d.ts",
+      "import": "./dist/text/text.vue",
+      "default": "./dist/text/text.vue"
+    },
     "./textarea/textarea.vue": {
       "types": "./dist/types/textarea.d.ts",
       "import": "./dist/textarea/textarea.vue",
       "default": "./dist/textarea/textarea.vue"
     },
+    "./title/title.vue": {
+      "types": "./dist/types/title.d.ts",
+      "import": "./dist/title/title.vue",
+      "default": "./dist/title/title.vue"
+    },
     "./toast/toast.vue": {
       "types": "./dist/types/toast.d.ts",
       "import": "./dist/toast/toast.vue",
@@ -582,4 +597,4 @@
       "eslint --fix"
     ]
   }
-}
\ No newline at end of file
+}
diff --git a/packages/uniapp-components/types/index.d.ts b/packages/uniapp-components/types/index.d.ts
index aae6edc8f..1faadfeaf 100644
--- a/packages/uniapp-components/types/index.d.ts
+++ b/packages/uniapp-components/types/index.d.ts
@@ -42,6 +42,7 @@ export * from '../message/type';
 export * from '../navbar/type';
 export * from '../notice-bar/type';
 export * from '../overlay/type';
+export * from '../paragraph/type';
 export * from '../picker/type';
 export * from '../picker-item/type';
 export * from '../popover/type';
@@ -74,7 +75,9 @@ export * from '../tab-panel/type';
 export * from '../table/type';
 export * from '../tabs/type';
 export * from '../tag/type';
+export * from '../text/type';
 export * from '../textarea/type';
+export * from '../title/type';
 export * from '../toast/type';
 export * from '../tree-select/type';
 export * from '../upload/type';
diff --git a/packages/uniapp-components/types/paragraph.d.ts b/packages/uniapp-components/types/paragraph.d.ts
new file mode 100644
index 000000000..9e4fddcb8
--- /dev/null
+++ b/packages/uniapp-components/types/paragraph.d.ts
@@ -0,0 +1,7 @@
+import type { TransformEventHandlers, ExtractNonOnProps } from '../common/common';
+import type { TdParagraphProps } from '../paragraph/type';
+
+export type ParagraphProps = ExtractNonOnProps<TdParagraphProps>;
+export type ParagraphEmits = TransformEventHandlers<TdParagraphProps, true>;
+declare const ParagraphComponent: import('vue').DefineComponent<ParagraphProps, {}, {}, {}, {}, {}, {}, ParagraphEmits, any>;
+export default ParagraphComponent;
diff --git a/packages/uniapp-components/types/text.d.ts b/packages/uniapp-components/types/text.d.ts
new file mode 100644
index 000000000..2d499a8c3
--- /dev/null
+++ b/packages/uniapp-components/types/text.d.ts
@@ -0,0 +1,7 @@
+import type { TransformEventHandlers, ExtractNonOnProps } from '../common/common';
+import type { TdTextProps } from '../text/type';
+
+export type TextProps = ExtractNonOnProps<TdTextProps>;
+export type TextEmits = TransformEventHandlers<TdTextProps, true>;
+declare const TextComponent: import('vue').DefineComponent<TextProps, {}, {}, {}, {}, {}, {}, TextEmits, any>;
+export default TextComponent;
diff --git a/packages/uniapp-components/types/title.d.ts b/packages/uniapp-components/types/title.d.ts
new file mode 100644
index 000000000..0061d0797
--- /dev/null
+++ b/packages/uniapp-components/types/title.d.ts
@@ -0,0 +1,7 @@
+import type { TransformEventHandlers, ExtractNonOnProps } from '../common/common';
+import type { TdTitleProps } from '../title/type';
+
+export type TitleProps = ExtractNonOnProps<TdTitleProps>;
+export type TitleEmits = TransformEventHandlers<TdTitleProps, true>;
+declare const TitleComponent: import('vue').DefineComponent<TitleProps, {}, {}, {}, {}, {}, {}, TitleEmits, any>;
+export default TitleComponent;

From 7d24d29ec6c3cc496bc02b6e0fb800516d9c018d Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Sat, 13 Jun 2026 12:11:48 +0800
Subject: [PATCH 10/11] =?UTF-8?q?fix(image):=20=E4=BF=AE=E5=A4=8D=E9=B8=BF?=
 =?UTF-8?q?=E8=92=99=E4=B8=8B=E5=9B=BE=E7=89=87=E6=97=A0=E6=B3=95=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/uniapp-components/common/version.js | 3 +++
 packages/uniapp-components/image/image.vue   | 4 ++--
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/uniapp-components/common/version.js b/packages/uniapp-components/common/version.js
index 474e9b73e..3b913dee9 100644
--- a/packages/uniapp-components/common/version.js
+++ b/packages/uniapp-components/common/version.js
@@ -12,6 +12,9 @@ function getSystemInfo() {
 
 // 版本号比较, 参考：https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html
 export function compareVersion(v1, v2) {
+  if (!v1 || !v2) {
+    return 0;
+  }
   v1 = v1.split('.');
   v2 = v2.split('.');
   const len = Math.max(v1.length, v2.length);
diff --git a/packages/uniapp-components/image/image.vue b/packages/uniapp-components/image/image.vue
index dfd61d352..1593da9dc 100644
--- a/packages/uniapp-components/image/image.vue
+++ b/packages/uniapp-components/image/image.vue
@@ -142,14 +142,14 @@ export default {
     },
     methods: {
       onLoaded(e) {
-        const version = appBaseInfo.SDKVersion;
         const {
           mode,
           tId,
         } = this;
 
-        const lower = compareVersion(version, '2.10.3') < 0;
         // #ifdef MP-WEIXIN || MP-QQ
+        const version = appBaseInfo.SDKVersion || '2.10.3';
+        const lower = compareVersion(version, '2.10.3') < 0;
         if ('heightFix' === mode && lower) {
           getRect(this, `#${tId || 'image'}`).then((e) => {
             const {

From 26d2ae76bed39da07414e109dbb360a859c66326 Mon Sep 17 00:00:00 2001
From: tdesign-bot <tdesign@tencent.com>
Date: Mon, 15 Jun 2026 02:11:44 +0000
Subject: [PATCH 11/11] chore: stash changelog [ci skip]

---
 packages/tdesign-uniapp/.changelog/pr-4511.md | 12 ++++++++++++
 1 file changed, 12 insertions(+)
 create mode 100644 packages/tdesign-uniapp/.changelog/pr-4511.md

diff --git a/packages/tdesign-uniapp/.changelog/pr-4511.md b/packages/tdesign-uniapp/.changelog/pr-4511.md
new file mode 100644
index 000000000..aaae886a0
--- /dev/null
+++ b/packages/tdesign-uniapp/.changelog/pr-4511.md
@@ -0,0 +1,12 @@
+---
+pr_number: 4511
+contributor: novlan1
+---
+
+- fix(Message): 修复连续点击时的报错问题 @novlan1 ([#4511](https://github.com/Tencent/tdesign-miniprogram/pull/4511))
+- fix(Stepper): 调整手动输入逻辑，输入时仅过滤非法字符，范围校验&赋值移至失焦 @novlan1 ([#4511](https://github.com/Tencent/tdesign-miniprogram/pull/4511))
+- fix(Search): 补全 `update:value` 事件声明，修复 `v-model:value` 语法糖告警 @novlan1 ([#4511](https://github.com/Tencent/tdesign-miniprogram/pull/4511))
+- fix(Upload): 修复禁用态文件样式错误（禁用态下移除操作按钮） @novlan1 ([#4511](https://github.com/Tencent/tdesign-miniprogram/pull/4511))
+- fix(Image): 修复鸿蒙下图片无法显示问题 @novlan1 ([#4511](https://github.com/Tencent/tdesign-miniprogram/pull/4511))
+- feat(Cascader): 新增 `filterable`、`filter` 和 `filter-placeholder` 属性，支持搜索功能 @novlan1 ([#4511](https://github.com/Tencent/tdesign-miniprogram/pull/4511))
+- feat(Typography): 新增 `Typography` 排版组件 @novlan1 ([#4511](https://github.com/Tencent/tdesign-miniprogram/pull/4511))