Workaround for custom-elements-es5-adapter:
<script>if (!window.customElements) { document.write('<!--'); }</script>
<script src="<path_to>/custom-elements-es5-adapter.84b300ee818dce8b351c7cc7c100bcf7.js" type="text/javascript" ></script>
<!--! do not remove -->
Chat relies on dependencies described at peerDependencies section.
They should be included according your pipeline or like that.
Chat in a nutshell can be accessed like this:
<script src="<path/to>/dist/chat.min.js"></script>
<script>
window.customElements.define('wc-chat', window.WcChat.Chat);
</script>
Chat is able to be enhanced. It provides some mixins and utilities.
An example can be seen here.
Chat supports internationalization and contains basic dictionary within. You have to specify language attribute to make it work (uses en-US
locale by default).
For instance:
<script src="https://cdn.jsdelivr.net/npm/intl-messageformat@2.2.0/dist/intl-messageformat-with-locales.min.js"></script>
<wc-chat
language="en-US"
placeholder="Write something…"
placeholderdisabled="Chat is blocked now"
/>
Chat supports parsers to render a message.
Here are built-in ones:
Chat renders string as is unless parser
is defined.
This parser just encodes a string with HTML entities.
For instance:
<wc-chat parser='html-entities' />
Result
:s/Scotch & Soda/Scotch & Soda/
This parser renders any string according to Markdown markup.
For instance:
<script src="https://cdn.jsdelivr.net/npm/markdown-it@8.4.2/dist/markdown-it.min.js"></script>
<wc-chat parser='markdown' />