signal-desktop/ts/components/conversation/Emojify.md
Scott Nonnenberg 2988da0981 Turn on all of Microsoft's recommend lint rules
Biggest changes forced by this: alt tags for all images, resulting in
new strings added to messages.json, and a new i18n paramter/prop added
in a plot of places.

Another change of note is that there are two new tslint.json files under
ts/test and ts/styleguide to relax our rules a bit there. This required
a change to our package.json script, as manually specifying the config
file there made it ignore our tslint.json files in subdirectories
2018-05-23 16:26:47 -07:00

64 lines
1.1 KiB
Markdown

### All emoji
```jsx
<Emojify text="🔥🔥🔥" i18n={util.i18n} />
```
### With skin color modifier
```jsx
<Emojify text="👍🏾" i18n={util.i18n} />
```
### With `sizeClass` provided
```jsx
<Emojify text="🔥" sizeClass="jumbo" i18n={util.i18n} />
```
```jsx
<Emojify text="🔥" sizeClass="large" i18n={util.i18n} />
```
```jsx
<Emojify text="🔥" sizeClass="medium" i18n={util.i18n} />
```
```jsx
<Emojify text="🔥" sizeClass="small" i18n={util.i18n} />
```
```jsx
<Emojify text="🔥" sizeClass="" i18n={util.i18n} />
```
### Starting and ending with emoji
```jsx
<Emojify text="🔥in between🔥" i18n={util.i18n} />
```
### With emoji in the middle
```jsx
<Emojify text="Before 🔥🔥 after" i18n={util.i18n} />
```
### No emoji
```jsx
<Emojify text="This is the text" i18n={util.i18n} />
```
### Providing custom non-link render function
```jsx
const renderNonEmoji = ({ text, key }) => (
<span key={key}>This is my custom content</span>
);
<Emojify
text="Before 🔥🔥 after"
renderNonEmoji={renderNonEmoji}
i18n={util.i18n}
/>;
```