diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md index 03cf137971..34c45f1003 100644 --- a/CHANGELOG.en-US.md +++ b/CHANGELOG.en-US.md @@ -15,6 +15,17 @@ timeline: true --- +## 4.21.5 + +`2022-07-03` + +- 🐞 Fix Checkbox cannot be disabled by Form `disabled` prop. [#36345](https://github.com/ant-design/ant-design/pull/36345) +- 🐞 Fix Button `loading` prop with `null` value. [#36288](https://github.com/ant-design/ant-design/pull/36288) [@kejianfeng](https://github.com/kejianfeng) +- 🐞 Fix popover arrow compatibility problem on some browsers. [#36266](https://github.com/ant-design/ant-design/pull/36266) +- 🐞 Fix extra shadow in nested Table. [#36277](https://github.com/ant-design/ant-design/pull/36277) +- 🐞 Fix that some class name in Divider cannot be customized. [#36271](https://github.com/ant-design/ant-design/pull/36271) [@alanhaledc](https://github.com/alanhaledc) +- 🇧🇾 Update Belarusian locale. [#36265](https://github.com/ant-design/ant-design/pull/36265) + ## 4.21.4 `2022-06-27` diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md index 6e448cc249..c168d1a8a3 100644 --- a/CHANGELOG.zh-CN.md +++ b/CHANGELOG.zh-CN.md @@ -15,6 +15,17 @@ timeline: true --- +## 4.21.5 + +`2022-07-03` + +- 🐞 修复 Checkbox 不会被 Form `disabled` 属性禁用的问题。[#36345](https://github.com/ant-design/ant-design/pull/36345) +- 🐞 修复 Button `loading` 属性传入 `null` 时错误问题。[#36288](https://github.com/ant-design/ant-design/pull/36288) [@kejianfeng](https://github.com/kejianfeng) +- 🐞 修复弹出框箭头在某些浏览器上的兼容性问题。[#36266](https://github.com/ant-design/ant-design/pull/36266) +- 🐞 修复 Table 滚动阴影在内嵌表格内出现的问题。[#36277](https://github.com/ant-design/ant-design/pull/36277) +- 🐞 修复 Divider 部分类名无法自定义的问题。[#36271](https://github.com/ant-design/ant-design/pull/36271) [@alanhaledc](https://github.com/alanhaledc) +- 🇧🇾 调整白俄罗斯国际化语言。[#36265](https://github.com/ant-design/ant-design/pull/36265) + ## 4.21.4 `2022-06-27` diff --git a/components/calendar/demo/basic.md b/components/calendar/demo/basic.md index 4ecb5b98bb..e8144f2168 100644 --- a/components/calendar/demo/basic.md +++ b/components/calendar/demo/basic.md @@ -15,8 +15,8 @@ A basic calendar component with Year/Month switch. ```tsx import { Calendar } from 'antd'; -import type { CalendarMode } from 'antd/lib/calendar/generateCalendar'; import type { Dayjs } from 'dayjs'; +import type { CalendarMode } from 'antd/es/calendar/generateCalendar'; import React from 'react'; const App: React.FC = () => { diff --git a/components/calendar/demo/card.md b/components/calendar/demo/card.md index f20188f66b..a5b489b59d 100644 --- a/components/calendar/demo/card.md +++ b/components/calendar/demo/card.md @@ -15,8 +15,8 @@ Nested inside a container element for rendering in limited space. ```tsx import { Calendar } from 'antd'; -import type { CalendarMode } from 'antd/lib/calendar/generateCalendar'; import type { Dayjs } from 'dayjs'; +import type { CalendarMode } from 'antd/es/calendar/generateCalendar'; import React from 'react'; const App: React.FC = () => { diff --git a/components/calendar/demo/customize-header.md b/components/calendar/demo/customize-header.md index ac1ec4e0b7..0a16423e87 100644 --- a/components/calendar/demo/customize-header.md +++ b/components/calendar/demo/customize-header.md @@ -15,11 +15,11 @@ Customize Calendar header content. ```tsx import { Calendar, Col, Radio, Row, Select, Typography } from 'antd'; -import type { CalendarMode } from 'antd/lib/calendar/generateCalendar'; import type { Dayjs } from 'dayjs'; import dayjs from 'dayjs'; import 'dayjs/locale/zh-cn'; import dayLocaleData from 'dayjs/plugin/localeData'; +import type { CalendarMode } from 'antd/es/calendar/generateCalendar'; import React from 'react'; dayjs.extend(dayLocaleData); diff --git a/components/carousel/demo/position.md b/components/carousel/demo/position.md index 059304f331..0e3eaa8185 100644 --- a/components/carousel/demo/position.md +++ b/components/carousel/demo/position.md @@ -16,7 +16,7 @@ There are 4 position options available. ```tsx import type { RadioChangeEvent } from 'antd'; import { Carousel, Radio } from 'antd'; -import type { DotPosition } from 'antd/lib/carousel'; +import type { DotPosition } from 'antd/es/carousel'; import React, { useState } from 'react'; const contentStyle: React.CSSProperties = { diff --git a/components/config-provider/__tests__/form.test.js b/components/config-provider/__tests__/form.test.js index bd13dfa5af..84fe2cc6cc 100644 --- a/components/config-provider/__tests__/form.test.js +++ b/components/config-provider/__tests__/form.test.js @@ -51,6 +51,10 @@ describe('ConfigProvider.Form', () => { await Promise.resolve(); }); + act(() => { + jest.runAllTimers(); + }); + expect(container.querySelector('.ant-form-item-explain')).toHaveTextContent('请输入姓名'); }); @@ -70,6 +74,10 @@ describe('ConfigProvider.Form', () => { await Promise.resolve(); }); + act(() => { + jest.runAllTimers(); + }); + const explains = Array.from(container.querySelectorAll('.ant-form-item-explain')); expect(explains[0]).toHaveTextContent('必须'); diff --git a/components/config-provider/demo/direction.md b/components/config-provider/demo/direction.md index 709fddaaf7..6b9fcd79d4 100644 --- a/components/config-provider/demo/direction.md +++ b/components/config-provider/demo/direction.md @@ -44,7 +44,7 @@ import { Tree, TreeSelect, } from 'antd'; -import type { DirectionType } from 'antd/lib/config-provider'; +import type { DirectionType } from 'antd/es/config-provider'; import React, { useState } from 'react'; const InputGroup = Input.Group; diff --git a/components/config-provider/demo/locale.md b/components/config-provider/demo/locale.md index 45927b8f56..fd64296df7 100644 --- a/components/config-provider/demo/locale.md +++ b/components/config-provider/demo/locale.md @@ -29,10 +29,10 @@ import { TimePicker, Transfer, } from 'antd'; -import enUS from 'antd/lib/locale/en_US'; -import zhCN from 'antd/lib/locale/zh_CN'; import dayjs from 'dayjs'; import 'dayjs/locale/zh-cn'; +import enUS from 'antd/es/locale/en_US'; +import zhCN from 'antd/es/locale/zh_CN'; import React, { useState } from 'react'; dayjs.locale('en'); diff --git a/components/config-provider/demo/size.md b/components/config-provider/demo/size.md index 3979eddf96..4f2120bdc7 100644 --- a/components/config-provider/demo/size.md +++ b/components/config-provider/demo/size.md @@ -26,7 +26,7 @@ import { Table, Tabs, } from 'antd'; -import type { SizeType } from 'antd/lib/config-provider/SizeContext'; +import type { SizeType } from 'antd/es/config-provider/SizeContext'; import React, { useState } from 'react'; const { TabPane } = Tabs; diff --git a/components/config-provider/index.en-US.md b/components/config-provider/index.en-US.md index 277f9bf8c8..dffe8a3849 100644 --- a/components/config-provider/index.en-US.md +++ b/components/config-provider/index.en-US.md @@ -49,7 +49,7 @@ Some components use dynamic style to support wave effect. You can config `csp` p | getTargetContainer | Config Affix, Anchor scroll target container | () => HTMLElement | () => window | 4.2.0 | | iconPrefixCls | Set icon prefix className (cooperated with [@iconfont-css-prefix](https://github.com/ant-design/ant-design/blob/d943b85a523bdf181dabc12c928226f3b4b893de/components/style/themes/default.less#L106)) | string | `anticon` | 4.11.0 | | input | Set Input common props | { autoComplete?: string } | - | 4.2.0 | -| locale | Language package setting, you can find the packages in [antd/lib/locale](http://unpkg.com/antd/lib/locale/) | object | - | | +| locale | Language package setting, you can find the packages in [antd/es/locale](http://unpkg.com/antd/es/locale/) | object | - | | | pageHeader | Unify the ghost of PageHeader, ref [PageHeader](/components/page-header) | { ghost: boolean } | true | | | prefixCls | Set prefix className (cooperated with [@ant-prefix](https://github.com/ant-design/ant-design/blob/2c6c789e3a9356f96c47aea0083f5a15538315cf/components/style/themes/default.less#L7)) | string | `ant` | | | renderEmpty | Set empty content of components. Ref [Empty](/components/empty/) | function(componentName: string): ReactNode | - | | diff --git a/components/config-provider/index.zh-CN.md b/components/config-provider/index.zh-CN.md index 9811351865..299348789f 100644 --- a/components/config-provider/index.zh-CN.md +++ b/components/config-provider/index.zh-CN.md @@ -50,7 +50,7 @@ export default () => ( | getTargetContainer | 配置 Affix、Anchor 滚动监听容器。 | () => HTMLElement | () => window | 4.2.0 | | iconPrefixCls | 设置图标统一样式前缀。注意：需要配合 `less` 变量 [@iconfont-css-prefix](https://github.com/ant-design/ant-design/blob/d943b85a523bdf181dabc12c928226f3b4b893de/components/style/themes/default.less#L106) 使用 | string | `anticon` | 4.11.0 | | input | 设置 Input 组件的通用属性 | { autoComplete?: string } | - | 4.2.0 | -| locale | 语言包配置，语言包可到 [antd/lib/locale](http://unpkg.com/antd/lib/locale/) 目录下寻找 | object | - | | +| locale | 语言包配置，语言包可到 [antd/es/locale](http://unpkg.com/antd/es/locale/) 目录下寻找 | object | - | | | pageHeader | 统一设置 PageHeader 的 ghost，参考 [PageHeader](/components/page-header) | { ghost: boolean } | true | | | prefixCls | 设置统一样式前缀。注意：需要配合 `less` 变量 [@ant-prefix](https://github.com/ant-design/ant-design/blob/2c6c789e3a9356f96c47aea0083f5a15538315cf/components/style/themes/default.less#L7) 使用 | string | `ant` | | | renderEmpty | 自定义组件空状态。参考 [空状态](/components/empty/) | function(componentName: string): ReactNode | - | | diff --git a/components/date-picker/index.en-US.md b/components/date-picker/index.en-US.md index 26878d779a..8a7169248e 100644 --- a/components/date-picker/index.en-US.md +++ b/components/date-picker/index.en-US.md @@ -39,7 +39,7 @@ import locale from 'antd/es/date-picker/locale/zh_CN'; // The default locale is en-US, if you want to use other locale, just set locale in entry file globally. import dayjs from 'dayjs'; import 'dayjs/locale/zh-cn'; -import locale from 'antd/lib/locale/zh_CN'; +import locale from 'antd/es/locale/zh_CN'; diff --git a/components/date-picker/index.zh-CN.md b/components/date-picker/index.zh-CN.md index 67ae2f2f95..e707b2a4f8 100644 --- a/components/date-picker/index.zh-CN.md +++ b/components/date-picker/index.zh-CN.md @@ -40,7 +40,7 @@ import locale from 'antd/es/date-picker/locale/zh_CN'; // 默认语言为 en-US，如果你需要设置其他语言，推荐在入口文件全局设置 locale import dayjs from 'dayjs'; import 'dayjs/locale/zh-cn'; -import locale from 'antd/lib/locale/zh_CN'; +import locale from 'antd/es/locale/zh_CN'; diff --git a/components/form/ErrorList.tsx b/components/form/ErrorList.tsx index 4c193afa33..4202be5b43 100644 --- a/components/form/ErrorList.tsx +++ b/components/form/ErrorList.tsx @@ -5,6 +5,7 @@ import { ConfigContext } from '../config-provider'; import collapseMotion from '../_util/motion'; import { FormItemPrefixContext } from './context'; import type { ValidateStatus } from './FormItem'; +import useDebounce from './hooks/useDebounce'; const EMPTY_LIST: React.ReactNode[] = []; @@ -48,16 +49,23 @@ export default function ErrorList({ const baseClassName = `${prefixCls}-item-explain`; const rootPrefixCls = getPrefixCls(); + // We have to debounce here again since somewhere use ErrorList directly still need no shaking + // ref: https://github.com/ant-design/ant-design/issues/36336 + const debounceErrors = useDebounce(errors); + const debounceWarnings = useDebounce(warnings); + const fullKeyList = React.useMemo(() => { if (help !== undefined && help !== null) { return [toErrorEntity(help, helpStatus, 'help')]; } return [ - ...errors.map((error, index) => toErrorEntity(error, 'error', 'error', index)), - ...warnings.map((warning, index) => toErrorEntity(warning, 'warning', 'warning', index)), + ...debounceErrors.map((error, index) => toErrorEntity(error, 'error', 'error', index)), + ...debounceWarnings.map((warning, index) => + toErrorEntity(warning, 'warning', 'warning', index), + ), ]; - }, [help, helpStatus, errors, warnings]); + }, [help, helpStatus, debounceErrors, debounceWarnings]); return ( { await sleep(100); jest.runAllTimers(); }); + + act(() => { + jest.runAllTimers(); + }); } await addItem(); diff --git a/components/notification/demo/hooks.md b/components/notification/demo/hooks.md index 8b8fc2bfab..5e296a75e7 100755 --- a/components/notification/demo/hooks.md +++ b/components/notification/demo/hooks.md @@ -21,7 +21,7 @@ import { RadiusUprightOutlined, } from '@ant-design/icons'; import { Button, Divider, notification, Space } from 'antd'; -import type { NotificationPlacement } from 'antd/lib/notification'; +import type { NotificationPlacement } from 'antd/es/notification'; import React from 'react'; const Context = React.createContext({ name: 'Default' }); diff --git a/components/notification/demo/placement.md b/components/notification/demo/placement.md index 3cd37643cc..b2685530de 100755 --- a/components/notification/demo/placement.md +++ b/components/notification/demo/placement.md @@ -23,7 +23,7 @@ import { RadiusUprightOutlined, } from '@ant-design/icons'; import { Button, Divider, notification, Space } from 'antd'; -import type { NotificationPlacement } from 'antd/lib/notification'; +import type { NotificationPlacement } from 'antd/es/notification'; import React from 'react'; const App: React.FC = () => { diff --git a/components/radio/style/index.less b/components/radio/style/index.less new file mode 100644 index 0000000000..5b97f8d818 --- /dev/null +++ b/components/radio/style/index.less @@ -0,0 +1,371 @@ +@import '../../style/themes/index'; +@import '../../style/mixins/index'; + +@radio-prefix-cls: ~'@{ant-prefix}-radio'; +@radio-group-prefix-cls: ~'@{radio-prefix-cls}-group'; +@radio-inner-prefix-cls: ~'@{radio-prefix-cls}-inner'; +@radio-duration: 0.3s; +@radio-focus-shadow: 0 0 0 3px @slider-handle-color-focus-shadow; +@radio-button-focus-shadow: @radio-focus-shadow; + +.@{radio-group-prefix-cls} { + .reset-component(); + + display: inline-block; + font-size: 0; + + .@{ant-prefix}-badge-count { + z-index: 1; + } + + > .@{ant-prefix}-badge:not(:first-child) > .@{radio-prefix-cls}-button-wrapper { + border-left: none; + } +} + +// 一般状态 +.@{radio-prefix-cls}-wrapper { + .reset-component(); + position: relative; + display: inline-flex; + align-items: baseline; + margin-right: @radio-wrapper-margin-right; + cursor: pointer; + + &-disabled { + cursor: not-allowed; + } + + &::after { + display: inline-block; + width: 0; + overflow: hidden; + content: '\a0'; + } + + &&-in-form-item { + input[type='radio'] { + width: 14px; + height: 14px; + } + } +} + +.@{radio-prefix-cls} { + .reset-component(); + + position: relative; + top: @radio-top; + display: inline-block; + outline: none; + cursor: pointer; + + .@{radio-prefix-cls}-wrapper:hover &, + &:hover .@{radio-inner-prefix-cls}, + &-input:focus + .@{radio-inner-prefix-cls} { + border-color: @radio-dot-color; + } + + &-input:focus + .@{radio-inner-prefix-cls} { + box-shadow: @radio-focus-shadow; + } + + &-checked::after { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + border: 1px solid @radio-dot-color; + border-radius: 50%; + visibility: hidden; + animation: antRadioEffect 0.36s ease-in-out; + animation-fill-mode: both; + content: ''; + } + + &:hover::after, + .@{radio-prefix-cls}-wrapper:hover &::after { + visibility: visible; + } + + &-inner { + &::after { + position: absolute; + top: 50%; + left: 50%; + display: block; + width: @radio-size; + height: @radio-size; + margin-top: -(@radio-size / 2); + margin-left: -(@radio-size / 2); + background-color: @radio-dot-color; + border-top: 0; + border-left: 0; + border-radius: @radio-size; + transform: scale(0); + opacity: 0; + transition: all @radio-duration @ease-in-out-circ; + content: ' '; + } + + position: relative; + top: 0; + left: 0; + display: block; + width: @radio-size; + height: @radio-size; + background-color: @radio-button-bg; + border-color: @border-color-base; + border-style: solid; + border-width: @radio-border-width; + border-radius: 50%; + transition: all @radio-duration; + } + + &-input { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1; + cursor: pointer; + opacity: 0; + } + + &&-disabled { + .@{radio-inner-prefix-cls} { + border-color: @border-color-base; + } + } +} + +// 选中状态 +.@{radio-prefix-cls}-checked { + .@{radio-inner-prefix-cls} { + border-color: @radio-dot-color; + + &::after { + transform: scale((unit(@radio-dot-size) / unit(@radio-size))); + opacity: 1; + transition: all @radio-duration @ease-in-out-circ; + } + } +} + +.@{radio-prefix-cls}-disabled { + cursor: not-allowed; + + .@{radio-inner-prefix-cls} { + background-color: @input-disabled-bg; + cursor: not-allowed; + + &::after { + background-color: @radio-dot-disabled-color; + } + } + + .@{radio-prefix-cls}-input { + cursor: not-allowed; + } + + & + span { + color: @disabled-color; + cursor: not-allowed; + } +} + +span.@{radio-prefix-cls} + * { + padding-right: 8px; + padding-left: 8px; +} + +.@{radio-prefix-cls}-button-wrapper { + position: relative; + display: inline-block; + height: @btn-height-base; + margin: 0; + padding: 0 @radio-button-padding-horizontal; + color: @radio-button-color; + font-size: @font-size-base; + line-height: @btn-height-base - 2px; + background: @radio-button-bg; + border: @border-width-base @border-style-base @border-color-base; + // strange align fix for chrome but works + // https://gw.alipayobjects.com/zos/rmsportal/VFTfKXJuogBAXcvfAUWJ.gif + border-top-width: @border-width-base + 0.02px; + border-left-width: 0; + cursor: pointer; + transition: color 0.3s, background 0.3s, border-color 0.3s, box-shadow 0.3s; + + a { + color: @radio-button-color; + } + + > .@{radio-prefix-cls}-button { + position: absolute; + top: 0; + left: 0; + z-index: -1; + width: 100%; + height: 100%; + } + + .@{radio-group-prefix-cls}-large & { + height: @input-height-lg; + font-size: @font-size-lg; + line-height: @input-height-lg - 2px; + } + + .@{radio-group-prefix-cls}-small & { + height: @input-height-sm; + padding: 0 @control-padding-horizontal-sm - 1px; + line-height: @input-height-sm - 2px; + } + + &:not(:first-child) { + &::before { + position: absolute; + top: @border-width-base * -1; + left: -1px; + display: block; + box-sizing: content-box; + width: 1px; + height: 100%; + padding: @border-width-base 0; + background-color: @border-color-base; + transition: background-color 0.3s; + content: ''; + } + } + + &:first-child { + border-left: @border-width-base @border-style-base @border-color-base; + border-radius: @border-radius-base 0 0 @border-radius-base; + } + + &:last-child { + border-radius: 0 @border-radius-base @border-radius-base 0; + } + + &:first-child:last-child { + border-radius: @border-radius-base; + } + + &:hover { + position: relative; + color: @radio-dot-color; + } + + &:focus-within { + box-shadow: @radio-button-focus-shadow; + } + + .@{radio-prefix-cls}-inner, + input[type='checkbox'], + input[type='radio'] { + width: 0; + height: 0; + opacity: 0; + pointer-events: none; + } + + &-checked:not(&-disabled) { + z-index: 1; + color: @radio-dot-color; + background: @radio-button-checked-bg; + border-color: @radio-dot-color; + + &::before { + background-color: @radio-dot-color; + } + + &:first-child { + border-color: @radio-dot-color; + } + + &:hover { + color: @radio-button-hover-color; + border-color: @radio-button-hover-color; + + &::before { + background-color: @radio-button-hover-color; + } + } + + &:active { + color: @radio-button-active-color; + border-color: @radio-button-active-color; + + &::before { + background-color: @radio-button-active-color; + } + } + + &:focus-within { + box-shadow: @radio-button-focus-shadow; + } + } + + .@{radio-group-prefix-cls}-solid &-checked:not(&-disabled) { + color: @radio-solid-checked-color; + background: @radio-dot-color; + border-color: @radio-dot-color; + + &:hover { + color: @radio-solid-checked-color; + background: @radio-button-hover-color; + border-color: @radio-button-hover-color; + } + + &:active { + color: @radio-solid-checked-color; + background: @radio-button-active-color; + border-color: @radio-button-active-color; + } + + &:focus-within { + box-shadow: @radio-button-focus-shadow; + } + } + + &-disabled { + color: @disabled-color; + background-color: @input-disabled-bg; + border-color: @border-color-base; + cursor: not-allowed; + + &:first-child, + &:hover { + color: @disabled-color; + background-color: @input-disabled-bg; + border-color: @border-color-base; + } + + &:first-child { + border-left-color: @border-color-base; + } + } + + &-disabled&-checked { + color: @radio-disabled-button-checked-color; + background-color: @radio-disabled-button-checked-bg; + border-color: @border-color-base; + box-shadow: none; + } +} + +@keyframes antRadioEffect { + 0% { + transform: scale(1); + opacity: 0.5; + } + + 100% { + transform: scale(1.6); + opacity: 0; + } +} + +@import './rtl'; diff --git a/components/slider/demo/mark.md b/components/slider/demo/mark.md index 7801f6f3c7..66eb94404e 100644 --- a/components/slider/demo/mark.md +++ b/components/slider/demo/mark.md @@ -15,7 +15,7 @@ Using `marks` property to mark a graduated slider, use `value` or `defaultValue` ```tsx import { Slider } from 'antd'; -import type { SliderMarks } from 'antd/lib/slider'; +import type { SliderMarks } from 'antd/es/slider'; import React from 'react'; const marks: SliderMarks = { diff --git a/components/slider/demo/vertical.md b/components/slider/demo/vertical.md index 5b30b1ce41..51fa5a7e59 100644 --- a/components/slider/demo/vertical.md +++ b/components/slider/demo/vertical.md @@ -15,7 +15,7 @@ The vertical Slider. ```tsx import { Slider } from 'antd'; -import type { SliderMarks } from 'antd/lib/slider'; +import type { SliderMarks } from 'antd/es/slider'; import React from 'react'; const style: React.CSSProperties = { diff --git a/components/statistic/demo/countdown.md b/components/statistic/demo/countdown.md index 923468472a..6791ba7555 100644 --- a/components/statistic/demo/countdown.md +++ b/components/statistic/demo/countdown.md @@ -15,7 +15,7 @@ Countdown component. ```tsx import { Col, Row, Statistic } from 'antd'; -import type { countdownValueType } from 'antd/lib/statistic/utils'; +import type { countdownValueType } from 'antd/es/statistic/utils'; import React from 'react'; const { Countdown } = Statistic; diff --git a/components/table/demo/ajax.md b/components/table/demo/ajax.md index fbdea74c1d..6e07e56920 100644 --- a/components/table/demo/ajax.md +++ b/components/table/demo/ajax.md @@ -27,8 +27,8 @@ Setting `rowSelection.preserveSelectedRowKeys` to keep the `key` when enable sel ```tsx import { Table } from 'antd'; -import type { ColumnsType, TablePaginationConfig } from 'antd/lib/table'; -import type { FilterValue, SorterResult } from 'antd/lib/table/interface'; +import type { ColumnsType, TablePaginationConfig } from 'antd/es/table'; +import type { FilterValue, SorterResult } from 'antd/es/table/interface'; import qs from 'qs'; import React, { useEffect, useState } from 'react'; diff --git a/components/table/demo/basic.md b/components/table/demo/basic.md index 0d991b37fe..13821aaf70 100644 --- a/components/table/demo/basic.md +++ b/components/table/demo/basic.md @@ -15,7 +15,7 @@ Simple table with actions. ```tsx import { Space, Table, Tag } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/bordered.md b/components/table/demo/bordered.md index 0e3f4309b5..1771bf6651 100644 --- a/components/table/demo/bordered.md +++ b/components/table/demo/bordered.md @@ -15,7 +15,7 @@ Add border, title and footer for table. ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/colspan-rowspan.md b/components/table/demo/colspan-rowspan.md index dc436d259a..cfe669aac2 100644 --- a/components/table/demo/colspan-rowspan.md +++ b/components/table/demo/colspan-rowspan.md @@ -20,7 +20,7 @@ Table cell supports `colSpan` and `rowSpan` that set in render return object. Wh ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/custom-filter-panel.md b/components/table/demo/custom-filter-panel.md index 626d8d4047..a1fb312bf2 100644 --- a/components/table/demo/custom-filter-panel.md +++ b/components/table/demo/custom-filter-panel.md @@ -21,8 +21,8 @@ Add the `boolean` type parameter `closeDropdown` to the function `clearFilters`. import { SearchOutlined } from '@ant-design/icons'; import type { InputRef } from 'antd'; import { Button, Input, Space, Table } from 'antd'; -import type { ColumnsType, ColumnType } from 'antd/lib/table'; -import type { FilterConfirmProps } from 'antd/lib/table/interface'; +import type { ColumnsType, ColumnType } from 'antd/es/table'; +import type { FilterConfirmProps } from 'antd/es/table/interface'; import React, { useRef, useState } from 'react'; import Highlighter from 'react-highlight-words'; diff --git a/components/table/demo/drag-sorting-handler.md b/components/table/demo/drag-sorting-handler.md index 912e63aa28..1a30bfd521 100644 --- a/components/table/demo/drag-sorting-handler.md +++ b/components/table/demo/drag-sorting-handler.md @@ -16,7 +16,7 @@ Alternatively you can implement drag sorting with handler using [react-sortable- ```tsx import { MenuOutlined } from '@ant-design/icons'; import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import { arrayMoveImmutable } from 'array-move'; import React, { useState } from 'react'; import type { SortableContainerProps, SortEnd } from 'react-sortable-hoc'; diff --git a/components/table/demo/drag-sorting.md b/components/table/demo/drag-sorting.md index 22e3e0e4a0..f34e2564d0 100644 --- a/components/table/demo/drag-sorting.md +++ b/components/table/demo/drag-sorting.md @@ -15,7 +15,7 @@ By using `components`, we can integrate table with [react-dnd](https://github.co ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import update from 'immutability-helper'; import React, { useCallback, useRef, useState } from 'react'; import { DndProvider, useDrag, useDrop } from 'react-dnd'; diff --git a/components/table/demo/dynamic-settings.md b/components/table/demo/dynamic-settings.md index 26e430015c..5a23a0d47b 100644 --- a/components/table/demo/dynamic-settings.md +++ b/components/table/demo/dynamic-settings.md @@ -17,9 +17,9 @@ Select different settings to see the result. import { DownOutlined } from '@ant-design/icons'; import type { RadioChangeEvent } from 'antd'; import { Form, Radio, Space, Switch, Table } from 'antd'; -import type { SizeType } from 'antd/lib/config-provider/SizeContext'; -import type { ColumnsType, TableProps } from 'antd/lib/table'; -import type { ExpandableConfig, TableRowSelection } from 'antd/lib/table/interface'; +import type { SizeType } from 'antd/es/config-provider/SizeContext'; +import type { ColumnsType, TableProps } from 'antd/es/table'; +import type { ExpandableConfig, TableRowSelection } from 'antd/es/table/interface'; import React, { useState } from 'react'; interface DataType { diff --git a/components/table/demo/edit-cell.md b/components/table/demo/edit-cell.md index b993344a45..637677e56f 100644 --- a/components/table/demo/edit-cell.md +++ b/components/table/demo/edit-cell.md @@ -16,7 +16,7 @@ Table with editable cells. When work with `shouldCellUpdate`, please take care o ```tsx import type { InputRef } from 'antd'; import { Button, Form, Input, Popconfirm, Table } from 'antd'; -import type { FormInstance } from 'antd/lib/form'; +import type { FormInstance } from 'antd/es/form'; import React, { useContext, useEffect, useRef, useState } from 'react'; const EditableContext = React.createContext | null>(null); diff --git a/components/table/demo/ellipsis-custom-tooltip.md b/components/table/demo/ellipsis-custom-tooltip.md index c8cecbfd4b..25ea1f2f54 100644 --- a/components/table/demo/ellipsis-custom-tooltip.md +++ b/components/table/demo/ellipsis-custom-tooltip.md @@ -15,7 +15,7 @@ Ellipsis cell content via setting `column.ellipsis.showTitle`, use `Tooltip` ins ```tsx import { Table, Tooltip } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/ellipsis.md b/components/table/demo/ellipsis.md index d9c41f4bab..6e9453b64a 100644 --- a/components/table/demo/ellipsis.md +++ b/components/table/demo/ellipsis.md @@ -19,7 +19,7 @@ Ellipsis cell content via setting `column.ellipsis`. ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/expand.md b/components/table/demo/expand.md index 7ec7883860..40c1aaedde 100644 --- a/components/table/demo/expand.md +++ b/components/table/demo/expand.md @@ -15,7 +15,7 @@ When there's too much information to show and the table can't display all at onc ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/filter-in-tree.md b/components/table/demo/filter-in-tree.md index 19534f3f4d..5760ed533a 100644 --- a/components/table/demo/filter-in-tree.md +++ b/components/table/demo/filter-in-tree.md @@ -18,7 +18,7 @@ You can use `filterMode` to change default filter interface, options: `menu`(def ```tsx import { Table } from 'antd'; -import type { ColumnsType, TableProps } from 'antd/lib/table'; +import type { ColumnsType, TableProps } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/filter-search.md b/components/table/demo/filter-search.md index 390f163f80..9cf6408902 100644 --- a/components/table/demo/filter-search.md +++ b/components/table/demo/filter-search.md @@ -16,7 +16,7 @@ title: ```tsx import { Table } from 'antd'; -import type { ColumnsType, TableProps } from 'antd/lib/table'; +import type { ColumnsType, TableProps } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/fixed-columns-header.md b/components/table/demo/fixed-columns-header.md index 439fcf4c07..f9d79a34db 100644 --- a/components/table/demo/fixed-columns-header.md +++ b/components/table/demo/fixed-columns-header.md @@ -23,7 +23,7 @@ A Solution for displaying large amounts of data with long columns. ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/fixed-columns.md b/components/table/demo/fixed-columns.md index 82bc556df0..d44994aead 100644 --- a/components/table/demo/fixed-columns.md +++ b/components/table/demo/fixed-columns.md @@ -27,7 +27,7 @@ To fix some columns and scroll inside other columns, and you must set `scroll.x` ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/fixed-header.md b/components/table/demo/fixed-header.md index 9d15e7d8bb..3a1062f9b8 100644 --- a/components/table/demo/fixed-header.md +++ b/components/table/demo/fixed-header.md @@ -19,7 +19,7 @@ Display large amounts of data in scrollable view. ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/grouping-columns.md b/components/table/demo/grouping-columns.md index 44c1ef7f0d..facf8a4883 100644 --- a/components/table/demo/grouping-columns.md +++ b/components/table/demo/grouping-columns.md @@ -15,7 +15,7 @@ Group table head with `columns[n].children`. ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/head.md b/components/table/demo/head.md index a914abaed7..b8bcbe36e2 100644 --- a/components/table/demo/head.md +++ b/components/table/demo/head.md @@ -31,7 +31,7 @@ If a `sortOrder` or `defaultSortOrder` is specified with the value `ascend` or ` ```tsx import { Table } from 'antd'; -import type { ColumnsType, TableProps } from 'antd/lib/table'; +import type { ColumnsType, TableProps } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/multiple-sorter.md b/components/table/demo/multiple-sorter.md index 7ec614a162..37bc9393f6 100644 --- a/components/table/demo/multiple-sorter.md +++ b/components/table/demo/multiple-sorter.md @@ -15,7 +15,7 @@ title: ```tsx import { Table } from 'antd'; -import type { ColumnsType, TableProps } from 'antd/lib/table'; +import type { ColumnsType, TableProps } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/narrow.md b/components/table/demo/narrow.md index 09b37e4596..78f888e002 100644 --- a/components/table/demo/narrow.md +++ b/components/table/demo/narrow.md @@ -16,7 +16,7 @@ There are two compacted table sizes: `middle` and `small`. The `small` size is u ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/order-column.md b/components/table/demo/order-column.md index 8d3321ae72..0ed7923b27 100644 --- a/components/table/demo/order-column.md +++ b/components/table/demo/order-column.md @@ -16,7 +16,7 @@ You can control the order of the expand and select columns by using `Table.EXPAN ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/pagination.md b/components/table/demo/pagination.md index 117b8f45f2..90aa77605a 100644 --- a/components/table/demo/pagination.md +++ b/components/table/demo/pagination.md @@ -15,7 +15,7 @@ Table pagination settings. ```tsx import { Radio, Space, Table, Tag } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React, { useState } from 'react'; interface DataType { diff --git a/components/table/demo/reset-filter.md b/components/table/demo/reset-filter.md index 2a2212563e..69899bfb93 100644 --- a/components/table/demo/reset-filter.md +++ b/components/table/demo/reset-filter.md @@ -24,7 +24,7 @@ Control filters and sorters by `filteredValue` and `sortOrder`. ```tsx import type { TableProps } from 'antd'; import { Button, Space, Table } from 'antd'; -import type { ColumnsType, FilterValue, SorterResult } from 'antd/lib/table/interface'; +import type { ColumnsType, FilterValue, SorterResult } from 'antd/es/table/interface'; import React, { useState } from 'react'; interface DataType { diff --git a/components/table/demo/resizable-column.md b/components/table/demo/resizable-column.md index b9d4e27312..46f01d69a1 100644 --- a/components/table/demo/resizable-column.md +++ b/components/table/demo/resizable-column.md @@ -16,7 +16,7 @@ Implement resizable column by integrate with [react-resizable](https://github.co ```tsx import { Table } from 'antd'; -import type { ColumnsType, ColumnType } from 'antd/lib/table'; +import type { ColumnsType, ColumnType } from 'antd/es/table'; import React, { useState } from 'react'; import type { ResizeCallbackData } from 'react-resizable'; import { Resizable } from 'react-resizable'; diff --git a/components/table/demo/responsive.md b/components/table/demo/responsive.md index 70496e3370..8a5f90e794 100644 --- a/components/table/demo/responsive.md +++ b/components/table/demo/responsive.md @@ -15,7 +15,7 @@ Responsive columns. ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/row-selection-and-operation.md b/components/table/demo/row-selection-and-operation.md index d14980e111..2af2706106 100644 --- a/components/table/demo/row-selection-and-operation.md +++ b/components/table/demo/row-selection-and-operation.md @@ -15,7 +15,7 @@ To perform operations and clear selections after selecting some rows, use `rowSe ```tsx import { Button, Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React, { useState } from 'react'; interface DataType { diff --git a/components/table/demo/row-selection-custom-debug.md b/components/table/demo/row-selection-custom-debug.md index 9df24a1f1f..82a4094848 100644 --- a/components/table/demo/row-selection-custom-debug.md +++ b/components/table/demo/row-selection-custom-debug.md @@ -16,8 +16,8 @@ Customize selection group. ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; -import type { TableRowSelection } from 'antd/lib/table/interface'; +import type { ColumnsType } from 'antd/es/table'; +import type { TableRowSelection } from 'antd/es/table/interface'; import React from 'react'; interface DataType { diff --git a/components/table/demo/row-selection-custom.md b/components/table/demo/row-selection-custom.md index eb932ec09e..ee71f4973e 100644 --- a/components/table/demo/row-selection-custom.md +++ b/components/table/demo/row-selection-custom.md @@ -15,8 +15,8 @@ Use `rowSelection.selections` custom selections, default no select dropdown, sho ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; -import type { TableRowSelection } from 'antd/lib/table/interface'; +import type { ColumnsType } from 'antd/es/table'; +import type { TableRowSelection } from 'antd/es/table/interface'; import React, { useState } from 'react'; interface DataType { diff --git a/components/table/demo/row-selection.md b/components/table/demo/row-selection.md index d7a4004b16..0e02dd7f65 100644 --- a/components/table/demo/row-selection.md +++ b/components/table/demo/row-selection.md @@ -19,7 +19,7 @@ Rows can be selectable by making first column as a selectable column. You can us ```tsx import { Divider, Radio, Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React, { useState } from 'react'; interface DataType { diff --git a/components/table/demo/size.md b/components/table/demo/size.md index 77873ee086..ad972dcb84 100644 --- a/components/table/demo/size.md +++ b/components/table/demo/size.md @@ -15,7 +15,7 @@ There are two compacted table sizes: `middle` and `small`. The `small` size is u ```tsx import { Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; interface DataType { diff --git a/components/table/demo/sticky.md b/components/table/demo/sticky.md index 99ccb43d5b..d3893c0153 100644 --- a/components/table/demo/sticky.md +++ b/components/table/demo/sticky.md @@ -15,7 +15,7 @@ For long table，need to scroll to view the header and scroll bar，then you can ```tsx import { Switch, Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React, { useState } from 'react'; interface DataType { diff --git a/components/table/demo/summary.md b/components/table/demo/summary.md index 39287efa24..e8d4caa0a8 100644 --- a/components/table/demo/summary.md +++ b/components/table/demo/summary.md @@ -15,7 +15,7 @@ Set summary content by `summary` prop. Sync column fixed status with `Table.Summ ```tsx import { Table, Typography } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; +import type { ColumnsType } from 'antd/es/table'; import React from 'react'; const { Text } = Typography; diff --git a/components/table/demo/tree-data.md b/components/table/demo/tree-data.md index a0d9fd22e1..3b305d5484 100644 --- a/components/table/demo/tree-data.md +++ b/components/table/demo/tree-data.md @@ -19,8 +19,8 @@ You can control the indent width by setting `indentSize`. ```tsx import { Space, Switch, Table } from 'antd'; -import type { ColumnsType } from 'antd/lib/table'; -import type { TableRowSelection } from 'antd/lib/table/interface'; +import type { ColumnsType } from 'antd/es/table'; +import type { TableRowSelection } from 'antd/es/table/interface'; import React, { useState } from 'react'; interface DataType { diff --git a/components/table/style/radius.less b/components/table/style/radius.less new file mode 100644 index 0000000000..0d9cc08edd --- /dev/null +++ b/components/table/style/radius.less @@ -0,0 +1,49 @@ +// ================================================================ +// = Border Radius = +// ================================================================ +.@{table-prefix-cls} { + /* title + table */ + &-title { + border-radius: @table-border-radius-base @table-border-radius-base 0 0; + } + + &-title + &-container { + border-top-left-radius: 0; + border-top-right-radius: 0; + + table { + border-radius: 0; + + > thead > tr:first-child { + th:first-child { + border-radius: 0; + } + + th:last-child { + border-radius: 0; + } + } + } + } + + /* table */ + &-container { + border-top-left-radius: @table-border-radius-base; + border-top-right-radius: @table-border-radius-base; + + table > thead > tr:first-child { + th:first-child { + border-top-left-radius: @table-border-radius-base; + } + + th:last-child { + border-top-right-radius: @table-border-radius-base; + } + } + } + + /* table + footer */ + &-footer { + border-radius: 0 0 @table-border-radius-base @table-border-radius-base; + } +} diff --git a/components/tabs/demo/size.md b/components/tabs/demo/size.md index f512315ab5..911530b677 100644 --- a/components/tabs/demo/size.md +++ b/components/tabs/demo/size.md @@ -16,7 +16,7 @@ Large size tabs are usually used in page header, and small size could be used in ```tsx import type { RadioChangeEvent } from 'antd'; import { Radio, Tabs } from 'antd'; -import type { SizeType } from 'antd/lib/config-provider/SizeContext'; +import type { SizeType } from 'antd/es/config-provider/SizeContext'; import React, { useState } from 'react'; const { TabPane } = Tabs; diff --git a/components/tree/demo/basic-controlled.md b/components/tree/demo/basic-controlled.md index e208aa879f..2a55cbef6c 100644 --- a/components/tree/demo/basic-controlled.md +++ b/components/tree/demo/basic-controlled.md @@ -15,7 +15,7 @@ Controlled mode lets parent nodes reflect the status of child nodes more intelli ```tsx import { Tree } from 'antd'; -import type { DataNode } from 'antd/lib/tree'; +import type { DataNode } from 'antd/es/tree'; import React, { useState } from 'react'; const treeData: DataNode[] = [ diff --git a/components/tree/demo/basic.md b/components/tree/demo/basic.md index 16a4fc723c..af5069d3e2 100644 --- a/components/tree/demo/basic.md +++ b/components/tree/demo/basic.md @@ -15,7 +15,7 @@ The most basic usage, tell you how to use checkable, selectable, disabled, defau ```tsx import { Tree } from 'antd'; -import type { DataNode, TreeProps } from 'antd/lib/tree'; +import type { DataNode, TreeProps } from 'antd/es/tree'; import React from 'react'; const treeData: DataNode[] = [ diff --git a/components/tree/demo/big-data.md b/components/tree/demo/big-data.md index 4c2579c478..16f41ad6ac 100644 --- a/components/tree/demo/big-data.md +++ b/components/tree/demo/big-data.md @@ -16,7 +16,7 @@ Plenty of tree nodes. ```tsx import { Tree } from 'antd'; -import type { DataNode } from 'antd/lib/tree'; +import type { DataNode } from 'antd/es/tree'; import React from 'react'; const treeData: DataNode[] = []; diff --git a/components/tree/demo/customized-icon.md b/components/tree/demo/customized-icon.md index eb67413ba6..d8d3facb47 100644 --- a/components/tree/demo/customized-icon.md +++ b/components/tree/demo/customized-icon.md @@ -22,7 +22,7 @@ import { SmileOutlined, } from '@ant-design/icons'; import { Tree } from 'antd'; -import type { DataNode } from 'antd/lib/tree'; +import type { DataNode } from 'antd/es/tree'; import React from 'react'; const treeData: DataNode[] = [ diff --git a/components/tree/demo/directory.md b/components/tree/demo/directory.md index 918fe995e1..7324e973b8 100644 --- a/components/tree/demo/directory.md +++ b/components/tree/demo/directory.md @@ -15,7 +15,7 @@ Built-in directory tree. `multiple` support `ctrl(Windows)` / `command(Mac)` sel ```tsx import { Tree } from 'antd'; -import type { DataNode, DirectoryTreeProps } from 'antd/lib/tree'; +import type { DataNode, DirectoryTreeProps } from 'antd/es/tree'; import React from 'react'; const { DirectoryTree } = Tree; diff --git a/components/tree/demo/draggable.md b/components/tree/demo/draggable.md index b0a9b673b1..8b3ff08a04 100644 --- a/components/tree/demo/draggable.md +++ b/components/tree/demo/draggable.md @@ -15,7 +15,7 @@ Drag treeNode to insert after the other treeNode or insert into the other parent ```tsx import { Tree } from 'antd'; -import type { DataNode, TreeProps } from 'antd/lib/tree'; +import type { DataNode, TreeProps } from 'antd/es/tree'; import React, { useState } from 'react'; const x = 3; diff --git a/components/tree/demo/line.md b/components/tree/demo/line.md index 4f90a5aa51..bb874c43eb 100644 --- a/components/tree/demo/line.md +++ b/components/tree/demo/line.md @@ -16,7 +16,7 @@ Tree with connected line between nodes, turn on by `showLine`, customize the pre ```tsx import { CarryOutOutlined, FormOutlined } from '@ant-design/icons'; import { Switch, Tree } from 'antd'; -import type { DataNode } from 'antd/lib/tree'; +import type { DataNode } from 'antd/es/tree'; import React, { useState } from 'react'; const treeData: DataNode[] = [ diff --git a/components/tree/demo/search.md b/components/tree/demo/search.md index e37a9cf347..7353ef3841 100644 --- a/components/tree/demo/search.md +++ b/components/tree/demo/search.md @@ -15,7 +15,7 @@ Searchable Tree. ```tsx import { Input, Tree } from 'antd'; -import type { DataNode } from 'antd/lib/tree'; +import type { DataNode } from 'antd/es/tree'; import React, { useMemo, useState } from 'react'; const { Search } = Input; diff --git a/components/tree/demo/switcher-icon.md b/components/tree/demo/switcher-icon.md index 341dd3ef77..589f41ddbd 100644 --- a/components/tree/demo/switcher-icon.md +++ b/components/tree/demo/switcher-icon.md @@ -16,7 +16,7 @@ customize collapse/expand icon of tree node ```tsx import { DownOutlined } from '@ant-design/icons'; import { Tree } from 'antd'; -import type { DataNode, TreeProps } from 'antd/lib/tree'; +import type { DataNode, TreeProps } from 'antd/es/tree'; import React from 'react'; const treeData: DataNode[] = [ diff --git a/components/tree/demo/virtual-scroll.md b/components/tree/demo/virtual-scroll.md index 4904c296db..913d55a7fb 100644 --- a/components/tree/demo/virtual-scroll.md +++ b/components/tree/demo/virtual-scroll.md @@ -15,7 +15,7 @@ Use virtual list through `height` prop. ```tsx import { Tree } from 'antd'; -import type { DataNode } from 'antd/lib/tree'; +import type { DataNode } from 'antd/es/tree'; import React from 'react'; const dig = (path = '0', level = 3) => { diff --git a/docs/react/customize-theme.en-US.md b/docs/react/customize-theme.en-US.md index ab37aff515..f6c82732bb 100644 --- a/docs/react/customize-theme.en-US.md +++ b/docs/react/customize-theme.en-US.md @@ -98,7 +98,7 @@ Follow [Use in create-react-app](/docs/react/use-with-create-react-app). Another approach to customize theme is creating a `less` file within variables to override `antd.less`. ```css -@import '~antd/lib/style/themes/default.less'; +@import '~antd/es/style/themes/default.less'; @import '~antd/dist/antd.less'; // Import Ant Design styles by less entry @import 'your-theme-file.less'; // variables to override above ``` @@ -122,7 +122,7 @@ It's possible to configure webpack to load an alternate less file: ```ts new webpack.NormalModuleReplacementPlugin( /node_modules\/antd\/lib\/style\/index\.less/, path.resolve(rootDir, 'src/myStylesReplacement.less') ) -#antd { @import '~antd/lib/style/core/index.less'; @import '~antd/lib/style/themes/default.less'; } +#antd { @import '~antd/es/style/core/index.less'; @import '~antd/es/style/themes/default.less'; } ``` Where the src/myStylesReplacement.less file loads the same files as the index.less file, but loads them within the scope of a top-level selector : the result is that all of the "global" styles are being applied with the #antd scope. diff --git a/docs/react/customize-theme.zh-CN.md b/docs/react/customize-theme.zh-CN.md index 7ebca0f1c7..75db5d086a 100644 --- a/docs/react/customize-theme.zh-CN.md +++ b/docs/react/customize-theme.zh-CN.md @@ -98,7 +98,7 @@ module.exports = { 另外一种方式是建立一个单独的 `less` 变量文件，引入这个文件覆盖 `antd.less` 里的变量。 ```css -@import '~antd/lib/style/themes/default.less'; +@import '~antd/es/style/themes/default.less'; @import '~antd/dist/antd.less'; // 引入官方提供的 less 样式入口文件 @import 'your-theme-file.less'; // 用于覆盖上面定义的变量 ``` diff --git a/docs/react/getting-started.zh-CN.md b/docs/react/getting-started.zh-CN.md index e1267bb655..0723864e22 100755 --- a/docs/react/getting-started.zh-CN.md +++ b/docs/react/getting-started.zh-CN.md @@ -34,9 +34,9 @@ import React, { useState } from 'react'; import { render } from 'react-dom'; import { ConfigProvider, DatePicker, message } from 'antd'; // 由于 antd 组件的默认文案是英文，所以需要修改为中文 -import zhCN from 'antd/lib/locale/zh_CN'; import dayjs from 'dayjs'; import 'dayjs/locale/zh-cn'; +import zhCN from 'antd/es/locale/zh_CN'; import 'antd/dist/antd.css'; import './index.css'; diff --git a/docs/react/i18n.en-US.md b/docs/react/i18n.en-US.md index 6b4b07e9ce..261af1e009 100644 --- a/docs/react/i18n.en-US.md +++ b/docs/react/i18n.en-US.md @@ -11,7 +11,7 @@ The default language of `antd@2.x` is currently English. If you wish to use othe ```jsx import { ConfigProvider } from 'antd'; -import frFR from 'antd/lib/locale/fr_FR'; +import frFR from 'antd/es/locale/fr_FR'; return ( diff --git a/docs/react/i18n.zh-CN.md b/docs/react/i18n.zh-CN.md index ac32d741b4..8d9b59bb51 100644 --- a/docs/react/i18n.zh-CN.md +++ b/docs/react/i18n.zh-CN.md @@ -10,7 +10,7 @@ title: 国际化 antd 提供了一个 React 组件 [ConfigProvider](/components/config-provider) 用于全局配置国际化文案。 ```jsx -import zhCN from 'antd/lib/locale/zh_CN'; +import zhCN from 'antd/es/locale/zh_CN'; return ( diff --git a/docs/spec/colors.en-US.md b/docs/spec/colors.en-US.md index 9e65ba1d53..1ba123a15d 100644 --- a/docs/spec/colors.en-US.md +++ b/docs/spec/colors.en-US.md @@ -59,7 +59,7 @@ We provide Less and JavaScript usage for developers. - **Less** ```less - @import '~antd/lib/style/themes/default.less'; + @import '~antd/es/style/themes/default.less'; .selector { color: @blue-5; diff --git a/docs/spec/colors.zh-CN.md b/docs/spec/colors.zh-CN.md index 8395d9e677..564e6209d1 100644 --- a/docs/spec/colors.zh-CN.md +++ b/docs/spec/colors.zh-CN.md @@ -67,7 +67,7 @@ ReactDOM.render(, mountNode); - **Less** ```less - @import '~antd/lib/style/themes/default.less'; + @import '~antd/es/style/themes/default.less'; .selector { color: @blue-5; diff --git a/package.json b/package.json index b653d75a01..b0df3ae33d 100644 --- a/package.json +++ b/package.json @@ -143,7 +143,7 @@ "rc-slider": "~10.0.0", "rc-steps": "~4.1.0", "rc-switch": "~3.2.0", - "rc-table": "~7.24.0", + "rc-table": "~7.25.0", "rc-tabs": "~11.16.0", "rc-textarea": "~0.3.0", "rc-tooltip": "~5.1.1", @@ -218,7 +218,7 @@ "eslint-plugin-markdown": "^2.0.0", "eslint-plugin-react": "^7.28.0", "eslint-plugin-react-hooks": "^4.1.2", - "eslint-plugin-unicorn": "^42.0.0", + "eslint-plugin-unicorn": "^43.0.0", "fast-glob": "^3.2.11", "fetch-jsonp": "^1.1.3", "fs-extra": "^10.0.0", diff --git a/scripts/print-changelog.js b/scripts/print-changelog.js index 4e16f81254..dfd69e1e8f 100644 --- a/scripts/print-changelog.js +++ b/scripts/print-changelog.js @@ -111,7 +111,20 @@ async function printLog() { const pr = prs[j]; // Use jquery to get full html page since it don't need auth token - const res = await fetch(`https://github.com/ant-design/ant-design/pull/${pr}`); + let res; + let tryTimes = 0; + const fetchPullRequest = async () => { + try { + res = await fetch(`https://github.com/ant-design/ant-design/pull/${pr}`); + } catch (err) { + tryTimes++; + if (tryTimes < 5) { + console.log(chalk.red(`😬 Fetch error, retrying...`)); + await fetchPullRequest(); + } + } + }; + await fetchPullRequest(); if (res.url.includes('/issues/')) { continue; }