feat: add variant in status component (#212)

lojaintegrada · May 16, 2024 · 4ff2faf · 4ff2faf
1 parent e36318c
commit 4ff2faf
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/styleguide/src/Indicators/Status/Status.spec.tsx b/styleguide/src/Indicators/Status/Status.spec.tsx
@@ -21,6 +21,9 @@ describe(specTitle('Status tests'), () => {
     mount(<Default type="success" />)
     cy.get('.indicator-status').find('.rounded-full').should('have.class', 'bg-success')
 
+    mount(<Default type="successDark" />)
+    cy.get('.indicator-status').find('.rounded-full').should('have.class', 'bg-success-dark')
+
     mount(<Default type="warning" />)
     cy.get('.indicator-status').find('.rounded-full').should('have.class', 'bg-warning')
 
@@ -36,4 +39,9 @@ describe(specTitle('Status tests'), () => {
     cy.get('.indicator-status *').first().contains('Aprovado')
   })
 
+  it('Description', () => {
+    mount(<Default description={<strong>Aprovado</strong>} />)
+    cy.get('.indicator-status').find('strong').contains('Aprovado')
+  })
+
 })
diff --git a/styleguide/src/Indicators/Status/Status.tsx b/styleguide/src/Indicators/Status/Status.tsx
@@ -3,6 +3,7 @@ import React from 'react'
 const statusTypes = {
   default: 'bg-inverted-2',
   success: 'bg-success',
+  successDark: 'bg-success-dark',
   warning: 'bg-warning',
   danger: 'bg-danger',
   dangerLight: 'bg-danger-light',
@@ -56,7 +57,7 @@ export interface StatusProps {
   /**
    * Status additional text
    * */
-  description?: string
+  description?: React.ReactNode | string
   /** Invert icon and text position
    * @default false
    * */