@patternfly/react-core 6.0.0-alpha.25 → 6.0.0-alpha.27

package/src/components/Drawer/examples/DrawerSecondaryBackground.tsx

@@ -46,11 +46,10 @@ export const DrawerSecondaryBackground: React.FunctionComponent = () => {
   };
 
   const panelContent = (
-    // TODO:  need to update with issue #9979. Removed light color variant for secondary panel.
-    <DrawerPanelContent colorVariant={DrawerColorVariant.default}>
+    <DrawerPanelContent colorVariant={panelSecondary ? DrawerColorVariant.secondary : DrawerColorVariant.default}>
       <DrawerHead>
         <span tabIndex={isExpanded ? 0 : -1} ref={drawerRef}>
-          drawer-panel
+          Drawer panel header
         </span>
         <DrawerActions>
           <DrawerCloseButton onClick={onCloseClick} />
@@ -93,11 +92,11 @@ export const DrawerSecondaryBackground: React.FunctionComponent = () => {
         Toggle drawer
       </Button>
       <Drawer isExpanded={isExpanded} onExpand={onExpand}>
-        {/* TODO: MAy need to update with issue #9979. Removed light color variant for secondary panel. */}
-        <DrawerSection colorVariant={DrawerColorVariant.default}>drawer-section</DrawerSection>
+        <DrawerSection colorVariant={sectionSecondary ? DrawerColorVariant.secondary : DrawerColorVariant.default}>
+          drawer-section
+        </DrawerSection>
         <DrawerContent
-          // TODO:  need to update with issue #9979. Removed light color variant for secondary section.
-          colorVariant={DrawerColorVariant.default}
+          colorVariant={contentSecondary ? DrawerColorVariant.secondary : DrawerColorVariant.default}
           panelContent={panelContent}
         >
           <DrawerContentBody>{drawerContent}</DrawerContentBody>

package/src/components/Drawer/examples/DrawerStackedContentBodyElements.tsx

@@ -32,15 +32,14 @@ export const DrawerStackedContentBodyElements: React.FunctionComponent = () => {
     <DrawerPanelContent>
       <DrawerHead>
         <Title headingLevel="h3" size="2xl" tabIndex={isExpanded ? 0 : -1} ref={drawerRef}>
-          drawer title{' '}
+          Drawer panel header in a Title
         </Title>
         <DrawerActions>
           <DrawerCloseButton onClick={onCloseClick} />
         </DrawerActions>
-        drawer-panel
       </DrawerHead>
-      <DrawerPanelBody hasNoPadding>drawer-panel with no padding</DrawerPanelBody>
-      <DrawerPanelBody>drawer-panel</DrawerPanelBody>
+      <DrawerPanelBody hasNoPadding>Drawer panel body with no padding</DrawerPanelBody>
+      <DrawerPanelBody>Drawer panel body</DrawerPanelBody>
     </DrawerPanelContent>
   );
 

package/src/components/Drawer/examples/DrawerStatic.tsx

@@ -31,7 +31,7 @@ export const DrawerStatic: React.FunctionComponent = () => {
     <DrawerPanelContent>
       <DrawerHead>
         <span tabIndex={isExpanded ? 0 : -1} ref={drawerRef}>
-          drawer-panel
+          Drawer panel header
         </span>
         <DrawerActions>
           <DrawerCloseButton onClick={onCloseClick} />

package/src/components/Drawer/index.ts

@@ -3,6 +3,7 @@ export * from './DrawerActions';
 export * from './DrawerCloseButton';
 export * from './DrawerContent';
 export * from './DrawerContentBody';
+export * from './DrawerPanelDescription';
 export * from './DrawerHead';
 export * from './DrawerPanelBody';
 export * from './DrawerPanelContent';

package/src/components/Wizard/examples/WizardStepDrawerContent.tsx

@@ -4,6 +4,7 @@ import {
   Drawer,
   DrawerContent,
   DrawerPanelContent,
+  DrawerColorVariant,
   DrawerHead,
   DrawerActions,
   DrawerCloseButton,
@@ -26,8 +27,7 @@ const StepContentWithDrawer: React.FunctionComponent = () => {
     <Drawer isInline isExpanded={isDrawerExpanded} onExpand={onWizardExpand}>
       <DrawerContent
         panelContent={
-          // TODO: need to update with issue #9979. Removed light color variant for secondary panel.
-          <DrawerPanelContent widths={{ default: 'width_50' }}>
+          <DrawerPanelContent widths={{ default: 'width_50' }} colorVariant={DrawerColorVariant.secondary}>
             <DrawerHead>
               <span tabIndex={isDrawerExpanded ? 0 : -1} ref={drawerRef}>
                 Drawer content: <strong>{activeStep?.name}</strong>

package/src/demos/examples/Wizard/InModalWithDrawer.tsx

@@ -4,6 +4,7 @@ import {
   Drawer,
   DrawerContent,
   DrawerPanelContent,
+  DrawerColorVariant,
   DrawerHead,
   DrawerActions,
   DrawerCloseButton,
@@ -37,8 +38,7 @@ export const WizardModalWithDrawerDemo: React.FunctionComponent = () => {
     <Drawer isInline isExpanded={isDrawerExpanded} onExpand={onExpand}>
       <DrawerContent
         panelContent={
-          // TODO: MAy need to update with issue #9979. Removed light color variant.
-          <DrawerPanelContent widths={{ default: 'width_33' }}>
+          <DrawerPanelContent widths={{ default: 'width_33' }} colorVariant={DrawerColorVariant.secondary}>
             <DrawerHead>
               <span tabIndex={isDrawerExpanded ? 0 : -1} ref={drawerRef}>
                 Drawer content: {stepName}

package/src/demos/examples/Wizard/InModalWithDrawerInformationalStep.tsx

@@ -6,6 +6,7 @@ import {
   DrawerCloseButton,
   DrawerContent,
   DrawerPanelContent,
+  DrawerColorVariant,
   DrawerHead,
   Flex,
   Modal,
@@ -40,8 +41,7 @@ export const WizardModalWithDrawerInfoStepDemo: React.FunctionComponent = () =>
     <Drawer isInline isExpanded={isDrawerExpanded} onExpand={onExpand}>
       <DrawerContent
         panelContent={
-          // TODO: MAy need to update with issue #9979. Removed light color variant.
-          <DrawerPanelContent widths={{ default: 'width_33' }}>
+          <DrawerPanelContent widths={{ default: 'width_33' }} colorVariant={DrawerColorVariant.secondary}>
             <DrawerHead>
               <span tabIndex={isDrawerExpanded ? 0 : -1} ref={drawerRef}>
                 Drawer content: {stepName}

package/src/demos/examples/Wizard/InPageWithDrawer.tsx

@@ -9,6 +9,7 @@ import {
   DrawerCloseButton,
   DrawerContent,
   DrawerPanelContent,
+  DrawerColorVariant,
   DrawerHead,
   Flex,
   Nav,
@@ -118,8 +119,7 @@ export const WizardFullPageWithDrawerDemo: React.FunctionComponent = () => {
     <Drawer isInline isExpanded={isDrawerExpanded} onExpand={onExpand}>
       <DrawerContent
         panelContent={
-          // TODO: MAy need to update with issue #9979. Removed light color variant.
-          <DrawerPanelContent widths={{ default: 'width_33' }}>
+          <DrawerPanelContent widths={{ default: 'width_33' }} colorVariant={DrawerColorVariant.secondary}>
             <DrawerHead>
               <span tabIndex={isDrawerExpanded ? 0 : -1} ref={drawerRef}>
                 Drawer content: {stepName}

package/src/demos/examples/Wizard/InPageWithDrawerInformationalStep.tsx

@@ -10,6 +10,7 @@ import {
   DrawerContent,
   DrawerHead,
   DrawerPanelContent,
+  DrawerColorVariant,
   Flex,
   Nav,
   NavItem,
@@ -119,8 +120,7 @@ export const WizardFullPageWithDrawerInfoStepDemo: React.FunctionComponent = ()
     <Drawer isInline isExpanded={isDrawerExpanded} onExpand={onExpand}>
       <DrawerContent
         panelContent={
-          // TODO: MAy need to update with issue #9979. Removed light color variant.
-          <DrawerPanelContent widths={{ default: 'width_33' }}>
+          <DrawerPanelContent widths={{ default: 'width_33' }} colorVariant={DrawerColorVariant.secondary}>
             <DrawerHead>
               <span tabIndex={isDrawerExpanded ? 0 : -1} ref={drawerRef}>
                 Drawer content: {stepName}

package/src/deprecated/components/Wizard/__tests__/Wizard.test.tsx

@@ -104,7 +104,6 @@ describe('Wizard', () => {
 
   test('wiz with drawer', () => {
     const wizDrawerPanelContent = (
-      // TODO: MAy need to update with issue #9979. Removed light color variant.
       <DrawerPanelContent>
         <DrawerHead>
           <span>This wizard has a drawer with drawer panel content</span>

package/src/deprecated/components/Wizard/examples/WizardWithDrawer.tsx

@@ -1,5 +1,12 @@
 import React from 'react';
-import { Button, DrawerActions, DrawerCloseButton, DrawerHead, DrawerPanelContent } from '@patternfly/react-core';
+import {
+  Button,
+  DrawerActions,
+  DrawerCloseButton,
+  DrawerHead,
+  DrawerPanelContent,
+  DrawerColorVariant
+} from '@patternfly/react-core';
 import { Wizard as WizardDeprecated } from '@patternfly/react-core/deprecated';
 
 export const WizardWithDrawer: React.FunctionComponent = () => {
@@ -20,8 +27,7 @@ export const WizardWithDrawer: React.FunctionComponent = () => {
   };
 
   const panel1Content = (
-    // TODO: MAy need to update with issue #9979. Removed light color variant.
-    <DrawerPanelContent widths={{ default: 'width_33' }}>
+    <DrawerPanelContent widths={{ default: 'width_33' }} colorVariant={DrawerColorVariant.secondary}>
       <DrawerHead>
         <span tabIndex={isDrawerExpanded ? 0 : -1} ref={drawerRef}>
           drawer-panel-1 content
@@ -34,8 +40,7 @@ export const WizardWithDrawer: React.FunctionComponent = () => {
   );
 
   const panel2Content = (
-    // TODO: MAy need to update with issue #9979. Removed light color variant.
-    <DrawerPanelContent widths={{ default: 'width_33' }}>
+    <DrawerPanelContent widths={{ default: 'width_33' }} colorVariant={DrawerColorVariant.secondary}>
       <DrawerHead>
         <span tabIndex={0} ref={drawerRef}>
           drawer-panel-2 content
@@ -48,8 +53,7 @@ export const WizardWithDrawer: React.FunctionComponent = () => {
   );
 
   const panel3Content = (
-    // TODO: MAy need to update with issue #9979. Removed light color variant.
-    <DrawerPanelContent widths={{ default: 'width_33' }}>
+    <DrawerPanelContent widths={{ default: 'width_33' }} colorVariant={DrawerColorVariant.secondary}>
       <DrawerHead>
         <span tabIndex={0} ref={drawerRef}>
           drawer-panel-3 content