mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-12 20:43:11 +08:00
Fix/legacy icon usage (#19446)
* fix: legacy icon usage in progress component demo * fix: legacy icon usage in button test cases
This commit is contained in:
parent
3ddc3a267a
commit
d25dff397d
@ -43,7 +43,26 @@ exports[`Button renders Chinese characters correctly 2`] = `
|
||||
class="ant-btn"
|
||||
type="button"
|
||||
>
|
||||
search
|
||||
<span
|
||||
aria-label="search"
|
||||
class="anticon anticon-search"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="search"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span>
|
||||
按钮
|
||||
</span>
|
||||
@ -86,7 +105,26 @@ exports[`Button renders Chinese characters correctly 4`] = `
|
||||
class="ant-btn"
|
||||
type="button"
|
||||
>
|
||||
search
|
||||
<span
|
||||
aria-label="search"
|
||||
class="anticon anticon-search"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="search"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span>
|
||||
按钮
|
||||
</span>
|
||||
@ -166,17 +204,6 @@ exports[`Button renders Chinese characters correctly 7`] = `
|
||||
</button>
|
||||
`;
|
||||
|
||||
exports[`Button renders Chinese characters correctly 7`] = `
|
||||
<button
|
||||
class="ant-btn"
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
按 钮
|
||||
</span>
|
||||
</button>
|
||||
`;
|
||||
|
||||
exports[`Button renders correctly 1`] = `
|
||||
<button
|
||||
class="ant-btn"
|
||||
|
@ -27,7 +27,7 @@ describe('Button', () => {
|
||||
const wrapper = render(<Button>按钮</Button>);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
// should not insert space when there is icon
|
||||
const wrapper1 = render(<Button icon="search">按钮</Button>);
|
||||
const wrapper1 = render(<Button icon={<Search />}>按钮</Button>);
|
||||
expect(wrapper1).toMatchSnapshot();
|
||||
// should not insert space when there is icon
|
||||
const wrapper2 = render(
|
||||
@ -38,11 +38,11 @@ describe('Button', () => {
|
||||
);
|
||||
expect(wrapper2).toMatchSnapshot();
|
||||
// should not insert space when there is icon
|
||||
const wrapper3 = render(<Button icon="search">按钮</Button>);
|
||||
const wrapper3 = render(<Button icon={<Search />}>按钮</Button>);
|
||||
expect(wrapper3).toMatchSnapshot();
|
||||
// should not insert space when there is icon while loading
|
||||
const wrapper4 = render(
|
||||
<Button icon="search" loading>
|
||||
<Button icon={<Search />} loading>
|
||||
按钮
|
||||
</Button>,
|
||||
);
|
||||
|
@ -218,13 +218,55 @@ exports[`renders ./components/progress/demo/circle-dynamic.md correctly 1`] = `
|
||||
class="ant-btn ant-btn-icon-only"
|
||||
type="button"
|
||||
>
|
||||
minus
|
||||
<span
|
||||
aria-label="minus"
|
||||
class="anticon anticon-minus"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="minus"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M872 474H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h720c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
class="ant-btn ant-btn-icon-only"
|
||||
type="button"
|
||||
>
|
||||
plus
|
||||
<span
|
||||
aria-label="plus"
|
||||
class="anticon anticon-plus"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="plus"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<defs />
|
||||
<path
|
||||
d="M482 152h60q8 0 8 8v704q0 8-8 8h-60q-8 0-8-8V160q0-8 8-8z"
|
||||
/>
|
||||
<path
|
||||
d="M176 474h672q8 0 8 8v60q0 8-8 8H176q-8 0-8-8v-60q0-8 8-8z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -475,13 +517,55 @@ exports[`renders ./components/progress/demo/dynamic.md correctly 1`] = `
|
||||
class="ant-btn ant-btn-icon-only"
|
||||
type="button"
|
||||
>
|
||||
minus
|
||||
<span
|
||||
aria-label="minus"
|
||||
class="anticon anticon-minus"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="minus"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M872 474H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h720c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
class="ant-btn ant-btn-icon-only"
|
||||
type="button"
|
||||
>
|
||||
plus
|
||||
<span
|
||||
aria-label="plus"
|
||||
class="anticon anticon-plus"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="plus"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<defs />
|
||||
<path
|
||||
d="M482 152h60q8 0 8 8v704q0 8-8 8h-60q-8 0-8-8V160q0-8 8-8z"
|
||||
/>
|
||||
<path
|
||||
d="M176 474h672q8 0 8 8v60q0 8-8 8H176q-8 0-8-8v-60q0-8 8-8z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -15,6 +15,7 @@ A dynamic progress bar is better.
|
||||
|
||||
```jsx
|
||||
import { Progress, Button } from 'antd';
|
||||
import { Minus as IconMinus, Plus as IconPlus } from '@ant-design/icons';
|
||||
|
||||
const ButtonGroup = Button.Group;
|
||||
|
||||
@ -44,8 +45,8 @@ class App extends React.Component {
|
||||
<div>
|
||||
<Progress type="circle" percent={this.state.percent} />
|
||||
<ButtonGroup>
|
||||
<Button onClick={this.decline} icon="minus" />
|
||||
<Button onClick={this.increase} icon="plus" />
|
||||
<Button onClick={this.decline} icon={<IconMinus />} />
|
||||
<Button onClick={this.increase} icon={<IconPlus />} />
|
||||
</ButtonGroup>
|
||||
</div>
|
||||
);
|
||||
|
@ -15,6 +15,7 @@ A dynamic progress bar is better.
|
||||
|
||||
```jsx
|
||||
import { Progress, Button } from 'antd';
|
||||
import { Minus as IconMinus, Plus as IconPlus } from '@ant-design/icons';
|
||||
|
||||
const ButtonGroup = Button.Group;
|
||||
|
||||
@ -44,8 +45,8 @@ class App extends React.Component {
|
||||
<div>
|
||||
<Progress percent={this.state.percent} />
|
||||
<ButtonGroup>
|
||||
<Button onClick={this.decline} icon="minus" />
|
||||
<Button onClick={this.increase} icon="plus" />
|
||||
<Button onClick={this.decline} icon={<IconMinus />} />
|
||||
<Button onClick={this.increase} icon={<IconPlus />} />
|
||||
</ButtonGroup>
|
||||
</div>
|
||||
);
|
||||
|
Loading…
Reference in New Issue
Block a user