diff --git a/.dumi/pages/index/components/Theme/ColorPicker.tsx b/.dumi/pages/index/components/Theme/ColorPicker.tsx index 23872dce7e..f41295a9e5 100644 --- a/.dumi/pages/index/components/Theme/ColorPicker.tsx +++ b/.dumi/pages/index/components/Theme/ColorPicker.tsx @@ -7,7 +7,7 @@ import classNames from 'classnames'; import { PRESET_COLORS } from './colorUtil'; -type Color = GetProp; +type Color = Extract, string | { cleared: any }>; const useStyle = createStyles(({ token, css }) => ({ color: css` diff --git a/.dumi/pages/index/components/Theme/index.tsx b/.dumi/pages/index/components/Theme/index.tsx index 0b5e735b30..182819bf07 100644 --- a/.dumi/pages/index/components/Theme/index.tsx +++ b/.dumi/pages/index/components/Theme/index.tsx @@ -40,7 +40,7 @@ import RadiusPicker from './RadiusPicker'; import type { THEME } from './ThemePicker'; import ThemePicker from './ThemePicker'; -type Color = GetProp; +type Color = Extract, string | { cleared: any }>; const { Header, Content, Sider } = Layout; diff --git a/components/_util/type.ts b/components/_util/type.ts index 37b107729e..ee4225a35c 100644 --- a/components/_util/type.ts +++ b/components/_util/type.ts @@ -18,13 +18,8 @@ export type CustomComponent

= React.ComponentType

| string; * ``` * @since 5.13.0 */ -export type GetProps | object> = T extends React.ComponentType< - infer P -> - ? P - : T extends object - ? T - : never; +export type GetProps | object> = + T extends React.ComponentType ? P : T extends object ? T : never; /** * Get component props by component name @@ -71,3 +66,10 @@ export type GetRef | React.Component> = : T extends React.ComponentType ? ExtractRefAttributesRef

: never; + +export type GetContextProps = T extends React.Context ? P : never; + +export type GetContextProp< + T extends React.Context, + PropName extends keyof GetContextProps, +> = NonNullable[PropName]>; diff --git a/components/badge/style/index.ts b/components/badge/style/index.ts index 620ffaf4d2..845ff3d453 100644 --- a/components/badge/style/index.ts +++ b/components/badge/style/index.ts @@ -1,12 +1,7 @@ import { Keyframes, unit } from '@ant-design/cssinjs'; import { resetComponent } from '../../style'; -import type { - FullToken, - GenerateStyle, - GenStyleFn, - GetDefaultToken, -} from '../../theme/internal'; +import type { FullToken, GenerateStyle, GenStyleFn, GetDefaultToken } from '../../theme/internal'; import { genPresetColor, genStyleHooks, mergeToken } from '../../theme/internal'; /** Component only token. Which will handle additional calculation of alias token */ @@ -21,12 +16,12 @@ export interface ComponentToken { * @desc 徽标高度 * @descEN Height of badge */ - indicatorHeight: number; + indicatorHeight: number | string; /** * @desc 小号徽标高度 * @descEN Height of small badge */ - indicatorHeightSM: number; + indicatorHeightSM: number | string; /** * @desc 点状徽标尺寸 * @descEN Size of dot badge diff --git a/components/button/style/token.ts b/components/button/style/token.ts index 6eb33b3149..478de73bec 100644 --- a/components/button/style/token.ts +++ b/components/button/style/token.ts @@ -1,10 +1,6 @@ import type { CSSProperties } from 'react'; -import type { - FullToken, - GetDefaultToken, - GenStyleFn, -} from '../../theme/internal'; +import type { FullToken, GetDefaultToken, GenStyleFn } from '../../theme/internal'; import { getLineHeight, mergeToken } from '../../theme/internal'; /** Component only token. Which will handle additional calculation of alias token */ diff --git a/components/calendar/style/index.ts b/components/calendar/style/index.ts index e4d126a49c..43552cbdd4 100644 --- a/components/calendar/style/index.ts +++ b/components/calendar/style/index.ts @@ -16,17 +16,17 @@ export interface ComponentToken { * @desc 年选择器宽度 * @descEN Width of year select */ - yearControlWidth: number; + yearControlWidth: number | string; /** * @desc 月选择器宽度 * @descEN Width of month select */ - monthControlWidth: number; + monthControlWidth: number | string; /** * @desc 迷你日历内容高度 * @descEN Height of mini calendar content */ - miniContentHeight: number; + miniContentHeight: number | string; /** * @desc 完整日历背景色 * @descEN Background color of full calendar @@ -46,9 +46,9 @@ export interface ComponentToken { interface CalendarToken extends FullToken<'Calendar'>, PickerPanelToken, PanelComponentToken { calendarCls: string; - dateValueHeight: number; - weekHeight: number; - dateContentHeight: number; + dateValueHeight: number | string; + weekHeight: number | string; + dateContentHeight: number | string; } export const genCalendarStyles = (token: CalendarToken): CSSObject => { diff --git a/components/card/style/index.ts b/components/card/style/index.ts index 4a8dac85da..ed01366b28 100644 --- a/components/card/style/index.ts +++ b/components/card/style/index.ts @@ -15,22 +15,22 @@ export interface ComponentToken { * @desc 卡片头部文字大小 * @descEN Font size of card header */ - headerFontSize: number; + headerFontSize: number | string; /** * @desc 小号卡片头部文字大小 * @descEN Font size of small card header */ - headerFontSizeSM: number; + headerFontSizeSM: number | string; /** * @desc 卡片头部高度 * @descEN Height of card header */ - headerHeight: number; + headerHeight: number | string; /** * @desc 小号卡片头部高度 * @descEN Height of small card header */ - headerHeightSM: number; + headerHeightSM: number | string; /** * @desc 操作区背景色 * @descEN Background color of card actions diff --git a/components/carousel/index.tsx b/components/carousel/index.tsx index f45eef1740..f74891ebad 100644 --- a/components/carousel/index.tsx +++ b/components/carousel/index.tsx @@ -31,6 +31,8 @@ export interface CarouselRef { innerSlider: any; } +const dotsClass = 'slick-dots'; + interface ArrowType extends React.ButtonHTMLAttributes { currentSlide?: number; slideCount?: number; @@ -40,8 +42,6 @@ const ArrowButton: React.FC = ({ currentSlide, slideCount, ...rest }) + )} + + ); + + const defaultScannedNode =

{locale?.scanned}

; + + const defaultNodes = { + expired: defaultExpiredNode, + loading: defaultSpin, + scanned: defaultScannedNode, + }; + + const defaultStatusRender: QRCodeProps['statusRender'] = (info) => defaultNodes[info.status]; + + const mergedStatusRender = statusRender ?? defaultStatusRender; + + return mergedStatusRender({ + status, + locale, + }); +} diff --git a/components/qr-code/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/qr-code/__tests__/__snapshots__/demo-extend.test.ts.snap index 0326ba7d32..4e3e630824 100644 --- a/components/qr-code/__tests__/__snapshots__/demo-extend.test.ts.snap +++ b/components/qr-code/__tests__/__snapshots__/demo-extend.test.ts.snap @@ -210,6 +210,174 @@ Array [ exports[`renders components/qr-code/demo/customSize.tsx extend context correctly 2`] = `[]`; +exports[`renders components/qr-code/demo/customStatusRender.tsx extend context correctly 1`] = ` +
+
+
+
+
+
+ + + + + + + + +
+
+
+

+ Loading... +

+
+
+
+ +
+
+
+
+ + + + QR code expired +

+ +

+
+
+ +
+
+
+
+ + + + Scanned +
+
+ +
+
+`; + +exports[`renders components/qr-code/demo/customStatusRender.tsx extend context correctly 2`] = `[]`; + exports[`renders components/qr-code/demo/download.tsx extend context correctly 1`] = `
+
+
+
+
+
+ + + + + + + + +
+
+
+

+ Loading... +

+
+
+
+ +
+
+
+
+ + + + + QR code expired +

+ +

+
+
+ +
+
+
+
+ + + + + Scanned +
+
+ +
+
+`; + exports[`renders components/qr-code/demo/download.tsx correctly 1`] = `
+
+
+
+ QR code expired +
+
+ +
+
+
+
+ Loading +
+
+ +
+
+
+
+ Scanned +
+
+ +
+
+`; + exports[`QRCode test rtl render component should be rendered correctly in RTL direction 1`] = `null`; exports[`QRCode test should correct render 1`] = ` diff --git a/components/qr-code/__tests__/index.test.tsx b/components/qr-code/__tests__/index.test.tsx index b92623fa9a..8f5ec82d57 100644 --- a/components/qr-code/__tests__/index.test.tsx +++ b/components/qr-code/__tests__/index.test.tsx @@ -98,4 +98,50 @@ describe('QRCode test', () => { 'width: 100%; height: 80%;', ); }); + it('custom status render', () => { + const customStatusRender: QRCodeProps['statusRender'] = (info) => { + switch (info.status) { + case 'expired': + return
{info.locale?.expired}
; + case 'loading': + return
Loading
; + case 'scanned': + return
{info.locale?.scanned}
; + default: + return null; + } + }; + const { container } = render( + <> + + + + , + ); + expect( + container.querySelector('.qrcode-expired .custom-expired')?.textContent, + ).toBe('QR code expired'); + expect( + container.querySelector('.qrcode-loading .custom-loading')?.textContent, + ).toBe('Loading'); + expect( + container.querySelector('.qrcode-scanned .custom-scanned')?.textContent, + ).toBe('Scanned'); + expect(container).toMatchSnapshot(); + }); }); diff --git a/components/qr-code/demo/customStatusRender.md b/components/qr-code/demo/customStatusRender.md new file mode 100644 index 0000000000..ed534c3968 --- /dev/null +++ b/components/qr-code/demo/customStatusRender.md @@ -0,0 +1,7 @@ +## zh-CN + +可以通过 `statusRender` 的值控制二维码不同状态的渲染逻辑。 + +## en-US + +You can control the rendering logic of the QR code in different states through the value of `statusRender`. diff --git a/components/qr-code/demo/customStatusRender.tsx b/components/qr-code/demo/customStatusRender.tsx new file mode 100644 index 0000000000..8dc1d3063f --- /dev/null +++ b/components/qr-code/demo/customStatusRender.tsx @@ -0,0 +1,52 @@ +import React from 'react'; +import { CheckCircleFilled, CloseCircleFilled, ReloadOutlined } from '@ant-design/icons'; +import type { QRCodeProps } from 'antd'; +import { Button, Flex, QRCode, Space, Spin } from 'antd'; + +const value = 'https://ant.design'; + +const customStatusRender: QRCodeProps['statusRender'] = (info) => { + switch (info.status) { + case 'expired': + return ( +
+ {info.locale?.expired} +

+ +

+
+ ); + case 'loading': + return ( + + +

Loading...

+ + ); + case 'scanned': + return ( +
+ {info.locale?.scanned} +
+ ); + default: + return null; + } +}; + +const App: React.FC = () => ( + + + console.log('refresh')} + statusRender={customStatusRender} + /> + + +); + +export default App; diff --git a/components/qr-code/index.en-US.md b/components/qr-code/index.en-US.md index d36c0c4722..fd01052da2 100644 --- a/components/qr-code/index.en-US.md +++ b/components/qr-code/index.en-US.md @@ -22,6 +22,7 @@ Used when the text needs to be converted into a QR Code. base With Icon other status +custom status render Custom Render Type Custom Size Custom Color @@ -47,8 +48,19 @@ Common props ref：[Common props](/docs/react/common-props) | bordered | Whether has border style | boolean | `true` | | errorLevel | Error Code Level | `'L' \| 'M' \| 'Q' \| 'H' ` | `M` | | status | QRCode status | `active \| expired \| loading \| scanned` | `active` | scanned: 5.13.0 | +| statusRender | custom status render | `(info: \[StatusRenderInfo](/components/qr-code-cn#statusrenderinfo)) => React.ReactNode` | 5.20.0 | | onRefresh | callback | `() => void` | - | +### StatusRenderInfo + +```typescript +type StatusRenderInfo = { + status: QRStatus; + locale: Locale['QRCode']; + onRefresh?: () => void; +}; +``` + ## Design Token diff --git a/components/qr-code/index.tsx b/components/qr-code/index.tsx index cd9aad5b3e..9cc88ffaeb 100644 --- a/components/qr-code/index.tsx +++ b/components/qr-code/index.tsx @@ -1,17 +1,15 @@ import React, { useContext } from 'react'; -import ReloadOutlined from '@ant-design/icons/ReloadOutlined'; -import classNames from 'classnames'; import { QRCodeCanvas, QRCodeSVG } from '@rc-component/qrcode'; +import classNames from 'classnames'; import { devUseWarning } from '../_util/warning'; -import Button from '../button'; import type { ConfigConsumerProps } from '../config-provider'; import { ConfigContext } from '../config-provider'; import { useLocale } from '../locale'; -import Spin from '../spin'; import { useToken } from '../theme/internal'; import type { QRCodeProps, QRProps } from './interface'; import useStyle from './style/index'; +import QRcodeStatus from './QrcodeStatus'; const QRCode: React.FC = (props) => { const [, token] = useToken(); @@ -31,6 +29,7 @@ const QRCode: React.FC = (props) => { rootClassName, prefixCls: customizePrefixCls, bgColor = 'transparent', + statusRender, ...rest } = props; const { getPrefixCls } = useContext(ConfigContext); @@ -91,18 +90,13 @@ const QRCode: React.FC = (props) => {
{status !== 'active' && (
- {status === 'loading' && } - {status === 'expired' && ( - <> -

{locale?.expired}

- {onRefresh && ( - - )} - - )} - {status === 'scanned' &&

{locale?.scanned}

} +
)} {type === 'canvas' ? : } diff --git a/components/qr-code/index.zh-CN.md b/components/qr-code/index.zh-CN.md index a41dda1b88..dc88f9a88c 100644 --- a/components/qr-code/index.zh-CN.md +++ b/components/qr-code/index.zh-CN.md @@ -23,6 +23,7 @@ tag: 5.1.0 基本使用 带 Icon 的例子 不同的状态 +自定义状态渲染器 自定义渲染类型 自定义尺寸 自定义颜色 @@ -48,8 +49,19 @@ tag: 5.1.0 | bordered | 是否有边框 | boolean | `true` | | errorLevel | 二维码纠错等级 | `'L' \| 'M' \| 'Q' \| 'H' ` | `M` | | status | 二维码状态 | `active \| expired \| loading \| scanned` | `active` | scanned: 5.13.0 | +| statusRender | 自定义状态渲染器 | (info: [StatusRenderInfo](/components/qr-code-cn#statusrenderinfo)) => React.ReactNode | - | 5.20.0 | | onRefresh | 点击"点击刷新"的回调 | `() => void` | - | +### StatusRenderInfo + +```typescript +type StatusRenderInfo = { + status: QRStatus; + locale: Locale['QRCode']; + onRefresh?: () => void; +}; +``` + ## 主题变量（Design Token） diff --git a/components/qr-code/interface.ts b/components/qr-code/interface.ts index 6664dbe8b5..b79f8fad6e 100644 --- a/components/qr-code/interface.ts +++ b/components/qr-code/interface.ts @@ -1,5 +1,8 @@ +import type { ReactNode } from 'react'; import type { QRProps } from '@rc-component/qrcode'; +import type { Locale } from '../locale'; + type ImageSettings = QRProps['imageSettings']; export type { QRProps, ImageSettings }; @@ -8,6 +11,14 @@ export type QRPropsCanvas = QRProps & React.CanvasHTMLAttributes; +export type QRStatus = 'active' | 'expired' | 'loading' | 'scanned'; + +export type StatusRenderInfo = { + status: Exclude; + locale: Locale['QRCode']; + onRefresh?: () => void; +}; + export interface QRCodeProps extends QRProps, React.HTMLAttributes { type?: 'canvas' | 'svg'; className?: string; @@ -17,6 +28,7 @@ export interface QRCodeProps extends QRProps, React.HTMLAttributes void; + statusRender?: (info: StatusRenderInfo) => ReactNode; } diff --git a/components/result/style/index.ts b/components/result/style/index.ts index b8a454c04a..7d1d793a7d 100644 --- a/components/result/style/index.ts +++ b/components/result/style/index.ts @@ -29,8 +29,8 @@ export interface ComponentToken { } interface ResultToken extends FullToken<'Result'> { - imageWidth: number; - imageHeight: number; + imageWidth: number | string; + imageHeight: number | string; resultInfoIconColor: string; resultSuccessIconColor: string; resultWarningIconColor: string; diff --git a/components/skeleton/style/index.ts b/components/skeleton/style/index.ts index efafbbd8db..cdee1613f1 100644 --- a/components/skeleton/style/index.ts +++ b/components/skeleton/style/index.ts @@ -1,12 +1,7 @@ import type { CSSObject } from '@ant-design/cssinjs'; import { Keyframes, unit } from '@ant-design/cssinjs'; -import type { - FullToken, - GenerateStyle, - GetDefaultToken, - CSSUtil, -} from '../../theme/internal'; +import type { FullToken, GenerateStyle, GetDefaultToken, CSSUtil } from '../../theme/internal'; import { genStyleHooks, mergeToken } from '../../theme/internal'; export type ComponentToken = { @@ -28,7 +23,7 @@ export type ComponentToken = { * @desc 标题骨架屏高度 * @descEN Height of title skeleton */ - titleHeight: number; + titleHeight: number | string; /** * @desc 骨架屏圆角 * @descEN Border radius of skeleton diff --git a/components/slider/Context.ts b/components/slider/Context.ts new file mode 100644 index 0000000000..f930e2e52b --- /dev/null +++ b/components/slider/Context.ts @@ -0,0 +1,14 @@ +import { createContext } from 'react'; +import type { SliderProps as RcSliderProps } from 'rc-slider'; + +import type { DirectionType } from '../config-provider'; + +export interface SliderInternalContextProps { + handleRender?: RcSliderProps['handleRender']; + direction?: DirectionType; +} + +/** @private Internal context. Do not use in your production. */ +const SliderInternalContext = createContext({}); + +export default SliderInternalContext; diff --git a/components/slider/SliderTooltip.tsx b/components/slider/SliderTooltip.tsx index 428a870513..0a51dfbea8 100644 --- a/components/slider/SliderTooltip.tsx +++ b/components/slider/SliderTooltip.tsx @@ -7,10 +7,16 @@ import { composeRef } from 'rc-util/lib/ref'; import type { TooltipProps } from '../tooltip'; import Tooltip from '../tooltip'; -const SliderTooltip = React.forwardRef((props, ref) => { - const { open } = props; +export type SliderTooltipProps = TooltipProps & { + draggingDelete?: boolean; +}; + +const SliderTooltip = React.forwardRef((props, ref) => { + const { open, draggingDelete } = props; const innerRef = useRef(null); + const mergedOpen = open && !draggingDelete; + const rafRef = useRef(null); function cancelKeepAlign() { @@ -26,16 +32,16 @@ const SliderTooltip = React.forwardRef((props, ref) => } React.useEffect(() => { - if (open) { + if (mergedOpen) { keepAlign(); } else { cancelKeepAlign(); } return cancelKeepAlign; - }, [open, props.title]); + }, [mergedOpen, props.title]); - return ; + return ; }); if (process.env.NODE_ENV !== 'production') { diff --git a/components/slider/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/slider/__tests__/__snapshots__/demo-extend.test.ts.snap index b075ad0781..4c4944520d 100644 --- a/components/slider/__tests__/__snapshots__/demo-extend.test.ts.snap +++ b/components/slider/__tests__/__snapshots__/demo-extend.test.ts.snap @@ -81,28 +81,6 @@ Array [ style="left: 50%; transform: translateX(-50%);" tabindex="0" /> - +
+ , +] +`; + +exports[`renders components/table/demo/custom-empty.tsx extend context correctly 2`] = `[]`; + exports[`renders components/table/demo/custom-filter-panel.tsx extend context correctly 1`] = `
+ + Toggle Data + + , +
, +
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Name + +
+ + Age + + + + + + +
+ 		+ Address +
+ Edward King 0 + + 32 + + London, Park Lane no. 0 +
+ Edward King 1 + + 33 + + London, Park Lane no. 1 +
+ Edward King 2 + + 34 + + London, Park Lane no. 2 +
+ Edward King 3 + + 35 + + London, Park Lane no. 3 +
+ Edward King 4 + + 36 + + London, Park Lane no. 4 +
+
+
+
+
    +
  • + +
    • +
  • + + 1 + +
    • +
  • + +
    • +
+
+
+
, +] +`; + exports[`renders components/table/demo/custom-filter-panel.tsx correctly 1`] = `
{ return ( <> -
+ diff --git a/components/table/demo/custom-empty.md b/components/table/demo/custom-empty.md new file mode 100644 index 0000000000..f379db653b --- /dev/null +++ b/components/table/demo/custom-empty.md @@ -0,0 +1,7 @@ +## zh-CN + +自定义空状态。 + +## en-US + +Custom empty status. diff --git a/components/table/demo/custom-empty.tsx b/components/table/demo/custom-empty.tsx new file mode 100644 index 0000000000..d397e5dd99 --- /dev/null +++ b/components/table/demo/custom-empty.tsx @@ -0,0 +1,72 @@ +import type { GetProp } from 'antd'; +import { Button, Empty, ConfigProvider, Table } from 'antd'; +import React, { useState } from 'react'; + +const genFakeData = (count = 5) => + Array.from({ length: count }).map((_, index) => ({ + key: index, + name: `Edward King ${index}`, + age: 32 + index, + address: `London, Park Lane no. ${index}`, + })); + +const renderEmpty: GetProp = (componentName) => { + if (componentName === 'Table.filter' /** 👈 5.20.0+ */) { + return ; + } +}; + +function App() { + const [dataSource, setDataSource] = useState(genFakeData); + + const handleToggle = () => { + setDataSource(dataSource.length ? [] : genFakeData(Math.floor(Math.random() * 10))); + }; + + const columns: GetProp = [ + { + title: 'Name', + dataIndex: 'name', + key: 'name', + }, + { + title: 'Age', + dataIndex: 'age', + key: 'age', + filters: dataSource.length + ? [ + { text: '>=35', value: 'gte35' }, + { text: '<18', value: 'lt18' }, + ] + : [], + }, + { + title: 'Address', + dataIndex: 'address', + key: 'address', + }, + ]; + + const toggleButton = ( + + ); + + return ( + + {dataSource.length ? toggleButton : null} +
+ {toggleButton}, + }} + /> + + ); +} + +export default App; diff --git a/components/table/demo/dynamic-settings.tsx b/components/table/demo/dynamic-settings.tsx index d3abb476ef..d9627a82ea 100644 --- a/components/table/demo/dynamic-settings.tsx +++ b/components/table/demo/dynamic-settings.tsx @@ -176,11 +176,7 @@ const App: React.FC = () => { return ( <> - + diff --git a/components/table/demo/nest-table-border-debug.tsx b/components/table/demo/nest-table-border-debug.tsx index 167065133c..4e7101071f 100644 --- a/components/table/demo/nest-table-border-debug.tsx +++ b/components/table/demo/nest-table-border-debug.tsx @@ -99,11 +99,7 @@ const App: React.FC = () => { const [childTableBordered, setChildTableBordered] = useState(true); return ( <> - + setRootTableBordered(v)} /> diff --git a/components/table/hooks/useFilter/FilterDropdown.tsx b/components/table/hooks/useFilter/FilterDropdown.tsx index 04da300fad..974cd95a3b 100644 --- a/components/table/hooks/useFilter/FilterDropdown.tsx +++ b/components/table/hooks/useFilter/FilterDropdown.tsx @@ -350,6 +350,8 @@ function FilterDropdown(props: FilterDropdownProps) { let dropdownContent: React.ReactNode; + const { direction, renderEmpty } = React.useContext(ConfigContext); + if (typeof column.filterDropdown === 'function') { dropdownContent = column.filterDropdown({ prefixCls: `${dropdownPrefixCls}-custom`, @@ -368,7 +370,7 @@ function FilterDropdown(props: FilterDropdownProps) { } else { const selectedKeys = getFilteredKeysSync() || []; const getFilterComponent = () => { - const empty = ( + const empty = renderEmpty?.('Table.filter') ?? ( (props: FilterDropdownProps) { filterIcon = ; } - const { direction } = React.useContext(ConfigContext); - return (
{children} diff --git a/components/table/index.en-US.md b/components/table/index.en-US.md index 646cffb182..5b7cfe7b36 100644 --- a/components/table/index.en-US.md +++ b/components/table/index.en-US.md @@ -98,6 +98,7 @@ const columns = [ Resizable column ellipsis column ellipsis column custom tooltip +Custom empty Summary Virtual list Responsive diff --git a/components/table/index.zh-CN.md b/components/table/index.zh-CN.md index bb51bd1590..a2647bbf6c 100644 --- a/components/table/index.zh-CN.md +++ b/components/table/index.zh-CN.md @@ -99,6 +99,7 @@ const columns = [ 可伸缩列 单元格自动省略 自定义单元格省略提示 +自定义空状态 总结栏 虚拟列表 响应式 diff --git a/components/table/style/index.ts b/components/table/style/index.ts index 0e675f05ad..d41d2731d6 100644 --- a/components/table/style/index.ts +++ b/components/table/style/index.ts @@ -166,7 +166,7 @@ export interface ComponentToken { * @desc 选择列宽度 * @descEN Width of selection column */ - selectionColumnWidth: number; + selectionColumnWidth: number | string; /** * @desc Sticky 模式下滚动条背景色 * @descEN Background of sticky scrollbar @@ -214,14 +214,14 @@ export interface TableToken extends FullToken<'Table'> { tableFixedHeaderSortActiveBg: string; tableHeaderFilterActiveBg: string; tableFilterDropdownBg: string; - tableFilterDropdownHeight: number; + tableFilterDropdownHeight: number | string; tableRowHoverBg: string; tableSelectedRowBg: string; tableSelectedRowHoverBg: string; tableFontSizeMiddle: number; tableFontSizeSmall: number; - tableSelectionColumnWidth: number; + tableSelectionColumnWidth: number | string; tableExpandIconBg: string; tableExpandColumnWidth: number | string; tableExpandedRowBg: string; diff --git a/components/tabs/style/index.ts b/components/tabs/style/index.ts index b88be98550..a9c3d18df9 100644 --- a/components/tabs/style/index.ts +++ b/components/tabs/style/index.ts @@ -21,7 +21,7 @@ export interface ComponentToken { * @desc 卡片标签页高度 * @descEN Height of card tab */ - cardHeight: number; + cardHeight: number | string; /** * @desc 卡片标签页内间距 * @descEN Padding of card tab @@ -134,8 +134,8 @@ export interface TabsToken extends FullToken<'Tabs'> { dropdownEdgeChildVerticalPadding: number; tabsNavWrapPseudoWidth: number; tabsActiveTextShadow: string; - tabsDropdownHeight: number; - tabsDropdownWidth: number; + tabsDropdownHeight: number | string; + tabsDropdownWidth: number | string; tabsHorizontalItemMargin: string; tabsHorizontalItemMarginRTL: string; } diff --git a/components/tag/style/index.ts b/components/tag/style/index.ts index 90ea37ed1c..11f169e73f 100644 --- a/components/tag/style/index.ts +++ b/components/tag/style/index.ts @@ -4,11 +4,7 @@ import type { CSSInterpolation } from '@ant-design/cssinjs'; import { TinyColor } from '@ctrl/tinycolor'; import { resetComponent } from '../../style'; -import type { - FullToken, - GetDefaultToken, - GenStyleFn, -} from '../../theme/internal'; +import type { FullToken, GetDefaultToken, GenStyleFn } from '../../theme/internal'; import { genStyleHooks, mergeToken } from '../../theme/internal'; export interface ComponentToken { diff --git a/components/theme/interface/cssinjs-utils.ts b/components/theme/interface/cssinjs-utils.ts index 076acb9091..eaa23284eb 100644 --- a/components/theme/interface/cssinjs-utils.ts +++ b/components/theme/interface/cssinjs-utils.ts @@ -10,7 +10,6 @@ import type { import type { AliasToken } from './alias'; import type { ComponentTokenMap } from './components'; - /** Final token which contains the components level override */ export type GlobalToken = GlobalTokenTypeUtil; @@ -18,8 +17,20 @@ export type OverrideToken = OverrideTokenTypeUtil export type OverrideComponent = TokenMapKey; -export type FullToken> = FullTokenTypeUtil; +export type FullToken> = FullTokenTypeUtil< + ComponentTokenMap, + AliasToken, + C +>; -export type GetDefaultToken> = GetDefaultTokenTypeUtil; +export type GetDefaultToken> = GetDefaultTokenTypeUtil< + ComponentTokenMap, + AliasToken, + C +>; -export type GenStyleFn> = GenStyleFnTypeUtil; +export type GenStyleFn> = GenStyleFnTypeUtil< + ComponentTokenMap, + AliasToken, + C +>; diff --git a/components/theme/internal.ts b/components/theme/internal.ts index 13835f345c..546ce37fcc 100644 --- a/components/theme/internal.ts +++ b/components/theme/internal.ts @@ -1,10 +1,5 @@ import { useStyleRegister } from '@ant-design/cssinjs'; -import { - genCalc as calc, - mergeToken, - statisticToken, - statistic, -} from '@ant-design/cssinjs-utils'; +import { genCalc as calc, mergeToken, statisticToken, statistic } from '@ant-design/cssinjs-utils'; import type { AliasToken, @@ -22,11 +17,7 @@ import type { import { PresetColors } from './interface'; import { getLineHeight } from './themes/shared/genFontSizes'; import useToken from './useToken'; -import { - genComponentStyleHook, - genStyleHooks, - genSubStyleComponent, -} from './util/genStyleUtils'; +import { genComponentStyleHook, genStyleHooks, genSubStyleComponent } from './util/genStyleUtils'; import genPresetColor from './util/genPresetColor'; import useResetIconStyle from './util/useResetIconStyle'; diff --git a/components/timeline/style/index.ts b/components/timeline/style/index.ts index ff219c63bc..9bc8485119 100644 --- a/components/timeline/style/index.ts +++ b/components/timeline/style/index.ts @@ -15,12 +15,12 @@ export interface ComponentToken { * @desc 轨迹宽度 * @descEN Line width */ - tailWidth: number; + tailWidth: number | string; /** * @desc 节点边框宽度 * @descEN Border width of node */ - dotBorderWidth: number; + dotBorderWidth: number | string; /** * @desc 节点背景色 * @descEN Background color of node diff --git a/components/tour/style/index.ts b/components/tour/style/index.ts index 3adef42a12..7e8827b098 100644 --- a/components/tour/style/index.ts +++ b/components/tour/style/index.ts @@ -37,8 +37,8 @@ export interface ComponentToken extends ArrowOffsetToken, ArrowToken { interface TourToken extends FullToken<'Tour'> { tourZIndexPopup: number; - indicatorWidth: number; - indicatorHeight: number; + indicatorWidth: number | string; + indicatorHeight: number | string; tourBorderRadius: number; } diff --git a/components/transfer/style/index.ts b/components/transfer/style/index.ts index cee0e5892a..d7107c71bc 100644 --- a/components/transfer/style/index.ts +++ b/components/transfer/style/index.ts @@ -10,32 +10,32 @@ export interface ComponentToken { * @desc 列表宽度 * @descEN Width of list */ - listWidth: number; + listWidth: number | string; /** * @desc 大号列表宽度 * @descEN Width of large list */ - listWidthLG: number; + listWidthLG: number | string; /** * @desc 列表高度 * @descEN Height of list */ - listHeight: number; + listHeight: number | string; /** * @desc 列表项高度 * @descEN Height of list item */ - itemHeight: number; + itemHeight: number | string; /** * @desc 列表项纵向内边距 * @descEN Vertical padding of list item */ - itemPaddingBlock: number; + itemPaddingBlock: number | string; /** * @desc 顶部高度 * @descEN Height of header */ - headerHeight: number; + headerHeight: number | string; } interface TransferToken extends FullToken<'Transfer'> { diff --git a/components/tree/Tree.tsx b/components/tree/Tree.tsx index 0355fa1e2f..2ddcec83ab 100644 --- a/components/tree/Tree.tsx +++ b/components/tree/Tree.tsx @@ -151,6 +151,7 @@ export interface TreeProps showIcon?: boolean; icon?: TreeIcon; switcherIcon?: SwitcherIcon; + switcherLoadingIcon?: React.ReactNode; prefixCls?: string; children?: React.ReactNode; blockNode?: boolean; @@ -164,6 +165,7 @@ const Tree = React.forwardRef((props, ref) => { showIcon = false, showLine, switcherIcon, + switcherLoadingIcon, blockNode = false, children, checkable = false, @@ -226,6 +228,7 @@ const Tree = React.forwardRef((props, ref) => { diff --git a/components/tree/__tests__/__snapshots__/index.test.tsx.snap b/components/tree/__tests__/__snapshots__/index.test.tsx.snap index f93ff09632..97acb65949 100644 --- a/components/tree/__tests__/__snapshots__/index.test.tsx.snap +++ b/components/tree/__tests__/__snapshots__/index.test.tsx.snap @@ -495,6 +495,144 @@ exports[`Tree showLine is object type should render correctly 1`] = `
`; +exports[`Tree support switcherLoadingIcon prop when loadData 1`] = ` +
+
+ +
+ +`; + exports[`Tree switcherIcon in Tree could be string 1`] = `
{ expect(asFragment().firstChild).toMatchSnapshot(); }); + it('support switcherLoadingIcon prop when loadData', () => { + const onLoadData = () => + new Promise((resolve) => { + setTimeout(() => { + resolve(); + }, 1000); + }); + const { asFragment } = render( + loading...
} + > + + + + + , + ); + expect(asFragment().firstChild).toMatchSnapshot(); + }); + it('switcherIcon in Tree could be render prop function', () => { const { container } = render( ReactNode)} | false | | | switcherIcon | Customize expand/collapse icons for tree nodes (With default rotate angular style) | ReactNode \| ((props: AntTreeNodeProps) => ReactNode) | - | renderProps: 4.20.0 | +| switcherLoadingIcon | Customize loading icons for tree nodes | ReactNode | - | 5.20.0 | | titleRender | Customize tree node title render | (nodeData) => ReactNode | - | 4.5.0 | | treeData | The treeNodes data Array, if set it then you need not to construct children TreeNode. (key should be unique across the whole array) | array<{ key, title, children, \[disabled, selectable] }> | - | | | virtual | Disable virtual scroll when set to false | boolean | true | 4.1.0 | diff --git a/components/tree/index.zh-CN.md b/components/tree/index.zh-CN.md index 088b1412b8..35d90e40e5 100644 --- a/components/tree/index.zh-CN.md +++ b/components/tree/index.zh-CN.md @@ -69,6 +69,7 @@ demo: | showIcon | 控制是否展示 `icon` 节点，没有默认样式 | boolean | false | | | showLine | 是否展示连接线 | boolean \| { showLeafIcon: ReactNode \| ((props: AntTreeNodeProps) => ReactNode) } | false | | | switcherIcon | 自定义树节点的展开/折叠图标（带有默认 rotate 角度样式） | ReactNode \| ((props: AntTreeNodeProps) => ReactNode) | - | renderProps: 4.20.0 | +| switcherLoadingIcon | 自定义树节点的加载图标 | ReactNode | - | 5.20.0 | | titleRender | 自定义渲染节点 | (nodeData) => ReactNode | - | 4.5.0 | | treeData | treeNodes 数据，如果设置则不需要手动构造 TreeNode 节点（key 在整个树范围内唯一） | array<{key, title, children, \[disabled, selectable]}> | - | | | virtual | 设置 false 时关闭虚拟滚动 | boolean | true | 4.1.0 | diff --git a/components/tree/style/index.ts b/components/tree/style/index.ts index a25931ac0c..8227b7f8ab 100644 --- a/components/tree/style/index.ts +++ b/components/tree/style/index.ts @@ -4,12 +4,7 @@ import { Keyframes, unit } from '@ant-design/cssinjs'; import { getStyle as getCheckboxStyle } from '../../checkbox/style'; import { genFocusOutline, resetComponent } from '../../style'; import { genCollapseMotion } from '../../style/motion'; -import type { - AliasToken, - FullToken, - GetDefaultToken, - CSSUtil, -} from '../../theme/internal'; +import type { AliasToken, FullToken, GetDefaultToken, CSSUtil } from '../../theme/internal'; import { genStyleHooks, mergeToken } from '../../theme/internal'; export interface TreeSharedToken { diff --git a/components/tree/utils/iconUtil.tsx b/components/tree/utils/iconUtil.tsx index 1777bea011..0f4488d0a3 100644 --- a/components/tree/utils/iconUtil.tsx +++ b/components/tree/utils/iconUtil.tsx @@ -13,15 +13,19 @@ interface SwitcherIconProps { prefixCls: string; treeNodeProps: AntTreeNodeProps; switcherIcon?: SwitcherIcon; + switcherLoadingIcon?: React.ReactNode; showLine?: boolean | { showLeafIcon: boolean | TreeLeafIcon }; } const SwitcherIconCom: React.FC = (props) => { - const { prefixCls, switcherIcon, treeNodeProps, showLine } = props; + const { prefixCls, switcherIcon, treeNodeProps, showLine, switcherLoadingIcon } = props; const { isLeaf, expanded, loading } = treeNodeProps; if (loading) { + if (React.isValidElement(switcherLoadingIcon)) { + return switcherLoadingIcon; + } return ; } let showLeafIcon: boolean | TreeLeafIcon; diff --git a/components/upload/Upload.tsx b/components/upload/Upload.tsx index ab95aabc65..3adc6e6d35 100644 --- a/components/upload/Upload.tsx +++ b/components/upload/Upload.tsx @@ -386,6 +386,7 @@ const InternalUpload: React.ForwardRefRenderFunction = ( removeIcon, previewIcon, downloadIcon, + extra, } = typeof showUploadList === 'boolean' ? ({} as ShowUploadListInterface) : showUploadList; // use showRemoveIcon if it is specified explicitly @@ -412,6 +413,7 @@ const InternalUpload: React.ForwardRefRenderFunction = ( previewIcon={previewIcon} downloadIcon={downloadIcon} iconRender={iconRender} + extra={extra} locale={{ ...contextLocale, ...propLocale }} isImageUrl={isImageUrl} progress={progress} diff --git a/components/upload/UploadList/ListItem.tsx b/components/upload/UploadList/ListItem.tsx index e2f9eb2a74..7ca2ef7d47 100644 --- a/components/upload/UploadList/ListItem.tsx +++ b/components/upload/UploadList/ListItem.tsx @@ -31,6 +31,7 @@ export interface ListItemProps { removeIcon?: React.ReactNode | ((file: UploadFile) => React.ReactNode); downloadIcon?: React.ReactNode | ((file: UploadFile) => React.ReactNode); previewIcon?: React.ReactNode | ((file: UploadFile) => React.ReactNode); + extra?: React.ReactNode | ((file: UploadFile) => React.ReactNode); iconRender: (file: UploadFile) => React.ReactNode; actionIconRender: ( customIcon: React.ReactNode, @@ -67,6 +68,7 @@ const ListItem = React.forwardRef( previewIcon: customPreviewIcon, removeIcon: customRemoveIcon, downloadIcon: customDownloadIcon, + extra: customExtra, onPreview, onDownload, onClose, @@ -172,34 +174,38 @@ const ListItem = React.forwardRef( {removeIcon} ); + + const extraContent = typeof customExtra === 'function' ? customExtra(file) : customExtra; + const extra = extraContent && ( + {extraContent} + ); + const listItemNameClass = classNames(`${prefixCls}-list-item-name`); - const fileName = file.url - ? [ - onPreview(file, e)} - > - {file.name} - , - downloadOrDelete, - ] - : [ - onPreview(file, e)} - title={file.name} - > - {file.name} - , - downloadOrDelete, - ]; + const fileName = file.url ? ( + onPreview(file, e)} + > + {file.name} + {extra} + + ) : ( + onPreview(file, e)} + title={file.name} + > + {file.name} + {extra} + + ); const previewIcon = showPreviewIcon && (file.url || file.thumbUrl) ? ( @@ -232,6 +238,7 @@ const ListItem = React.forwardRef(
{icon} {fileName} + {downloadOrDelete} {pictureCardActions} {showProgress && ( xxx.png + + + (1.18MB) + + yyy.png + + + (1.18MB) + + zzz.png + + + (1.18MB) + + xxx.png + + + ( + + 1.18 + + MB) + + yyy.png + + + ( + + 1.18 + + MB) + + zzz.png + + + ( + + 1.18 + + MB) + + ( + ({(size / 1024 / 1024).toFixed(2)}MB) + ), showDownloadIcon: true, downloadIcon: 'Download', showRemoveIcon: true, diff --git a/components/upload/index.en-US.md b/components/upload/index.en-US.md index 285a5b8bc5..ca6d1cb2a2 100644 --- a/components/upload/index.en-US.md +++ b/components/upload/index.en-US.md @@ -36,7 +36,7 @@ Uploading is the process of publishing information (web pages, text, pictures, v Transform file before request Aliyun OSS custom show icon -custom action icon +Custom action icon and extra info Drag sorting of uploadList Crop image before uploading Customize Progress Bar @@ -70,7 +70,7 @@ Common props ref：[Common props](/docs/react/common-props) | openFileDialogOnClick | Click open file dialog | boolean | true | | | previewFile | Customize preview file logic | (file: File \| Blob) => Promise<dataURL: string> | - | | | progress | Custom progress bar | [ProgressProps](/components/progress/#api) (support `type="line"` only) | { strokeWidth: 2, showInfo: false } | 4.3.0 | -| showUploadList | Whether to show default upload list, could be an object to specify `showPreviewIcon`, `showRemoveIcon`, `showDownloadIcon`, `removeIcon` and `downloadIcon` individually | boolean \| { showPreviewIcon?: boolean, showDownloadIcon?: boolean, showRemoveIcon?: boolean, previewIcon?: ReactNode \| (file: UploadFile) => ReactNode, removeIcon?: ReactNode \| (file: UploadFile) => ReactNode, downloadIcon?: ReactNode \| (file: UploadFile) => ReactNode } | true | function: 4.7.0 | +| showUploadList | Whether to show default upload list, could be an object to specify `extra`(5.20.0+), `showPreviewIcon`, `showRemoveIcon`, `showDownloadIcon`, `removeIcon` and `downloadIcon` individually | boolean \| { extra?: ReactNode \| (file: UploadFile) => ReactNode, showPreviewIcon?: boolean, showDownloadIcon?: boolean, showRemoveIcon?: boolean, previewIcon?: ReactNode \| (file: UploadFile) => ReactNode, removeIcon?: ReactNode \| (file: UploadFile) => ReactNode, downloadIcon?: ReactNode \| (file: UploadFile) => ReactNode } | true | `extra`: 5.20.0 | | withCredentials | The ajax upload with cookie sent | boolean | false | | | onChange | A callback function, can be executed when uploading state is changing. It will trigger by every uploading phase. see [onChange](#onchange) | function | - | | | onDrop | A callback function executed when files are dragged and dropped into the upload area | (event: React.DragEvent) => void | - | 4.16.0 | diff --git a/components/upload/index.zh-CN.md b/components/upload/index.zh-CN.md index ea96ac6c58..c4bd9c5ba0 100644 --- a/components/upload/index.zh-CN.md +++ b/components/upload/index.zh-CN.md @@ -37,7 +37,7 @@ demo: 上传前转换文件 阿里云 OSS 自定义显示 icon -自定义交互图标 +自定义交互图标和文件信息 上传列表拖拽排序 上传前裁切图片 自定义进度条样式 @@ -71,7 +71,7 @@ demo: | openFileDialogOnClick | 点击打开文件对话框 | boolean | true | | | previewFile | 自定义文件预览逻辑 | (file: File \| Blob) => Promise<dataURL: string> | - | | | progress | 自定义进度条样式 | [ProgressProps](/components/progress-cn#api)（仅支持 `type="line"`） | { strokeWidth: 2, showInfo: false } | 4.3.0 | -| showUploadList | 是否展示文件列表, 可设为一个对象，用于单独设定 `showPreviewIcon`, `showRemoveIcon`, `showDownloadIcon`, `removeIcon` 和 `downloadIcon` | boolean \| { showPreviewIcon?: boolean, showRemoveIcon?: boolean, showDownloadIcon?: boolean, previewIcon?: ReactNode \| (file: UploadFile) => ReactNode, removeIcon?: ReactNode \| (file: UploadFile) => ReactNode, downloadIcon?: ReactNode \| (file: UploadFile) => ReactNode } | true | function: 4.7.0 | +| showUploadList | 是否展示文件列表, 可设为一个对象，用于单独设定 `extra`(5.20.0+), `showPreviewIcon`, `showRemoveIcon`, `showDownloadIcon`, `removeIcon` 和 `downloadIcon` | boolean \| { extra?: ReactNode \| (file: UploadFile) => ReactNode, showPreviewIcon?: boolean, showRemoveIcon?: boolean, showDownloadIcon?: boolean, previewIcon?: ReactNode \| (file: UploadFile) => ReactNode, removeIcon?: ReactNode \| (file: UploadFile) => ReactNode, downloadIcon?: ReactNode \| (file: UploadFile) => ReactNode } | true | `extra`: 5.20.0 | | withCredentials | 上传请求时是否携带 cookie | boolean | false | | | onChange | 上传文件改变时的回调，上传每个阶段都会触发该事件。详见 [onChange](#onchange) | function | - | | | onDrop | 当文件被拖入上传区域时执行的回调功能 | (event: React.DragEvent) => void | - | 4.16.0 | diff --git a/components/upload/interface.ts b/components/upload/interface.ts index 1e573898e5..17e0ae6768 100755 --- a/components/upload/interface.ts +++ b/components/upload/interface.ts @@ -50,6 +50,7 @@ export interface UploadChangeParam { } export interface ShowUploadListInterface { + extra?: React.ReactNode | ((file: UploadFile) => React.ReactNode); showRemoveIcon?: boolean; showPreviewIcon?: boolean; showDownloadIcon?: boolean; @@ -155,6 +156,7 @@ export interface UploadListProps { removeIcon?: React.ReactNode | ((file: UploadFile) => React.ReactNode); downloadIcon?: React.ReactNode | ((file: UploadFile) => React.ReactNode); previewIcon?: React.ReactNode | ((file: UploadFile) => React.ReactNode); + extra?: React.ReactNode | ((file: UploadFile) => React.ReactNode); locale: UploadLocale; previewFile?: PreviewFileHandler; iconRender?: (file: UploadFile, listType?: UploadListType) => React.ReactNode; diff --git a/components/watermark/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/watermark/__tests__/__snapshots__/demo-extend.test.ts.snap index abfee734ee..0d3cb1b6be 100644 --- a/components/watermark/__tests__/__snapshots__/demo-extend.test.ts.snap +++ b/components/watermark/__tests__/__snapshots__/demo-extend.test.ts.snap @@ -168,7 +168,7 @@ exports[`renders components/watermark/demo/custom.tsx extend context correctly 1 style="position: relative;" >
-
-
-
-
-
+ class="ant-slider-rail ant-color-picker-slider-rail" + /> +
+
-
-
-
-
-
+ class="ant-slider-rail ant-color-picker-slider-rail" + /> +
+
diff --git a/components/watermark/demo/custom.tsx b/components/watermark/demo/custom.tsx index a514b3a595..5f1df0bd87 100644 --- a/components/watermark/demo/custom.tsx +++ b/components/watermark/demo/custom.tsx @@ -2,7 +2,7 @@ import React, { useState } from 'react'; import { ColorPicker, Flex, Form, Input, InputNumber, Slider, Typography, Watermark } from 'antd'; import type { ColorPickerProps, GetProp, WatermarkProps } from 'antd'; -type Color = GetProp; +type Color = Extract, string | { cleared: any }>; const { Paragraph } = Typography; diff --git a/mako.config.json b/mako.config.json index bf1f7489ed..f3013a5870 100644 --- a/mako.config.json +++ b/mako.config.json @@ -5,5 +5,8 @@ }, "codeSplitting": { "strategy": "auto" + }, + "watch": { + "_nodeModulesRegexes": ["rc-.*"] } } diff --git a/package.json b/package.json index da01d27dd5..f74203e710 100644 --- a/package.json +++ b/package.json @@ -106,7 +106,7 @@ "@ant-design/react-slick": "~1.1.2", "@babel/runtime": "^7.24.8", "@ctrl/tinycolor": "^3.6.1", - "@rc-component/color-picker": "~1.5.3", + "@rc-component/color-picker": "~2.0.0", "@rc-component/mutate-observer": "^1.1.0", "@rc-component/qrcode": "~1.0.0", "@rc-component/tour": "~1.15.0", @@ -122,9 +122,9 @@ "rc-dropdown": "~4.2.0", "rc-field-form": "~2.2.1", "rc-image": "~7.9.0", - "rc-input": "~1.5.1", - "rc-input-number": "~9.1.0", - "rc-mentions": "~2.14.0", + "rc-input": "~1.6.2", + "rc-input-number": "~9.2.0", + "rc-mentions": "~2.15.0", "rc-menu": "~9.14.1", "rc-motion": "^2.9.2", "rc-notification": "~5.6.0", @@ -135,12 +135,12 @@ "rc-resize-observer": "^1.4.0", "rc-segmented": "~2.3.0", "rc-select": "~14.15.1", - "rc-slider": "~10.6.2", + "rc-slider": "~11.1.3", "rc-steps": "~6.0.1", "rc-switch": "~4.1.0", "rc-table": "~7.45.7", "rc-tabs": "~15.1.1", - "rc-textarea": "~1.7.0", + "rc-textarea": "~1.8.1", "rc-tooltip": "~6.2.0", "rc-tree": "~5.8.8", "rc-tree-select": "~5.22.1", diff --git a/scripts/visual-regression/upload.js b/scripts/visual-regression/upload.js index bf89fbbdf8..51942d432c 100644 --- a/scripts/visual-regression/upload.js +++ b/scripts/visual-regression/upload.js @@ -138,7 +138,12 @@ async function boot() { try { await retry(doUpload, 3, 1000); } catch (err) { - console.error('Uploading file `%s` failed after retry %s, error: %s', fileOrFolderName, 3, err); + console.error( + 'Uploading file `%s` failed after retry %s, error: %s', + fileOrFolderName, + 3, + err, + ); process.exit(1); } return; @@ -152,7 +157,13 @@ async function boot() { // eslint-disable-next-line no-await-in-loop await retry(doUpload, 3, 1000); } catch (err) { - console.warn('Skip uploading file `%s` in folder `%s` failed after retry %s, error: %s', path.relative(workspacePath, file), fileOrFolderName, 3, err); + console.warn( + 'Skip uploading file `%s` in folder `%s` failed after retry %s, error: %s', + path.relative(workspacePath, file), + fileOrFolderName, + 3, + err, + ); } } }