@mail3/mail-me
v0.0.5
Published
`mail-me-button` provides a simple way to interact with [Mail3 App](https://app.mail3.me).
Downloads
12
Readme
mail-me-button
mail-me-button provides a simple way to interact with Mail3 App.
Usage
mail-me-button is a Web Component, Just like a HTML element, mail-me-button has some built-in attributes:
address(string): If this address is provided,mail-me-buttondisplays the number of unread messages between this address and the currently logged in mailbox in Mail3 app, otherwise it displays the number of all unread messages.lite(boolean): in lite mode,mail-me-buttonwill be displayed as a circular Icon without text.variant(string): Some default style set formail-me-button, optionally one ofsolid,outline,ghost, default issolidicon(string): style for Mail3 Icon, optionally one ofblack,white,light,solid, default issolid
In addition to the above built-in attributes, mail-me-button also supports passing in all the attributes of the anchor element, such as style, target, etc.
HTML
After adding the mail-me-button script, you can use it like an HTMl element.
<!DOCTYPE html>
<html>
<head>
<title>Mail Me Button Demo</title>
<meta charset="UTF-8" />
</head>
<body>
<!-- 3KiB gziped with public cdn, it is recommended that self-hosted this script -->
<script src="https://unpkg.com/@mail3/mail-me"></script>
<mail-me address="your email address" />
</body>
</html>React
Install mail-me-button:
$ npm i @mail3/mail-me
# or yarn
$ yarn add @mail3/mail-meImport the dependency in the entry file of your application:
// app.js
// only 3KiB gziped
import '@mail3/mail-me'Use mail-me-button like a HTML Element:
<App>
<Navbar />
<mail-me address="[email protected]" />
</App>