Skip to content

Commit 95c0083

Browse files
fix(CheckIcon): Replace CheckIcon with RhMicronsCheckmarkIcon
Co-authored-by: Cursor <cursoragent@cursor.com>
1 parent a479b4c commit 95c0083

16 files changed

Lines changed: 89 additions & 186 deletions

File tree

packages/react-core/src/components/ActionList/examples/ActionList.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ propComponents: ['ActionList', 'ActionListGroup', 'ActionListItem']
77

88
import { Fragment, useState } from 'react';
99
import RhMicronsCloseIcon from '@patternfly/react-icons/dist/js/icons/rh-microns-close-icon';
10-
import CheckIcon from '@patternfly/react-icons/dist/js/icons/check-icon';
1110
import RhUiEllipsisVerticalFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-ellipsis-vertical-fill-icon';
11+
import RhMicronsCheckmarkIcon from '@patternfly/react-icons/dist/js/icons/rh-microns-checkmark-icon';
1212

1313
## Examples
1414

packages/react-core/src/components/ActionList/examples/ActionListVertical.tsx

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { ActionList, ActionListGroup, ActionListItem, Button } from '@patternfly/react-core';
2-
import CheckIcon from '@patternfly/react-icons/dist/esm/icons/check-icon';
2+
import RhMicronsCheckmarkIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-checkmark-icon';
33
import RhMicronsCloseIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-close-icon';
44

55
export const ActionListVertical: React.FunctionComponent = () => (
@@ -30,15 +30,23 @@ export const ActionListVertical: React.FunctionComponent = () => (
3030
<Button aria-label="Close vertical action list group 1" variant="plain" icon={<RhMicronsCloseIcon />} />
3131
</ActionListItem>
3232
<ActionListItem>
33-
<Button aria-label="Toggle vertical action list example group 1" variant="plain" icon={<CheckIcon />} />
33+
<Button
34+
aria-label="Toggle vertical action list example group 1"
35+
variant="plain"
36+
icon={<RhMicronsCheckmarkIcon />}
37+
/>
3438
</ActionListItem>
3539
</ActionListGroup>
3640
<ActionListGroup>
3741
<ActionListItem>
3842
<Button aria-label="Close vertical action list group 2" variant="plain" icon={<RhMicronsCloseIcon />} />
3943
</ActionListItem>
4044
<ActionListItem>
41-
<Button aria-label="Toggle vertical action list example group 2" variant="plain" icon={<CheckIcon />} />
45+
<Button
46+
aria-label="Toggle vertical action list example group 2"
47+
variant="plain"
48+
icon={<RhMicronsCheckmarkIcon />}
49+
/>
4250
</ActionListItem>
4351
</ActionListGroup>
4452
</ActionList>

packages/react-core/src/components/ActionList/examples/ActionListWithIcons.tsx

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { ActionList, ActionListGroup, ActionListItem, Button } from '@patternfly/react-core';
22
import RhMicronsCloseIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-close-icon';
3-
import CheckIcon from '@patternfly/react-icons/dist/esm/icons/check-icon';
3+
import RhMicronsCheckmarkIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-checkmark-icon';
44

55
export const ActionListWithIcons: React.FunctionComponent = () => (
66
<>
@@ -15,7 +15,12 @@ export const ActionListWithIcons: React.FunctionComponent = () => (
1515
/>
1616
</ActionListItem>
1717
<ActionListItem>
18-
<Button variant="plain" id="with-icons-check-button" aria-label="check icon button" icon={<CheckIcon />} />
18+
<Button
19+
variant="plain"
20+
id="with-icons-check-button"
21+
aria-label="check icon button"
22+
icon={<RhMicronsCheckmarkIcon />}
23+
/>
1924
</ActionListItem>
2025
</ActionList>
2126
<br />
@@ -35,7 +40,7 @@ export const ActionListWithIcons: React.FunctionComponent = () => (
3540
variant="plain"
3641
id="with-icons-list-check-button"
3742
aria-label="check icon button"
38-
icon={<CheckIcon />}
43+
icon={<RhMicronsCheckmarkIcon />}
3944
/>
4045
</ActionListItem>
4146
</ActionListGroup>
@@ -53,7 +58,7 @@ export const ActionListWithIcons: React.FunctionComponent = () => (
5358
variant="plain"
5459
id="with-icons-group-check-button"
5560
aria-label="check icon button"
56-
icon={<CheckIcon />}
61+
icon={<RhMicronsCheckmarkIcon />}
5762
/>
5863
</ActionListItem>
5964
</ActionListGroup>

packages/react-core/src/components/HelperText/examples/HelperText.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ propComponents: ['HelperText', 'HelperTextItem']
88
import { Fragment } from 'react';
99
import InfoIcon from '@patternfly/react-icons/dist/esm/icons/info-icon';
1010
import QuestionIcon from '@patternfly/react-icons/dist/esm/icons/question-icon';
11-
import CheckIcon from '@patternfly/react-icons/dist/esm/icons/check-icon';
11+
import RhMicronsCheckmarkIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-checkmark-icon';
1212
import RhMicronsCloseIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-close-icon';
1313
import ExclamationIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-icon';
1414

packages/react-core/src/components/HelperText/examples/HelperTextWithCustomIcon.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { HelperText, HelperTextItem } from '@patternfly/react-core';
33
import InfoIcon from '@patternfly/react-icons/dist/esm/icons/info-icon';
44
import QuestionIcon from '@patternfly/react-icons/dist/esm/icons/question-icon';
55
import ExclamationIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-icon';
6-
import CheckIcon from '@patternfly/react-icons/dist/esm/icons/check-icon';
6+
import RhMicronsCheckmarkIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-checkmark-icon';
77
import RhMicronsCloseIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-close-icon';
88

99
export const HelperTextWithCustomIcon: React.FunctionComponent = () => (
@@ -22,7 +22,7 @@ export const HelperTextWithCustomIcon: React.FunctionComponent = () => (
2222
</HelperTextItem>
2323
</HelperText>
2424
<HelperText>
25-
<HelperTextItem variant="success" icon={<CheckIcon />}>
25+
<HelperTextItem variant="success" icon={<RhMicronsCheckmarkIcon />}>
2626
This is success helper text
2727
</HelperTextItem>
2828
</HelperText>

packages/react-core/src/components/Icon/__tests__/Icon.test.tsx

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
import { render, screen } from '@testing-library/react';
22
import { kebabCase } from 'case-anything';
33
import { Icon, IconSize } from '../Icon';
4-
import CheckIcon from '@patternfly/react-icons/dist/esm/icons/check-icon';
4+
import RhMicronsCheckmarkIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-checkmark-icon';
55
import styles from '@patternfly/react-styles/css/components/Icon/icon';
66

77
test('renders basic icon successfully', () => {
88
const { asFragment } = render(
99
<Icon>
10-
<CheckIcon />
10+
<RhMicronsCheckmarkIcon />
1111
</Icon>
1212
);
1313
expect(asFragment()).toMatchSnapshot();
@@ -16,7 +16,7 @@ test('renders basic icon successfully', () => {
1616
test('checks basic icon structure', () => {
1717
render(
1818
<Icon title="icon">
19-
<CheckIcon />
19+
<RhMicronsCheckmarkIcon />
2020
</Icon>
2121
);
2222
const iconContainer = screen.getByTitle('icon');
@@ -33,7 +33,7 @@ test('renders without children', () => {
3333
test('sets additional custom class successfully', () => {
3434
render(
3535
<Icon className="test" title="custom-icon">
36-
<CheckIcon />
36+
<RhMicronsCheckmarkIcon />
3737
</Icon>
3838
);
3939
const iconContainer = screen.getByTitle('custom-icon');
@@ -61,7 +61,7 @@ Object.values([
6161
test(`sets icon size modifier successfully - ${size}`, () => {
6262
render(
6363
<Icon iconSize={size as IconSize} title={`content-${size}-icon`}>
64-
<CheckIcon />
64+
<RhMicronsCheckmarkIcon />
6565
</Icon>
6666
);
6767
const iconContainer = screen.getByTitle(`content-${size}-icon`).querySelector(`.${styles.iconContent}`);
@@ -74,7 +74,7 @@ Object.values([
7474
test(`sets progress icon size modifier successfully - ${size}`, () => {
7575
render(
7676
<Icon isInProgress progressIconSize={size as IconSize} title={`progress-content-${size}-icon`}>
77-
<CheckIcon />
77+
<RhMicronsCheckmarkIcon />
7878
</Icon>
7979
);
8080
const iconContainer = screen.getByTitle(`progress-content-${size}-icon`).querySelector(`.${styles.iconProgress}`);
@@ -87,7 +87,7 @@ Object.values([
8787
test(`sets size modifier successfully - ${size}`, () => {
8888
render(
8989
<Icon size={size as IconSize} title={`${size}-icon`}>
90-
<CheckIcon />
90+
<RhMicronsCheckmarkIcon />
9191
</Icon>
9292
);
9393
const iconContainer = screen.getByTitle(`${size}-icon`);
@@ -101,7 +101,7 @@ Object.values([
101101
test('check icon without iconSize', () => {
102102
render(
103103
<Icon title="no-icon-size">
104-
<CheckIcon />
104+
<RhMicronsCheckmarkIcon />
105105
</Icon>
106106
);
107107
const iconContainer = screen.getByTitle('no-icon-size').querySelector(`.${styles.iconContent}`);
@@ -111,7 +111,7 @@ test('check icon without iconSize', () => {
111111
test('check icon without progress icon size', () => {
112112
render(
113113
<Icon title="no-progress-icon-size">
114-
<CheckIcon />
114+
<RhMicronsCheckmarkIcon />
115115
</Icon>
116116
);
117117
const iconContainer = screen.getByTitle('no-progress-icon-size').querySelector(`.${styles.iconProgress}`);
@@ -121,7 +121,7 @@ test('check icon without progress icon size', () => {
121121
test('check icon without size', () => {
122122
render(
123123
<Icon title="no-size">
124-
<CheckIcon />
124+
<RhMicronsCheckmarkIcon />
125125
</Icon>
126126
);
127127
const iconContainer = screen.getByTitle('no-size');
@@ -132,7 +132,7 @@ Object.values(['custom', 'info', 'success', 'warning', 'danger']).forEach((statu
132132
test(`sets status modifier successfully - ${status}`, () => {
133133
render(
134134
<Icon status={status as 'custom' | 'info' | 'success' | 'warning' | 'danger'} title={`${status}-icon`}>
135-
<CheckIcon />
135+
<RhMicronsCheckmarkIcon />
136136
</Icon>
137137
);
138138
const iconContent = screen.getByTitle(`${status}-icon`).querySelector(`.${styles.iconContent}`);
@@ -144,7 +144,7 @@ Object.values(['custom', 'info', 'success', 'warning', 'danger']).forEach((statu
144144
test('check icon without status', () => {
145145
render(
146146
<Icon title="no-status">
147-
<CheckIcon />
147+
<RhMicronsCheckmarkIcon />
148148
</Icon>
149149
);
150150
const iconContent = screen.getByTitle('no-status').querySelector(`.${styles.iconContent}`);
@@ -154,7 +154,7 @@ test('check icon without status', () => {
154154
test('sets isInline successfully', () => {
155155
render(
156156
<Icon isInline title="inline-icon">
157-
<CheckIcon />
157+
<RhMicronsCheckmarkIcon />
158158
</Icon>
159159
);
160160
const iconContainer = screen.getByTitle('inline-icon');
@@ -165,7 +165,7 @@ test('sets isInline successfully', () => {
165165
test('check icon without isInline', () => {
166166
render(
167167
<Icon title="no-inline">
168-
<CheckIcon />
168+
<RhMicronsCheckmarkIcon />
169169
</Icon>
170170
);
171171
const iconContainer = screen.getByTitle('no-inline');
@@ -175,7 +175,7 @@ test('check icon without isInline', () => {
175175
test('sets isInProgress successfully', () => {
176176
render(
177177
<Icon isInProgress title="progress-icon">
178-
<CheckIcon />
178+
<RhMicronsCheckmarkIcon />
179179
</Icon>
180180
);
181181
const iconContainer = screen.getByTitle('progress-icon');
@@ -188,7 +188,7 @@ test('sets isInProgress successfully', () => {
188188
test('check icon without isInProgress', () => {
189189
render(
190190
<Icon title="no-in-progress">
191-
<CheckIcon />
191+
<RhMicronsCheckmarkIcon />
192192
</Icon>
193193
);
194194
const iconContainer = screen.getByTitle('no-in-progress');
@@ -198,7 +198,7 @@ test('check icon without isInProgress', () => {
198198
test('sets default progres aria-label successfully', () => {
199199
render(
200200
<Icon isInProgress defaultProgressArialabel="test" title="progress-icon">
201-
<CheckIcon />
201+
<RhMicronsCheckmarkIcon />
202202
</Icon>
203203
);
204204

@@ -207,8 +207,8 @@ test('sets default progres aria-label successfully', () => {
207207

208208
test('renders progress icon successfully', () => {
209209
const { asFragment } = render(
210-
<Icon isInProgress progressIcon={<CheckIcon />}>
211-
<CheckIcon />
210+
<Icon isInProgress progressIcon={<RhMicronsCheckmarkIcon />}>
211+
<RhMicronsCheckmarkIcon />
212212
</Icon>
213213
);
214214
expect(asFragment()).toMatchSnapshot();

packages/react-core/src/components/Icon/__tests__/__snapshots__/Icon.test.tsx.snap

Lines changed: 12 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -14,24 +14,12 @@ exports[`renders basic icon successfully 1`] = `
1414
fill="currentColor"
1515
height="1em"
1616
role="img"
17+
viewBox="0 0 20 20"
1718
width="1em"
1819
>
19-
<svg
20-
class="pf-v6-icon-default"
21-
viewBox="0 0 512 512"
22-
>
23-
<path
24-
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
25-
/>
26-
</svg>
27-
<svg
28-
class="pf-v6-icon-rh-ui"
29-
viewBox="0 0 32 32"
30-
>
31-
<path
32-
d="M11 26.792c-.384 0-.769-.146-1.061-.438l-8.646-8.647a.999.999 0 1 1 1.414-1.414L11 24.586 29.293 6.293a.999.999 0 1 1 1.414 1.414L12.061 26.354a1.497 1.497 0 0 1-1.061.438Z"
33-
/>
34-
</svg>
20+
<path
21+
d="M18.71 4.27c-.4-.38-1.03-.37-1.41.02L7 14.59 2.71 10.3l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l4.65 4.65a1.499 1.499 0 0 0 2.12 0L18.72 5.71l.02-.02c.38-.4.37-1.03-.02-1.41Z"
22+
/>
3523
</svg>
3624
</span>
3725
</span>
@@ -52,24 +40,12 @@ exports[`renders progress icon successfully 1`] = `
5240
fill="currentColor"
5341
height="1em"
5442
role="img"
43+
viewBox="0 0 20 20"
5544
width="1em"
5645
>
57-
<svg
58-
class="pf-v6-icon-default"
59-
viewBox="0 0 512 512"
60-
>
61-
<path
62-
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
63-
/>
64-
</svg>
65-
<svg
66-
class="pf-v6-icon-rh-ui"
67-
viewBox="0 0 32 32"
68-
>
69-
<path
70-
d="M11 26.792c-.384 0-.769-.146-1.061-.438l-8.646-8.647a.999.999 0 1 1 1.414-1.414L11 24.586 29.293 6.293a.999.999 0 1 1 1.414 1.414L12.061 26.354a1.497 1.497 0 0 1-1.061.438Z"
71-
/>
72-
</svg>
46+
<path
47+
d="M18.71 4.27c-.4-.38-1.03-.37-1.41.02L7 14.59 2.71 10.3l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l4.65 4.65a1.499 1.499 0 0 0 2.12 0L18.72 5.71l.02-.02c.38-.4.37-1.03-.02-1.41Z"
48+
/>
7349
</svg>
7450
</span>
7551
<span
@@ -81,24 +57,12 @@ exports[`renders progress icon successfully 1`] = `
8157
fill="currentColor"
8258
height="1em"
8359
role="img"
60+
viewBox="0 0 20 20"
8461
width="1em"
8562
>
86-
<svg
87-
class="pf-v6-icon-default"
88-
viewBox="0 0 512 512"
89-
>
90-
<path
91-
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
92-
/>
93-
</svg>
94-
<svg
95-
class="pf-v6-icon-rh-ui"
96-
viewBox="0 0 32 32"
97-
>
98-
<path
99-
d="M11 26.792c-.384 0-.769-.146-1.061-.438l-8.646-8.647a.999.999 0 1 1 1.414-1.414L11 24.586 29.293 6.293a.999.999 0 1 1 1.414 1.414L12.061 26.354a1.497 1.497 0 0 1-1.061.438Z"
100-
/>
101-
</svg>
63+
<path
64+
d="M18.71 4.27c-.4-.38-1.03-.37-1.41.02L7 14.59 2.71 10.3l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l4.65 4.65a1.499 1.499 0 0 0 2.12 0L18.72 5.71l.02-.02c.38-.4.37-1.03-.02-1.41Z"
65+
/>
10266
</svg>
10367
</span>
10468
</span>

packages/react-core/src/components/Menu/MenuItem.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import leftOffset from '@patternfly/react-tokens/dist/esm/c_menu_m_flyout__menu_
77
import RhMicronsExternalLinkIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-external-link-icon';
88
import RhMicronsCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-left-icon';
99
import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
10-
import CheckIcon from '@patternfly/react-icons/dist/esm/icons/check-icon';
10+
import RhMicronsCheckmarkIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-checkmark-icon';
1111
import { Checkbox } from '../Checkbox';
1212
import { MenuContext, MenuItemContext } from './MenuContext';
1313
import { MenuItemAction } from './MenuItemAction';
@@ -399,7 +399,7 @@ const MenuItemBase: React.FunctionComponent<MenuItemProps> = ({
399399
)}
400400
{getIsSelected() && (
401401
<span className={css(styles.menuItemSelectIcon)}>
402-
<CheckIcon />
402+
<RhMicronsCheckmarkIcon />
403403
</span>
404404
)}
405405
</span>

0 commit comments

Comments
 (0)