whatsapp formatting for the web

What if you could use an awesome text formatting syntax that millions of people are already used to in your app? Oh wait! You can! cue Whatsapp formatting. You can use *bold*, _italic_, ~strikethrough~, ```monospace```, or `inline code`. (it's only 510 bytes gzip!)

Installation

$ yarn add @flasd/whatsapp-formatting

// or if you are feeling old school
$ npm install @flasd/whatsapp-formatting

Usage

The API is very very simple.

import { format } from "@flasd/whatsapp-formatting";

format("*hello* _world_");
// « '<strong>hello</strong> <i>world</i>'

format("~how are you?~");
// « '<s>how are you?</s>'

format("```monospace text```");
// « '<code>monospace text</code>'

format("`inline code`");
// « '<code>inline code</code>'

format(`
multiline
string
`);
// « '<br>multiline<br>string<br>'

Supported Formatting

This library supports the following WhatsApp text formatting:

• Bold: *text* → <strong>text</strong>
• Italic: _text_ → <i>text</i>
• Strikethrough: ~text~ → <s>text</s>
• Monospace: ```text``` → <code>text</code>
• Inline Code: `text` → <code>text</code>
• Line breaks: \n → <br>

You can mix and match all of the formatters. OH! And you can customize the formatting rules if you want to:

import { format, whatsappRules } from "@flasd/whatsapp-formatting";

const customRules = [
  ...whatsappRules,
  {
    wildcard: "|",
    openTag: '<span style="font-family:monospace">',
    closeTag: "</span>",
  },
];

format("|some awesome code|", customRules);
// « '<span style="font-family:monospace">some awesome code</span>'

MIT License

Copyright 2020 Marcel de Oliveira Coelho under the MIT License. Go Crazy. :rocket: