$ npm install react-telegram-sticker-viewer
For a live demo, visit: https://kokim2022.github.io/react-telegram-sticker-viewer/
import React, { useState } from 'react';
import ReactTelegramStickerViewer from 'react-telegram-sticker-viewer';
const App: React.FC = () => {
const [tgsUrl, setTgsUrl] = useState<string>(
'https://cdn.chatapi.net/stickers/telegram/1c49672ec5dbeef5cfd517996acf2bac/file_10.tgs'
);
return (
<ReactTelegramStickerViewer
tgsUrl={tgsUrl}
// Optional: You can pass a custom CORS proxy URL if needed
// corsProxyServerUrl="https://your-custom-cors-proxy.com/?url="
style={{ height: '300px', width: '300px' }}
/>
);
};
export default App;
-
tgsUrl
(required, string)
The URL of the Telegram Sticker (TGS file) to be displayed. -
style
(optional, object)
The style of the sticker viewer. Default is{ height: '100px', width: '100px' }
. -
corsProxyServerUrl
(optional, string)
You can provide a custom CORS proxy URL if needed. This is useful if you're encountering CORS issues when accessing the TGS URL.
MIT @ kokim2020.