Error Pages Component (terra-consumer)

Issue Description

The Terra Consumer Error Page is a display presented with an error message and location for a button on a Card component.

Issue Type

• New Feature
• Enhancement
• Bug
• Other

Expected Behavior

The Error Page component will show Error icon, Error message and button. A button will provide a user with primary and secondary action.

There are different types of error pages:

• Not Authorized Error Page: This page will always have a “Not Authorized” text and rest (icon, message, and button) are optional.
• Sensitive concept Error Page: This page will always have a “Sensitive Data” text and rest (icon, message, and button) are optional.
• Error Page: This page will always have an “Error” text and rest (icon, message, and button) are optional.

Tech Design:

Considerations:

• Cover most of the Cerner Terra Clinical Error View

Example:

import React from 'react';
import ErrorPages from 'terra-core-error-pages';
import Button from 'terra-button';

<ErrorPages
  name="error name"
  description="error description"
  buttonText="error button text"
  buttonOnClick={this.handleClick();}
  isGlyphHidden={false}
 />

This will require creating new files:
/terra-core/packages/terra-core-error-pages/src/ErrorPages.jsx
/terra-core/packages/terra-core-error-pages/src/ErrorIcon.jsx
/terra-core/packages/terra-core-error-pages/src/ErrorPages.scss

Props table:

Prop Name	Type	Is Required	Default Value	Description
name	string	required	‘’	The name of the error to display.
description	string	optional	‘’	The error description to display.
buttonOnClick	func	optional	undefined	The click callback function that should be applied to the button.
buttonText	string	optional	‘’	The display text for the button.
isGlyphHidden	bool	optional	false	Whether or not the error glyph should be displayed.

CSS Classes:

Selector	Description
well-Icon-large well-text–light	Icon styling
well-Font-xxx–large well-text–light	Icon text style
well-Font–body well-text–large	message style
terra-Button terra-Button–default well-Font–large well-Button–concept3 well-Button–fill	Terra Button style

[alex-bezek]

No, I think this should take the terra-clinical component, move it to terra-core, and theme/enhance it properly to solve the existing terra-clinical look/feel (legacy), consumer theme, and OCS theme. I think the code will end up in terra-core.

[PaulSolDev]

Orion JIRA created