Chip

Last Update : 14 August, 2023 | Published : 01 July, 2023 | 1 Min Read

Chips - allows users to show information, make selections, to filter content or to trigger actions. How are they different from buttons? Buttons usually appear consistently along with a action attached to them, while chips usually appear dynamically as interactive elements. One of the most common use of chips is as:

  • Contact tags

Import

import Chip from '@intelops/intelops_ui/packages/react/components/Chip/src';

Create an Alert

<Chip 
    title = "chip"
    variant="orange">
    Text on the chip
</Chip>

Props

NameTypeDescription
idstringUnique to each element can be used to lookup an element getElementById( )
classNamestringTo add new or to override the applied styles
childrennodeComponents content
variantstringHas multiple colors - eight in total

Chip Variants

The variants in this case is that you can choose frm 8 different colors

Variants

  1. fuchsia
  2. slate
  3. lime
  4. red
  5. orange
  6. cyan
  7. gray
  8. dark

Looking for Cloud-Native Implementation?

Finding the right talent is pain. More so, keeping up with concepts, culture, technology and tools. We all have been there. Our AI-based automated solutions helps eliminate these issues, making your teams lives easy.

Contact Us