Go Main page
Go Main page

Web components

Foundations
Components
About
cover

components

Validation Status

v.1.0.0 | Saturn

Usage

The name of the tokens object to style validationStatus is VALIDATION_STATUS_STYLES.

You can not change the name of the tokens object.

ValidationStatus component has one way to modify the styles:

  • Variant: modify the styles of the ValidationStatus.

The structure of the VALIDATION_STATUS_STYLES object is:

Variant and State

Each variant can have several state. state can modify the styles of the validationStatus. The states are defined by the user.

12345
enum ValidationStatusState {
  DEFAULT
  SUCCESS
  ERROR
}

The tokens used are:

12345678910
const VALIDATION_STATUS_STYLES = {
  [VARIANT]: {
    container?: CommonStyleType,
    row?: CommonStyleType,
    [STATE]: {
      icon?: IconTypes,
      explainText?: TypographyTypes,
    },
  }
};

Full

12345678910
const VALIDATION_STATUS_STYLES = {
  [VARIANT]: {
    container: {
      background_color: 'background-color',
    },
    row: {
      padding: 'padding',
    },
    [STATE]: {
      icon: {
Validation StatusCode API
Validation StatusAccessibility