npm install m-dash-uim-dash-ui is a UI library from Mudano built with React. Its objective is to be an aggregate of beatiful and useful general components to be re-used across teams to build new features. Each component should cover most of the general use-cases and avoid getting into specifics of the features it's being used on.
A simple user avatar component, with support for showing name initials.
#### Props
| prop | requiredness | type | description |
| --- | --- | --- | --- |
| name | required | string | Name of the user |
| url | _optional_ | string | Url or base64 for the image |
| base64 | _optional_ | boolean | Whether url is base64 or not |
| showLabel | _optional_ | boolean | Whether to show a label with the user's name below the avatar |
| size | _optional_ | string | Can be either nothing, sm, md or lg. Default size is 42px, sm is 22px, md is 32px and lg is 64px |
| renderTooltip | _optional_ | function | A function that returns jsx or a component with the content of a tooltip |
| style | _optional_ | object | An object with valid custom css for the avatar |
| className | _optional_ | string | A custom class for the avatar wrapper |
| onMouseLeave | _optional_ | function | Function to be called when mouse leaves the avatar
| onMouseEnter | _optional_ | function | Function to be called when mouse enters the avatar
| onClick | _optional_ | function | Function to be called the avatar is clicked
Isotope grid component
#### Props
| prop | requiredness | type | description |
| --- | --- | --- | --- |
| data | required | array | Array of items to be rendered on the grid |
| itemToKey | required | function | Function that transforms each item on a key that's passed to react, so the component doesn't need to infer anything about the items structure |
| renderItem | _optional_ | function | Recommended way of customizing the items rendering. The function receives the following signature: ({ item, removeItem }) |
| comp | _optional_ | function | Unrecommended way of customizing the items rendering. The component receives the item data spread into its props and a removeMe props for removing the item |
| vertical | _optional_ | boolean | Transforms the grid view into a vertical list |
| filter | _optional_ | string | String following the isotope format for filtering the rendered items |
| itemClassName | _optional_ | string | CSS class to be passed to the items wrapper |
| className | _optional_ | string | CSS class to be passed to the grid wrapper |