@patternfly/react-core 6.6.0-prerelease.9 → 6.6.1-prerelease.0

package/src/components/DescriptionList/examples/DescriptionList.md

@@ -20,7 +20,7 @@ import { Button, DescriptionList, DescriptionListTerm, DescriptionListDescriptio
 import RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon';
 import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';
 import BookIcon from '@patternfly/react-icons/dist/esm/icons/book-icon';
-import KeyIcon from '@patternfly/react-icons/dist/esm/icons/key-icon';
+import RhUiKeyIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-key-icon';
 import RhUiFlagFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-flag-fill-icon';
 import RhUiLanguageFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-language-fill-icon';
 
@@ -29,66 +29,79 @@ import RhUiLanguageFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-l
 ### Basic
 
 ```ts file='./DescriptionListBasic.tsx'
+
 ```
 
 ### Term help text
 
 ```ts file='./DescriptionListWithTermHelpText.tsx'
+
 ```
 
 ### Default 2 col
 
 ```ts file='./DescriptionListDefaultTwoCol.tsx'
+
 ```
 
 ### Default 3 col on lg
 
 ```ts file='./DescriptionListDefaultThreeColLg.tsx'
+
 ```
 
 ### Horizontal
 
 ```ts file='./DescriptionListHorizontal.tsx'
+
 ```
 
 ### Horizontal using custom term width modifier
 
 ```ts file='./DescriptionListHorizontalCustomTermWidth.tsx'
+
 ```
 
 ### Horizontal 2 col
 
 ```ts file='./DescriptionListHorizontalTwoCol.tsx'
+
 ```
 
 ### Horizontal 3 col on lg
 
 ```ts file='./DescriptionListHorizontalThreeColLg.tsx'
+
 ```
 
 ### Compact
 
 ```ts file='./DescriptionListCompact.tsx'
+
 ```
 
 ### Compact horizontal
 
 ```ts file='./DescriptionListCompactHorizontal.tsx'
+
 ```
 
 ### Fluid horizontal
 
 ```ts file='./DescriptionListFluidHorizontal.tsx'
+
 ```
 
 ### Column fill
 
 ```ts file='./DescriptionListColumnFill.tsx'
+
 ```
 
 ### Large display size
 
 ```ts file='./DescriptionListWithLargeDisplaySize.tsx'
+
 ```
 
 ## Responsive column definitions
@@ -96,16 +109,19 @@ import RhUiLanguageFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-l
 ### Default responsive columns
 
 ```ts file='./DescriptionListDefaultResponsiveColumns.tsx'
+
 ```
 
 ### Horizontal responsive columns
 
 ```ts file='./DescriptionListHorizontalResponsiveColumns.tsx'
+
 ```
 
 ### Responsive horizontal, vertical group layout
 
 ```ts file='./DescriptionListResponsiveHoriVertGroup.tsx'
+
 ```
 
 ## Auto-column-width
@@ -113,11 +129,13 @@ import RhUiLanguageFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-l
 ### Default auto column width
 
 ```ts file='./DescriptionListDefaultAutoColumn.tsx'
+
 ```
 
 ### Horizontal auto column width
 
 ```ts file='./DescriptionListHorizontalAutoColumn.tsx'
+
 ```
 
 ## Inline grid
@@ -125,6 +143,7 @@ import RhUiLanguageFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-l
 ### Default inline grid
 
 ```ts file='./DescriptionListDefaultInlineGrid.tsx'
+
 ```
 
 ## Card variants
@@ -134,21 +153,25 @@ A [card component](/components/card) can be used in place of a description list
 ### Description list with card
 
 ```ts file='./DescriptionListWithCard.tsx'
+
 ```
 
 ### Description list with large display size and card
 
 ```ts file='./DescriptionListWithLargeDisplaySizeAndCard.tsx'
+
 ```
 
 ### Display size with card, three column on large breakpoint
 
 ```ts file='./DescriptionListDisplaySizeAndCardThreeColumn.tsx'
+
 ```
 
 ### Display size with card, horizontal, modified term width
 
 ```ts file='./DescriptionListDisplaySizeAndCardHorizontalTermWidth.tsx'
+
 ```
 
 ## Auto fit
@@ -156,16 +179,19 @@ A [card component](/components/card) can be used in place of a description list
 ### Auto-fit basic
 
 ```ts file='./DescriptionListAutoFitBasic.tsx'
+
 ```
 
 ### Auto-fit, min width modified grid template columns
 
 ```ts file='./DescriptionListAutoFitMinWidthModified.tsx'
+
 ```
 
 ### Auto-fit, min width modified, responsive grid template columns
 
 ```ts file='./DescriptionListAutoFitMinWidthResponsive.tsx'
+
 ```
 
 ## With icons
@@ -173,4 +199,5 @@ A [card component](/components/card) can be used in place of a description list
 ### Icons on terms
 
 ```ts file='./DescriptionListIconsOnTerms.tsx'
+
 ```

package/src/components/DescriptionList/examples/DescriptionListIconsOnTerms.tsx

@@ -8,7 +8,7 @@ import {
 import RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon';
 import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';
 import BookIcon from '@patternfly/react-icons/dist/esm/icons/book-icon';
-import KeyIcon from '@patternfly/react-icons/dist/esm/icons/key-icon';
+import RhUiKeyIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-key-icon';
 import RhUiFlagFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-flag-fill-icon';
 import RhUiLanguageFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-language-fill-icon';
 
@@ -25,7 +25,7 @@ export const DescriptionListIconsOnTerms: React.FunctionComponent = () => (
       </DescriptionListDescription>
     </DescriptionListGroup>
     <DescriptionListGroup>
-      <DescriptionListTerm icon={<KeyIcon />}>Labels</DescriptionListTerm>
+      <DescriptionListTerm icon={<RhUiKeyIcon />}>Labels</DescriptionListTerm>
       <DescriptionListDescription>example</DescriptionListDescription>
     </DescriptionListGroup>
     <DescriptionListGroup>

package/src/components/Drawer/DrawerPanelContent.tsx

@@ -8,6 +8,7 @@ import { FocusTrap } from '../../helpers/FocusTrap/FocusTrap';
 import cssPanelMdFlexBasis from '@patternfly/react-tokens/dist/esm/c_drawer__panel_md_FlexBasis';
 import cssPanelMdFlexBasisMin from '@patternfly/react-tokens/dist/esm/c_drawer__panel_md_FlexBasis_min';
 import cssPanelMdFlexBasisMax from '@patternfly/react-tokens/dist/esm/c_drawer__panel_md_FlexBasis_max';
+import { IS_INERT } from '../../helpers/inert';
 
 export interface DrawerPanelFocusTrapObject {
   /** Enables a focus trap on the drawer panel content. This will also automatically
@@ -408,7 +409,7 @@ export const DrawerPanelContent: React.FunctionComponent<DrawerPanelContentProps
         ...((defaultSize || minSize || maxSize) && boundaryCssVars),
         ...style
       }}
-      {...(shouldCollapseSpace && { inert: '' })}
+      {...(shouldCollapseSpace && { inert: IS_INERT })}
       {...props}
       ref={panel}
     >

package/src/components/DualListSelector/DualListSelectorTreeItem.tsx

@@ -3,10 +3,11 @@ import styles from '@patternfly/react-styles/css/components/DualListSelector/dua
 import { css } from '@patternfly/react-styles';
 import { DualListSelectorTreeItemData } from './DualListSelectorTree';
 import { Badge } from '../Badge';
-import RhMicronsCaretDownIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-down-icon';
+import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
 import { flattenTree } from './treeUtils';
 import { DualListSelectorListContext } from './DualListSelectorContext';
 import { useHasAnimations } from '../../helpers';
+import { IS_INERT } from '../../helpers/inert';
 
 export interface DualListSelectorTreeItemProps extends React.HTMLProps<HTMLLIElement> {
   /** Content rendered inside the dual list selector. */
@@ -78,7 +79,7 @@ const DualListSelectorTreeItemBase: React.FunctionComponent<DualListSelectorTree
     (child) =>
       isValidElement(child) &&
       cloneElement(child as React.ReactElement<any>, {
-        inert: isExpanded ? undefined : ''
+        inert: isExpanded ? undefined : IS_INERT
       })
   );
 
@@ -136,7 +137,7 @@ const DualListSelectorTreeItemBase: React.FunctionComponent<DualListSelectorTree
                 tabIndex={-1}
               >
                 <span className={css(styles.dualListSelectorItemToggleIcon)}>
-                  <RhMicronsCaretDownIcon />
+                  <RhMicronsCaretRightIcon />
                 </span>
               </div>
             )}

package/src/components/DualListSelector/__tests__/__snapshots__/DualListSelector.test.tsx.snap

@@ -90,24 +90,12 @@ exports[`DualListSelector with search inputs 1`] = `
                   fill="currentColor"
                   height="1em"
                   role="img"
+                  viewBox="0 0 20 20"
                   width="1em"
                 >
-                  <svg
-                    class="pf-v6-icon-default"
-                    viewBox="0 0 512 512"
-                  >
-                    <path
-                      d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
-                    />
-                  </svg>
-                  <svg
-                    class="pf-v6-icon-rh-ui"
-                    viewBox="0 0 32 32"
-                  >
-                    <path
-                      d="m30.796 29.205-8.557-8.557A11.945 11.945 0 0 0 25 13c0-6.617-5.383-12-12-12S1 6.383 1 13s5.383 12 12 12c2.904 0 5.57-1.038 7.648-2.761l8.556 8.556a1.122 1.122 0 0 0 1.592 0 1.127 1.127 0 0 0 0-1.591ZM3 13C3 7.486 7.486 3 13 3s10 4.486 10 10-4.486 10-10 10S3 18.514 3 13Z"
-                    />
-                  </svg>
+                  <path
+                    d="m18.8 17.21-4.41-4.41A7.906 7.906 0 0 0 16 8c0-4.41-3.59-8-8-8S0 3.59 0 8s3.59 8 8 8c1.73 0 3.42-.57 4.8-1.61l4.41 4.41c.44.44 1.15.44 1.59 0 .44-.44.44-1.15 0-1.59ZM8 14c-3.31 0-6-2.69-6-6s2.69-6 6-6 6 2.69 6 6-2.69 6-6 6Z"
+                  />
                 </svg>
               </span>
               <input

package/src/components/DualListSelector/examples/DualListSelector.md

@@ -17,12 +17,12 @@ propComponents:
 
 import { Fragment, useEffect, useMemo, useState } from 'react';
 import RhMicronsDoubleCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-left-icon';
-import AngleLeftIcon from '@patternfly/react-icons/dist/esm/icons/angle-left-icon';
-import AngleDoubleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-double-right-icon';
-import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-icon';
+import RhMicronsCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-left-icon';
+import RhMicronsDoubleCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-right-icon';
+import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
 import RhMicronsSortDownSmallToLargeIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-sort-down-small-to-large-icon';
-import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
 import RhUiEllipsisVerticalFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-ellipsis-vertical-fill-icon';
+import RhMicronsSearchIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-search-icon';
 import { DragDropSort, DragDropContainer, Droppable as NewDroppable } from '@patternfly/react-drag-drop';
 
 ## Examples

package/src/components/DualListSelector/examples/DualListSelectorBasic.tsx

@@ -8,9 +8,9 @@ import {
   DualListSelectorControl
 } from '@patternfly/react-core';
 import RhMicronsDoubleCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-left-icon';
-import AngleLeftIcon from '@patternfly/react-icons/dist/esm/icons/angle-left-icon';
-import AngleDoubleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-double-right-icon';
-import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-icon';
+import RhMicronsCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-left-icon';
+import RhMicronsDoubleCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-right-icon';
+import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
 
 interface Option {
   text: string;
@@ -105,13 +105,13 @@ export const DualListSelectorBasic: React.FunctionComponent = () => {
           isDisabled={!availableOptions.some((option) => option.selected)}
           onClick={() => moveSelected(true)}
           aria-label="Add selected"
-          icon={<AngleRightIcon />}
+          icon={<RhMicronsCaretRightIcon />}
         />
         <DualListSelectorControl
           isDisabled={availableOptions.length === 0}
           onClick={() => moveAll(true)}
           aria-label="Add all"
-          icon={<AngleDoubleRightIcon />}
+          icon={<RhMicronsDoubleCaretRightIcon />}
         />
         <DualListSelectorControl
           isDisabled={chosenOptions.length === 0}
@@ -123,7 +123,7 @@ export const DualListSelectorBasic: React.FunctionComponent = () => {
           onClick={() => moveSelected(false)}
           isDisabled={!chosenOptions.some((option) => option.selected)}
           aria-label="Remove selected"
-          icon={<AngleLeftIcon />}
+          icon={<RhMicronsCaretLeftIcon />}
         />
       </DualListSelectorControlsWrapper>
       <DualListSelectorPane

package/src/components/DualListSelector/examples/DualListSelectorBasicSearch.tsx

@@ -15,10 +15,10 @@ import {
   EmptyStateActions
 } from '@patternfly/react-core';
 import RhMicronsDoubleCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-left-icon';
-import AngleLeftIcon from '@patternfly/react-icons/dist/esm/icons/angle-left-icon';
-import AngleDoubleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-double-right-icon';
-import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-icon';
-import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
+import RhMicronsCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-left-icon';
+import RhMicronsDoubleCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-right-icon';
+import RhMicronsSearchIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-search-icon';
+import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
 
 interface Option {
   text: string;
@@ -107,7 +107,12 @@ export const DualListSelectorSearch: React.FunctionComponent = () => {
   );
 
   const buildEmptyState = (isAvailable: boolean) => (
-    <EmptyState titleText="No results found" variant={EmptyStateVariant.sm} headingLevel="h4" icon={SearchIcon}>
+    <EmptyState
+      titleText="No results found"
+      variant={EmptyStateVariant.sm}
+      headingLevel="h4"
+      icon={RhMicronsSearchIcon}
+    >
       <EmptyStateBody>No results match the filter criteria. Clear all filters and try again.</EmptyStateBody>
       <EmptyStateFooter>
         <EmptyStateActions>
@@ -153,13 +158,13 @@ export const DualListSelectorSearch: React.FunctionComponent = () => {
           isDisabled={!availableOptions.some((option) => option.selected)}
           onClick={() => moveSelected(true)}
           aria-label="Add selected"
-          icon={<AngleRightIcon />}
+          icon={<RhMicronsCaretRightIcon />}
         />
         <DualListSelectorControl
           isDisabled={availableOptions.length === 0}
           onClick={() => moveAll(true)}
           aria-label="Add all"
-          icon={<AngleDoubleRightIcon />}
+          icon={<RhMicronsDoubleCaretRightIcon />}
         />
         <DualListSelectorControl
           isDisabled={chosenOptions.length === 0}
@@ -171,7 +176,7 @@ export const DualListSelectorSearch: React.FunctionComponent = () => {
           onClick={() => moveSelected(false)}
           isDisabled={!chosenOptions.some((option) => option.selected)}
           aria-label="Remove selected"
-          icon={<AngleLeftIcon />}
+          icon={<RhMicronsCaretLeftIcon />}
         />
       </DualListSelectorControlsWrapper>
       <DualListSelectorPane

package/src/components/DualListSelector/examples/DualListSelectorBasicTooltips.tsx

@@ -8,9 +8,9 @@ import {
   DualListSelectorControl
 } from '@patternfly/react-core';
 import RhMicronsDoubleCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-left-icon';
-import AngleLeftIcon from '@patternfly/react-icons/dist/esm/icons/angle-left-icon';
-import AngleDoubleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-double-right-icon';
-import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-icon';
+import RhMicronsCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-left-icon';
+import RhMicronsDoubleCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-right-icon';
+import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
 
 interface Option {
   text: string;
@@ -107,7 +107,7 @@ export const DualListSelectorBasic: React.FunctionComponent = () => {
           aria-label="Add selected"
           tooltipContent="Add selected"
           tooltipProps={{ position: 'top', 'aria-live': 'off' }}
-          icon={<AngleRightIcon />}
+          icon={<RhMicronsCaretRightIcon />}
         />
         <DualListSelectorControl
           isDisabled={availableOptions.length === 0}
@@ -115,7 +115,7 @@ export const DualListSelectorBasic: React.FunctionComponent = () => {
           aria-label="Add all"
           tooltipContent="Add all"
           tooltipProps={{ position: 'right', 'aria-live': 'off' }}
-          icon={<AngleDoubleRightIcon />}
+          icon={<RhMicronsDoubleCaretRightIcon />}
         />
         <DualListSelectorControl
           isDisabled={chosenOptions.length === 0}
@@ -131,7 +131,7 @@ export const DualListSelectorBasic: React.FunctionComponent = () => {
           aria-label="Remove selected"
           tooltipContent="Remove selected"
           tooltipProps={{ position: 'bottom', 'aria-live': 'off' }}
-          icon={<AngleLeftIcon />}
+          icon={<RhMicronsCaretLeftIcon />}
         />
       </DualListSelectorControlsWrapper>
       <DualListSelectorPane

package/src/components/DualListSelector/examples/DualListSelectorComplexOptionsActions.tsx

@@ -22,12 +22,12 @@ import {
   MenuToggleElement
 } from '@patternfly/react-core';
 import RhMicronsDoubleCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-left-icon';
-import AngleLeftIcon from '@patternfly/react-icons/dist/esm/icons/angle-left-icon';
-import AngleDoubleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-double-right-icon';
-import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-icon';
+import RhMicronsCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-left-icon';
+import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
+import RhMicronsDoubleCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-right-icon';
 import RhMicronsSortDownSmallToLargeIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-sort-down-small-to-large-icon';
-import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
 import RhUiEllipsisVerticalFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-ellipsis-vertical-fill-icon';
+import RhMicronsSearchIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-search-icon';
 
 interface Option {
   text: string;
@@ -221,7 +221,12 @@ export const DualListSelectorComplexOptionsActionsNext: React.FunctionComponent
   };
 
   const buildEmptyState = (isAvailable: boolean) => (
-    <EmptyState headingLevel="h4" titleText="No results found" icon={SearchIcon} variant={EmptyStateVariant.sm}>
+    <EmptyState
+      headingLevel="h4"
+      titleText="No results found"
+      icon={RhMicronsSearchIcon}
+      variant={EmptyStateVariant.sm}
+    >
       <EmptyStateBody>No results match the filter criteria. Clear all filters and try again.</EmptyStateBody>
       <EmptyStateFooter>
         <EmptyStateActions>
@@ -271,13 +276,13 @@ export const DualListSelectorComplexOptionsActionsNext: React.FunctionComponent
             isDisabled={!availableOptions.some((option) => option.selected) || isDisabled}
             onClick={() => moveSelected(true)}
             aria-label="Add selected"
-            icon={<AngleRightIcon />}
+            icon={<RhMicronsCaretRightIcon />}
           />
           <DualListSelectorControl
             isDisabled={availableOptions.length === 0 || isDisabled}
             onClick={() => moveAll(true)}
             aria-label="Add all"
-            icon={<AngleDoubleRightIcon />}
+            icon={<RhMicronsDoubleCaretRightIcon />}
           />
           <DualListSelectorControl
             isDisabled={chosenOptions.length === 0 || isDisabled}
@@ -289,7 +294,7 @@ export const DualListSelectorComplexOptionsActionsNext: React.FunctionComponent
             onClick={() => moveSelected(false)}
             isDisabled={!chosenOptions.some((option) => option.selected) || isDisabled}
             aria-label="Remove selected"
-            icon={<AngleLeftIcon />}
+            icon={<RhMicronsCaretLeftIcon />}
           />
         </DualListSelectorControlsWrapper>
         <DualListSelectorPane

package/src/components/DualListSelector/examples/DualListSelectorTree.tsx

@@ -16,10 +16,10 @@ import {
   EmptyStateActions
 } from '@patternfly/react-core';
 import RhMicronsDoubleCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-left-icon';
-import AngleLeftIcon from '@patternfly/react-icons/dist/esm/icons/angle-left-icon';
-import AngleDoubleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-double-right-icon';
-import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-icon';
-import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
+import RhMicronsCaretLeftIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-left-icon';
+import RhMicronsDoubleCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-double-caret-right-icon';
+import RhMicronsSearchIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-search-icon';
+import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
 
 interface FoodNode {
   id: string;
@@ -259,7 +259,12 @@ export const DualListSelectorComposableTree: React.FunctionComponent<ExampleProp
         listMinHeight="300px"
       >
         {filterApplied && options.length === 0 && (
-          <EmptyState headingLevel="h4" titleText="No results found" icon={SearchIcon} variant={EmptyStateVariant.sm}>
+          <EmptyState
+            headingLevel="h4"
+            titleText="No results found"
+            icon={RhMicronsSearchIcon}
+            variant={EmptyStateVariant.sm}
+          >
             <EmptyStateBody>No results match the filter criteria. Clear all filters and try again.</EmptyStateBody>
             <EmptyStateFooter>
               <EmptyStateActions>
@@ -290,13 +295,13 @@ export const DualListSelectorComposableTree: React.FunctionComponent<ExampleProp
           isDisabled={!checkedLeafIds.filter((x) => visibleAvailableLeafIds.includes(x)).length}
           onClick={() => moveChecked(true)}
           aria-label="Add selected"
-          icon={<AngleRightIcon />}
+          icon={<RhMicronsCaretRightIcon />}
         />
         <DualListSelectorControl
           isDisabled={chosenLeafIds.length === memoizedAllLeaves.length}
           onClick={() => moveAll(true)}
           aria-label="Add all"
-          icon={<AngleDoubleRightIcon />}
+          icon={<RhMicronsDoubleCaretRightIcon />}
         />
         <DualListSelectorControl
           isDisabled={chosenLeafIds.length === 0}
@@ -308,7 +313,7 @@ export const DualListSelectorComposableTree: React.FunctionComponent<ExampleProp
           onClick={() => moveChecked(false)}
           isDisabled={!checkedLeafIds.filter((x) => visibleChosenLeafIds.includes(x)).length}
           aria-label="Remove selected"
-          icon={<AngleLeftIcon />}
+          icon={<RhMicronsCaretLeftIcon />}
         />
       </DualListSelectorControlsWrapper>
       {buildPane(true)}

package/src/components/EmptyState/examples/EmptyState.md

@@ -6,45 +6,56 @@ propComponents: ['EmptyState', 'EmptyStateBody', 'EmptyStateFooter', 'EmptyState
 ---
 
 import { useState } from 'react';
-import CubesIcon from '@patternfly/react-icons/dist/esm/icons/cubes-icon';
-import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
+import RhMicronsSearchIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-search-icon';
+import RhUiCubesIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-cubes-icon';
+import RhUiModuleIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-module-icon';
 
 ## Examples
+
 ### Basic
 
 ```ts file="EmptyStateBasic.tsx"
+
 ```
 
 ### Extra small
 
 ```ts file="EmptyStateExtraSmall.tsx"
+
 ```
 
 ### Small
 
 ```ts file="EmptyStateSmall.tsx"
+
 ```
 
 ### Large
 
 ```ts file="EmptyStateLarge.tsx"
+
 ```
 
 ### Extra large
 
 ```ts file="EmptyStateExtraLarge.tsx"
+
 ```
 
 ### With status
+
 ```ts file="EmptyStateWithStatus.tsx"
+
 ```
 
 ### Spinner
 
 ```ts file="EmptyStateSpinner.tsx"
+
 ```
 
 ### No match found
 
 ```ts file="EmptyStateNoMatchFound.tsx"
+
 ```

package/src/components/EmptyState/examples/EmptyStateBasic.tsx

@@ -1,8 +1,8 @@
 import { Button, EmptyState, EmptyStateBody, EmptyStateActions, EmptyStateFooter } from '@patternfly/react-core';
-import CubesIcon from '@patternfly/react-icons/dist/esm/icons/cubes-icon';
+import RhUiModuleIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-module-icon';
 
 export const EmptyStateBasic: React.FunctionComponent = () => (
-  <EmptyState titleText="Empty state" headingLevel="h4" icon={CubesIcon}>
+  <EmptyState titleText="Empty state" headingLevel="h4" icon={RhUiModuleIcon}>
     <EmptyStateBody>
       This represents the empty state pattern in PatternFly. Hopefully it's simple enough to use but flexible enough to
       meet a variety of needs.

package/src/components/EmptyState/examples/EmptyStateExtraLarge.tsx

@@ -6,10 +6,10 @@ import {
   EmptyStateActions,
   EmptyStateFooter
 } from '@patternfly/react-core';
-import CubesIcon from '@patternfly/react-icons/dist/esm/icons/cubes-icon';
+import RhUiModuleIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-module-icon';
 
 export const EmptyStateExtraLarge: React.FunctionComponent = () => (
-  <EmptyState variant={EmptyStateVariant.xl} titleText="Empty state" headingLevel="h4" icon={CubesIcon}>
+  <EmptyState variant={EmptyStateVariant.xl} titleText="Empty state" headingLevel="h4" icon={RhUiModuleIcon}>
     <EmptyStateBody>
       This represents the empty state pattern in PatternFly. Hopefully it's simple enough to use but flexible enough to
       meet a variety of needs.

package/src/components/EmptyState/examples/EmptyStateExtraSmall.tsx

@@ -6,10 +6,10 @@ import {
   EmptyStateActions,
   EmptyStateFooter
 } from '@patternfly/react-core';
-import CubesIcon from '@patternfly/react-icons/dist/esm/icons/cubes-icon';
+import RhUiModuleIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-module-icon';
 
 export const EmptyStateExtraSmall: React.FunctionComponent = () => (
-  <EmptyState variant={EmptyStateVariant.xs} titleText="Empty state" headingLevel="h4" icon={CubesIcon}>
+  <EmptyState variant={EmptyStateVariant.xs} titleText="Empty state" headingLevel="h4" icon={RhUiModuleIcon}>
     <EmptyStateBody>This represents an the empty state pattern in PatternFly. The icon is optional.</EmptyStateBody>
     <EmptyStateFooter>
       <EmptyStateActions>

package/src/components/EmptyState/examples/EmptyStateLarge.tsx

@@ -6,10 +6,10 @@ import {
   EmptyStateActions,
   EmptyStateFooter
 } from '@patternfly/react-core';
-import CubesIcon from '@patternfly/react-icons/dist/esm/icons/cubes-icon';
+import RhUiModuleIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-module-icon';
 
 export const EmptyStateLarge: React.FunctionComponent = () => (
-  <EmptyState variant={EmptyStateVariant.lg} titleText="Empty state" headingLevel="h4" icon={CubesIcon}>
+  <EmptyState variant={EmptyStateVariant.lg} titleText="Empty state" headingLevel="h4" icon={RhUiModuleIcon}>
     <EmptyStateBody>
       This represents the empty state pattern in PatternFly. Hopefully it's simple enough to use but flexible enough to
       meet a variety of needs.