Merge branch 'develop' into pr/Shabi-x/3293

CHANGELOG.md

@@ -5,6 +5,65 @@ toc: false
 spline: explain
 ---
 
+## 🌈 1.10.5 `2025-01-16` 
+### 🚀 Features
+- `Radio`: `RadioGroup` 新增 `theme` API，用于决定使用 options 时渲染的子组件样式 @HaixingOoO ([#3303](https://github.com/Tencent/tdesign-react/pull/3303))
+- `Upload`: 新增`imageProps` API，用于在上传图片场景下透传 `Image` 组件的相关属性 @HaixingOoO ([#3317](https://github.com/Tencent/tdesign-react/pull/3317))
+- `AutoComplete`: 新增 `empty` API ，用于支持自定义空节点内容 @liweijie0812 ([#3319](https://github.com/Tencent/tdesign-react/pull/3319))
+- `drawer`: `sizeDraggable`新增支持`SizeDragLimit`类型的功能实现 @huangchen1031 ([#3323](https://github.com/Tencent/tdesign-react/pull/3323))
+- `Icon`: 新增`logo-alipay`、`logo-behance-filled`等图标，修改`logo-wecom`图标，移除不合理的`logo-wecom-filled`图标 @uyarn ([#3326](https://github.com/Tencent/tdesign-react/pull/3326))
+### 🐞 Bug Fixes
+- `Select`: 修复`onChange`回调 `context` 中的全部选项的值没有包含选项本身全部内容的问题 @uyarn ([#3305](https://github.com/Tencent/tdesign-react/pull/3305))
+- `DateRangePicker`: 开始结束值同时存在的逻辑判断错误问题 @betavs ([#3301](https://github.com/Tencent/tdesign-react/pull/3301))
+- `Notification`: 修复使用`attach`属性配置导致渲染节点异常的问题 @centuryPark ([#3306](https://github.com/Tencent/tdesign-react/pull/3306))
+- `AutoComplete`: 修复当选项为空时显示效果异常的问题 @betavs ([#3316](https://github.com/Tencent/tdesign-react/pull/3316))
+- `Menu`: 修复 `head-menu` 不渲染 `icon` 的问题 @HaixingOoO ([#3320](https://github.com/Tencent/tdesign-react/pull/3320))
+- `Statistic`: 修复`decimalPlaces=0`时数值动画期间精度错误的问题 @huangchen1031 ([#3327](https://github.com/Tencent/tdesign-react/pull/3327))
+- `ImageVewer`: 修复开启`closeOnOverlay`时，点击蒙层关闭存在闪烁情况的问题 @huangchen1031
+
+
+## 🌈 1.10.4 `2024-12-25` 
+### 🚀 Features
+- `Tree`:  支持 `onScroll` API，用于处理滚动事件回调 @HaixingOoO ([#3295](https://github.com/Tencent/tdesign-react/pull/3295))
+- `Tooltip`: tooltip-lite 的`mouse` 模式下优化为完全跟随鼠标位置，更符合 API 描述 @moecasts ([#3267](https://github.com/Tencent/tdesign-react/pull/3267))
+### 🐞 Bug Fixes
+- `Select`: 修复全选默认返回值错误的问题 @uyarn ([#3298](https://github.com/Tencent/tdesign-react/pull/3298))
+- `Upload`: 优化部分尺寸上传组件图片展示的样式问题 @huangchen1031 ([#3290](https://github.com/Tencent/tdesign-react/pull/3290))
+### 📝 Documentation
+- `Stackblitz`: 调整`Stackblitz`示例的启动方式，并修复部分示例无法使用`stackblitz`或`codesandbox`运行的问题 @uyarn ([#3297](https://github.com/Tencent/tdesign-react/pull/3297))
+
+
+
+## 🌈 1.10.2 `2024-12-19`
+
+### 🚀 Features
+
+- `Alert`: 在 `maxLine >= message` 数组长度的情况下，不再展示 `展开更多/收起` 的按钮 @miownag ([#3281](https://github.com/Tencent/tdesign-react/pull/3281))
+- `ConfigProvider`: `attach` 属性支持配置 `drawer` 组件，支持全局配置`drawer`的挂载位置 @HaixingOoO ([#3272](https://github.com/Tencent/tdesign-react/pull/3272))
+- `DatePicker`: 多选模式支持周选择和年选择的场景 @HaixingOoO @uyarn  ([#3264](https://github.com/Tencent/tdesign-react/pull/3264))
+- `Form`: 新增`supportNumberKey` API，支持在`1.9.3`版本后不支持数字键值的场景使用，若不需要支持数字类型作为表单键值请关闭此 API @uyarn ([#3277](https://github.com/Tencent/tdesign-react/pull/3277))
+- `Radio`: 新增 `Radio` 及 `RadioGroup` 的 `reaonly`属性的支持 @liweijie0812 ([#3280](https://github.com/Tencent/tdesign-react/pull/3280))
+- `Tree`: 实例新增 `setIndeterminate` 方法，支持手动设置半选的功能 @uyarn ([#3261](https://github.com/Tencent/tdesign-react/pull/3261))
+- `label`: `DatePicker`、`TimePicker`、`RangeInput`支持`label` API @liweijie0812 ([#3276](https://github.com/Tencent/tdesign-react/pull/3276))
+
+### 🐞 Bug Fixes
+
+- `DateRangePicker`: 修复日期区间选择器在跨年的场景下的展示异常问题 @huangchen1031 ([#3275](https://github.com/Tencent/tdesign-react/pull/3275))
+- `Menu`: 优化菜单项点击事件的绑定问题避免边界触发异常的问题 @huangchen1031 ([#3241](https://github.com/Tencent/tdesign-react/pull/3241))
+- `ImageViewer`: 修复不受控时，`visable`改变时都会触发`onClose`的问题 @HaixingOoO ([#3244](https://github.com/Tencent/tdesign-react/pull/3244))
+- `CheckboxGroup`: 修复复选框组的子元素不是复选框导致的问题 @HaixingOoO ([#3253](https://github.com/Tencent/tdesign-react/pull/3253))
+- `Form`: 修复`1.9.3`版本后，多级表单字段使用 `setFieldValues` 功能异常的问题 @l123wx ([#3279](https://github.com/Tencent/tdesign-react/pull/3279))
+- `Form`: 修复当规则为中涉及 `0` 判断时，验证不生效的问题 @RSS1102 ([#3283](https://github.com/Tencent/tdesign-react/pull/3283))
+- `Select`: 修复 `valueType` 为 `object`选中全选的展示异常及回调参数缺少的问题 @uyarn ([#3287](https://github.com/Tencent/tdesign-react/pull/3287))
+- `SelectInput`: 修复没有 `label` 都会渲染节点导致垂直对齐的问题 @huangchen1031 ([#3278](https://github.com/Tencent/tdesign-react/pull/3278))
+- `TextArea`: 优化 `TextArea` 初始化时 `autosize` 下计算高度的逻辑 @HaixingOoO ([#3286](https://github.com/Tencent/tdesign-react/pull/3286))
+
+### 🚧 Others
+- `Alert`: 优化测试用例代码类型和添加对于 `className`、`style` 的测试 @RSS1102 ([#3284](https://github.com/Tencent/tdesign-react/pull/3284))
+
+
+
+
 ## 🌈 1.10.1 `2024-11-28` 
 ### 🚀 Features
 - `DatePicker`: 新增`multiple` API，用于支持日期选择器多选功能，具体使用请参考示例 @HaixingOoO ([#3199](https://github.com/Tencent/tdesign-react/pull/3199))

package.json

@@ -1,7 +1,7 @@
 {
   "name": "tdesign-react",
   "purename": "tdesign",
-  "version": "1.10.1",
+  "version": "1.10.5",
   "description": "TDesign Component for React",
   "title": "tdesign-react",
   "main": "lib/index.js",
@@ -185,7 +185,7 @@
     "rollup-plugin-typescript2": "^0.31.2",
     "semver": "^7.6.3",
     "start-server-and-test": "^1.14.0",
-    "tdesign-icons-view": "^0.3.0",
+    "tdesign-icons-view": "^0.3.4",
     "tdesign-publish-cli": "^0.0.12",
     "tdesign-site-components": "^0.15.3",
     "tdesign-theme-generator": "^1.0.0",
@@ -215,7 +215,7 @@
     "react-popper": "~2.3.0",
     "react-transition-group": "~4.4.1",
     "sortablejs": "^1.15.0",
-    "tdesign-icons-react": "^0.3.4",
+    "tdesign-icons-react": "^0.4.3",
     "tinycolor2": "^1.4.2",
     "tslib": "~2.3.1",
     "validator": "~13.7.0"

site/src/App.jsx

@@ -97,6 +97,7 @@ function Components() {
     };
 
     initHistoryVersions();
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   useEffect(() => {

site/src/components/stackblitz/content.js

@@ -1,18 +1,26 @@
 import orgPkg from '../../../../package.json';
 
 export const htmlContent = `
-  <div id="app" style="padding: 24px;"></div>
+  <div id="app"></div>
+  <script type="module" src="/src/index.jsx"></script>
 `;
 
 export const mainJsContent = `
-  import React from 'react';
-  import ReactDOM from 'react-dom';
+  import React, { StrictMode } from 'react';
+  import { createRoot } from 'react-dom/client';
+
   import Demo from './demo';
   import './index.css';
   import 'tdesign-react/dist/tdesign.css';
 
   const rootElement = document.getElementById('app');
-  ReactDOM.render(<Demo />, rootElement);
+  const root = createRoot(rootElement);
+
+  root.render(
+  <React.StrictMode>
+    <Demo />
+  </React.StrictMode>,
+  );
 `;
 
 export const styleContent = `
@@ -66,12 +74,47 @@ export const tsconfigContent = `{
 }
 `;
 
-export const dependenciesContent = JSON.stringify({
-  'tdesign-react': orgPkg.version,
-  'tdesign-icons-react': orgPkg.dependencies['tdesign-icons-react'],
-  dayjs: orgPkg.dependencies.dayjs,
-  react: orgPkg.devDependencies.react,
-  'react-dom': orgPkg.devDependencies['react-dom'],
-  '@types/react': orgPkg.devDependencies['@types/react'],
-  '@types/react-dom': orgPkg.devDependencies['@types/react-dom'],
-});
+export const stackblitzRc = `
+  {
+    "installDependencies": true,
+    "startCommand": "npm run dev"
+  }
+`;
+
+export const viteConfigContent = `
+  import { defineConfig } from 'vite';
+  import react from '@vitejs/plugin-react';
+
+  export default defineConfig({
+    plugins: [react()],
+  });
+`;
+
+export const packageJSONContent = JSON.stringify(
+  {
+    name: 'tdesign-react-demo',
+    version: '0.0.0',
+    private: true,
+    scripts: {
+      dev: 'vite',
+      build: 'vite build',
+      serve: 'vite preview',
+    },
+    dependencies: {
+      react: orgPkg.devDependencies.react,
+      dayjs: orgPkg.dependencies.dayjs,
+      'react-dom': orgPkg.devDependencies['react-dom'],
+      'tdesign-react': orgPkg.version,
+      'tdesign-icons-react': orgPkg.dependencies['tdesign-icons-react'],
+      '@types/react': orgPkg.devDependencies['@types/react'],
+      '@types/react-dom': orgPkg.devDependencies['@types/react-dom'],
+    },
+    devDependencies: {
+      vite: orgPkg.devDependencies.vite,
+      '@vitejs/plugin-react': orgPkg.devDependencies['@vitejs/plugin-react'],
+      typescript: orgPkg.devDependencies.typescript,
+    },
+  },
+  null,
+  2,
+);

site/src/components/stackblitz/index.jsx

@@ -1,7 +1,15 @@
 import React, { useRef, useState } from 'react';
 import Tooltip from 'tdesign-react/tooltip';
 
-import { htmlContent, mainJsContent, styleContent, dependenciesContent, tsconfigContent } from './content';
+import {
+  htmlContent,
+  mainJsContent,
+  styleContent,
+  tsconfigContent,
+  viteConfigContent,
+  packageJSONContent,
+  stackblitzRc,
+} from './content';
 
 const TypeScriptType = 0;
 
@@ -23,20 +31,28 @@ export default function Stackblitz(props) {
 
   return (
     <Tooltip content="在 Stackblitz 中打开">
-      <form ref={formRef} method="post" action="https://stackblitz.com/run" target="_blank" onClick={submit}>
+      <form
+        ref={formRef}
+        method="post"
+        action={`https://stackblitz.com/run?file=src%2F${isTypeScriptDemo ? 'demo.tsx' : 'demo.jsx'}`}
+        target="_blank"
+        onClick={submit}
+      >
         {isTypeScriptDemo ? (
           <>
             <input type="hidden" name="project[files][src/demo.tsx]" value={code} />
-            <input type="hidden" name="project[tsconfig.json]" value={tsconfigContent} />
+            <input type="hidden" name="project[files][tsconfig.json]" value={tsconfigContent} />
           </>
         ) : (
           <input type="hidden" name="project[files][src/demo.jsx]" value={code} />
         )}
         <input type="hidden" name="project[files][src/index.css]" value={styleContent} />
-        <input type="hidden" name="project[files][src/index.js]" value={mainJsContent} />
-        <input type="hidden" name="project[files][public/index.html]" value={htmlContent} />
-        <input type="hidden" name="project[dependencies]" value={dependenciesContent} />
-        <input type="hidden" name="project[template]" value="create-react-app" />
+        <input type="hidden" name="project[files][src/index.jsx]" value={mainJsContent} />
+        <input type="hidden" name="project[files][index.html]" value={htmlContent} />
+        <input type="hidden" name="project[files][vite.config.js]" value={viteConfigContent} />
+        <input type="hidden" name="project[files][.stackblitzrc]" value={stackblitzRc} />
+        <input type="hidden" name="project[files][package.json]" value={packageJSONContent} />
+        <input type="hidden" name="project[template]" value="node" />
 
         <div className="action-online">
           <svg viewBox="0 0 28 28" height="20">

src/auto-complete/AutoComplete.tsx

@@ -151,13 +151,14 @@ const AutoComplete = forwardRef<AutoCompleteRef, AutoCompleteProps>((originalPro
       highlightKeyword={props.highlightKeyword}
       filterable={props.filterable}
       filter={props.filter}
+      empty={props.empty}
     />
   );
   const topContent = props.panelTopContent;
   const bottomContent = props.panelBottomContent;
   const panelContent =
     topContent || listContent || bottomContent ? (
-      <div className={`${classPrefix}-autocomplete__panel`}>
+      <div className={`${classPrefix}-auto-complete__panel`}>
         {topContent}
         {listContent}
         {bottomContent}

src/auto-complete/OptionList.tsx

@@ -8,6 +8,7 @@ import { CommonClassNameType } from '../hooks/useCommonClassName';
 import { AutoCompleteOptionObj, TdAutoCompleteProps } from './type';
 import HighlightOption from './HighlightOption';
 import { on, off } from '../_util/dom';
+import { useLocaleReceiver } from '../locale/LocalReceiver';
 
 export interface OptionsListProps {
   sizeClassNames: CommonClassNameType['sizeClassNames'];
@@ -18,7 +19,8 @@ export interface OptionsListProps {
   highlightKeyword: boolean;
   filterable: boolean;
   filter: TdAutoCompleteProps['filter'];
-  onSelect?: (keyword: string, context: { e: MouseEvent<HTMLLIElement> | KeyboardEvent | any }) => void;
+  empty: TdAutoCompleteProps['empty'];
+  onSelect: (keyword: string, context: { e: MouseEvent<HTMLLIElement> | KeyboardEvent | any }) => void;
 }
 
 export interface OptionsListRef {
@@ -32,6 +34,8 @@ const OptionsList = forwardRef<OptionsListRef, OptionsListProps>((props: Options
   const [active, setActive] = useState('');
   const activeIndexRef = useRef(-1);
 
+  const [global] = useLocaleReceiver('autoComplete');
+
   const classes = `${classPrefix}-select__list`;
   const optionClasses = [
     `${classPrefix}-select-option`,
@@ -81,7 +85,7 @@ const OptionsList = forwardRef<OptionsListRef, OptionsListProps>((props: Options
     }
     const keyword = liNode.getAttribute('title');
     setActive(keyword);
-    onSelect?.(keyword, { e });
+    onSelect(keyword, { e });
   };
 
   // 键盘事件，上下选择
@@ -90,10 +94,10 @@ const OptionsList = forwardRef<OptionsListRef, OptionsListProps>((props: Options
       const currentIndex = activeIndexRef.current;
 
       if (currentIndex === -1) {
-        return
+        return;
       }
 
-      onSelect?.(tOptions[activeIndexRef.current].text, { e });
+      onSelect(tOptions[activeIndexRef.current].text, { e });
     } else {
       const index = activeIndexRef.current;
       let newIndex;
@@ -141,7 +145,9 @@ const OptionsList = forwardRef<OptionsListRef, OptionsListProps>((props: Options
     activeIndexRef.current = tOptions.findIndex((item) => item.text === active);
   }, [active, tOptions]);
 
-  if (!tOptions.length) return null;
+  if (!tOptions.length) {
+    return <div className={`${classPrefix}-auto-complete__panel--empty`}>{props.empty || global.empty}</div>;
+  }
   return (
     <ul className={classes}>
       {tOptions.map((item) => {

src/auto-complete/auto-complete.en-US.md

@@ -13,6 +13,7 @@ borderless | Boolean | false | \- | N
 children | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 clearable | Boolean | - | \- | N
 disabled | Boolean | - | \- | N
+empty | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 filter | Function | - | Typescript：`(filterWords: string, option: T) => boolean \| Promise<boolean>` | N
 filterable | Boolean | true | \- | N
 highlightKeyword | Boolean | true | \- | N

src/auto-complete/auto-complete.md

@@ -13,6 +13,7 @@ borderless | Boolean | false | 无边框模式 | N
 children | TNode | - | 触发显示联想词下拉框的元素，同 `triggerElement`。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 clearable | Boolean | - | 是否允许清空 | N
 disabled | Boolean | - | 是否禁用 | N
+empty | TNode | - | 当下拉联想词列表为空时显示的内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 filter | Function | - | 自定义过滤规则，用于对现有数据进行搜索过滤，判断是否过滤某一项数据。参数 `filterWords` 表示搜索词，`option`表示单个选项内容，返回值为 `true` 保留该选项，返回值为 `false` 则隐藏该选项。使用该方法时无需设置 `filterable`。TS 类型：`(filterWords: string, option: T) => boolean \| Promise<boolean>` | N
 filterable | Boolean | true | 是否根据输入内容过滤联想词。默认过滤规则不区分大小写，全文本任意位置匹配。如果默认搜索规则不符合业务需求，可以更为使用 `filter` 自定义过滤规则。部分场景下输入关键词和下拉联想词完全不同，此时可以设置为 `false` | N
 highlightKeyword | Boolean | true | 是否高亮联想词中和输入值的相同部分 | N
@@ -21,7 +22,7 @@ options | Array | - | 下拉联想词列表。示例一：`['联想词一', '联
 panelBottomContent | TNode | - | 面板内的底部内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 panelTopContent | TNode | - | 面板内的顶部内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 placeholder | String | undefined | 输入框为空时的占位提示。组件本身默认值为 `undefined`，但全局配置存在默认值，不同语言全局默认值不同 | N
-popupProps | Object | - | 透传 Popup 组件全部特性。TS 类型：`PopupProps`，[Popup API Documents](./popup?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/auto-complete/type.ts) | N
+popupProps | Object | - | 透传 Popup 组件全部属性。TS 类型：`PopupProps`，[Popup API Documents](./popup?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/auto-complete/type.ts) | N
 readonly | Boolean | - | 是否只读 | N
 size | String | medium | 组件尺寸。可选项：small/medium/large。TS 类型：`SizeEnum`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 status | String | default | 输入框状态。可选项：default/success/warning/error | N

src/auto-complete/type.ts

@@ -32,6 +32,10 @@ export interface TdAutoCompleteProps<T extends AutoCompleteOption = AutoComplete
    * 是否禁用
    */
   disabled?: boolean;
+  /**
+   * 当下拉联想词列表为空时显示的内容
+   */
+  empty?: TNode;
   /**
    * 自定义过滤规则，用于对现有数据进行搜索过滤，判断是否过滤某一项数据。参数 `filterWords` 表示搜索词，`option`表示单个选项内容，返回值为 `true` 保留该选项，返回值为 `false` 则隐藏该选项。使用该方法时无需设置 `filterable`
    */
@@ -67,7 +71,7 @@ export interface TdAutoCompleteProps<T extends AutoCompleteOption = AutoComplete
    */
   placeholder?: string;
   /**
-   * 透传 Popup 组件全部特性
+   * 透传 Popup 组件全部属性
    */
   popupProps?: PopupProps;
   /**

src/cascader/core/effect.ts

@@ -45,7 +45,7 @@ export function expendClickEffect(
     // 非受控状态下更新状态
     setValue(valueType === 'single' ? value : node.getPath().map((item) => item.value), 'check', node.getModel());
 
-   // 当 trigger 为 hover 时 ，点击节点一定是关闭 panel 的操作
+    // 当 trigger 为 hover 时 ，点击节点一定是关闭 panel 的操作
     if (!checkStrictly || propsTrigger === 'hover') {
       setVisible(false, {});
     }