fix: fix Steps size small of CP (#42278)

* fix: fix Steps size small of CP

* fix: update snap
This commit is contained in:
huiwang 2023-05-11 19:26:04 +08:00 committed by GitHub
parent e09112160b
commit da67b481b8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 17 additions and 4 deletions

View File

@ -29809,7 +29809,7 @@ exports[`ConfigProvider components Steps configProvider componentDisabled 1`] =
exports[`ConfigProvider components Steps configProvider componentSize large 1`] = `
<div
class="config-steps config-steps-vertical"
class="config-steps config-steps-vertical config-steps-large"
>
<div
class="config-steps-item config-steps-item-process config-steps-item-active"
@ -29850,7 +29850,7 @@ exports[`ConfigProvider components Steps configProvider componentSize large 1`]
exports[`ConfigProvider components Steps configProvider componentSize middle 1`] = `
<div
class="config-steps config-steps-vertical"
class="config-steps config-steps-vertical config-steps-middle"
>
<div
class="config-steps-item config-steps-item-process config-steps-item-active"
@ -29891,7 +29891,7 @@ exports[`ConfigProvider components Steps configProvider componentSize middle 1`]
exports[`ConfigProvider components Steps configProvider componentSize small 1`] = `
<div
class="config-steps config-steps-vertical"
class="config-steps config-steps-vertical config-steps-small"
>
<div
class="config-steps-item config-steps-item-process config-steps-item-active"

View File

@ -4,6 +4,7 @@ import mountTest from '../../../tests/shared/mountTest';
import rtlTest from '../../../tests/shared/rtlTest';
import { fireEvent, render, screen } from '../../../tests/utils';
import { resetWarned } from '../../_util/warning';
import ConfigProvider from '../../config-provider';
describe('Steps', () => {
mountTest(Steps);
@ -106,4 +107,13 @@ describe('Steps', () => {
);
errorSpy.mockRestore();
});
it('Steps should inherit the size from ConfigProvider if the componentSize is set ', () => {
const { container } = render(
<ConfigProvider componentSize="small">
<Steps items={[{ title: 'In Progress' }, { title: 'Finished' }]} />
</ConfigProvider>,
);
expect(container.querySelectorAll('.ant-steps-small')).toHaveLength(1);
});
});

View File

@ -14,6 +14,7 @@ import useBreakpoint from '../grid/hooks/useBreakpoint';
import Progress from '../progress';
import useLegacyItems from './useLegacyItems';
import useStyle from './style';
import useSize from '../_util/hooks/useSize';
export interface StepProps {
className?: string;
@ -55,7 +56,7 @@ type CompoundedComponent = React.FC<StepsProps> & {
const Steps: CompoundedComponent = (props) => {
const {
percent,
size,
size: customizeSize,
className,
rootClassName,
direction,
@ -73,6 +74,8 @@ const Steps: CompoundedComponent = (props) => {
[xs, direction],
);
const size = useSize(customizeSize);
const prefixCls = getPrefixCls('steps', props.prefixCls);
const [wrapSSR, hashId] = useStyle(prefixCls);