Browse Source

prettier

pull/40626/head
yoyo837 2 years ago
parent
commit
af183295a5
  1. 4
      components/_util/motion.tsx
  2. 4
      components/button/button.tsx
  3. 24
      components/card/index.en-US.md
  4. 24
      components/card/index.zh-CN.md
  5. 8
      components/carousel/index.zh-CN.md
  6. 11
      components/date-picker/generatePicker/generateSinglePicker.tsx
  7. 4
      components/date-picker/style/panel.less
  8. 12
      components/descriptions/index.zh-CN.md
  9. 10
      components/form/FormItem/index.tsx
  10. 4
      components/form/__tests__/index.test.tsx
  11. 4
      components/form/style/index.less
  12. 2
      components/grid/row.tsx
  13. 2
      components/icon/index.en-US.md
  14. 16
      components/icon/index.zh-CN.md
  15. 4
      components/input/ClearableLabeledInput.tsx
  16. 4
      components/input/__tests__/Search.test.tsx
  17. 2
      components/locale/cs_CZ.tsx
  18. 23
      components/mentions/__tests__/index.test.tsx
  19. 10
      components/message/__tests__/type.test.tsx
  20. 2
      components/message/index.en-US.md
  21. 12
      components/message/index.zh-CN.md
  22. 6
      components/modal/__tests__/Modal.test.tsx
  23. 10
      components/modal/demo/custom-mouse-position.md
  24. 10
      components/pagination/__tests__/simple.test.tsx
  25. 8
      components/popover/index.en-US.md
  26. 8
      components/popover/index.zh-CN.md
  27. 2
      components/progress/progress.tsx
  28. 4
      components/radio/style/rtl.less
  29. 8
      components/rate/index.en-US.md
  30. 6
      components/rate/index.zh-CN.md
  31. 4
      components/select/style/status.less
  32. 4
      components/spin/index.tsx
  33. 16
      components/spin/index.zh-CN.md
  34. 8
      components/switch/index.en-US.md
  35. 2
      components/table/demo/virtual-list.md
  36. 4
      components/table/style/index.less
  37. 4
      components/table/style/rtl.less
  38. 2
      components/timeline/Timeline.tsx
  39. 8
      components/tree/Tree.tsx
  40. 13
      components/tree/index.tsx
  41. 6
      docs/spec/buttons.zh-CN.md
  42. 2
      docs/spec/cases.en-US.md
  43. 14
      site/theme/template/Home/DesignPage/index.tsx
  44. 2
      site/theme/template/Layout/Footer.tsx

4
components/_util/motion.tsx

@ -4,11 +4,11 @@ import { tuple } from './type';
// ================== Collapse Motion ==================
const getCollapsedHeight: MotionEventHandler = () => ({ height: 0, opacity: 0 });
const getRealHeight: MotionEventHandler = node => {
const getRealHeight: MotionEventHandler = (node) => {
const { scrollHeight } = node;
return { height: scrollHeight, opacity: 1 };
};
const getCurrentHeight: MotionEventHandler = node => ({ height: node ? node.offsetHeight : 0 });
const getCurrentHeight: MotionEventHandler = (node) => ({ height: node ? node.offsetHeight : 0 });
const skipOpacityTransition: MotionEndEventHandler = (_, event: MotionEvent) =>
event?.deadline === true || (event as TransitionEvent).propertyName === 'height';

4
components/button/button.tsx

@ -55,7 +55,7 @@ function insertSpace(child: React.ReactElement | string | number, needInserted:
function spaceChildren(children: React.ReactNode, needInserted: boolean) {
let isPrevChildPure: boolean = false;
const childList: React.ReactNode[] = [];
React.Children.forEach(children, child => {
React.Children.forEach(children, (child) => {
const type = typeof child;
const isCurrentChildPure = type === 'string' || type === 'number';
if (isPrevChildPure && isCurrentChildPure) {
@ -70,7 +70,7 @@ function spaceChildren(children: React.ReactNode, needInserted: boolean) {
});
// Pass to React.Children.map to auto fill key
return React.Children.map(childList, child =>
return React.Children.map(childList, (child) =>
insertSpace(child as React.ReactElement | string | number, needInserted),
);
}

24
components/card/index.en-US.md

@ -42,18 +42,18 @@ A card can be used to display content related to a single subject. The content c
### Card.Grid
| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| className | The className of container | string | - | |
| hoverable | Lift up when hovering card grid | boolean | true | |
| style | The style object of container | CSSProperties | - | |
| Property | Description | Type | Default | Version |
| --------- | ------------------------------- | ------------- | ------- | ------- |
| className | The className of container | string | - | |
| hoverable | Lift up when hovering card grid | boolean | true | |
| style | The style object of container | CSSProperties | - | |
### Card.Meta
| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| avatar | Avatar or icon | ReactNode | - | |
| className | The className of container | string | - | |
| description | Description content | ReactNode | - | |
| style | The style object of container | CSSProperties | - | |
| title | Title content | ReactNode | - | |
| Property | Description | Type | Default | Version |
| ----------- | ----------------------------- | ------------- | ------- | ------- |
| avatar | Avatar or icon | ReactNode | - | |
| className | The className of container | string | - | |
| description | Description content | ReactNode | - | |
| style | The style object of container | CSSProperties | - | |
| title | Title content | ReactNode | - | |

24
components/card/index.zh-CN.md

@ -43,18 +43,18 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/NqXt8DJhky/Card.svg
### Card.Grid
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| className | 网格容器类名 | string | - | |
| hoverable | 鼠标移过时可浮起 | boolean | true | |
| style | 定义网格容器类名的样式 | CSSProperties | - | |
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --------- | ---------------------- | ------------- | ------ | ---- |
| className | 网格容器类名 | string | - | |
| hoverable | 鼠标移过时可浮起 | boolean | true | |
| style | 定义网格容器类名的样式 | CSSProperties | - | |
### Card.Meta
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| avatar | 头像/图标 | ReactNode | - | |
| className | 容器类名 | string | - | |
| description | 描述内容 | ReactNode | - | |
| style | 定义容器类名的样式 | CSSProperties | - | |
| title | 标题内容 | ReactNode | - | |
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ----------- | ------------------ | ------------- | ------ | ---- |
| avatar | 头像/图标 | ReactNode | - | |
| className | 容器类名 | string | - | |
| description | 描述内容 | ReactNode | - | |
| style | 定义容器类名的样式 | CSSProperties | - | |
| title | 标题内容 | ReactNode | - | |

8
components/carousel/index.zh-CN.md

@ -28,11 +28,11 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/%24C9tmj978R/Carousel.svg
## 方法
| 名称 | 描述 |
| --- | --- |
| 名称 | 描述 |
| ------------------------------ | ------------------------------------------------- |
| goTo(slideNumber, dontAnimate) | 切换到指定面板, dontAnimate = true 时,不使用动画 |
| next() | 切换到下一面板 |
| prev() | 切换到上一面板 |
| next() | 切换到下一面板 |
| prev() | 切换到上一面板 |
更多 API 可参考:<https://react-slick.neostack.com/docs/api>

11
components/date-picker/generatePicker/generateSinglePicker.tsx

@ -31,9 +31,9 @@ export default function generatePicker<DateType>(generateConfig: GenerateConfig<
*/
dropdownClassName?: string;
popupClassName?: string;
}
};
type DatePickerProps = PickerProps<DateType> & CustomPickerProps;
type TimePickerProps = PickerTimeProps<DateType> & CustomPickerProps
type TimePickerProps = PickerTimeProps<DateType> & CustomPickerProps;
function getPicker<InnerPickerProps extends DatePickerProps>(
picker?: PickerMode,
@ -119,7 +119,7 @@ export default function generatePicker<DateType>(generateConfig: GenerateConfig<
return (
<LocaleReceiver componentName="DatePicker" defaultLocale={enUS}>
{contextLocale => {
{(contextLocale) => {
const locale = { ...contextLocale, ...props.locale };
return (
@ -179,10 +179,7 @@ export default function generatePicker<DateType>(generateConfig: GenerateConfig<
const MonthPicker = getPicker<Omit<DatePickerProps, 'picker'>>('month', 'MonthPicker');
const YearPicker = getPicker<Omit<DatePickerProps, 'picker'>>('year', 'YearPicker');
const TimePicker = getPicker<Omit<TimePickerProps, 'picker'>>('time', 'TimePicker');
const QuarterPicker = getPicker<Omit<TimePickerProps, 'picker'>>(
'quarter',
'QuarterPicker',
);
const QuarterPicker = getPicker<Omit<TimePickerProps, 'picker'>>('quarter', 'QuarterPicker');
return { DatePicker, WeekPicker, MonthPicker, YearPicker, TimePicker, QuarterPicker };
}

4
components/date-picker/style/panel.less

@ -179,7 +179,9 @@
// >>> Hover
&:hover:not(&-in-view),
&:hover:not(&-selected):not(&-range-start):not(&-range-end):not(&-range-hover-start):not(&-range-hover-end) {
&:hover:not(&-selected):not(&-range-start):not(&-range-end):not(&-range-hover-start):not(
&-range-hover-end
) {
.@{cellClassName} {
background: @picker-basic-cell-hover-color;
}

12
components/descriptions/index.zh-CN.md

@ -31,11 +31,11 @@ cover: https://gw.alipayobjects.com/zos/alicdn/MjtG9_FOI/Descriptions.svg
### DescriptionItem
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| contentStyle | 自定义内容样式 | CSSProperties | - | 4.9.0 |
| label | 内容的描述 | ReactNode | - | |
| labelStyle | 自定义标签样式 | CSSProperties | - | 4.9.0 |
| span | 包含列的数量 | number | 1 | |
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------ | -------------- | ------------- | ------ | ----- |
| contentStyle | 自定义内容样式 | CSSProperties | - | 4.9.0 |
| label | 内容的描述 | ReactNode | - | |
| labelStyle | 自定义标签样式 | CSSProperties | - | 4.9.0 |
| span | 包含列的数量 | number | 1 | |
> span 是 Description.Item 的数量。 span={2} 会占用两个 DescriptionItem 的宽度。当同时配置 `style``labelStyle`(或 `contentStyle`)时,两者会同时作用。样式冲突时,后者会覆盖前者。

10
components/form/FormItem/index.tsx

@ -158,7 +158,7 @@ function InternalFormItem<Values = any>(props: FormItemProps<Values>): React.Rea
// >>>>> Collect noStyle Field error to the top FormItem
const onSubItemMetaChange = (subMeta: Meta & { destroy: boolean }, uniqueKeys: React.Key[]) => {
// Only `noStyle` sub item will trigger
setSubFieldErrors(prevSubFieldErrors => {
setSubFieldErrors((prevSubFieldErrors) => {
const clone = {
...prevSubFieldErrors,
};
@ -184,7 +184,7 @@ function InternalFormItem<Values = any>(props: FormItemProps<Values>): React.Rea
const errorList: string[] = [...meta.errors];
const warningList: string[] = [...meta.warnings];
Object.values(subFieldErrors).forEach(subFieldError => {
Object.values(subFieldErrors).forEach((subFieldError) => {
errorList.push(...(subFieldError.errors || []));
warningList.push(...(subFieldError.warnings || []));
});
@ -254,7 +254,7 @@ function InternalFormItem<Values = any>(props: FormItemProps<Values>): React.Rea
? required
: !!(
rules &&
rules.some(rule => {
rules.some((rule) => {
if (rule && typeof rule === 'object' && rule.required && !rule.warningOnly) {
return true;
}
@ -294,7 +294,7 @@ function InternalFormItem<Values = any>(props: FormItemProps<Values>): React.Rea
warning(
!hasName,
'Form.Item',
"A `Form.Item` with a render function cannot be a field, and thus cannot have a `name` prop.",
'A `Form.Item` with a render function cannot be a field, and thus cannot have a `name` prop.',
);
} else if (dependencies && !isRenderProps && !hasName) {
warning(
@ -343,7 +343,7 @@ function InternalFormItem<Values = any>(props: FormItemProps<Values>): React.Rea
...toArray(mergedValidateTrigger),
]);
triggers.forEach(eventName => {
triggers.forEach((eventName) => {
childProps[eventName] = (...args: any[]) => {
mergedControl[eventName]?.(...args);
children.props[eventName]?.(...args);

4
components/form/__tests__/index.test.tsx

@ -225,7 +225,7 @@ describe('Form', () => {
</Form>,
);
expect(errorSpy).toHaveBeenCalledWith(
"Warning: [antd: Form.Item] A `Form.Item` with a render function cannot be a field, and thus cannot have a `name` prop.",
'Warning: [antd: Form.Item] A `Form.Item` with a render function cannot be a field, and thus cannot have a `name` prop.',
);
});
@ -1494,7 +1494,7 @@ describe('Form', () => {
it('item customize margin', async () => {
const computeSpy = jest
.spyOn(window, 'getComputedStyle')
.mockImplementation(() => ({ marginBottom: 24 } as unknown as CSSStyleDeclaration));
.mockImplementation(() => ({ marginBottom: 24 }) as unknown as CSSStyleDeclaration);
const { container } = render(
<Form>

4
components/form/style/index.less

@ -109,7 +109,9 @@
}
// Required mark
&.@{form-item-prefix-cls}-required:not(.@{form-item-prefix-cls}-required-mark-optional)::before {
&.@{form-item-prefix-cls}-required:not(
.@{form-item-prefix-cls}-required-mark-optional
)::before {
display: inline-block;
margin-right: 4px;
color: @label-required-color;

2
components/grid/row.tsx

@ -101,7 +101,7 @@ const Row = React.forwardRef<HTMLDivElement, RowProps>((props, ref) => {
// ================================== Effect ==================================
React.useEffect(() => {
const token = ResponsiveObserve.subscribe(screen => {
const token = ResponsiveObserve.subscribe((screen) => {
setCurScreens(screen);
const currentGutter = gutterRef.current || 0;
if (

2
components/icon/index.en-US.md

@ -14,7 +14,7 @@ npm install --save @ant-design/icons
## List of icons
```_\_react
```__react
import IconDisplay from 'site/theme/template/IconDisplay';
ReactDOM.render(<IconDisplay />, mountNode);
```

16
components/icon/index.zh-CN.md

@ -19,7 +19,7 @@ npm install --save @ant-design/icons
## 图标列表
```_\_react
```__react
import IconDisplay from 'site/theme/template/IconDisplay';
ReactDOM.render(<IconDisplay />, mountNode);
```
@ -148,10 +148,10 @@ ReactDOM.render(<Icon component={MessageSvg} />, mountNode);
`Icon` 中的 `component` 组件的接受的属性如下:
| 字段 | 说明 | 类型 | 只读值 | 版本 |
| --- | --- | --- | --- | --- |
| className | 计算后的 `svg` 类名 | string | - | |
| fill | `svg` 元素填充的颜色 | string | `currentColor` | |
| height | `svg` 元素高度 | string \| number | `1em` | |
| style | 计算后的 `svg` 元素样式 | CSSProperties | - | |
| width | `svg` 元素宽度 | string \| number | `1em` | |
| 字段 | 说明 | 类型 | 只读值 | 版本 |
| --------- | ----------------------- | ---------------- | -------------- | ---- |
| className | 计算后的 `svg` 类名 | string | - | |
| fill | `svg` 元素填充的颜色 | string | `currentColor` | |
| height | `svg` 元素高度 | string \| number | `1em` | |
| style | 计算后的 `svg` 元素样式 | CSSProperties | - | |
| width | `svg` 元素宽度 | string \| number | `1em` | |

4
components/input/ClearableLabeledInput.tsx

@ -56,7 +56,7 @@ class ClearableLabeledInput extends React.Component<ClearableInputProps> {
onClick={handleReset}
// Do not trigger onBlur when clear input
// https://github.com/ant-design/ant-design/issues/31200
onMouseDown={e => e.preventDefault()}
onMouseDown={(e) => e.preventDefault()}
className={classNames(
{
[`${className}-hidden`]: !needClear,
@ -121,7 +121,7 @@ class ClearableLabeledInput extends React.Component<ClearableInputProps> {
render() {
return (
<FormItemInputContext.Consumer>
{statusContext => {
{(statusContext) => {
const { prefixCls, inputType, element } = this.props;
if (inputType === ClearableInputType[0]) {
return this.renderTextAreaWithClearIcon(prefixCls, element, statusContext);

4
components/input/__tests__/Search.test.tsx

@ -163,9 +163,7 @@ describe('Input.Search', () => {
it('should not trigger onSearch when press enter while loading', () => {
const onSearch = jest.fn();
const { container } = render(
<Search loading onSearch={onSearch} />,
);
const { container } = render(<Search loading onSearch={onSearch} />);
fireEvent.keyDown(container.querySelector('input')!, { key: 'Enter', keyCode: 13 });
expect(onSearch).not.toHaveBeenCalled();
});

2
components/locale/cs_CZ.tsx

@ -133,4 +133,4 @@ const localeValues: Locale = {
},
};
export default localeValues;
export default localeValues;

23
components/mentions/__tests__/index.test.tsx

@ -1,5 +1,5 @@
import React from 'react';
import Mentions,{ Option } from '..';
import Mentions, { Option } from '..';
import focusTest from '../../../tests/shared/focusTest';
import mountTest from '../../../tests/shared/mountTest';
import rtlTest from '../../../tests/shared/rtlTest';
@ -85,18 +85,16 @@ describe('Mentions', () => {
expect(wrapper.container.querySelectorAll('.bamboo-light').length).toBeTruthy();
});
it('do not lose label when use children Option', () => {
const wrapper = render( <Mentions
style={{ width: '100%' }}
>
<Mentions.Option value="afc163">Afc163</Mentions.Option>
<Mentions.Option value="zombieJ">ZombieJ</Mentions.Option>
<Mentions.Option value="yesmeck">Yesmeck</Mentions.Option>
</Mentions>);
simulateInput(wrapper, '@');
const {container} = wrapper
fireEvent.mouseEnter(
container.querySelector('li.ant-mentions-dropdown-menu-item:last-child')!,
const wrapper = render(
<Mentions style={{ width: '100%' }}>
<Mentions.Option value="afc163">Afc163</Mentions.Option>
<Mentions.Option value="zombieJ">ZombieJ</Mentions.Option>
<Mentions.Option value="yesmeck">Yesmeck</Mentions.Option>
</Mentions>,
);
simulateInput(wrapper, '@');
const { container } = wrapper;
fireEvent.mouseEnter(container.querySelector('li.ant-mentions-dropdown-menu-item:last-child')!);
fireEvent.focus(container.querySelector('textarea')!);
act(() => {
jest.runAllTimers();
@ -118,5 +116,4 @@ describe('Mentions', () => {
'Warning: [antd: Mentions] `Mentions.Option` is deprecated. Please use `options` instead.',
);
});
});

10
components/message/__tests__/type.test.tsx

@ -5,20 +5,20 @@ describe('message.typescript', () => {
message.success('yes!!!', 0);
});
it('promise with one augument', done => {
message.success('yes!!!').then(filled => {
it('promise with one augument', (done) => {
message.success('yes!!!').then((filled) => {
expect(filled).toBe(true);
done();
});
});
it('promise two auguments', done => {
it('promise two auguments', (done) => {
message.success('yes!!!').then(
filled => {
(filled) => {
expect(filled).toBe(true);
done();
},
rejected => {
(rejected) => {
expect(rejected).toBe(false);
},
);

2
components/message/index.en-US.md

@ -120,4 +120,4 @@ return (
### How to set static methods prefixCls ?
You can config with [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+)
You can config with [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>)

12
components/message/index.zh-CN.md

@ -25,11 +25,11 @@ cover: https://gw.alipayobjects.com/zos/alicdn/hAkKTIW0K/Message.svg
- `message.warn(content, [duration], onClose)` // alias of warning
- `message.loading(content, [duration], onClose)`
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| content | 提示内容 | ReactNode \| config | - |
| duration | 自动关闭的延时,单位秒。设为 0 时不自动关闭 | number | 3 |
| onClose | 关闭时触发的回调函数 | function | - |
| 参数 | 说明 | 类型 | 默认值 |
| -------- | ------------------------------------------- | ------------------- | ------ |
| content | 提示内容 | ReactNode \| config | - |
| duration | 自动关闭的延时,单位秒。设为 0 时不自动关闭 | number | 3 |
| onClose | 关闭时触发的回调函数 | function | - |
组件同时提供 promise 接口。
@ -121,4 +121,4 @@ return (
### 静态方法如何设置 prefixCls ?
你可以通过 [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+) 进行设置。
你可以通过 [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>) 进行设置。

6
components/modal/__tests__/Modal.test.tsx

@ -97,7 +97,11 @@ describe('Modal', () => {
const containerRef = React.useRef<HTMLDivElement>(null);
return (
<div ref={containerRef}>
<Modal open getContainer={() => containerRef.current!} mousePosition={{x: 100, y: 100}} />
<Modal
open
getContainer={() => containerRef.current!}
mousePosition={{ x: 100, y: 100 }}
/>
</div>
);
};

10
components/modal/demo/custom-mouse-position.md

@ -38,11 +38,11 @@ const App: React.FC = () => {
<Button type="primary" onClick={showModal}>
Open Modal
</Button>
<Modal
title="Basic Modal"
open={isModalOpen}
onOk={handleOk}
onCancel={handleCancel}
<Modal
title="Basic Modal"
open={isModalOpen}
onOk={handleOk}
onCancel={handleCancel}
mousePosition={{ x: 300, y: 300 }}
>
<p>Some contents...</p>

10
components/pagination/__tests__/simple.test.tsx

@ -5,8 +5,14 @@ import { render } from '../../../tests/utils';
describe('Pagination simple mode', () => {
it('should support showTotal in simple mode', () => {
const { container } = render(
<Pagination simple total={100} showTotal={(total: number, range: number[]) => `${range[0]}-${range[1]} of ${total} items`} />,
<Pagination
simple
total={100}
showTotal={(total: number, range: number[]) => `${range[0]}-${range[1]} of ${total} items`}
/>,
);
expect(container?.querySelector('.ant-pagination-total-text')).toHaveTextContent(
'1-10 of 100 items',
);
expect(container?.querySelector('.ant-pagination-total-text')).toHaveTextContent('1-10 of 100 items');
});
});

8
components/popover/index.en-US.md

@ -15,10 +15,10 @@ Comparing with `Tooltip`, besides information `Popover` card can also provide ac
## API
| Param | Description | Type | Default value | Version |
| --- | --- | --- | --- | --- |
| content | Content of the card | ReactNode \| () => ReactNode | - | |
| title | Title of the card | ReactNode \| () => ReactNode | - | |
| Param | Description | Type | Default value | Version |
| ------- | ------------------- | ---------------------------- | ------------- | ------- |
| content | Content of the card | ReactNode \| () => ReactNode | - | |
| title | Title of the card | ReactNode \| () => ReactNode | - | |
Consult [Tooltip's documentation](/components/tooltip/#API) to find more APIs.

8
components/popover/index.zh-CN.md

@ -16,10 +16,10 @@ cover: https://gw.alipayobjects.com/zos/alicdn/1PNL1p_cO/Popover.svg
## API
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| content | 卡片内容 | ReactNode \| () => ReactNode | - | |
| title | 卡片标题 | ReactNode \| () => ReactNode | - | |
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------- | -------- | ---------------------------- | ------ | ---- |
| content | 卡片内容 | ReactNode \| () => ReactNode | - | |
| title | 卡片标题 | ReactNode \| () => ReactNode | - | |
更多属性请参考 [Tooltip](/components/tooltip/#API)。

2
components/progress/progress.tsx

@ -88,7 +88,7 @@ const Progress: React.FC<ProgressProps> = (props: ProgressProps) => {
return null;
}
let text;
const textFormatter = format || (percentNumber => `${percentNumber}%`);
const textFormatter = format || ((percentNumber) => `${percentNumber}%`);
const isLineType = type === 'line';
if (format || (progressStatus !== 'exception' && progressStatus !== 'success')) {
text = textFormatter(validProgress(percent), validProgress(successPercent));

4
components/radio/style/rtl.less

@ -40,7 +40,9 @@
border-right: @border-width-base @border-style-base @border-color-base;
border-radius: 0 @border-radius-base @border-radius-base 0;
}
.@{radio-prefix-cls-button-wrapper}-checked:not([class*=~"' @{radio-prefix-cls}-button-wrapper-disabled'"])& {
.@{radio-prefix-cls-button-wrapper}-checked:not(
[class*=~"' @{radio-prefix-cls}-button-wrapper-disabled'"]
)& {
border-right-color: @radio-button-hover-color;
}
}

8
components/rate/index.en-US.md

@ -35,7 +35,7 @@ Rate component.
## Methods
| Name | Description |
| --- | --- |
| blur() | Remove focus |
| focus() | Get focus |
| Name | Description |
| ------- | ------------ |
| blur() | Remove focus |
| focus() | Get focus |

6
components/rate/index.zh-CN.md

@ -36,7 +36,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/R5uiIWmxe/Rate.svg
## 方法
| 名称 | 描述 |
| --- | --- |
| blur() | 移除焦点 |
| 名称 | 描述 |
| ------- | -------- |
| blur() | 移除焦点 |
| focus() | 获取焦点 |

4
components/select/style/status.less

@ -10,7 +10,9 @@
@hoverBorderColor;
@outlineColor;
) {
&.@{select-prefix-cls}:not(.@{select-prefix-cls}-disabled):not(.@{select-prefix-cls}-customize-input):not(.@{pagination-prefix-cls}-size-changer) {
&.@{select-prefix-cls}:not(.@{select-prefix-cls}-disabled):not(
.@{select-prefix-cls}-customize-input
):not(.@{pagination-prefix-cls}-size-changer) {
.@{select-prefix-cls}-selector {
background-color: @background-color;
border-color: @border-color !important;

4
components/spin/index.tsx

@ -70,7 +70,7 @@ function shouldDelay(spinning?: boolean, delay?: number): boolean {
return !!spinning && !!delay && !isNaN(Number(delay));
}
const Spin: React.FC<SpinClassProps> = props => {
const Spin: React.FC<SpinClassProps> = (props) => {
const {
spinPrefixCls: prefixCls,
spinning: customSpinning = true,
@ -147,7 +147,7 @@ const Spin: React.FC<SpinClassProps> = props => {
return <ConfigConsumer>{renderSpin}</ConfigConsumer>;
};
const SpinFC: SpinFCType = props => {
const SpinFC: SpinFCType = (props) => {
const { prefixCls: customizePrefixCls } = props;
const { getPrefixCls } = React.useContext(ConfigContext);

16
components/spin/index.zh-CN.md

@ -14,14 +14,14 @@ cover: https://gw.alipayobjects.com/zos/alicdn/LBcJqCPRv/Spin.svg
## API
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| delay | 延迟显示加载效果的时间(防止闪烁) | number (毫秒) | - |
| indicator | 加载指示符 | ReactNode | - |
| size | 组件大小,可选值为 `small` `default` `large` | string | `default` |
| spinning | 是否为加载中状态 | boolean | true |
| tip | 当作为包裹元素时,可以自定义描述文案 | ReactNode | - |
| wrapperClassName | 包装器的类属性 | string | - |
| 参数 | 说明 | 类型 | 默认值 |
| ---------------- | -------------------------------------------- | ------------- | --------- |
| delay | 延迟显示加载效果的时间(防止闪烁) | number (毫秒) | - |
| indicator | 加载指示符 | ReactNode | - |
| size | 组件大小,可选值为 `small` `default` `large` | string | `default` |
| spinning | 是否为加载中状态 | boolean | true |
| tip | 当作为包裹元素时,可以自定义描述文案 | ReactNode | - |
| wrapperClassName | 包装器的类属性 | string | - |
### 静态方法

8
components/switch/index.en-US.md

@ -30,7 +30,7 @@ Switching Selector.
## Methods
| Name | Description |
| --- | --- |
| blur() | Remove focus |
| focus() | Get focus |
| Name | Description |
| ------- | ------------ |
| blur() | Remove focus |
| focus() | Get focus |

2
components/table/demo/virtual-list.md

@ -14,7 +14,7 @@ title:
Integrate virtual scroll with `react-window` to achieve a high performance table of 100,000 data.
```tsx
import { Table } from 'antd';
import { Table } from 'antd';
import type { TableProps } from 'antd';
import classNames from 'classnames';
import ResizeObserver from 'rc-resize-observer';

4
components/table/style/index.less

@ -99,7 +99,9 @@
text-align: center;
}
&:not(:last-child):not(.@{table-prefix-cls}-selection-column):not(.@{table-prefix-cls}-row-expand-icon-cell):not([colspan])::before {
&:not(:last-child):not(.@{table-prefix-cls}-selection-column):not(
.@{table-prefix-cls}-row-expand-icon-cell
):not([colspan])::before {
position: absolute;
top: 50%;
right: 0;

4
components/table/style/rtl.less

@ -32,7 +32,9 @@
}
}
&:not(:last-child):not(.@{table-prefix-cls}-selection-column):not(.@{table-prefix-cls}-row-expand-icon-cell):not([colspan])::before {
&:not(:last-child):not(.@{table-prefix-cls}-selection-column):not(
.@{table-prefix-cls}-row-expand-icon-cell
):not([colspan])::before {
.@{table-wrapepr-rtl-cls} & {
right: auto;
left: 0;

2
components/timeline/Timeline.tsx

@ -63,7 +63,7 @@ const Timeline: CompoundedComponent = (props) => {
};
// Remove falsy items
const truthyItems = timeLineItems.filter(item => !!item);
const truthyItems = timeLineItems.filter((item) => !!item);
const itemsCount = React.Children.count(truthyItems);
const lastCls = `${prefixCls}-item-last`;
const items = React.Children.map(truthyItems, (ele: React.ReactElement<any>, idx) => {

8
components/tree/Tree.tsx

@ -51,7 +51,7 @@ export interface AntTreeNodeProps {
[customProp: string]: any;
}
export interface AntTreeNode extends React.Component<AntTreeNodeProps, {}> { }
export interface AntTreeNode extends React.Component<AntTreeNodeProps, {}> {}
export interface AntTreeNodeBaseEvent {
node: AntTreeNode;
@ -144,9 +144,9 @@ export interface TreeProps<T extends BasicDataNode = DataNode>
style?: React.CSSProperties;
showIcon?: boolean;
icon?:
| ((nodeProps: AntdTreeNodeAttribute) => React.ReactNode)
| React.ReactNode
| RcTreeProps<T>['icon'];
| ((nodeProps: AntdTreeNodeAttribute) => React.ReactNode)
| React.ReactNode
| RcTreeProps<T>['icon'];
switcherIcon?: SwitcherIcon | RcTreeProps<T>['switcherIcon'];
prefixCls?: string;
children?: React.ReactNode;

13
components/tree/index.tsx

@ -5,9 +5,9 @@ import type { DataNode } from 'rc-tree/lib/interface';
import type { TreeProps } from './Tree';
import TreePure from './Tree';
import DirectoryTree from './DirectoryTree'
import DirectoryTree from './DirectoryTree';
export { DataNode }
export { DataNode };
export { EventDataNode } from 'rc-tree/lib/interface';
export { DirectoryTreeProps, ExpandAction as DirectoryTreeExpandAction } from './DirectoryTree';
export {
@ -21,7 +21,6 @@ export {
TreeProps,
} from './Tree';
type CompoundedComponent = (<T extends BasicDataNode | DataNode = DataNode>(
props: React.PropsWithChildren<TreeProps<T>> & { ref?: React.Ref<RcTree> },
) => React.ReactElement) & {
@ -29,8 +28,8 @@ type CompoundedComponent = (<T extends BasicDataNode | DataNode = DataNode>(
DirectoryTree: typeof DirectoryTree;
};
const Tree = TreePure as unknown as CompoundedComponent
Tree.DirectoryTree = DirectoryTree
Tree.TreeNode = TreeNode
const Tree = TreePure as unknown as CompoundedComponent;
Tree.DirectoryTree = DirectoryTree;
Tree.TreeNode = TreeNode;
export default Tree;
export default Tree;

6
docs/spec/buttons.zh-CN.md

@ -86,27 +86,25 @@ title: 按钮
经常独立出现,行动号召按钮就像是电脑在对用户大声说“跟我来吧”,有点命令用户点击的意味,通常出现于 landing page 或者 一些引导性场景。最大可以将按钮放宽到与父区域等宽。一个屏幕空间中,建议只有一个行动号召按钮。
## 位置
### 按钮区
<img class="preview-img no-padding" align="right" src="https://img.alicdn.com/imgextra/i1/O1CN01Wd9Dbh1z6A5MQwEnh_!!6000000006664-2-tps-930-290.png">
按钮区是用于放置按钮的区域,一个按钮区内可以有多个按钮。
### 跟随内容的按钮区
<img class="preview-img no-padding" align="right" src="https://img.alicdn.com/imgextra/i4/O1CN01OVOv5G27z8YLYdWED_!!6000000007867-2-tps-928-342.png">
按钮区跟随受控内容。将按钮区放置于用户浏览路径中,便于被用户发现。
### 工具栏中的按钮区
<img class="preview-img no-padding" align="right" src="https://img.alicdn.com/imgextra/i2/O1CN01aAZHoi1uZrgx1C3zR_!!6000000006052-2-tps-928-332.png">
工具栏中的按钮区,靠右放置。控制工具栏控制的内容范围。
### 如何确定按钮区的放置位置?
#### 页面/卡片/一组信息都能够呈现一个主题,主题的描述可以抽象为三个区域:
@ -126,6 +124,7 @@ title: 按钮
<img class="preview-img no-padding" align="right" src="https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*KGGWQLCBfm0AAAAAAAAAAABkARQnAQ">
为避免页脚工具栏滥用,我们不推荐使用页脚工具栏,仅建议以下两种场景使用:
- 1)对象详情页,「推进」对象的进展,例如审批流「通过」「驳回」。
- 2)异常复杂的表单页,表单的内容复杂到需要切分为多张卡片。
@ -161,7 +160,6 @@ title: 按钮
- 其他:刷新、分享、设置等;
- 溢出:被折叠的操作,若进行响应式设计,从右往左折叠至溢出操作。
### 按钮分组
当需要布置的按钮数量过多,可以把相关的动作组成一组,并采用相似的视觉设计。当某一个按钮是首要动作时仍可使用主按钮强调。

2
docs/spec/cases.en-US.md

@ -24,7 +24,7 @@ Cloud-oriented financial services, used by financial institutions that benefit f
OceanBase Cloud is a distributed relational database in a real sense, and OceanBase Cloud Platform is the OceanBase cloud-based database service that can help users quickly create and use OceanBase service.
[Visit]([http://oceanbase.alipay.com](https://www.oceanbase.com/docs/enterprise/oceanbase-ocp-cn/V3.3.3/10000000000636101))
[Visit](<[http://oceanbase.alipay.com](https://www.oceanbase.com/docs/enterprise/oceanbase-ocp-cn/V3.3.3/10000000000636101)>)
![OceanBase Cloud Platform](https://gw.alipayobjects.com/zos/rmsportal/OYGCAlMwSWkdaKfxIDtz.png)

14
site/theme/template/Home/DesignPage/index.tsx

@ -29,8 +29,7 @@ const MINI_LIST: PanelProps[] = [
href: 'https://antv.vision',
},
{
img:
'https://gw.alipayobjects.com/zos/antfincdn/888xda6kBc/Ant%252520Design%252520shouyepeitu.svg',
img: 'https://gw.alipayobjects.com/zos/antfincdn/888xda6kBc/Ant%252520Design%252520shouyepeitu.svg',
title: 'Ant Design Pro',
description: 'app.home.product-pro-slogan',
href: 'https://pro.ant.design/',
@ -252,7 +251,8 @@ const DesignPage = (props: { location: any }) => {
Ant Design of React
</Link>
<span style={smallStyle}>
(<FormattedMessage id="app.implementation.official" />)
(
<FormattedMessage id="app.implementation.official" />)
</span>
</li>
<li>
@ -260,7 +260,8 @@ const DesignPage = (props: { location: any }) => {
Ant Design of Angular
</a>
<span style={smallStyle}>
(<FormattedMessage id="app.implementation.community" />)
(
<FormattedMessage id="app.implementation.community" />)
</span>
</li>
<li>
@ -268,7 +269,8 @@ const DesignPage = (props: { location: any }) => {
Ant Design of Vue
</a>
<span style={smallStyle}>
(<FormattedMessage id="app.implementation.community" />)
(
<FormattedMessage id="app.implementation.community" />)
</span>
</li>
</ul>
@ -295,7 +297,7 @@ const DesignPage = (props: { location: any }) => {
]}
className="design-mini-panels"
>
{MINI_LIST.map(panel => (
{MINI_LIST.map((panel) => (
<MiniPanel key={panel.description} {...panel} isZhCN={isZhCN} query={location.query} />
))}
</Row>

2
site/theme/template/Layout/Footer.tsx

@ -20,7 +20,7 @@ import {
import type { FooterColumn } from 'rc-footer/lib/column';
import { getLocalizedPathname } from '../utils';
const Footer: React.FC<WrappedComponentProps & { location: any }> = props => {
const Footer: React.FC<WrappedComponentProps & { location: any }> = (props) => {
const { intl, location } = props;
const getColumns = useMemo<FooterColumn[]>(() => {
const isZhCN = intl.locale === 'zh-CN';

Loading…
Cancel
Save