fix(PlusIcon): Replace PlusIcon with RhUiAddIcon (#12520)

Co-authored-by: Cursor <cursoragent@cursor.com>

Author: rebeccaalpert

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

@@ -20,7 +20,7 @@ import { Fragment, useState } from 'react';
 import pfLogo from '../../assets/PF-HorizontalLogo-Color.svg';
 import pfLogoSmall from '../../assets/PF-IconLogo.svg';
 import RhUiEllipsisVerticalFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-ellipsis-vertical-fill-icon';
-import PlusIcon from '@patternfly/react-icons/dist/esm/icons/plus-icon';
+import RhUiAddIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-icon';
 
 ## Examples
 

packages/react-core/src/components/Card/examples/CardTile.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { Card, CardHeader, CardBody, Gallery, Flex } from '@patternfly/react-core';
-import PlusIcon from '@patternfly/react-icons/dist/esm/icons/plus-icon';
+import RhUiAddIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-icon';
 
 export const CardTile: React.FunctionComponent = () => {
   const [isChecked, setIsChecked] = useState('');
@@ -26,7 +26,7 @@ export const CardTile: React.FunctionComponent = () => {
           }}
         >
           <Flex gap={{ default: 'gapSm' }} alignItems={{ default: 'alignItemsCenter' }}>
-            <PlusIcon />
+            <RhUiAddIcon />
             <b>Tile header</b>
           </Flex>
         </CardHeader>
@@ -44,7 +44,7 @@ export const CardTile: React.FunctionComponent = () => {
           }}
         >
           <Flex gap={{ default: 'gapSm' }} alignItems={{ default: 'alignItemsCenter' }}>
-            <PlusIcon />
+            <RhUiAddIcon />
             <b>Tile header</b>
           </Flex>
         </CardHeader>
@@ -62,7 +62,7 @@ export const CardTile: React.FunctionComponent = () => {
           }}
         >
           <Flex gap={{ default: 'gapSm' }} alignItems={{ default: 'alignItemsCenter' }}>
-            <PlusIcon />
+            <RhUiAddIcon />
             <b>Tile header (disabled)</b>
           </Flex>
         </CardHeader>

packages/react-core/src/components/Card/examples/CardTileMulti.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { Card, CardHeader, CardBody, Gallery, Flex } from '@patternfly/react-core';
-import PlusIcon from '@patternfly/react-icons/dist/esm/icons/plus-icon';
+import RhUiAddIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-icon';
 
 export const CardTileMulti: React.FunctionComponent = () => {
   const [isChecked1, setIsChecked1] = useState(false);
@@ -39,7 +39,7 @@ export const CardTileMulti: React.FunctionComponent = () => {
           }}
         >
           <Flex gap={{ default: 'gapSm' }} alignItems={{ default: 'alignItemsCenter' }}>
-            <PlusIcon />
+            <RhUiAddIcon />
             <b>Tile header</b>
           </Flex>
         </CardHeader>
@@ -56,7 +56,7 @@ export const CardTileMulti: React.FunctionComponent = () => {
           }}
         >
           <Flex gap={{ default: 'gapSm' }} alignItems={{ default: 'alignItemsCenter' }}>
-            <PlusIcon />
+            <RhUiAddIcon />
             <b>Tile header</b>
           </Flex>
         </CardHeader>
@@ -73,7 +73,7 @@ export const CardTileMulti: React.FunctionComponent = () => {
           }}
         >
           <Flex gap={{ default: 'gapSm' }} alignItems={{ default: 'alignItemsCenter' }}>
-            <PlusIcon />
+            <RhUiAddIcon />
             <b>Tile header (disabled)</b>
           </Flex>
         </CardHeader>

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

@@ -8,8 +8,8 @@ propComponents: ['MenuToggle', 'MenuToggleAction', 'MenuToggleCheckbox']
 
 import { Fragment, useState } from 'react';
 import './MenuToggle.css'
-import PlusIcon from '@patternfly/react-icons/dist/esm/icons/plus-icon';
 import RhUiEllipsisVerticalFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-ellipsis-vertical-fill-icon';
+import RhUiAddIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-icon';
 import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg';
 import RhMicronsCloseIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-close-icon';
 
@@ -65,7 +65,7 @@ To create a "settings" menu toggle that will animate on hover and focus, you can
 
 ### Custom icons
 
-To add a recognizable icon to a menu toggle, use the `icon` property. The following example adds a `PlusIcon` to the toggle.
+To add a recognizable icon to a menu toggle, use the `icon` property. The following example adds an `RhUiAddIcon` to the toggle.
 
 For most basic icons, it is recommended to wrap it inside our [icon component](/components/icon).
 

packages/react-core/src/components/MenuToggle/examples/MenuToggleCustomIcon.tsx

@@ -1,16 +1,16 @@
 import { Fragment } from 'react';
 import { MenuToggle } from '@patternfly/react-core';
-import PlusIcon from '@patternfly/react-icons/dist/esm/icons/plus-icon';
+import RhUiAddIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-icon';
 
 export const MenuToggleCustomIcon: React.FC = () => (
   <Fragment>
-    <MenuToggle icon={<PlusIcon />} variant="primary">
+    <MenuToggle icon={<RhUiAddIcon />} variant="primary">
       Icon
     </MenuToggle>{' '}
-    <MenuToggle icon={<PlusIcon />} variant="secondary">
+    <MenuToggle icon={<RhUiAddIcon />} variant="secondary">
       Icon
     </MenuToggle>{' '}
-    <MenuToggle icon={<PlusIcon />} variant="secondary" isDisabled>
+    <MenuToggle icon={<RhUiAddIcon />} variant="secondary" isDisabled>
       Icon
     </MenuToggle>
   </Fragment>

packages/react-core/src/components/NumberInput/NumberInput.tsx

@@ -1,7 +1,7 @@
 import styles from '@patternfly/react-styles/css/components/NumberInput/number-input';
 import { css } from '@patternfly/react-styles';
 import RhUiMinusIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-minus-icon';
-import PlusIcon from '@patternfly/react-icons/dist/esm/icons/plus-icon';
+import RhUiAddIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-icon';
 import { InputGroup, InputGroupItem } from '../InputGroup';
 import { Button, ButtonProps } from '../Button';
 import { KeyTypes, ValidatedOptions } from '../../helpers';
@@ -154,7 +154,7 @@ export const NumberInput: React.FunctionComponent<NumberInputProps> = ({
             onClick={(evt) => onPlus(evt, inputName)}
             icon={
               <span className={css(styles.numberInputIcon)}>
-                <PlusIcon />
+                <RhUiAddIcon />
               </span>
             }
             {...plusBtnProps}