Skip to content

Commit f59cf45

Browse files
kmcfaulkmcfaul
committed
feat(misc): update status icons to rh icons
1 parent 93e7816 commit f59cf45

102 files changed

Lines changed: 424 additions & 413 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎packages/code-connect/components/PopOver/Popover.figma.tsx‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import figma from '@figma/code-connect';
22
import { Popover } from '@patternfly/react-core';
3-
import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
4-
import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
5-
import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
6-
import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
3+
import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
4+
import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
5+
import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
6+
import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
77
import BullhornIcon from '@patternfly/react-icons/dist/esm/icons/bullhorn-icon';
88

99
// TODO: DESIGN: Add buttons boolean to footerContent
@@ -46,19 +46,19 @@ figma.connect(
4646
},
4747
Success: {
4848
state: 'success',
49-
icon: <CheckCircleIcon />
49+
icon: <RhUiCheckCircleFillIcon />
5050
},
5151
Info: {
5252
state: 'info',
53-
icon: <InfoCircleIcon />
53+
icon: <RhUiInformationFillIcon />
5454
},
5555
Warning: {
5656
state: 'warning',
57-
icon: <ExclamationTriangleIcon />
57+
icon: <RhUiWarningFillIcon />
5858
},
5959
Danger: {
6060
state: 'danger',
61-
icon: <ExclamationCircleIcon />
61+
icon: <RhUiErrorFillIcon />
6262
}
6363
}),
6464

‎packages/react-core/src/components/Alert/AlertIcon.tsx‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
import { css } from '@patternfly/react-styles';
22
import styles from '@patternfly/react-styles/css/components/Alert/alert';
3-
import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
4-
import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
5-
import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
6-
import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
7-
import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
3+
import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
4+
import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
5+
import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
6+
import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
7+
import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
88

99
export const variantIcons = {
10-
success: CheckCircleIcon,
11-
danger: ExclamationCircleIcon,
12-
warning: ExclamationTriangleIcon,
13-
info: InfoCircleIcon,
14-
custom: BellIcon
10+
success: RhUiCheckCircleFillIcon,
11+
danger: RhUiErrorFillIcon,
12+
warning: RhUiWarningFillIcon,
13+
info: RhUiInformationFillIcon,
14+
custom: RhUiNotificationFillIcon
1515
};
1616

1717
export interface AlertIconProps extends React.HTMLProps<HTMLDivElement> {

‎packages/react-core/src/components/Alert/__tests__/AlertIcon.test.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,14 @@ import { render, screen } from '@testing-library/react';
33
import { AlertIcon } from '../AlertIcon';
44
import styles from '@patternfly/react-styles/css/components/Alert/alert';
55

6-
jest.mock('@patternfly/react-icons/dist/esm/icons/check-circle-icon', () => () => 'Check circle icon mock');
7-
jest.mock('@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon', () => () => 'Exclamation circle icon mock');
6+
jest.mock('@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon', () => () => 'Check circle icon mock');
7+
jest.mock('@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon', () => () => 'Exclamation circle icon mock');
88
jest.mock(
9-
'@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon',
9+
'@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon',
1010
() => () => 'Exclamation triangle icon mock'
1111
);
12-
jest.mock('@patternfly/react-icons/dist/esm/icons/info-circle-icon', () => () => 'Info circle icon mock');
13-
jest.mock('@patternfly/react-icons/dist/esm/icons/bell-icon', () => () => 'Bell icon mock');
12+
jest.mock('@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon', () => () => 'Info circle icon mock');
13+
jest.mock('@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon', () => () => 'Bell icon mock');
1414

1515
test('Renders without children', () => {
1616
render(

‎packages/react-core/src/components/Banner/examples/Banner.md‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,11 @@ cssPrefix: pf-v6-c-banner
55
propComponents: ['Banner']
66
---
77

8-
import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
9-
import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
10-
import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
11-
import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
12-
import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
8+
import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
9+
import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
10+
import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
11+
import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
12+
import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
1313

1414
## Examples
1515

‎packages/react-core/src/components/Banner/examples/BannerStatus.tsx‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import { Banner, Flex, FlexItem } from '@patternfly/react-core';
2-
import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
3-
import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
4-
import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
5-
import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
6-
import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
2+
import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
3+
import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
4+
import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
5+
import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
6+
import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
77

88
export const BannerStatus: React.FunctionComponent = () => (
99
<>
1010
<Banner screenReaderText="Success banner" status="success">
1111
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
1212
<FlexItem>
13-
<CheckCircleIcon />
13+
<RhUiCheckCircleFillIcon />
1414
</FlexItem>
1515
<FlexItem>Success banner</FlexItem>
1616
</Flex>
@@ -19,7 +19,7 @@ export const BannerStatus: React.FunctionComponent = () => (
1919
<Banner screenReaderText="Warning banner" status="warning">
2020
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
2121
<FlexItem>
22-
<ExclamationTriangleIcon />
22+
<RhUiWarningFillIcon />
2323
</FlexItem>
2424
<FlexItem>Warning banner</FlexItem>
2525
</Flex>
@@ -28,7 +28,7 @@ export const BannerStatus: React.FunctionComponent = () => (
2828
<Banner screenReaderText="Danger banner" status="danger">
2929
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
3030
<FlexItem>
31-
<ExclamationCircleIcon />
31+
<RhUiErrorFillIcon />
3232
</FlexItem>
3333
<FlexItem>Danger banner</FlexItem>
3434
</Flex>
@@ -37,7 +37,7 @@ export const BannerStatus: React.FunctionComponent = () => (
3737
<Banner screenReaderText="Info banner" status="info">
3838
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
3939
<FlexItem>
40-
<InfoCircleIcon />
40+
<RhUiInformationFillIcon />
4141
</FlexItem>
4242
<FlexItem>Info banner</FlexItem>
4343
</Flex>
@@ -46,7 +46,7 @@ export const BannerStatus: React.FunctionComponent = () => (
4646
<Banner screenReaderText="Custom banner" status="custom">
4747
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
4848
<FlexItem>
49-
<BellIcon />
49+
<RhUiNotificationFillIcon />
5050
</FlexItem>
5151
<FlexItem>Custom banner</FlexItem>
5252
</Flex>

‎packages/react-core/src/components/Button/examples/Button.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import ExternalLinkSquareAltIcon from '@patternfly/react-icons/dist/esm/icons/ex
1313
import CopyIcon from '@patternfly/react-icons/dist/esm/icons/copy-icon';
1414
import ArrowRightIcon from '@patternfly/react-icons/dist/esm/icons/arrow-right-icon';
1515
import UploadIcon from '@patternfly/react-icons/dist/esm/icons/upload-icon';
16-
import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
16+
import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
1717
import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon';
1818

1919
## Examples

‎packages/react-core/src/components/Button/examples/ButtonCircle.tsx‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { Button, Flex } from '@patternfly/react-core';
22
import RhMicronsCloseIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-close-icon';
33
import PlusCircleIcon from '@patternfly/react-icons/dist/esm/icons/plus-circle-icon';
44
import CopyIcon from '@patternfly/react-icons/dist/esm/icons/copy-icon';
5-
import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
5+
import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
66
import UploadIcon from '@patternfly/react-icons/dist/esm/icons/upload-icon';
77

88
interface LoadingPropsType {
@@ -35,19 +35,24 @@ export const ButtonCircle: React.FunctionComponent = () => {
3535
<Button variant="link" isCircle icon={<PlusCircleIcon />} aria-label="Add link circle variant example" />
3636
<Button variant="control" isCircle icon={<CopyIcon />} aria-label="Copy control circle variant example" />
3737
<Button variant="plain" isCircle icon={<RhMicronsCloseIcon />} aria-label="Remove plain circle variant example" />
38-
<Button variant="stateful" isCircle icon={<BellIcon />} aria-label="Stateful unread circle variant example" />
38+
<Button
39+
variant="stateful"
40+
isCircle
41+
icon={<RhUiNotificationFillIcon />}
42+
aria-label="Stateful unread circle variant example"
43+
/>
3944
<Button
4045
variant="stateful"
4146
state="read"
4247
isCircle
43-
icon={<BellIcon />}
48+
icon={<RhUiNotificationFillIcon />}
4449
aria-label="Stateful read circle variant example"
4550
/>
4651
<Button
4752
variant="stateful"
4853
state="attention"
4954
isCircle
50-
icon={<BellIcon />}
55+
icon={<RhUiNotificationFillIcon />}
5156
aria-label="Stateful attention circle variant example"
5257
/>
5358
<Button

‎packages/react-core/src/components/Button/examples/ButtonStateful.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,29 @@
11
import { Button, Flex } from '@patternfly/react-core';
2-
import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
2+
import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
33

44
export const ButtonStateful: React.FunctionComponent = () => (
55
<Flex>
66
<div>
77
<div>
88
<strong>Read</strong>
99
</div>
10-
<Button variant="stateful" state="read" icon={<BellIcon />}>
10+
<Button variant="stateful" state="read" icon={<RhUiNotificationFillIcon />}>
1111
10 <span className="pf-v6-screen-reader">items</span>
1212
</Button>
1313
</div>
1414
<div>
1515
<div>
1616
<strong>Unread</strong>
1717
</div>
18-
<Button variant="stateful" state="unread" icon={<BellIcon />}>
18+
<Button variant="stateful" state="unread" icon={<RhUiNotificationFillIcon />}>
1919
10 <span className="pf-v6-screen-reader">unread items</span>
2020
</Button>
2121
</div>
2222
<div>
2323
<div>
2424
<strong>Attention</strong>
2525
</div>
26-
<Button variant="stateful" state="attention" icon={<BellIcon />}>
26+
<Button variant="stateful" state="attention" icon={<RhUiNotificationFillIcon />}>
2727
10 <span className="pf-v6-screen-reader">unread items, needs attention</span>
2828
</Button>
2929
</div>

‎packages/react-core/src/components/Button/examples/ButtonVariations.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import RhMicronsCloseIcon from '@patternfly/react-icons/dist/esm/icons/rh-micron
33
import PlusCircleIcon from '@patternfly/react-icons/dist/esm/icons/plus-circle-icon';
44
import ExternalLinkSquareAltIcon from '@patternfly/react-icons/dist/esm/icons/external-link-square-alt-icon';
55
import CopyIcon from '@patternfly/react-icons/dist/esm/icons/copy-icon';
6-
import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
6+
import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
77

88
export const ButtonVariations: React.FunctionComponent = () => (
99
<>
@@ -50,13 +50,13 @@ export const ButtonVariations: React.FunctionComponent = () => (
5050
</Flex>
5151
<br />
5252
<Flex columnGap={{ default: 'columnGapSm' }}>
53-
<Button variant="stateful" icon={<BellIcon />} state="read">
53+
<Button variant="stateful" icon={<RhUiNotificationFillIcon />} state="read">
5454
Stateful read
5555
</Button>
56-
<Button variant="stateful" icon={<BellIcon />} state="unread">
56+
<Button variant="stateful" icon={<RhUiNotificationFillIcon />} state="unread">
5757
Stateful unread
5858
</Button>
59-
<Button variant="stateful" icon={<BellIcon />} state="attention">
59+
<Button variant="stateful" icon={<RhUiNotificationFillIcon />} state="attention">
6060
Stateful attention
6161
</Button>
6262
</Flex>

‎packages/react-core/src/components/EmptyState/examples/EmptyState.md‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ propComponents: ['EmptyState', 'EmptyStateBody', 'EmptyStateFooter', 'EmptyState
88
import { useState } from 'react';
99
import CubesIcon from '@patternfly/react-icons/dist/esm/icons/cubes-icon';
1010
import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
11-
import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
1211

1312
## Examples
1413
### Basic

0 commit comments

Comments
 (0)