@smitch/fluid/lib/twitterembed/TwitterEmbed.js

A Next/React ui-component libray.

'use client';
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useCallback, useState, useMemo } from 'react';
import { twMerge } from 'tailwind-merge';
import { Loading } from '..';
export var TwitterEmbed = function (_a) {
    var handle = _a.handle, _b = _a.lang, lang = _b === void 0 ? 'en' : _b, status = _a.status, theme = _a.theme, _c = _a.header, header = _c === void 0 ? false : _c, _d = _a.borders, borders = _d === void 0 ? false : _d, _e = _a.transparent, transparent = _e === void 0 ? false : _e, _f = _a.scrollbars, scrollbars = _f === void 0 ? false : _f, height = _a.height, _g = _a.className, className = _g === void 0 ? '' : _g, style = _a.style;
    var _h = useState(true), loading = _h[0], setLoading = _h[1];
    var chrome = useMemo(function () {
        return "".concat(!header ? 'noheader' : '', " ").concat(!borders ? 'noborders' : '', " ").concat(transparent ? 'transparent' : '', " ").concat(!scrollbars ? 'noscrollbars' : '');
    }, [header, borders, transparent, scrollbars]);
    var embedRef = useCallback(function (embedRefNode) {
        if (embedRefNode) {
            if (!document.querySelector('script[src="https://platform.twitter.com/widgets.js"]')) {
                var script = document.createElement('script');
                script.src = 'https://platform.twitter.com/widgets.js';
                script.defer = true;
                script.onload = function () {
                    if (window.twttr) {
                        window.twttr.widgets.load(embedRefNode);
                        window.twttr.events.bind('rendered', function () {
                            setLoading(false);
                        });
                    }
                    else {
                        setLoading(false);
                    }
                };
                script.onerror = function () {
                    setLoading(false);
                };
                document.body.appendChild(script);
            }
            else {
                if (window.twttr) {
                    window.twttr.widgets.load(embedRefNode);
                    window.twttr.events.bind('rendered', function () {
                        setLoading(false);
                    });
                }
                else {
                    setLoading(false);
                }
            }
        }
    }, []);
    return (_jsxs("div", { className: twMerge("twitter-wrap flex flex-col justify-center w-full max-w-lg", className), style: style, children: [loading && (_jsx("div", { className: 'loading-spinner py-8 text-info flex w-full justify-center mb-8', children: _jsx(Loading, { loadingColor: 'info', size: 'md', spinner: 'dots', caption: 'Loading' }) })), _jsx("div", { ref: embedRef, className: 'flex flex-col justify-center', children: status ? (_jsx(_Fragment, { children: _jsx("blockquote", { className: 'twitter-tweet mx-auto', "data-theme": theme, "data-lang": lang, "data-chrome": chrome, children: _jsxs("a", { href: "https://twitter.com/".concat(handle, "/status/").concat(status), children: ["@", handle] }) }) })) : (_jsxs("a", { className: 'twitter-timeline p-4 mx-auto', href: "https://twitter.com/".concat(handle), "data-chrome": chrome, "data-theme": theme, "data-lang": lang, "data-height": height, children: ["Tweets from @", handle] })) })] }));
};
export default TwitterEmbed;