mirror of
https://github.com/noodlapp/noodl-docs.git
synced 2026-01-12 23:32:54 +01:00
53f0d6320e
Co-Authored-By: kotte <14197736+mrtamagotchi@users.noreply.github.com> Co-Authored-By: mikaeltellhed <2311083+mikaeltellhed@users.noreply.github.com> Co-Authored-By: Tore Knudsen <18231882+torekndsn@users.noreply.github.com> Co-Authored-By: Michael Cartner <32543275+michaelcartner@users.noreply.github.com>
64 lines
1.1 KiB
Markdown
64 lines
1.1 KiB
Markdown
---
|
|
title: Avatar Module
|
|
hide_title: true
|
|
---
|
|
|
|
# Avatar Module
|
|
|
|
This module allows you to add avatars to your Noodl App.
|
|
|
|
<div className="ndl-image-with-background l">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
## Nodes
|
|
|
|
In this module, there are a few nodes, which include:
|
|
|
|
### Avatar Node
|
|
|
|
This node is written using the SDK and gives you all the options to modify the style of the avatar.
|
|
|
|
### Avatar Group
|
|
|
|
<div className="ndl-image-with-background l">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
This is a simple node that takes in an array of objects.
|
|
It makes a few modifications to the array like taking only x amount of items and then sending that into a Repeater node,
|
|
using the Avatar Group Item component.
|
|
|
|
Items input:
|
|
|
|
```js
|
|
[
|
|
{
|
|
Text: 'AA',
|
|
Image: 'avatars/avatar-n4KewLKFOZw.jpg',
|
|
},
|
|
{
|
|
Text: 'AA',
|
|
Image: 'avatars/avatar-TW_z_iUD_bQ.jpg',
|
|
},
|
|
];
|
|
```
|
|
|
|
### Avatar Group Item
|
|
|
|
A node that maps the inputs from the Avatar Group into what should be used on the Avatar node.
|
|
|
|
### [Logic] Name Abbreviation
|
|
|
|
Converts a full name to 2 characters.
|
|
For example:
|
|
|
|
```
|
|
Input: "John Doe"
|
|
Output: "JD"
|
|
```
|