Code Monkey home page Code Monkey logo

tdesign-react's Introduction

TDesign Logo

License codecov Version Downloads

English | 简体中文

TDesign React is a UI component library for React 16.x and desktop application.

🎉 Features

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

📦 Installation

npm i tdesign-react
yarn add tdesign-react
pnpm add tdesign-react

🔨 Usage

import React from 'react';
import { Button } from 'tdesign-react';
import 'tdesign-react/es/style/index.css';

function App() {
  return <Button>Hello TDesign</Button>;
}

ReactDOM.createRoot(document.getElementById('app')).render(<App />);

The package of tdesign-react 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 React UI components.

Browser Support

IE / Edge
IE / Edge
Firefox
Firefox
Chrome
Chrome
Safari
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.

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-react's People

Contributors

94dreamer avatar andyjxli avatar carolin913 avatar chaishi avatar chrrg avatar dreamsqin avatar duenyang avatar github-actions[bot] avatar haixingooo avatar helkyle avatar honkinglin avatar insekkei avatar kenzyyang avatar ldwonday avatar li-jia-nan avatar littlehorsexie avatar liweijie0812 avatar magentaqin avatar nwylzw avatar pbk-b avatar pengyyyyy avatar samhou1988 avatar shryzhang avatar uyarn avatar wookaoer avatar xiaosansiji avatar xughv avatar ylushen avatar yunfeic avatar zhaorb avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

tdesign-react's Issues

select组件下拉内容被截断

Describe Framework

tdesign-react

Describe Environment

windows 系统(mac未复现)

Describe the bug
select组件下拉内容高度不正确。其中max-height属性比设置的height小,导致被截断。
企业微信截图_16415225163875
企业微信截图_16415225471530

Additional context
复现步骤:
select 组件设置远程搜索,搜索结果未返回时输入新的内容进行搜索。

组件使用如下:
<Select filterable value={uin} onChange={onChange} loading={loading} onSearch={onSearch} placeholder="" popupProps={{ placement: 'bottom-left', overlayStyle: { width: 300, height: 280 } }} >

TimePicker 时间选择器 确定选择时间不生效

Describe Framework

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

Describe Environment

Chrome 96.0

Describe the bug
TimePicker 时间选择器 下拉框后不做任何动作,有时间被选中,但是点击确定不生效,本页没有默认时间的都有这个问题
Link

timepickertdesign.mp4

Popup动画视觉效果

目前看到所有基于popup的弹出窗动画都比较缓慢。给人一种卡顿的感觉,是否考虑优化?

Tdesign 效果

Kapture 2021-12-29 at 19 31 35

Antd效果

QQ20211229-194232-HD

进度条相关问题

Describe Framework

  • tdesign-react

Describe Environment

Add browser version here

Describe the bug
环形进度条半径计算方法有问题
image

修复后
image

相关解释:
image
svg 中 circle 最后呈现的图形总半径其实是「半径 + strokeWidth / 2」

时间选择器相关问题

Describe Framework

  • tdesign-react

Describe Environment
Chrome 95.0.4638.69

Describe the bug
自定义步长时间选择器描述与显示不符。应只显示
的步长展示效果不明显。建议改为 5 分钟间隔。
image

Input缺少onPaste事件支持

Describe Framework

  • tdesign-react

另外建议最好能暴露inputElementRef,以防有什么特殊的需求,例如这种onPaste事件,如果暴露了ref其实外不可以先自行实现一下
PS:主要诉求是pasteEvent的clipboardData

Calendar 日历组件中,选择部分过长!

Describe Framework

  • tdesign-react

Describe Environment

Add browser version here

Describe the bug
Calendar 日历组件中,选择部分超出!期望是可以设置最大高度,在最大高度有一个滚动效果!

image

官网组件展示页,面包屑相关问题

Describe Framework

  • tdesign-react

Describe Environment

Add browser version here

Describe the bug
breadcrumb doc 基础面包屑示例文案错误,「页面2」和「页面3」有多次重复
不知道这个重复的文字算不算有意而为之,如果我理解错的话,烦请关闭这个 issue。多谢!

Additional context
image

类型缺失

Describe Framework

  • tdesign-react

Describe Environment
OSX

Describe the bug
类型推导提示缺失

image
这个情况存在在多个组件中

Additional context

大部分下拉框的组件显示错误

类似select,时间选择器等一些点击下拉弹出图层操作的组件,一旦组件位置处于浏览器底部区域,那么就会有弹出元素位置错误问题

【弹出层】bug,如【select】等组件,弹出层位置特殊时,会闪烁

Describe Framework

  • tdesign-react

Describe Environment

macos

Add browser version here
chrome 版本 96.0.4664.110(正式版本) (arm64)

Describe the bug
A clear and concise description of what the bug is.

image

弹出层相对于屏幕这种情况时【组件下方屏幕不能完全展示时】,选择其中某个,会屏幕闪烁,飞到上方,然后收起,或者鼠标移开,一会重新调整位置到上方【因为下方不能完整展示,上方可以】

image

Untitled

Additional context
Add any other context about the problem here.

闪烁会给部分人造成眩晕等问题。

部分带弹出层的组件都有类似问题

问一下组件导出为啥这样写?

没有仔细研究,看了一下 button 组件,为啥要支持两种导出方式?是有其他目的么

import _Button from './Button';

import './style/index.js';

export type { ButtonProps } from './Button';
export * from './type';

export const Button = _Button;
export default Button;

即使要支持两种导出方式,这样写不是更简单么?

import Button from './Button';
...
export { Button };
export default Button;

dropdown bug

Describe Framework
react web dropdown bug.
tdesign

Describe Environment
chrome
Add browser version here
96.0.4664.110

iframe元素内popup组件弹出位置不正确

Describe Framework

tdesign-react

Describe Environment

Add browser version here

在iframe内使用popup时,popup的attach属性设置iframe内元素时无效,总是放到最外层body下,导致弹出位置不正确。
image

Additional context
Add any other context about the problem here.

下拉菜单 Bug

在靠近屏幕底部的时候,下拉菜单本应该出现在上方,实际 hover 后出现在下方,之后鼠标移动出去下拉菜单会闪现到上方再收起。
官网演示模块稳定出现。

0.19版本到0.20+版本的CSS BEM规范改动列表

由于历史原因,之前的css类名没有很好地规范,为了以后可以更好更规范地推进,在0.20的版本中,我们把之前很多不规范的CSS类名都进行了改动,除了transfer、select和steps之外的组件都进行了类名规范,具体改动如列表所示。注意,在接下来的0.21的版本中,还会把剩余的transfer、select和steps的规范完成。如果您的项目中对TDesign的样式进行了覆盖,请按此表格所列的改动进行修改。

Table组件

组件 原类名 新类名
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组件

组件 原类名 新类名
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

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

[Menu] 双层导航 菜单切换后子菜单 bar 位置不对

Describe Framework

  • tdesign-react

Describe Environment

Add browser version here

Describe the bug
官网示例 -> 双层导航 -> 选择「菜单3」 -> 选择「二级菜单-2」-> 选择「菜单2」
效果:原「二级菜单-2」下的蓝条并未消失
image

Additional context
Add any other context about the problem here.

tdesign-site-components td-doc-header 组件问题

Describe Framework

  • tdesign-react

Describe Environment

Chrome 96.0.4664.110 arm64

Describe the bug
When using the document.documentElement.setAttribute method to switch from dark mode back to light mode, the src of the iframe in <td-doc-header> does not change. (Under a specific page: https://tdesign.tencent.com/react/components/dark-mode)

使用document.documentElement.setAttribute方法在特定页面将主题从暗黑切换回明亮模式后,<td-doc-header> 组件中 ifrrame 的 src 没有正确切换回来。页面地址:https://tdesign.tencent.com/react/components/dark-mode。

Steps to reproduce

  1. visit https://tdesign.tencent.com/react/components/dark-mode
  2. document.documentElement.setAttribute('theme-mode', 'dark')
  3. document.documentElement.removeAttribute('theme-mode')

New tabs style

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

No it's not related to a problem.

Describe the solution you'd like

It would be nice to have the tab header styled like the tab switch on documentation page:
image

Maybe it could be to add another theme called switcher so one would use it like this:

      <Tabs placement={'top'} size={'medium'} theme={'switcher'} disabled={false}>
        <TabPanel value={'1'} label={'1'}>
          <div style={{ margin: 20 }}>这是一个Tabs</div>
        </TabPanel>
        <TabPanel value={'2'} label={<div>2</div>}>
          <div style={{ margin: 20 }}>这是一个Tabs</div>
        </TabPanel>
      </Tabs>

Describe alternatives you've considered

Currently no alternatives. Maybe someone could pull some CSS tricks to achieve similar styling.

Additional context

No additional context.

希望Layout中的Sider增加对styled-components的支持

文档描述

当子元素中包含 <Aside> 时,全部子元素会水平排列,否则会垂直排列。

现状

我使用styled-components包裹了一下Sider组件,希望能在保持横向flex的同时自定义侧边栏的样式。

import React from 'react';
import { Layout } from 'tdesign-react';
import styled from 'styled-components';

const { Header, Content, Sider } = Layout;

const StyledHeader = styled(Header)`
  background: white;
  font-size: 1.5rem;
  box-shadow: 2px 1px 2px 0 gray;
  position: sticky;
  z-index: 200;
`;
const StyledSider = styled(Sider)`
  border-radius: 0.5rem;
`;
const IconContainer = styled.div`
  width: 14.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
`;
const Root = styled(Layout)`
  min-height: 100vh;
`;
console.log(<StyledSider />);
console.log(<Sider />);

const LayoutContainer: React.FC = () => {
  return (
    <Root>
      <StyledHeader>
        <IconContainer>View Mock</IconContainer>
      </StyledHeader>
        <Layout>
          <StyledSider>
            1
          </StyledSider>
          <Content>
            123
          </Content>
        </Layout>  
    </Root >
  )
};

export default LayoutContainer;

表现:

layout3

实际渲染出来的direction是纵向的。

个人分析:

Layout的Class挂载逻辑可能不支持styled-components,在这个情况下的Layout class如下图所示:

layout4

t-layout,而观察源码:

layout5

发现横向时的代码应该是t-layout--with-sider,因为useEffect中判断有无Sider组件的逻辑是根据child.type判断的,而Styled-components会把组件封装一次,将原组件的类型保存到target属性中,导致Layout的方向失效。

layout6

如图:上面是Styled-components组件,下面是t-design的Sider组件,可以看到Sider组件类型被封装到了type.target属性里,导致Layout没有在逻辑中找到children中的Sider组件。

Message close 关闭无响应

Describe Framework

  • tdesign-react

Describe Environment

Describe the bug
Message close 点击关闭,无响应!

Additional context

image

API文档优化

1. 目前API的复杂类型都是通过跳转的方案展示的,在实际使用中有所不便。是否考虑当前页展示

image

目前看到比较好的两种方案是:

  1. 当前页紧随其后展示复杂类型
  2. 当前复杂类型点击弹窗展示

2. API类型取值定义不够清晰明了。

例如: dialog组件的API
image

最好是类型一栏有强提醒 & 更加详细的类型。而不是TS的基本类型

[Table] 基础示例 Pagination 不正常工作

Describe Framework

  • tdesign-react

Describe Environment

Add browser version here

Describe the bug
基础示例 Pagination 不正常工作
点击无反应
image

Additional context
Add any other context about the problem here.

Cascader斜八度动画层级遮挡

Describe Framework

  • tdesign-react

Describe Environment

Version 96.0.4664.110 (Official Build) (arm64)

Describe the bug

Cascader斜八度动画层级遮挡

Additional context
cascader

compare with select

select

Tooltip 视觉效果

Describe Framework

  • tdesign-react

Describe Environment

Version: Mac OS Chrome/96.0

Describe the bug
Tooltip 视觉效果,如图,三角icon下出现了一个镂空的边,是设计效果吗,

Additional context

Content:
image

OTHERS

增加几个labels吧,方便标记与筛选问题

【Tree 组件】当每个节点都满足过滤条件时,展示不正确

Describe Framework

  • tdesign-react

Describe Environment

Chrome

Describe the bug

当每个节点都满足过滤条件时,展示不正确,详情见 codesandbox,具体操作是:
输入字符 1,期待的效果是包含 1 字符的节点都应该可以展示出来,但是并没有,初步判定是每个节点的 isRest 都为 true 导致程序内部不能判断是否处于过滤状态。

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.