BadgeAdd

BadgeAdd component.

It's a basic Badge with buisness logic.

Exemples

  <div style={{ height:'30px', width:'30px', border : '1px solid red' }}>
    <BadgeAdd counter={10} onClick={()=>{console.log('click Badge')}}>
      <CommentIcon  />
    </BadgeAdd>
  </div>

  <div>
  <BadgeAdd>
    <div style={{ border : '1px solid violet' }} >coucou</div>
    </BadgeAdd>
  </div>

  <div>
    <BadgeAdd>
      <PjIcon size={20} />
    </BadgeAdd>
  </div>
    <div>
    <BadgeAdd counter={98} color="red">
      <PjIcon size={20} />
    </BadgeAdd>
  </div>

  <div>
    <BadgeAdd counter={8}>
      <PjIcon size={20} />
    </BadgeAdd>
  </div>

  <div>
    <BadgeAdd counter={12} color="blue">
      <PjIcon size={20} />
    </BadgeAdd>
  </div>

   <div>
    <BadgeAdd counter={100} color="#de4f23">
      <CommentIcon size={20} />
    </BadgeAdd>
  </div>

10

coucou

98

8

12

+99

Props

Name	Type	Required	Default	Description
counter	number	No		Content of badge, IconPlus displayed if nothing or 0, +99 if more than 99
onClick	func	No	()=>	Action onClick Badge
color	string	No	()=>	palette.primary.main, #0BD1D1