@patternfly/react-core 6.5.0-prerelease.8 → 6.5.0

package/src/components/Label/examples/LabelGroupEditableAddModal.tsx

@@ -2,6 +2,7 @@ import { useEffect, useRef, useState } from 'react';
 import {
   LabelGroup,
   Label,
+  LabelColor,
   Button,
   Form,
   FormGroup,
@@ -15,7 +16,7 @@ import {
   Popper
 } from '@patternfly/react-core';
 import { Modal as ModalDeprecated, ModalVariant as ModalVariantDeprecated } from '@patternfly/react-core/deprecated';
-import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
+import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
 
 export const LabelGroupEditableAddModal: React.FunctionComponent = () => {
   const [isModalOpen, setModalOpen] = useState<boolean>(false);
@@ -71,7 +72,7 @@ export const LabelGroupEditableAddModal: React.FunctionComponent = () => {
   const onAdd = () => {
     let labelIcon: any;
     if (icon === 'Info circle icon') {
-      labelIcon = <InfoCircleIcon />;
+      labelIcon = <RhUiInformationFillIcon />;
     }
 
     setLabels([
@@ -220,7 +221,7 @@ export const LabelGroupEditableAddModal: React.FunctionComponent = () => {
         <MenuList>
           <MenuItem itemId="No icon">No icon</MenuItem>
           <MenuItem itemId="Info circle icon">
-            <InfoCircleIcon />
+            <RhUiInformationFillIcon />
             Info circle icon
           </MenuItem>
         </MenuList>
@@ -244,7 +245,7 @@ export const LabelGroupEditableAddModal: React.FunctionComponent = () => {
           <Label
             key={label.id}
             id={label.id}
-            color="blue"
+            color={LabelColor.blue}
             onClose={() => onClose(label.id)}
             onEditCancel={(_event, prevText) => onEdit(prevText, index)}
             onEditComplete={(_event, newText) => onEdit(newText, index)}

package/src/components/Label/examples/LabelGroupEditableLabels.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { LabelGroup, Label } from '@patternfly/react-core';
+import { LabelGroup, Label, LabelColor } from '@patternfly/react-core';
 
 export const LabelGroupEditableLabels: React.FunctionComponent = () => {
   const [label1, setLabel1] = useState('Editable label');
@@ -9,7 +9,7 @@ export const LabelGroupEditableLabels: React.FunctionComponent = () => {
   return (
     <LabelGroup numLabels={5} isEditable>
       <Label
-        color="blue"
+        color={LabelColor.blue}
         onClose={() => Function.prototype}
         onEditCancel={(_event, prevText) => setLabel1(prevText)}
         onEditComplete={(_event, newText) => setLabel1(newText)}
@@ -21,9 +21,9 @@ export const LabelGroupEditableLabels: React.FunctionComponent = () => {
       >
         {label1}
       </Label>
-      <Label color="green">Static label</Label>
+      <Label color={LabelColor.green}>Static label</Label>
       <Label
-        color="blue"
+        color={LabelColor.blue}
         onClose={() => Function.prototype}
         onEditCancel={(_event, prevText) => setLabel2(prevText)}
         onEditComplete={(_event, newText) => setLabel2(newText)}
@@ -36,7 +36,7 @@ export const LabelGroupEditableLabels: React.FunctionComponent = () => {
         {label2}
       </Label>
       <Label
-        color="blue"
+        color={LabelColor.blue}
         onClose={() => Function.prototype}
         onEditCancel={(_event, prevText) => setLabel3(prevText)}
         onEditComplete={(_event, newText) => setLabel3(newText)}

package/src/components/Label/examples/LabelGroupOverflow.tsx

@@ -1,22 +1,22 @@
-import { Label, LabelGroup } from '@patternfly/react-core';
-import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
+import { Label, LabelColor, LabelGroup } from '@patternfly/react-core';
+import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
 
 export const LabelGroupOverflow: React.FunctionComponent = () => (
   <LabelGroup>
-    <Label icon={<InfoCircleIcon />}>Label 1</Label>
-    <Label icon={<InfoCircleIcon />} color="blue">
+    <Label icon={<RhUiInformationFillIcon />}>Label 1</Label>
+    <Label icon={<RhUiInformationFillIcon />} color={LabelColor.blue}>
       Label 2
     </Label>
-    <Label icon={<InfoCircleIcon />} color="green">
+    <Label icon={<RhUiInformationFillIcon />} color={LabelColor.green}>
       Label 3
     </Label>
-    <Label icon={<InfoCircleIcon />} color="orange">
+    <Label icon={<RhUiInformationFillIcon />} color={LabelColor.orange}>
       Label 4
     </Label>
-    <Label icon={<InfoCircleIcon />} color="red">
+    <Label icon={<RhUiInformationFillIcon />} color={LabelColor.red}>
       Label 5
     </Label>
-    <Label icon={<InfoCircleIcon />} color="purple">
+    <Label icon={<RhUiInformationFillIcon />} color={LabelColor.purple}>
       Label 6
     </Label>
   </LabelGroup>

package/src/components/Label/examples/LabelGroupVerticalCategoryOverflowRemovable.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
-import { Label, LabelGroup, LabelProps } from '@patternfly/react-core';
-import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
+import { Label, LabelColor, LabelGroup } from '@patternfly/react-core';
+import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
 
 export const LabelGroupVerticalCategoryOverflowRemovable: React.FunctionComponent = () => {
   const [labels, setLabels] = useState([
@@ -15,7 +15,7 @@ export const LabelGroupVerticalCategoryOverflowRemovable: React.FunctionComponen
   return (
     <LabelGroup categoryName="Group label with a very long name" isVertical isClosable onClick={deleteCategory}>
       {labels.map(([labelText, labelColor]) => (
-        <Label icon={<InfoCircleIcon />} color={labelColor as LabelProps['color']} key={labelText}>
+        <Label icon={<RhUiInformationFillIcon />} color={labelColor as LabelColor} key={labelText}>
           {labelText}
         </Label>
       ))}