@shapla/react-chip
v1.0.0
Published
Chip component is a small, interactive element. Chips are commonly used for contacts, text, rules, icons, and photos.
Downloads
3
Readme
Shapla React Button
A simple button, in different colors, sizes, and states
Table of contents
Installation
npm install --save @shapla/react-chip
Usage
Styles
with Sass:
import '@shapla/react-chip/src/index.scss';
with CSS:
import '@shapla/react-chip/dist/chip.css';
Javascript Instantiation
import React from 'react';
import Chip from '@shapla/react-chip';
class MyApp extends React.Component {
render() {
return (
<Chip text='Sayful Islam' deletable={true} onDeleteIconClick={() => console.log('delete')}/>
);
}
}
Props
| Property | Type | Required | Default | Description
|---------------------|-----------|-----------|-----------|----------------------------------------
| text
| String | no | | Chip text
| `imageSrc` | String | **no** |
| Chip contact image url
| deletable
| Boolean | no | false
| If set true
, Delete icon will appear
| small
| Boolean | no | false
| If set true
, a small chip with display
| height
| String | no | 32px
| Custom height of chip
| onDeleteIconClick
| String | no | 32px
| Trigger when you click on delete icon.