Enums

The following Enums are available in the React base.

NameValueDescription
Color
'Error' | 'Info' | 'Primary' | 'Secondary' | 'Warning'

Defines a color categories for the components. Each color category is used to visually differentiate components based on context.

  • Error - Indicates the color for error or danger, signaling urgent problem requiring attention.
  • Info - Indicates the color for informational content, assisting in the communication of status or updates.
  • Primary - Indicates the primary color for highlighting the main role or action.
  • Secondary - Indicates secondary colors for support actions with a subtle tone.
  • Success - Indicates the color for success, often used to convey the completion of an action.
  • Warning - Indicates the color for warnings or cautions, drawing attention to potential issues.
Orientation
'Horizontal' | 'Vertical'

Defines layout orientation for components. Each orientation specifies the directional arrangement for layout and component behavior.

  • Horizontal - Arranges elements horizontally from left to right.
  • Vertical - Arranges elements vertically from top to bottom.
Position
'Bottom' | 'Left' | 'Right' | 'Top'

Specifies positioning options for the components. Determines how the element should be displayed relative to a reference context.

  • Bottom - Represents the positioning below the reference context.
  • Left - Represents the positioning left of the reference context.
  • Right - Represents the positioning right of the reference context.
  • Top - Represents the positioning above the reference context.
Severity
'Error' | 'Info' | 'Normal' | 'Success' | 'Warning'

Defines severity levels for components. Each severity level conveys appropriate importance and urgency to users.

  • Error - Indicates an information that is a critical issue requiring immediate user attention.
  • Info - Indicates an information that is general or non-urgent in nature.
  • Normal - Indicates an information that reflects a neutral state with no specific urgency.
  • Success - Indicates an information that confirms a successful operation.
  • Warning - Indicates an information that highlights a potential issue or caution.
Size
'Large' | 'Medium' | 'Small'

Defines size levels for UI components.

  • Large - Represents a larger size for the component, used for greater emphasis.
  • Medium - Represents a medium size for the component, offering a balanced appearance.
  • Small - Represents a smaller size for the component, suitable for less prominent display.
SortOrder
'None' | 'Ascending' | 'Descending'

Specifies the sorting order for items in the ListView. The available options are:

  • None - No sorting is applied. Items are displayed in their original order.
  • Ascending - Ascending order sorting is applied to the ListView items.
  • Descending - Descending order sorting is applied to the ListView items.
Variant
'Filled' | 'Outlined' | 'Standard'

Defines visual variants for UI components. Each variant modifies the appearance to convey distinct user preferences.

  • Filled - Indicates a solid background to emphasize content with contrasting text.
  • Outlined - Indicates a boundary outline to highlight content with colored text, excluding a background.
  • Standard - Indicates a minimalist style with colored text and a subtle or absent background.