tencent / tdesign-vue-next

A Vue3.x UI components lib for TDesign.

English | 简体中文

TDesign Vue Next is a UI component library for Vue 3 and desktop application.

🎉 Features

• Desktop application interaction
• High quality UI components for Vue 3.x
• Consistent API and UI with TDesign component libraries for other frameworks
• Dark mode and customizable theme
• Support tree-shaking

📦 Installation

npm i tdesign-vue-next

🔨 Usage

import { createApp } from 'vue';
import { Button } from 'tdesign-vue-next';

import 'tdesign-vue-next/es/style/index.css';

import App from './app.vue';

const app = createApp(App);
app.use(Button);

The package of tdesign-vue-next provides kinds of bundles, read the documentation for the detail of differences between bundles.

Quick Start

Visit TDesign Starter to experience in the application built with TDesign Vue Next UI components.

Browser Support

IE / Edge	Firefox	Chrome	Safari
Edge >=84	Firefox >=83	Chrome >=84	Safari >=14.1

Read our browser compatibility for more details.

TDesign component libraries

TDesign also provides component libraries for other platforms and frameworks.

• component library for Vue 2.x : tdesign-vue
• component library for React : tdesign-react
• component library for Wechat miniprogram : tdesign-miniprogram

Contributing

Contributing is welcome. Read guidelines for contributing before submitting your Pull Request.

Contributors

Feedback

Create your Github issues or scan the QR code below to join our user groups

License

The MIT License. Please see the license file for more information.

tdesign-vue-next's Issues

树选择器 点击关闭触发了下拉框

选择一个后点击关闭,

意外的弹出了下拉框.

为什么不使用 compositionApi 进行开发

如题, 有使用 compositionApi 进行重构的计划吗

[Improve][Input]组件功能增强

• 建议功能
  

• 远程搜索功能

• 输入长度限制功能

按需加载没有吗？

没找见文档

[BUG][Icon] 组件动态切换无效

<icon-font :name="collapsed ? 'menu-fold' : 'menu-unfold'"> 当我改变collapsed值时组件name并未切换。

如果分开写成2个能正常切换
<icon-font v-if="collapsed" name="menu-fold"><icon-font v-else name="menu-unfold">

datepicker日期选择器问题

Describe Framework

• tdesign-vue
• tdesign-vue-next
• tdesign-react
• tdesign-miniprogram

Describe Environment
[email protected]

Add browser version here
"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.110 Safari/537.36"

Describe the bug
当我们使用datepicker组件时，其中选择精确地时间（时分秒），选择后点击确认按钮，这时候输入框不显示精确时间。

Additional context

[Bug][Table]已设置每列宽度，当父容器变宽后标题和内容页错位

Describe Environment

browser version:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.110 Safari/537.36 Edg/96.0.1054.62
tdesign-vue-next version:0.6.0

Describe the bug

table已设置每列宽度，当父容器变宽后标题和内容页错位
设置height属性后才会出现该问题

一些建议

我有一些想法，想提 pr ，但是 fork 只有遇到了些项目问题，有可以讨论的群吗

[Bug][Tabs]增删选项卡bug

tdesign-vue版本：

[Improve][Message] 优化显示动画

Drawer 默认的确认按钮无效

绑定了onConfirm属性, 点击时无效.
另外, 同时绑定属性onConfirm和事件confirmd会导致vue的警告

此二api是否重复.

使用自定义的按钮可以正常使用, 如图打印出了confirm.

🎉 Composition Api 重构计划

说明

1. 使用 Composition Api 语法重构，文件类型依然使用 tsx
2. 参与贡献请在此 issue 中评论领取的组件
3. 重构时的思考，避免 optionsAPI 照搬 compositionAPI
4. 重构前联系管理员先进行一轮组件的 review

开发规范

https://github.com/Tencent/tdesign-vue-next/wiki/TDesign--CompositionAPI-%E5%BC%80%E5%8F%91%E8%A7%84%E8%8C%83

基础Hook:

• useConfig：全局配置 hook。 @PengYYYYY
• useEmitEvent: @vnues #177 (不推荐，事件参数类型不明确，建议直接使用 props.onXXX)
• useDefault： 用于实现 v-model，内置受控和非受控处理。 @chaishi
• useVModel： 用于实现 v-model:xxx，内置受控和非受控处理。 @chaishi
• useTNode: 用于在 setup 组合 TNode，render 函数渲染 TNode 请使用 renderTNodeJSX。 @PengYYYYY
• useChildComponentSlots：渲染 default slot，获取子组件 VNode。处理多种子组件创建场景。
• useIcon: 多种icon的render方式 @vnues
• useVirtualScroll @Louiszhai

组件

全局组件

• config-provider - @PengYYYYY

基础

• button - @amadeus711 #106

布局

• grid - @PengYYYYY #233
• layout - @PengYYYYY #233

导航

• affix - @btea #105
• anchor - @Blackn-L #646
• breadcrumb - @Blackn-L #567
• dropdown - @qunbotop #749
• pagination - @youuss #282
• steps - @k1nz #584
• tabs - @LeeJim #490

输入

• cascader - @PengYYYYY - #585
• checkbox - @whylost -#436
• date-picker - @HQ-Lin #943
• form - @k1nz - #782
• input - @youuss #588
• input-number - @youuss #588
• radio - @k1nz #555
• select - @PengYYYYY #965
• slider - @ChrisLee0211 #552
• switch -@zouhangwithsweet #434
• textarea - @btea #432
• transfer - @btea #496
• time-picker - @uyarn #943
• tree-select -@Godlike-meteor #508
• upload - @PengYYYYY #427

数据展示

• avatar - @vnues #160
• badge - @ChrisLee0211 #402
• calendar - @PsTiu #472
• comment - @simpleAndElegant #263
• list - @ChrisLee0211 #321
• progress - @Blackn-L #276
• table - @chaishi #468
• tag - @higuaifan #273
• tooltip- @cca313 #566
• tree - @PengYYYYY #857

消息提醒

• alert - @vnues #159
• dialog- @vnues #312
• drawer - @vnues #210
• loading - @uyarn #212
• message - @qunbotop #539
• notification - @qunbotop #429
• pop-confirm - @PengYYYYY #410
• popup @ikeq #635

[Bug] [Table] Vue3 树形表格，演示站

Vue3版本的
树形表格有BUG，如果两个项展开，插入数据的位置有问题

[Bug][Table]设置高度后，thead属性z-index高于菜单

table设置高度后，thead属性z-index高于菜单

menu菜单三级菜单无缩进效果

tdesign-vue-next

tdesign-vue

Table 组件是否能加入虚拟滚动

tooltip提示会有白边

element-ui

tdesign

TreeSelect 树选择 错误的显示了更多

即使选择项全部展示也还是显示了更多

源码里面有card，为什么文档没有介绍也不能用呢

源码里面有card，为什么文档没有介绍也不能用呢

[Bug][Tabs] 选项卡只能选中右侧选项后才能滑动

[Improve][Tree] 树能支持拖动吗

tdesign-vue-next

You will open an feature issue at tdesign-vue-next

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

inputNumber会有遮挡

Describe Framework

• tdesign-vue
• tdesign-vue-next
• tdesign-react
• tdesign-miniprogram

Describe Environment
chrome 96.0.4664.110
Describe the bug
数字长一点的时候，就会有数字遮挡，inputNumber的demo里可以复现

我打开控制台看了一下，是这个css造成的

[Improve][table] 表格能添加那种和tree结合形式么

tdesign-vue-next

You will open an feature issue at tdesign-vue-next

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

[Bug] [Menu] 当menu父容器设置有overflow-x:auto的时候，子menu无法展示

设置了 overflow-x: auto 就会将y的默认值visible改成auto；
因此相当于 overflow: auto 从而导致y轴的被隐藏。
所以，目前没办法通过简单改 css 来实现x轴溢出时滚动，需要调整下 DOM 。

觉得可以出个Space 间距组件

是否考虑出个Space 组件

日历组件年份与月份禁用演示错误

Describe Framework

• tdesign-vue
• tdesign-vue-next
• tdesign-react
• tdesign-miniprogram
  日历组件演示错误
  
  

[improve] [Form] 表单组件自定义校验如果为数字类型存在问题

tdesign-vue-next

You will open an feature issue at tdesign-vue-next

Is your feature request related to a problem? Please describe.

当前情况，所有的表单校验，max/min都是默认校验字符串的长度是否符合规则，但是如果为数字类型，个人理解理论上max/min应该校验的是其值是否 >min or <max

 max: (val: ValueType, num: number): boolean => getCharacterLength(val) <= num,
 min: (val: ValueType, num: number): boolean => val.length >= num,

逻辑修改

如果值为数字，由于数字很少有长度的定义，校验规则 max 和 min 自动更为数值大小的校验

cascader小尺寸下拉框中尺寸未改变

cascader小尺寸未变小：

对比select小尺寸有变小：

关于本地dev的问题

• 样式链接问题
• vite依赖不存在 等

我不知道是我个人的问题, 还是项目搭建的不够严谨, 或者官方可以给出一份相应的如何参与贡献地文档

我觉的 fork 后
直接 yarn / pnpm install / npm install
然后运行相应的命令(如 npm run start )就可以启动项目, 才是一种让人愉悦的体验

上方抽屉无动画效果，并且显示卡顿

Describe Framework

• tdesign-vue
• tdesign-vue-next
• tdesign-react
• tdesign-miniprogram

双层导航菜单演示错误

Describe Framework

• tdesign-vue
• tdesign-vue-next
• tdesign-react
• tdesign-miniprogram

vue3版本：

vue2版本：

table表格 最小宽度问题

1.table表格设置了最小宽度时，挤压到最小会按照最小宽度平均值设置
例如 ：1.有2列设置了minWidth 分别为100 和 200 挤压到最小，这两列默认的最小宽度都会置为（100+200）/2 .
2.有2列，1列设置了minWidth为100，另外一列自适应，这两列默认的最小宽度都会置为（100+0）/2 .

2.table表格是不是必须要设置一个固定列，才能去进行滚动，感觉蛮奇怪的。

演示页面演示代码报错

Describe Framework

• tdesign-vue
• tdesign-vue-next
• tdesign-react
• tdesign-miniprogram
  

Dialog组件 footer的按钮样式偏移

鼠标悬停时, 按钮的背景会往下做出一点移动,
导致文本不再是垂直居中, 且两个按钮不在同一水平线上.

滑块只有在鼠标移入元素时会显示弹窗

antd

Tree 树 不够流畅，有点卡顿

不够流畅，有点卡顿

0.5.0 升级至 0.6.0 版本 CSS BEM 规范改动列表

由于历史原因，之前的 CSS 类名没有很好地规范，为了以后可以更好更规范地推进，在 0.6.0 的版本中，我们把之前很多不规范的 CSS类名都进行了改动，具体改动如列表所示：

表格组件

组件	原类名	新类名
Table	table-body	t-table__body
Table	align-center	t-align-center
Table	align-left	t-align-left
Table	align-right	t-align-right
Table	text-ellipsis	t-text-ellipsis
Table	t-table-pagination	t-table__pagination
Table	t-table-sort-icon	t-table__sort-icon
Table	t-table-double-icons	t-table__double-icons
Table	t-table-sort-icon-active	t-table__sort-icon--active
Table	t-table-expand-box	t-table__expand-box
Table	t-table-sort-icon-active	t-table__sort-icon--active
Table	t-table-content	t-table__content
Table	t-table-expandable-icon-cell	t-table__expandable-icon-cell
Table	t-table--empty	t-table__empty
Table	t-table-valign__top	t-table--align-top
Table	t-table--loading-async	t-table__async-loading
Table	t-table--loading-status-loading	t-is-loading
Table	t-table--loading-status-load-more	t-is-load-more
Table	t-table-filter-icon	t-table__filter-icon
Table	t-table-filter-pop	t-table__filter-pop
Table	t-table-filter-pop-content	t-table__filter-pop-content
Table	t-table-filter-pop-content__inner	t-table__filter-pop-content-inner
Table	t-table-content--scrollable-to-left	t-table__content--scrollable-to-left
Table	t-table-content--scrollable-to-right	t-table__content--scrollable-to-right
Table	t-table-expanded-cell	t-table__expanded-cell

Menu 组件

组件	原类名	新类名
MenuGroup	t-menu-group-title	t-menu-group__title

Dropdown组件

组件	原类名	新类名
Dropdown 组件	t-dropdown__menu__column	t-dropdown__menu-column
Dropdown 组件	t-dropdown__item__content	t-dropdown__item-content
Dropdown 组件	t-dropdown__item__content_text	t-dropdown__item-text
Dropdown 组件	has-suffix	t-dropdown--suffix
Dropdown 组件	children-suffix	t-dropdown__item-icon

Divider组件

组件	原类名	新类名
Divider 组件	t-divider-inner-text	t-divider__inner-text

Drawer组件

组件	原类名	新类名
Drawer 组件	t-drawer-attach	t-drawer--attach
Drawer 组件	t-drawer-left	t-drawer--left
Drawer 组件	t-drawer-right	t-drawer--right
Drawer 组件	t-drawer-top	t-drawer--top
Drawer 组件	t-drawer-bottom	t-drawer--bottom
Drawer 组件	t-drawer-open	t-drawer--open
Drawer 组件	t-drawer-no-mask	t-drawer--without-mask
Drawer 组件	t-drawer-confirm	t-drawer__confirm
Drawer 组件	t-drawer-cancel	t-drawer__cancel

组件	原类名	新类名
Pagination	t-pagiantion__btn--prev	t-pagiantion__btn-prev
Pagination	t-pagiantion__btn--next	t-pagiantion__btn-next

Dialog 组件

组件	原类名	新类名
Dialog	t-dialog-ctx	t-dialog__ctx
Dialog	t-dialog-ctx--fixed	t-dialog__ctx--fixed
Dialog	t-not-visable	t-is-hidden
Dialog	t-dialog-mask	t-dialog__mask
Dialog	t-dialog-mask--hidden	t-is-hidden
Dialog	t-dialog-confirm	t-dialog__confirm
Dialog	t-dialog-cancel	t-dialog__cancel

Message

组件	原类名	新类名
Message	t-message-close	t-message__close
Message	t-message-list	t-message__list

Notification

组件	原类名	新类名
Notification	t-notification__detail--item	t-notification__detail-item

Anchor组件

组件	原类名	新类名
Anchor 组件	t-anchor_line	t-anchor__line
Anchor 组件	t-anchor-item	t-anchor__item
Anchor 组件	t-anchor-item_link	t-anchor__item-link
Anchor 组件	t-anchor-target	t-anchor__target
Anchor 组件	cursor-wrapper	t-anchor__line-cursor-wrapper
Anchor 组件	cursor	t-anchor__line-cursor
Anchor 组件	t-copy	t-anchor__copy

Slider组件

组件	原类名	新类名
Slider 组件	t-slider-contianer	t-slider__container
Slider 组件	t-slider-input-container	t-slider__input-container
Slider 组件	center-line	t-slider__center-line
Slider 组件	t-slide-vertical	t-slide--vertical

Form 组件

组件	原类名	新类名
Form 组件	t-form__controls--content	t-form__controls-content

Badge

组件	原类名	新类名
Badge 组件	t-badge-static	t-badge--static

List

组件	原类名	新类名
List	t-list-items	t-list__inner

Cascader 组件

组件	原类名	新类名
Cascader 组件	t-cascader-placeholder	t-cascader__placeholder
Cascader 组件	t-cascader-content	t-cascader__content
Cascader 组件	t-cascader-is-multiple	t-cascader--multiple
Cascader 组件	t-cascader-dropdown	t-cascader__dropdown
Cascader 组件	t-cascader-panel	t-cascader__panel
Cascader 组件	t-cascader-menu	t-cascader__menu
Cascader 组件	t-cascader-item	t-cascader__item
Cascader 组件	t-cascader-item--highlight	t-cascader__item--highlight
Cascader 组件	t-cascader-item-have-icon	t-cascader__item--with-icon
Cascader 组件	t-cascader-item-is-leaf	t-cascader__item--leaf
Cascader 组件	t-cascader-item__label	t-cascader__item-label
Cascader 组件	t-cascader-item__label--filter	t-cascader__item-label--filter
Cascader 组件	t-cascader-item__is-empty	t-cascader__empty
Cascader 组件	t-cascader-menu__seperator	t-cascader__menu-seperator
Cascader 组件	t-cascader-menu__filter	t-cascader__menu-filter
Cascader 组件	t-cascader-search-input	t-cascader__search-input
Cascader 组件	t-cascader-icon	t-cascader__icon
Cascader 组件	t-cascader-item-icon	t-cascader__item-icon
Cascader 组件	t-cascader-panel	t-cascader__panel

Calendar组件

组件	原类名	新类名
Calendar 组件	t-is-now	t-calendar__table-body-cell--now
Calendar 组件	t-calendar__table-body-cell-value	t-calendar__table-body-cell-display

DatePicker 组件

组件	原类名	新类名
DatePicker	t-date-picker-popup-reference	t-date-picker__popup-reference
DatePicker	t-date-picker--container	t-date-picker__container
DatePicker	t-date-picker--panels	t-date-picker__panels
DatePicker	t-date-picker-header	t-date-picker__header
DatePicker	t-date-picker-header-title	t-date-picker__header-title
DatePicker	t-date-header__btn	t-date-picker__header-btn
DatePicker	t-date-picker-header-controller	t-date-picker__header-controller
DatePicker	t-date-cell__wrapper	t-date-picker__cell-wrapper
DatePicker	t-date-picker-year	t-date-picker--year
DatePicker	t-date-picker-month	t-date-picker--month
DatePicker	t-date-picker-date	t-date-picker--date
DatePicker	t-date-picker-range	t-date-picker--range
DatePicker	t-date-cell__text	t-date-picker__cell-text
DatePicker	t-date-picker-presets	t-date-picker__presets
DatePicker	t-date	t-date-picker__panel
DatePicker	t-date-cell--now	t-date-picker__cell--now
DatePicker	t-date-cell--active	t-date-picker__cell--active
DatePicker	t-date-cell--disabled	t-date-picker__cell--disabled
DatePicker	t-date-cell--highlight	t-date-picker__cell--highlight
DatePicker	t-date-cell--active-start	t-date-picker__cell--active-start
DatePicker	t-date-cell--active-end	t-date-picker__cell--active-end
DatePicker	t-date-cell--additional	t-date-picker__cell--additional
DatePicker	t-date-cell--first-day-of-month	t-date-picker__cell--first-day-of-month
DatePicker	t-date-cell--last-day-of-month	t-date-picker__cell--last-day-of-month

Grid 组件

组件	原类名	新类名
Grid	t-row-start	r-row--start
Grid	t-row-center	r-row--center
Grid	t-row-end	r-row--end
Grid	t-row-space-between	t-row--space-between
Grid	t-row-space-around	t-row--space-around
Grid	t-row-top	t-row--top
Grid	t-row-middle	t-row--middle
Grid	t-row-bottom	t-row--bottom

Layout

组件	原类名	新类名
Layout	t-layout-has-sider	t-layout--with-sider
Layout	t-layout--header	t-layout__header
Layout	t-layout--content	t-layout__content
Layout	t-layout--sider	t-layout__sider
Layout	t-layout--footer	t-layout__footer

Popup

组件	原类名	新类名
Popup	t-popup-content	t-popup__content
Popup	t-popup-reference	t-popup__reference
Popup	t-popup_animation-enter	t-popup--animation-enter
Popup	t-popup_animation-enter-from	t-popup--animation-enter-from
Popup	t-popup_animation-exiting	t-popup--animation-exiting
Popup	t-popup_animation-leave-to	t-popup--animation-leave-to
Popup	t-popup_animation-enter-to	t-popup--animation-enter-to
Popup	t-popup_animation-entering	t-popup--animation-entering
Popup	t-popup_animation-leave-from	t-popup--animation-leave-from
Popup	t-popup_animation-leave	t-popup--animation-leave
Popup	t-popup_animation-enter-active	t-popup--animation-enter-active
Popup	t-popup_animation-leave-active	t-popup--animation-leave-active

Tooltip

组件	原类名	新类名
Tooltip	t-tooltip-light	t-tooltip--light
Tooltip	t-tooltip-default	t-tooltip--default
Tooltip	t-tooltip-primary	t-tooltip--primary
Tooltip	t-tooltip-success	t-tooltip--success
Tooltip	t-tooltip-danger	t-tooltip--danger
Tooltip	t-tooltip-warning	t-tooltip--warning

Popup

组件	原类名	新类名
Popup	t-popup-content	t-popup__content
Popup	t-popup-reference	t-popup__reference
Popup	t-popup_animation-enter	t-popup--animation-enter
Popup	t-popup_animation-enter-from	t-popup--animation-enter-from
Popup	t-popup_animation-exiting	t-popup--animation-exiting
Popup	t-popup_animation-leave-to	t-popup--animation-leave-to
Popup	t-popup_animation-enter-to	t-popup--animation-enter-to
Popup	t-popup_animation-entering	t-popup--animation-entering
Popup	t-popup_animation-leave-from	t-popup--animation-leave-from
Popup	t-popup_animation-leave	t-popup--animation-leave
Popup	t-popup_animation-enter-active	t-popup--animation-enter-active
Popup	t-popup_animation-leave-active	t-popup--animation-leave-active

Tooltip

| 组件 | 原类名 | 新类名 |
|-----|-----|
| Tooltip | t-tooltip-light | t-tooltip--light |
| Tooltip | t-tooltip-default | t-tooltip--default |
| Tooltip | t-tooltip-primary | t-tooltip--primary |
| Tooltip | t-tooltip-success | t-tooltip--success |
| Tooltip | t-tooltip-danger | t-tooltip--danger |
| Tooltip | t-tooltip-warning | t-tooltip--warning |

Radio

组件	原类名	新类名
Radio	t-radio-group-outline	t-radio-group__outline
Radio	t-radio-group-filled	t-radio-group--filled
Radio	t-radio-group-filled-bg-block	t-radio-group__bg-block
Radio	t-radio-group-primary-filled	t-radio-group--primary-filled
Radio	t-radio-group-small	t-size-s
Radio	t-radio-group-medium	t-size-m
Radio	t-radio-group-large	t-size-l

TimePicker

组件	原类名	新类名
TimePicker	t-time-picker-panel__container	t-time-picker__panel-container
TimePicker	t-time-picker-panel	t-time-picker__panel
TimePicker	t-time-picker-panel__body	t-time-picker__panel-body
TimePicker	t-time-picker-panel-section	t-time-picker__panel-section
TimePicker	t-time-picker-panel-section__body	t-time-picker__panel-section-body
TimePicker	t-time-picker-panel-section__footer	t-time-picker__panel-section-footer

Tree

组件	原类名	新类名
Tree	t-tree--fx	t-tree--transition
Tree	t-tree-toggle-enter-active	t-tree__item--enter-active
Tree	t-tree-toggle-leave-active	t-tree__item--leave-active

Upload

组件	原类名	新类名
Upload	t-upload-icon-delete	t-upload__icon-delete
Upload	t-upload-list__file	t-upload__list-file
Upload	t-upload-list__item	t-upload__list-item
Upload	t-upload-list__name	t-upload__list-name
Upload	t-upload-list__content	t-upload__list-content
Upload	t-upload-list__controll	t-upload__list-controll
Upload	t-upload-list__img	t-upload__list-img
Upload	t-upload__highlight	t-upload--highlight
Upload	t-upload-dialog	t-upload__dialog
Upload	t-upload-card__mask-disabled	t-is-disabled
Upload	t-upload__small	t-size-s
Upload	t-display-text--margin	t-upload__display-text--margin
Upload	t-upload-card-container	t-upload__card-container
Upload	t-upload-card	t-upload__card
Upload	t-upload-card__item	t-upload__card-item
Upload	t-upload-card__name	t-upload__card-name
Upload	t-upload-card__content	t-upload__card-content
Upload	t-upload-card__mask__item	t-upload__card-mask-item
Upload	t-upload-card__status-wrap	t-upload__card-status-wrap
Upload	t-upload-card__content-border	t-is-bordered
Upload	t-upload-card__status	t-upload__card-status
Upload	t-upload-card__mask	t-upload__card-mask
Upload	t-upload-dialog__body-img-box	t-upload__dialog-body-img-box

Transfer

组件	原类名	新类名
Transfer	t-transfer-list	t-transfer__list
Transfer	t-transfer-list-source	t-transfer__list-source
Transfer	t-transfer-list-target	t-transfer__list-target
Transfer	t-transfer-list__header	t-transfer__list-header
Transfer	t-transfer-list__body	t-transfer__list-body
Transfer	t-transfer-list-with-search	t-transfer__list--with-search
Transfer	t-transfer-list-search-wrapper	t-transfer__search-wrapper
Transfer	t-transfer-list__content	t-transfer__list-content
Transfer	t-transfer-list__item	t-transfer__list-item
Transfer	t-transfer-list__wrapper	t-transfer__list-wrapper
Transfer	t-transfer-list__pagination	t-transfer__list-pagination
Transfer	t-transfer-list__footer	t-transfer__list-footer
Transfer	t-transfer-operations	t-transfer__operations
Transfer	t-transfer-search	t-transfer__search
Transfer	t-transfer-with-tree	t-transfer--with-tree
Transfer	t-transfer-pagination	t-transfer__pagination
Transfer	t-transfer-footer	t-transfer__footer
Transfer	t-transfer-wrapper	t-transfer__wrapper

Select组件

组件	原类名	新类名
Select 组件	t-select-wrap	t-select__wrap
Select 组件	t-select-right-icon	t-select__right-icon
Select 组件	t-select-left-icon	t-select__left-icon
Select 组件	t-select-placeholder	t-select__placeholder
Select 组件	t-select-input	t-select__input
Select 组件	t-select-popup-reference	t-select__popup-reference
Select 组件	t-select-dropdown	t-select__dropdown
Select 组件	t-select-empty	t-select__empty
Select 组件	t-select-loading-tips	t-select__loading-tips
Select 组件	t-select-selectedSingle	t-select__single
Select 组件	t-option-group	t-select-option-group
Select 组件	t-option-group__divider	t-select-option-group__divider
Select 组件	t-option-group-header	t-select-option-group__header
Select 组件	t-select-right-icon__clear	t-select__right-icon-clear
Select 组件	t-select-active-icon	t-select__active-icon

Steps

组件	原类名	新类名
Steps	t-steps-item-content	t-steps-item__content
Steps	t-steps-item-title	t-steps-item__title
Steps	t-steps-item-icon	t-steps-item__icon
Steps	t-steps-item-description	t-steps-item__description
Steps	t-steps-item-canclick	t-steps-item--clickable
Steps	default-step-icon	t-steps__default-icon

Transfer 穿梭框 树结构未能如期进行全选,单选穿梭

全选样式异常

单选无法点击

Select 选择器演示站创建新条目报错

Popconfirm点击确认后位置变动

Describe Environment
browser version:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.110 Safari/537.36 Edg/96.0.1054.62
tdesign-vue-next version:0.6.0

Describe the bug

浏览器出现滚动条后，拖到最下面点击Popconfirm确认键后位置变动

年份选择器样式偏差

input演示站不同尺寸实际是相同尺寸

tdesign-vue-next版本：

tdesign-vue版本：

官方demo中日期选择器 点击七天前无效

点击七天前按钮, 视觉上active会跳到17号.

窗口动画后, 选择器上的日期仍为 2021-12-23.

[Bug][Cascader]组件任意一级缺少高亮效果，变更窗口大小时，弹窗未更新定位

对比
选中时：

未选中时：

变更了浏览器窗口

menu菜单禁用还可以点击

Tabs渲染问题

0.6.0版本Tabs会将渲染成tab。

[Bug][Select] 在Popup中使用Select组件，Select组件展开后点击空白处无法正常关闭

tdesign-vue-next

You will open a bug issue at tdesign-vue-next。

Describe Environment

• browser version: chrome
• tdesign-vue-next version: 0.6.0

Describe the bug

<template>
  <t-popup
    trigger="click"
    placement="bottom-left"
  >
    <template #content>
      <div style="width: 300px; height: 300px;">
        <t-select>
          <t-option value="apple" label="apple" />
          <t-option value="pear" label="pear" />
        </t-select>
      </div>
    </template>
    <div>click me</div>
  </t-popup>
</template>

Drawer 抽屉点击确定无法关闭抽屉&&取消关闭卡顿

抽屉从顶部弹出时关闭明显相对于其他三个位置弹出卡顿，点击确定按钮无法关闭抽屉

tree 有修改名称的api或者设计吗

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

[BUG] [TimePicker] 时间选择器无法正常计算滚动高度