chore: merge develop

.github/workflows/auto-release.yml

@@ -5,7 +5,7 @@ on:
     branches: [develop]
     types: [opened, synchronize, reopened, closed]
     paths:
-      - "package.json"
+      - "packages/tdesign-vue-next/package.json"
   issue_comment:
     types: [edited]
 
@@ -18,11 +18,18 @@ jobs:
       startsWith(github.head_ref, 'release/')
     steps:
       - run: echo "The head of this PR starts with 'release/'"
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
+      - uses: TDesignOteam/tdesign-tag-action@main
+        id: tag-action
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          version_file: packages/tdesign-vue-next/package.json
       - uses: TDesignOteam/tdesign-changelog-action@main
         id: changelog
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          tag: ${{ steps.tag-action.outputs.version }}  
       - name: Add comment
         uses: peter-evans/create-or-update-comment@v1
         with:
@@ -78,7 +85,7 @@ jobs:
           token: ${{ secrets.PERSONAL_TOKEN }}
       - name: tag and push if needed
         run: |
-          data=$(cat package.json)
+          data=$(cat packages/tdesign-vue-next/package.json)
           re="\"version\": \"([^\"]*)\""
           [[ $data =~ $re ]]
           echo "${BASH_REMATCH[1]}"

.github/workflows/pkg-pr-new.yml

@@ -0,0 +1,27 @@
+name: Publish_Any_Commit
+on:
+  push:
+    branches: [develop]
+  pull_request:
+    branches: [develop]
+
+jobs:
+  build:
+    if: ${{ github.repository == 'Tencent/tdesign-vue-next' && !startsWith(github.head_ref, 'release/')}}
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: recursive
+      - uses: pnpm/action-setup@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 18
+
+      - run: pnpm install
+
+      - run: pnpm build
+
+      - run: pnpm dlx pkg-pr-new publish './packages/tdesign-vue-next' --compact

.github/workflows/pr-comment-ci.yml

@@ -184,8 +184,8 @@ jobs:
           git status
           conflict_count=$(git status | grep -c 'both modified:') || true
           working_tree_clean=$(git status | grep -c 'nothing to commit, working tree clean') || true
-          csr_snap_conflict=$(git status | grep 'both modified:' | grep -c 'csr.test.jsx.snap') || true
-          ssr_snap_conflict=$(git status | grep 'both modified:' | grep -c 'ssr.test.jsx.snap') || true
+          csr_snap_conflict=$(git status | grep 'both modified:' | grep -c 'csr.test.js.snap') || true
+          ssr_snap_conflict=$(git status | grep 'both modified:' | grep -c 'ssr.test.js.snap') || true
           common_conflict=$(git status | grep 'both modified:' | grep -c 'packages/common') || true
           conflicts_sum=$((csr_snap_conflict + ssr_snap_conflict + common_conflict))
           echo "conflict_count: $conflict_count"

.github/workflows/pr-compressed-size.yml

@@ -12,7 +12,15 @@ jobs:
       - uses: actions/checkout@v3
         with:
           submodules: recursive
-      - uses: 94dreamer/compressed-size-action@master
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 18
+
+      - uses: preactjs/compressed-size-action@v2
         with:
           repo-token: "${{ secrets.GITHUB_TOKEN }}"
-          pattern: "./dist/**/*.{js,css}"
+          install-script: "pnpm install"
+          pattern: "packages/tdesign-vue-next/dist/**/*.{js,css}"

.vscode/settings.json

@@ -32,7 +32,9 @@
     "precaching",
     "tdesign",
     "tdoc",
+    "tmenu",
     "tnode",
+    "vnode",
     "wechat"
   ]
 }

CONTRIBUTING.md

@@ -12,7 +12,7 @@
 
 ## 进行开发
 
-请使用 `node 18` 与 `pnpm 9` 版本进行开发
+请使用 `node 18` 与 `pnpm 9` 版本进行开发。
 
 ### 1.初始化子仓库
 
@@ -32,21 +32,37 @@ pnpm install
 pnpm run dev
 ```
 
-完成以上 3 个步骤，浏览器访问 <http://127.0.0.1:17000> 即可调试该框架的任何内容
+完成以上 3 个步骤，浏览器访问 <http://127.0.0.1:17000> 即可调试该框架的任何内容。
 
 ## 目录结构
 
 ```text
-├── script // 构建代码
-└── packages // 组件代码
-     └─ components
-         └─ componentA     
-             ├── _example // 组件示例文档
-             ├── _usage // 组件 live demo
-             └── __tests__ // 组件测试用例
-     └─ tdesign-vue-next
-         └─ site 站点代码     
-```
+.
+├── internal                  // 仅供仓库内使用的包
+│   ├── tests                 // 测试公共逻辑
+│   └── utils                 // 基础 util
+├── script                    // 构建代码
+└── packages                  // 子应用
+    ├── common
+    │   ├── docs
+    │   ├── js
+    │   ├── style
+    │   │   ├── mobile
+    │   │   └── web
+    │   └── test
+    ├── components            // 组件
+    │   ├── componentA
+    │   │   ├── __tests__     // 组件测试用例
+    │   │   ├── _example      // 组件示例文档
+    │   │   ├── _example-ts   // 组件示例文档
+    │   │   ├── _usage        // 组件 live demo
+    │   │   └── style         // 组件样式
+    │   ├── style
+    │   ├── utils
+    └── tdesign-vue-next      // tdesign-vue-next 出口
+        ├── helper            // 供 vscode 等 IDE 使用
+        ├── site              // 站点
+        └── test              // 测试配置
 
 ### 组件页路由配置
 
@@ -85,11 +101,11 @@ pnpm run dev
 
 ### Demo 调试
 
-我们可以通过打开组件的路由页进行开发调试，
+我们可以通过打开组件的路由页进行开发调试。
 
-如 `button`，则打开<http://127.0.0.1:17000/vue-next/components/button> 进行开发调试；
+如 `button`，则打开<http://127.0.0.1:17000/vue-next/components/button> 进行开发调试。
 
-但当组件的 `Markdown` 文件插入了很多个 `demo` 之后，一些组件生命周期方法调试起来会变得困难，若想对某个 `demo` 单独调试，可以访问路由：`/demos/组件名/demo` 名，
+但当组件的 `Markdown` 文件插入了很多个 `demo` 之后，一些组件生命周期方法调试起来会变得困难，若想对某个 `demo` 单独调试，可以访问路由：`/demos/组件名/demo` 名。
 
 如：<http://127.0.0.1:17000/vue-next/demos/button/base>
 
@@ -99,9 +115,9 @@ pnpm run dev
 
 ## 子仓库相关
 
-TDesign 的项目都会以子仓库的形式引入 `tdesign-common` 公共仓库
+TDesign 的项目都会以子仓库的形式引入 `tdesign-common` 公共仓库。
 
-公共仓库中包含
+公共仓库中包含：
 - 部分组件的一些框架无关的公共的工具函数
 - `组件库UI`，即 `HTML` 结构和 `CSS` 样式（多框架共用）
 - 每个组件的文档页面的内容结构
@@ -147,13 +163,13 @@ import './button.less';
 
 ### 分支
 
-遵循使用 `git flow` 规范，新组件分支从 `develop checkout`：[https://nvie.com/posts/a-successful-git-branching-model/](https://nvie.com/posts/a-successful-git-branching-model/)
+遵循使用 `git flow` 规范，新组件分支从 `develop checkout`：[https://nvie.com/posts/a-successful-git-branching-model/](https://nvie.com/posts/a-successful-git-branching-model/)。
 
-如果是贡献组件，则从 `develop checkout` 分支如：`feature/button`，记得如果同时要在子仓库开发 `UI`，子仓库也要 `checkout` 同名分支
+如果是贡献组件，则从 `develop checkout` 分支如：`feature/button`，记得如果同时要在子仓库开发 `UI`，子仓库也要 `checkout` 同名分支。
 
 > 关于 fork
 
-以下内容处理 `fork` 仓库后，远端仓库的更新如何同步到 `fork` 仓库
+以下内容处理 `fork` 仓库后，远端仓库的更新如何同步到 `fork` 仓库。
 
 ```bash
 # 建立 upstream remote
@@ -172,7 +188,7 @@ git merge upstream/develop
 
 项目使用基于 angular 提交规范：[https://github.com/conventional-changelog/commitlint/tree/master/@commitlint/config-conventional](https://github.com/conventional-changelog/commitlint/tree/master/@commitlint/config-conventional)
 
-每次提交会自动触发提交验证
+每次提交会自动触发提交验证：
 
 - 使用工具 `commitizen` 协助规范 `git commit` 信息
 - `fix` & `feat` 的提交会被用来生成 `changelog`
@@ -190,4 +206,4 @@ git merge upstream/develop
 
 ### CSS 规范
 
-组件样式在 `common` 子仓库开发，遵循 [tdesign-common 仓库 UI 开发规范](https://github.com/Tencent/tdesign-common/blob/main/style/web/README.md)
+组件样式在 `common` 子仓库开发，遵循 [tdesign-common 仓库 UI 开发规范](https://github.com/Tencent/tdesign-common/blob/main/style/web/README.md)。

packages/components/button/__tests__/__snapshots__/index.test.jsx.snap

@@ -56,9 +56,7 @@ exports[`Button > :props > :content 1`] = `
     <span
       class="t-button__text"
     >
-      
-      bar
-      
+      foo
     </span>
   </button>
   <button

packages/components/collapse/collapse.tsx

@@ -42,6 +42,7 @@ export default defineComponent({
     provide('updateCollapseValue', updateCollapseValue);
     provide('collapseProps', toRefs(props));
     provide('getUniqId', getUniqId);
+    // TODO 这里是有问题的，这是无法响应式，expandIcon 的值变化了，不会重新渲染
     provide('renderParentTNode', renderTNodeJSX);
     return () => {
       const nodes = renderTNodeJSX('default');

packages/components/config-provider/config-provider.en-US.md

@@ -55,13 +55,21 @@ Vue.createApp({}).use(TDesign)
 ```
 
 ## API
+
+### ConfigProvider Props
+
+name | type | default | description | required
+-- | -- | -- | -- | --
+globalConfig | Object | - | global config。Typescript：`GlobalConfigProvider` | N
+
 ### GlobalConfigProvider
 
 name | type | default | description | required
 -- | -- | -- | -- | --
 alert | Object | - | Alert global configs。Typescript：`AlertConfig` | N
 anchor | Object | - | Anchor global configs。Typescript：`AnchorConfig` | N
 animation | Object | - | Typescript：`Partial<Record<'include'\|'exclude', Array<AnimationType>>>` `type AnimationType = 'ripple' \| 'expand' \| 'fade'`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/config-provider/type.ts) | N
+autoComplete | Object | - | AutoComplete global configs。Typescript：`AutoCompleteConfig` | N
 calendar | Object | - | Calendar global configs。Typescript：`CalendarConfig` | N
 cascader | Object | - | Cascader global configs。Typescript：`CascaderConfig` | N
 classPrefix | String | t | \- | N

packages/components/config-provider/config-provider.md

@@ -56,13 +56,21 @@ Vue.createApp({}).use(TDesign)
 
 
 ## API
+
+### ConfigProvider Props
+
+名称 | 类型 | 默认值 | 描述 | 必传
+-- | -- | -- | -- | --
+globalConfig | Object | - | 全局配置。TS 类型：`GlobalConfigProvider` | N
+
 ### GlobalConfigProvider
 
 名称 | 类型 | 默认值 | 描述 | 必传
 -- | -- | -- | -- | --
 alert | Object | - | 警告全局配置。TS 类型：`AlertConfig` | N
 anchor | Object | - | 锚点全局配置。TS 类型：`AnchorConfig` | N
 animation | Object | - | 动画效果控制，`ripple` 指波纹动画， `expand` 指展开动画，`fade` 指渐变动画。默认为 `{ include: ['ripple','expand','fade'], exclude: [] }`。TS 类型：`Partial<Record<'include'\|'exclude', Array<AnimationType>>>` `type AnimationType = 'ripple' \| 'expand' \| 'fade'`。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/config-provider/type.ts) | N
+autoComplete | Object | - | 自动填充组件全局配置。TS 类型：`AutoCompleteConfig` | N
 calendar | Object | - | 日历组件全局配置。TS 类型：`CalendarConfig` | N
 cascader | Object | - | 级联选择器全局配置。TS 类型：`CascaderConfig` | N
 classPrefix | String | t | CSS 类名前缀 | N

packages/components/config-provider/config-provider.tsx

@@ -1,19 +1,11 @@
-import { defineComponent, PropType } from 'vue';
-import { GlobalConfigProvider } from './type';
+import { defineComponent } from 'vue';
+import props from './props';
 import { useTNodeJSX } from '../hooks/tnode';
 import { provideConfig } from './useConfig';
 
-export const configProviderProps = {
-  globalConfig: Object as PropType<GlobalConfigProvider>,
-};
-
-export type ConfigProviderProps = {
-  globalConfig: GlobalConfigProvider;
-};
-
 export default defineComponent({
   name: 'TConfigProvider',
-  props: configProviderProps,
+  props,
   setup(props) {
     provideConfig(props);
 

packages/components/config-provider/index.ts

@@ -1,7 +1,9 @@
 import withInstall from '../utils/withInstall';
 import _ConfigProvider from './config-provider';
+import { TdConfigProviderProps } from './type';
 
 export * from './type';
+export type ConfigProviderProps = TdConfigProviderProps;
 
 export const ConfigProvider = withInstall(_ConfigProvider);
 export default ConfigProvider;

packages/components/config-provider/props.ts

@@ -0,0 +1,15 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import { TdConfigProviderProps } from './type';
+import { PropType } from 'vue';
+
+export default {
+  /** 全局配置 */
+  globalConfig: {
+    type: Object as PropType<TdConfigProviderProps['globalConfig']>,
+  },
+};

packages/components/config-provider/type.ts

@@ -10,7 +10,14 @@ import { ButtonProps } from '../button';
 import { FormErrorMessage } from '../form';
 import { MessageOptions } from '../message';
 import { ImageProps } from '../image';
-import { TNode, SizeEnum } from '../common';
+import { TNode, SizeEnum, AttachNode } from '../common';
+
+export interface TdConfigProviderProps {
+  /**
+   * 全局配置
+   */
+  globalConfig?: GlobalConfigProvider;
+}
 
 export interface GlobalConfigProvider {
   /**

packages/components/config-provider/useConfig.tsx

@@ -1,11 +1,8 @@
 import { computed, h, inject, getCurrentInstance, ref, provide } from 'vue';
-import { isFunction } from 'lodash-es';
-import { cloneDeep } from 'lodash-es';
-import { isString } from 'lodash-es';
+import { cloneDeep, isFunction, isString } from 'lodash-es';
 
 import { defaultGlobalConfig, configProviderInjectKey, mergeWith } from './context';
-import { GlobalConfigProvider } from './type';
-import type { ConfigProviderProps } from './config-provider';
+import { GlobalConfigProvider, TdConfigProviderProps } from './type';
 
 // 这是为了解决在非component里调用useConfig hook时发出的警告
 // https://github.com/Tencent/tdesign-vue-next/issues/2025
@@ -63,10 +60,10 @@ export function useConfig<T extends keyof GlobalConfigProvider>(
 
 /**
  * provide globalConfig
- * @param {ConfigProviderProps} props
+ * @param {TdConfigProviderProps} props
  * @returns {ComputedRef<GlobalConfigProvider>}
  */
-export const provideConfig = (props: ConfigProviderProps) => {
+export const provideConfig = (props: TdConfigProviderProps) => {
   const defaultData = cloneDeep(defaultGlobalConfig);
   const mergedGlobalConfig = computed(() =>
     Object.assign({}, mergeWith(defaultData as unknown as GlobalConfigProvider, props.globalConfig)),