mastodon-widget
v0.2.1
Published
Mastodon Widgets as Web Components
Downloads
1,986
Readme
Mastodon Widgets
This is a collection of Mastodon widgets for use on websites to add share and follow buttons and to display a user's profile and timeline.
🌟 If you like it, please star the repo and share it on Mastodon.
Usage
Here's the basic usage: Add the script
tag to your <head>
and then use any of the available components in your HTML.
<html lang="en">
<head>
<script type="module" src="https://unpkg.com/mastodon-widget"></script>
</head>
<body>
<mastodon-widget account="[email protected]" limit="5"></mastodon-widget>
<mastodon-share text="What a cool idea!"><button>Share this!</button></mastodon-share>
</body>
</html>
The script will lazy load only the components you actually use.
Components
You can see a demo of the available components at https://splitbrain.github.io/mastodon-widget/ and read more about them in their respective readme files:
- mastodon-widget The main widget showing a profile with a follow button and optionally timeline
- mastodon-follow Make any HTML a follow button
- mastodon-share Make any HTML a share button
- mastodon-timeline Show the timeline of a user
- mastodon-instancepicker The instance picker dialog used in the components above
Development
The widgets are web components built with the StencilJS compiler.
Setup dependencies:
npm install
Start a development server:
npm run start
Build the components and update the readme files for production:
npm run build
Prettify the code:
npm run pretty
NPM Package
The project is published to npm as mastodon-widget
. See the npm page for more info.
For building a new release, run:
npm version patch
git push
git push --tags
Replace patch
with minor
or major
as needed. This will update the pakage version, create a git tag and push it to the repo. There a github action will build the package and publish it to npm.
Help
Please help with the open issues.
This is my first project using stenciljs and typescript, so I'm sure there is a lot of room for improvement. Pull requests are welcome.