1.1.10 • Published 3 months ago
sveltegram v1.1.10
Sveltegram
This package allows you to embed telegram widgets in your svelte web application.
Library size is 96 bytes (min+gzipped). bundlephobia
Demo & Documentation
Post widget
Embed a telegram post widget in your svelte application.
How to use
<script>
import { Post } from 'sveltegram';
</script>
<Post link="https://t.me/computly/188" />
API
Property | Type | Default | Description |
---|---|---|---|
link (Required) | string | Telegram post link (You can find it in context menu) | |
color | string | #2f81f6 | Accent color |
colorDark | string | #89baff | Accent color in dark mode |
darkMode | boolean | false | Enable dark mode |
Discussions widget
Embed a telegram discussions widget in your svelte application.
How to use
<script>
import { Discussions } from 'sveltegram';
</script>
<Discussions link="https://t.me/contest/198" />
API
Property | Type | Default | Description |
---|---|---|---|
link (Required) | string | Telegram discussions link (You can find it in context menu) | |
pageURL | string | If you want to auto load comments from your channel as explained in Telegram documentation You'll need to pass the same page URL as the one in <link rel="canonical"> | |
color | string | #2f81f6 | Accent color |
colorDark | string | #89baff | Accent color in dark mode |
darkMode | boolean | false | Enable dark mode |
colorfulNames | boolean | false | Use different color for usernames |
commentsLimit | number | 5 | Number of comments to show |
height | number | Height of the widget, The default value is 'auto' which is determined by Telegram |
Login widget
Embed a telegram login button in your svelte application.
How to use
<script>
import { Login } from 'sveltegram';
</script>
<Login username="ComputlyBot" />
API
Property | Type | Default | Description |
---|---|---|---|
username (Required) | string | Your telegram bot username | |
authType | string | callback | How to authenticate users? Choices are callback, redirect |
redirectURL Required if authType = redirect | string | In case you chose redirect as an authentication method, you must set this property | |
requestAccess | boolean | false | Whether you want to send messages to the user in the future |
size | string | medium | Login button size. choices are small, medium,large |
buttonRadius | number | 10 | Login button radius (in pixels) |
Content Security Policy
If you are using CSP, you'll need to allow scripts and iFrames coming from Telegram domains as follows:
script-src https://telegram.org;
frame-src https://t.me;
Limitations
- Can't use the same widget more than once due to telegram script assigning a unique id to each widget.
Development
Install
git clone https://github.com/amr3k/sveltegram.git
cd sveltegram
Then install dependencies:
pnpm install
TODO
- Add support for login widget
License
1.1.9
3 months ago
1.1.10
3 months ago
1.1.8
5 months ago
1.1.7
5 months ago
1.1.6-2
7 months ago
1.1.6
7 months ago
1.1.6-1
11 months ago
1.1.5
1 year ago
1.1.4
1 year ago
1.1.3
1 year ago
1.1.2
2 years ago
1.1.1
2 years ago
1.1.0
2 years ago
1.0.0
2 years ago
0.1.0-beta.1
2 years ago
0.0.8
2 years ago
0.0.7
2 years ago
0.0.6
2 years ago
0.0.5
2 years ago
0.0.4
2 years ago
0.0.2
2 years ago
0.0.1
2 years ago