(SP: 2) Create Badge component aligned with design system

[Mav-Ivan]

Description:

Implement a reusable Badge component that meets the design system standards. This component will be used throughout the application to maintain consistency in badge styles, behavior, and accessibility.

Figma

Requirements:

• Styles:

  • Follow design system variables for colors, typography, padding, and other styles.

• Props:

  • variant: Defines type (sm, lg).
  • badgeContent: Provide content that will be rendered in Badge.
  • color: Supports different colors.
  • maxContent: The max value that will be shown in the Badge.
  • isVisible: To show Badge.

Don't forget to cover component with tests and add to the storybook