Skip to content
This repository has been archived by the owner on Jun 22, 2023. It is now read-only.

Reworked sub components and added new properties #213

Merged
merged 3 commits into from
Jan 23, 2019
Merged
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
73 changes: 52 additions & 21 deletions src/app/components/error/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,41 +5,72 @@
>

<sky-demo-page-summary>
The error component displays a SKY UX-themed error message. It includes options to specify the image, title, description, and action.
The error component displays a SKY UX-themed error message. It includes options to specify an image, title, description, and action in the error message.
</sky-demo-page-summary>

<sky-demo-page-properties>
<sky-demo-page-properties
sectionHeading="Error properties"
>
<sky-demo-page-property
propertyName="image"
propertyName="errorType"
[isOptional]="false"
>
Specifies an error type to use a set of pre-defined values for the image, title, and description. The valid options are <stache-code>broken</stache-code>,
<stache-code>construction</stache-code>, <stache-code>notfound</stache-code>, and <stache-code>security</stache-code>. This property accepts <stache-code>string</stache-code> values.
</sky-demo-page-property>
</sky-demo-page-properties>

<sky-demo-page-properties
sectionHeading="Error child components"
>
<sky-demo-page-property
propertyName="sky-error-action"
[isOptional]="true"
>
Specifies an image to display in the error message.
Specifies an action to include in the error message. For example, you can include a button to reload the page or to refresh
data.
</sky-demo-page-property>
<sky-demo-page-property
propertyName="title"
propertyName="sky-error-description"
[isOptional]="true"
>
Specifies a title to display in the error message.
Specifies a description to provide additional details in the error message. Properties are listed <a stacheRouterLink="." fragment="error-description-properties">below</a>.
</sky-demo-page-property>
<sky-demo-page-property
propertyName="description"
propertyName="sky-error-image"
[isOptional]="true"
>
Specifies a description to provide additional details in the error message.
Specifies an image to display in the error message.
</sky-demo-page-property>
<sky-demo-page-property
propertyName="action"
[isOptional]="false"
propertyName="sky-error-title"
[isOptional]="true"
>
Specifies an action to include in the error message. For example, you can include a button to reload the page or to refresh
data.
Specifies a title to display in the error message. Properties are listed <a stacheRouterLink="." fragment="error-title-properties">below</a>.
</sky-demo-page-property>
</sky-demo-page-properties>

<sky-demo-page-properties
sectionHeading="Error title properties"
>
<sky-demo-page-property
propertyName="replaceDefaultTitle"
defaultValue="false"
[isOptional]="true"
>
Indicates whether to replace the default title. If <stache-code>false</stache-code>, this title is appended to the default title. This property accepts <stache-code>boolean</stache-code> values.
</sky-demo-page-property>
</sky-demo-page-properties>

<sky-demo-page-properties
sectionHeading="Error description properties"
>
<sky-demo-page-property
propertyName="errorType"
propertyName="replaceDefaultDescription"
defaultValue="false"
[isOptional]="true"
>
An attribute to specify a set of pre-defined values for the image, title, and description. The valid options are <stache-code>broken</stache-code>,
<stache-code>notfound</stache-code>, <stache-code>construction</stache-code>, and <stache-code>security</stache-code>.
Indicates whether to replace the default description. If <stache-code>false</stache-code>, this description is appended to the default description. This property accepts <stache-code>boolean</stache-code> values.
</sky-demo-page-property>
</sky-demo-page-properties>

Expand All @@ -53,24 +84,24 @@

<sky-demo-page-properties sectionHeading="SkyErrorModalService config properties">
<sky-demo-page-property
propertyName="errorTitle"
propertyName="errorCloseText"
>
Specifies a title to display in the modal error message.
Specifies a label for the action button that closes the modal error message. This property accepts <stache-code>string</stache-code> values.
</sky-demo-page-property>
<sky-demo-page-property
propertyName="errorDescription"
>
Specifies a description to provide additional details in the modal error message.
Specifies a description to provide additional details in the modal error message. This property accepts <stache-code>string</stache-code> values.
</sky-demo-page-property>
<sky-demo-page-property
propertyName="errorCloseText"
propertyName="errorTitle"
>
Specifies a label for the action button that closes the modal error message.
Specifies a title to display in the modal error message. This property accepts <stache-code>string</stache-code> values.
</sky-demo-page-property>
</sky-demo-page-properties>

<sky-demo-page-example>
<sky-error-demo></sky-error-demo>
<sky-demo-page-code demoName="Error"></sky-demo-page-code>
</sky-demo-page-example>

</sky-demo-page>