diff --git a/packages/react-core/src/components/Popover/PopoverCloseButton.tsx b/packages/react-core/src/components/Popover/PopoverCloseButton.tsx index 616c9b5c1fe..6a1b9c5cbcc 100644 --- a/packages/react-core/src/components/Popover/PopoverCloseButton.tsx +++ b/packages/react-core/src/components/Popover/PopoverCloseButton.tsx @@ -1,4 +1,6 @@ import * as React from 'react'; +import { css } from '@patternfly/react-styles'; +import styles from '@patternfly/react-styles/css/components/Popover/popover'; import { Button } from '../Button'; import TimesIcon from '@patternfly/react-icons/dist/esm/icons/times-icon'; @@ -6,9 +8,11 @@ export const PopoverCloseButton: React.FunctionComponent undefined as void, ...props }: PopoverCloseButtonProps) => ( - +
+ +
); PopoverCloseButton.displayName = 'PopoverCloseButton'; diff --git a/packages/react-core/src/components/Popover/PopoverHeader.tsx b/packages/react-core/src/components/Popover/PopoverHeader.tsx index cddfd5e3743..2063be5d3ef 100644 --- a/packages/react-core/src/components/Popover/PopoverHeader.tsx +++ b/packages/react-core/src/components/Popover/PopoverHeader.tsx @@ -1,7 +1,6 @@ import * as React from 'react'; import { css } from '@patternfly/react-styles'; import styles from '@patternfly/react-styles/css/components/Popover/popover'; -import { Title, TitleSizes } from '../Title'; import { PopoverHeaderIcon } from './PopoverHeaderIcon'; import { PopoverHeaderText } from './PopoverHeaderText'; @@ -31,23 +30,17 @@ export const PopoverHeader: React.FunctionComponent = ({ id, alertSeverityScreenReaderText, ...props -}: PopoverHeaderProps) => { - const HeadingLevel = titleHeadingLevel; - - return icon || alertSeverityVariant ? ( -
- - {icon && {icon}} +}: PopoverHeaderProps) => ( +
+
+ {icon && {icon}} + {alertSeverityVariant && alertSeverityScreenReaderText && ( {alertSeverityScreenReaderText} )} - {children} - -
- ) : ( - - {children} - - ); -}; + {children} + + +
+); PopoverHeader.displayName = 'PopoverHeader'; diff --git a/packages/react-core/src/components/Popover/PopoverHeaderText.tsx b/packages/react-core/src/components/Popover/PopoverHeaderText.tsx index ef44d4b80c7..4a67816f5ee 100644 --- a/packages/react-core/src/components/Popover/PopoverHeaderText.tsx +++ b/packages/react-core/src/components/Popover/PopoverHeaderText.tsx @@ -7,15 +7,21 @@ export interface PopoverHeaderTextProps extends React.HTMLProps children: React.ReactNode; /** Class to be applied to the header text */ className?: string; + /** Heading level of the header title */ + headingLevel: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'; } export const PopoverHeaderText: React.FunctionComponent = ({ children, className, + headingLevel, ...props -}: PopoverHeaderTextProps) => ( - +}: PopoverHeaderTextProps) => { + const HeadingLevel = headingLevel; + + return ( + {children} - -); + ); +}; PopoverHeaderText.displayName = 'PopoverHeaderText'; diff --git a/packages/react-core/src/components/Popover/__tests__/Generated/__snapshots__/PopoverCloseButton.test.tsx.snap b/packages/react-core/src/components/Popover/__tests__/Generated/__snapshots__/PopoverCloseButton.test.tsx.snap index ee75b28f5f8..74aa91dfe32 100644 --- a/packages/react-core/src/components/Popover/__tests__/Generated/__snapshots__/PopoverCloseButton.test.tsx.snap +++ b/packages/react-core/src/components/Popover/__tests__/Generated/__snapshots__/PopoverCloseButton.test.tsx.snap @@ -2,29 +2,33 @@ exports[`PopoverCloseButton should match snapshot (auto-generated) 1`] = ` - + + + `; diff --git a/packages/react-core/src/components/Popover/__tests__/Generated/__snapshots__/PopoverHeader.test.tsx.snap b/packages/react-core/src/components/Popover/__tests__/Generated/__snapshots__/PopoverHeader.test.tsx.snap index 05df99e9f79..ad670fcb894 100644 --- a/packages/react-core/src/components/Popover/__tests__/Generated/__snapshots__/PopoverHeader.test.tsx.snap +++ b/packages/react-core/src/components/Popover/__tests__/Generated/__snapshots__/PopoverHeader.test.tsx.snap @@ -2,16 +2,21 @@ exports[`PopoverHeader should match snapshot (auto-generated) 1`] = ` -
-
- ReactNode +
+
+
+ ReactNode +
+
-
+
`; diff --git a/packages/react-integration/cypress/integration/popover.spec.ts b/packages/react-integration/cypress/integration/popover.spec.ts index eca138e5068..551d02462ed 100644 --- a/packages/react-integration/cypress/integration/popover.spec.ts +++ b/packages/react-integration/cypress/integration/popover.spec.ts @@ -24,7 +24,6 @@ describe('Popover Demo Test', () => { cy.get('button[id="popoverTarget"]').then((popoverLink: JQuery) => { cy.wrap(popoverLink).click(); cy.get('.pf-c-popover').should('exist'); - cy.get('h6').should('have.class', 'pf-m-md'); cy.get('button[aria-label="Close"]').then(closeBtn => { cy.wrap(closeBtn).click(); cy.get('.pf-c-popover').should('not.exist');