Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ exports[`AboutModalBoxCloseButton should match snapshot (auto-generated) 1`] = `
<div
className="pf-c-about-modal-box__close ''"
>
<Component
<Button
aria-label="Close Dialog"
onClick={[Function]}
variant="plain"
Expand All @@ -15,6 +15,6 @@ exports[`AboutModalBoxCloseButton should match snapshot (auto-generated) 1`] = `
size="sm"
title={null}
/>
</Component>
</Button>
</div>
`;
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ exports[`AboutModalBoxCloseButton Test 1`] = `
<div
className="pf-c-about-modal-box__close"
>
<Component
<Button
aria-label="Close Dialog"
onClick={[Function]}
variant="plain"
Expand All @@ -15,15 +15,15 @@ exports[`AboutModalBoxCloseButton Test 1`] = `
size="sm"
title={null}
/>
</Component>
</Button>
</div>
`;

exports[`AboutModalBoxCloseButton Test close button aria label 1`] = `
<div
className="pf-c-about-modal-box__close"
>
<Component
<Button
aria-label="Klose Daylok"
onClick={[Function]}
variant="plain"
Expand All @@ -34,15 +34,15 @@ exports[`AboutModalBoxCloseButton Test close button aria label 1`] = `
size="sm"
title={null}
/>
</Component>
</Button>
</div>
`;

exports[`AboutModalBoxCloseButton Test onclose 1`] = `
<div
className="pf-c-about-modal-box__close"
>
<Component
<Button
aria-label="Close Dialog"
onClick={[MockFunction]}
variant="plain"
Expand All @@ -53,6 +53,6 @@ exports[`AboutModalBoxCloseButton Test onclose 1`] = `
size="sm"
title={null}
/>
</Component>
</Button>
</div>
`;
18 changes: 5 additions & 13 deletions packages/react-core/src/components/Alert/Alert.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,8 @@ import { css } from '@patternfly/react-styles';
import styles from '@patternfly/react-styles/css/components/Alert/alert';
import accessibleStyles from '@patternfly/react-styles/css/utilities/Accessibility/accessibility';
import { AlertIcon } from './AlertIcon';
import { capitalize } from '../../helpers/util';
import { capitalize, getOUIAProps, OUIAProps } from '../../helpers';
import { Omit } from '../../helpers/typeUtils';
import { InjectedOuiaProps, withOuiaContext } from '../withOuia';

export enum AlertVariant {
success = 'success',
Expand Down Expand Up @@ -36,7 +35,7 @@ export interface AlertProps extends Omit<React.HTMLProps<HTMLDivElement>, 'actio
isLiveRegion?: boolean;
}

const Alert: React.FunctionComponent<AlertProps & InjectedOuiaProps> = ({
export const Alert: React.FunctionComponent<AlertProps & OUIAProps> = ({
variant = AlertVariant.info,
isInline = false,
isLiveRegion = false,
Expand All @@ -46,10 +45,9 @@ const Alert: React.FunctionComponent<AlertProps & InjectedOuiaProps> = ({
title,
children = '',
className = '',
ouiaContext = null,
ouiaId = null,
ouiaId,
...props
}: AlertProps & InjectedOuiaProps) => {
}: AlertProps & OUIAProps) => {
const readerTitle = (
<React.Fragment>
<span className={css(accessibleStyles.screenReader)}>{variantLabel}</span>
Expand All @@ -69,10 +67,7 @@ const Alert: React.FunctionComponent<AlertProps & InjectedOuiaProps> = ({
{...props}
className={customClassName}
aria-label={ariaLabel}
{...(ouiaContext.isOuia && {
'data-ouia-component-type': 'Alert',
'data-ouia-component-id': ouiaId || ouiaContext.ouiaId
})}
{...getOUIAProps('Alert', ouiaId)}
{...(isLiveRegion && {
'aria-live': 'polite',
'aria-atomic': 'false'
Expand All @@ -87,6 +82,3 @@ const Alert: React.FunctionComponent<AlertProps & InjectedOuiaProps> = ({
</div>
);
};

const AlertWithOuiaContext = withOuiaContext(Alert);
export { AlertWithOuiaContext as Alert };
Original file line number Diff line number Diff line change
@@ -1,7 +1,27 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Alert should match snapshot (auto-generated) 1`] = `
<ContextConsumer>
<Component />
</ContextConsumer>
<div
aria-label="string"
className="pf-c-alert pf-m-success ''"
data-ouia-component-id={0}
data-ouia-component-type="PF4/Alert"
data-ouia-safe={true}
>
<AlertIcon
variant="success"
/>
<h4
className="pf-c-alert__title"
>
<span
className="pf-u-screen-reader"
>
string
</span>
<div>
ReactNode
</div>
</h4>
</div>
`;
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`AlertActionCloseButton should match snapshot (auto-generated) 1`] = `
<Component
<Button
aria-label="''"
onClick={[Function]}
variant="plain"
Expand All @@ -12,5 +12,5 @@ exports[`AlertActionCloseButton should match snapshot (auto-generated) 1`] = `
size="sm"
title={null}
/>
</Component>
</Button>
`;
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`AlertActionLink should match snapshot (auto-generated) 1`] = `
<Component
<Button
className="''"
variant="link"
>
''
</Component>
</Button>
`;
Loading