mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-28 05:05:48 +08:00
Code Issues Actions 43 Packages Projects Releases Wiki Activity

fix: Space.Compact not work with CP component size (#42199)

Browse Source 
* test(space): add test cases

* fix(Space.Compact):  fix the size is not inherited from ConfigProvider when the componentSize is set

* test(Space.Compact): move Space.Compact test cases to the corresponding folder

* test: update snapshot

---------

Co-authored-by: 二货机器人 <smith3816@gmail.com>
This commit is contained in:
Ec-tracker 2023-05-09 11:18:23 +08:00 committed by GitHub
parent 52d91cec3f
commit 24dd5351e9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 33 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/config-provider/__tests__/__snapshots__/components.test.tsx.snap
View File

@ -16831,7 +16831,7 @@ exports[`ConfigProvider components Dropdown configProvider componentSize large 1
class="config-space-compact config-space-compact-block config-dropdown-button"
>
<button
class="config-btn config-btn-default config-btn-compact-item config-btn-compact-first-item"
class="config-btn config-btn-default config-btn-lg config-btn-compact-item config-btn-compact-first-item"
type="button"
>
<span>
@ -16839,7 +16839,7 @@ exports[`ConfigProvider components Dropdown configProvider componentSize large 1
</span>
</button>
<button
class="config-btn config-btn-default config-btn-icon-only config-btn-compact-item config-btn-compact-last-item config-dropdown-trigger"
class="config-btn config-btn-default config-btn-lg config-btn-icon-only config-btn-compact-item config-btn-compact-last-item config-dropdown-trigger"
type="button"
>
<span
@ -16909,7 +16909,7 @@ exports[`ConfigProvider components Dropdown configProvider componentSize small 1
class="config-space-compact config-space-compact-block config-dropdown-button"
>
<button
class="config-btn config-btn-default config-btn-compact-item config-btn-compact-first-item"
class="config-btn config-btn-default config-btn-sm config-btn-compact-item config-btn-compact-first-item"
type="button"
>
<span>
@ -16917,7 +16917,7 @@ exports[`ConfigProvider components Dropdown configProvider componentSize small 1
</span>
</button>
<button
class="config-btn config-btn-default config-btn-icon-only config-btn-compact-item config-btn-compact-last-item config-dropdown-trigger"
class="config-btn config-btn-default config-btn-sm config-btn-icon-only config-btn-compact-item config-btn-compact-last-item config-dropdown-trigger"
type="button"
>
<span

4
components/space/Compact.tsx
View File

@ -5,6 +5,7 @@ import * as React from 'react';
import type { DirectionType } from '../config-provider';
import { ConfigContext } from '../config-provider';
import type { SizeType } from '../config-provider/SizeContext';
import SizeContext from '../config-provider/SizeContext';
import useStyle from './style';
@ -64,9 +65,10 @@ const CompactItem: React.FC<React.PropsWithChildren<SpaceCompactItemContextType>
const Compact: React.FC<SpaceCompactProps> = (props) => {
const { getPrefixCls, direction: directionConfig } = React.useContext(ConfigContext);
const sizeInContext = React.useContext(SizeContext);
const {
size = 'middle',
size = sizeInContext || 'middle',
direction,
block,
prefixCls: customizePrefixCls,

26
components/space/__tests__/space-compact.test.tsx
View File

@ -7,6 +7,7 @@ import { render } from '../../../tests/utils';
import AutoComplete from '../../auto-complete';
import Button from '../../button';
import Cascader from '../../cascader';
import ConfigProvider from '../../config-provider';
import DatePicker from '../../date-picker';
import Drawer from '../../drawer';
import Dropdown from '../../dropdown';
@ -311,4 +312,29 @@ describe('Space.Compact', () => {
?.classList.contains('ant-picker-compact-item'),
).toBe(false);
});
// https://github.com/ant-design/ant-design/issues/41876
it('Space.Compact should inherit the size from ConfigProvider if the componentSize is set', () => {
const { container } = render(
<ConfigProvider componentSize="large">
<Space.Compact>
<Select placeholder="Select" />
</Space.Compact>
</ConfigProvider>,
);
expect(container.querySelectorAll('.ant-select-lg')).toHaveLength(1);
});
it('The size property of Space.Compact should have an higher priority over the componentSize property of ConfigProvider', () => {
const { container } = render(
<ConfigProvider componentSize="large">
<Space.Compact size="small">
<Select placeholder="Select" />
</Space.Compact>
</ConfigProvider>,
);
expect(container.querySelectorAll('.ant-select-sm')).toHaveLength(1);
});
});