https://github.com/tanem/default-avatar-helper
:bowtie: A helper for creating default avatars.
https://github.com/tanem/default-avatar-helper
avatar avatar-generator avatar-placeholder avatars default-avatar helper javascript typescript
Last synced: 6 months ago
JSON representation
:bowtie: A helper for creating default avatars.
- Host: GitHub
- URL: https://github.com/tanem/default-avatar-helper
- Owner: tanem
- License: mit
- Created: 2019-10-15T17:16:01.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2024-04-13T18:40:08.000Z (over 1 year ago)
- Last Synced: 2024-04-14T14:59:26.738Z (over 1 year ago)
- Topics: avatar, avatar-generator, avatar-placeholder, avatars, default-avatar, helper, javascript, typescript
- Language: JavaScript
- Homepage: https://npm.im/default-avatar-helper
- Size: 4.44 MB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
- Authors: AUTHORS
Awesome Lists containing this project
README
# default-avatar-helper
[](https://www.npmjs.com/package/default-avatar-helper)
[](https://github.com/tanem/default-avatar-helper/actions?query=workflow%3ACI)
[](https://codecov.io/gh/tanem/default-avatar-helper)
[](https://www.npmjs.com/package/default-avatar-helper)
[](https://bundlephobia.com/result?p=default-avatar-helper)
> A helper for creating default avatars.
## Usage
```ts
import { getDefaultAvatarDetails } from 'default-avatar-helper'
const palette = ['red', 'green', 'blue']
const name = 'random name'
// Providing both arguments at once will return a result object straight away:
const { colour, initials } = getDefaultAvatarDetails(palette, name)
// Alternatively, since `getDefaultAvatarDetails` is curried, you can do
// something like:
const getDefaultAvatarDetailsWithPalette = getDefaultAvatarDetails(palette)
const { colour, initials } = getDefaultAvatarDetailsWithPalette(name)
```
The following live examples show how `colour` and `initials` can be used to
create a default avatar.
## Live Examples
- Vanilla: [Source](https://github.com/tanem/default-avatar-helper/tree/master/examples/vanilla) | [Sandbox](https://codesandbox.io/s/github/tanem/default-avatar-helper/tree/master/examples/vanilla)
- UMD Build (Development): [Source](https://github.com/tanem/default-avatar-helper/tree/master/examples/umd-dev) | [Sandbox](https://codesandbox.io/s/github/tanem/default-avatar-helper/tree/master/examples/umd-dev)
- UMD Build (Production): [Source](https://github.com/tanem/default-avatar-helper/tree/master/examples/umd-prod) | [Sandbox](https://codesandbox.io/s/github/tanem/default-avatar-helper/tree/master/examples/umd-prod)
## API
### getDefaultAvatarDetails(palette, colour)
**Arguments**
- `palette` - An array of strings representing the colour palette to use.
- `name` - A string representing a user name.
**Returns**
If less than two arguments have been provided, returns a function accepting the
remaining argument.
If both arguments have been provided, returns an object containing the
properties defined below:
- `colour` - A colour string.
- `initials` - The user initials string.
**Example**
```ts
const palette = ['red', 'green', 'blue']
const name = 'random name'
// Providing both arguments at once.
const { colour, initials } = getDefaultAvatarDetails(palette, name)
// Making use of currying.
const getDefaultAvatarDetailsWithPalette = getDefaultAvatarDetails(palette)
const { colour, initials } = getDefaultAvatarDetailsWithPalette(name)
```
## Installation
```
$ npm install default-avatar-helper
```
There are also UMD builds available via [unpkg](https://unpkg.com/):
- https://unpkg.com/default-avatar-helper/dist/default-avatar-helper.umd.development.js
- https://unpkg.com/default-avatar-helper/dist/default-avatar-helper.umd.production.js
Make sure you have already included:
- [lodash/fp]()
## License
MIT