diff --git a/packages/react-core/src/components/Card/examples/Card.md b/packages/react-core/src/components/Card/examples/Card.md index d2fd9ed7c95..a88b6bece49 100644 --- a/packages/react-core/src/components/Card/examples/Card.md +++ b/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 diff --git a/packages/react-core/src/components/Card/examples/CardTile.tsx b/packages/react-core/src/components/Card/examples/CardTile.tsx index 2ed07685ba1..25ee1872557 100644 --- a/packages/react-core/src/components/Card/examples/CardTile.tsx +++ b/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 = () => { }} > - + Tile header @@ -44,7 +44,7 @@ export const CardTile: React.FunctionComponent = () => { }} > - + Tile header @@ -62,7 +62,7 @@ export const CardTile: React.FunctionComponent = () => { }} > - + Tile header (disabled) diff --git a/packages/react-core/src/components/Card/examples/CardTileMulti.tsx b/packages/react-core/src/components/Card/examples/CardTileMulti.tsx index c41816b5ba6..81fb355623d 100644 --- a/packages/react-core/src/components/Card/examples/CardTileMulti.tsx +++ b/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 = () => { }} > - + Tile header @@ -56,7 +56,7 @@ export const CardTileMulti: React.FunctionComponent = () => { }} > - + Tile header @@ -73,7 +73,7 @@ export const CardTileMulti: React.FunctionComponent = () => { }} > - + Tile header (disabled) diff --git a/packages/react-core/src/components/MenuToggle/examples/MenuToggle.md b/packages/react-core/src/components/MenuToggle/examples/MenuToggle.md index ae37f548b7e..bd6dd44ceca 100644 --- a/packages/react-core/src/components/MenuToggle/examples/MenuToggle.md +++ b/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). diff --git a/packages/react-core/src/components/MenuToggle/examples/MenuToggleCustomIcon.tsx b/packages/react-core/src/components/MenuToggle/examples/MenuToggleCustomIcon.tsx index 3d28980f807..34a1511e7d0 100644 --- a/packages/react-core/src/components/MenuToggle/examples/MenuToggleCustomIcon.tsx +++ b/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 = () => ( - } variant="primary"> + } variant="primary"> Icon {' '} - } variant="secondary"> + } variant="secondary"> Icon {' '} - } variant="secondary" isDisabled> + } variant="secondary" isDisabled> Icon diff --git a/packages/react-core/src/components/NumberInput/NumberInput.tsx b/packages/react-core/src/components/NumberInput/NumberInput.tsx index 41e074db844..f3076fa463a 100644 --- a/packages/react-core/src/components/NumberInput/NumberInput.tsx +++ b/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 MinusIcon from '@patternfly/react-icons/dist/esm/icons/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 = ({ onClick={(evt) => onPlus(evt, inputName)} icon={ - + } {...plusBtnProps} diff --git a/packages/react-core/src/components/NumberInput/__tests__/__snapshots__/NumberInput.test.tsx.snap b/packages/react-core/src/components/NumberInput/__tests__/__snapshots__/NumberInput.test.tsx.snap index b9d8eeaa62b..79235cf2f66 100644 --- a/packages/react-core/src/components/NumberInput/__tests__/__snapshots__/NumberInput.test.tsx.snap +++ b/packages/react-core/src/components/NumberInput/__tests__/__snapshots__/NumberInput.test.tsx.snap @@ -96,24 +96,12 @@ exports[`numberInput disables lower threshold 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -220,24 +208,12 @@ exports[`numberInput disables upper threshold 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -345,24 +321,12 @@ exports[`numberInput passes button props successfully 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -468,24 +432,12 @@ exports[`numberInput passes input props successfully 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -592,24 +544,12 @@ exports[`numberInput renders custom width 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -716,24 +656,12 @@ exports[`numberInput renders defaults & extra props 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -842,24 +770,12 @@ exports[`numberInput renders disabled 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -986,24 +902,12 @@ exports[`numberInput renders error validated 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -1130,24 +1034,12 @@ exports[`numberInput renders success validated 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -1258,24 +1150,12 @@ exports[`numberInput renders unit & position 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -1381,24 +1261,12 @@ exports[`numberInput renders unit 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -1509,24 +1377,12 @@ exports[`numberInput renders value 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -1653,24 +1509,12 @@ exports[`numberInput renders warning validated 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + diff --git a/packages/react-core/src/components/Slider/examples/Slider.md b/packages/react-core/src/components/Slider/examples/Slider.md index 8c74eea7be0..03c4a5040a4 100644 --- a/packages/react-core/src/components/Slider/examples/Slider.md +++ b/packages/react-core/src/components/Slider/examples/Slider.md @@ -8,7 +8,7 @@ propComponents: ['Slider', 'SliderStepObject'] import { useState } from 'react'; import { Slider, Button, Content, ContentVariants } from '@patternfly/react-core'; import MinusIcon from '@patternfly/react-icons/dist/esm/icons/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 LockIcon from '@patternfly/react-icons/dist/esm/icons/lock-icon'; import LockOpenIcon from '@patternfly/react-icons/dist/esm/icons/lock-open-icon'; diff --git a/packages/react-core/src/components/Slider/examples/SliderActions.tsx b/packages/react-core/src/components/Slider/examples/SliderActions.tsx index 1b4051008cb..39975b71a44 100644 --- a/packages/react-core/src/components/Slider/examples/SliderActions.tsx +++ b/packages/react-core/src/components/Slider/examples/SliderActions.tsx @@ -1,7 +1,7 @@ import { useState } from 'react'; import { Slider, SliderOnChangeEvent, Button, Content } from '@patternfly/react-core'; import MinusIcon from '@patternfly/react-icons/dist/esm/icons/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 LockIcon from '@patternfly/react-icons/dist/esm/icons/lock-icon'; import LockOpenIcon from '@patternfly/react-icons/dist/esm/icons/lock-open-icon'; @@ -69,7 +69,7 @@ export const SliderActions: React.FunctionComponent = () => { value={value1} onChange={onChange1} startActions={