thebe-react/dist/ThebeLoaderProvider.js

React providers and components for thebe-core

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useThebeLoader = exports.ThebeBundleLoaderProvider = exports.ThebeLoaderProvider = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importStar(require("react"));
const version_1 = tslib_1.__importDefault(require("./version"));
// Don't know how to get rid of the undefined here in the case of an async provider
const ThebeLoaderContext = react_1.default.createContext(undefined);
function ThebeLoaderProvider({ start, children, }) {
    const [startLoad, setStartLoad] = (0, react_1.useState)(start);
    const [loading, setLoading] = (0, react_1.useState)(false);
    const [core, setCore] = (0, react_1.useState)();
    const [error, setError] = (0, react_1.useState)();
    (0, react_1.useEffect)(() => {
        // if already loaded do nothing
        if (!startLoad || core)
            return;
        setLoading(true);
        console.debug(`thebe-react (v${version_1.default}) importing thebe-core...`);
        Promise.resolve().then(() => tslib_1.__importStar(require('thebe-core'))).then((thebeCore) => {
            console.debug(`thebe-core (v${thebeCore.version}) loaded`);
            setCore(thebeCore);
            setLoading(false);
        })
            .catch(({ message }) => {
            console.debug(`thebe-core load failed ${message}`);
            setError(message);
            setLoading(false);
        });
    }, [startLoad]);
    return ((0, jsx_runtime_1.jsx)(ThebeLoaderContext.Provider, Object.assign({ value: { core, error, loading, load: () => setStartLoad(true) } }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children }) })));
}
exports.ThebeLoaderProvider = ThebeLoaderProvider;
function ThebeBundleLoaderProvider({ start, loadThebeLite, publicPath, children, options = {}, }) {
    const [startLoad, setStartLoad] = (0, react_1.useState)(start);
    const [loading, setLoading] = (0, react_1.useState)(false);
    const [core, setCore] = (0, react_1.useState)();
    const [error, setError] = (0, react_1.useState)();
    (0, react_1.useEffect)(() => {
        var _a;
        // if already loaded do nothing
        if (!startLoad || core)
            return;
        setLoading(true);
        console.debug(`thebe-react (v${version_1.default}) importing thebe-core...`);
        if (typeof document !== 'undefined' && typeof window !== 'undefined') {
            try {
                if (!window.thebeCore) {
                    const script = document.createElement('script');
                    script.setAttribute('src', `${publicPath !== null && publicPath !== void 0 ? publicPath : ''}/thebe-core.min.js`);
                    script.setAttribute('async', 'true');
                    script.setAttribute('type', 'text/javascript');
                    document.head.appendChild(script);
                }
                if (loadThebeLite) {
                    const liteScript = document.createElement('script');
                    liteScript.setAttribute('src', `${publicPath !== null && publicPath !== void 0 ? publicPath : ''}/thebe-lite.min.js`);
                    liteScript.setAttribute('async', 'true');
                    liteScript.setAttribute('type', 'text/javascript');
                    document.head.appendChild(liteScript);
                }
                let attempts = 0;
                const timer = setInterval(() => {
                    var _a, _b, _c, _d, _e, _f;
                    if (window.thebeCore && (window.thebeLite || !loadThebeLite)) {
                        setLoading(false);
                        setCore((_a = window.thebeCore) === null || _a === void 0 ? void 0 : _a.module);
                        console.debug(`thebe-core (v${(_c = (_b = window.thebeCore) === null || _b === void 0 ? void 0 : _b.version) !== null && _c !== void 0 ? _c : '0'}) loaded`);
                        if (window.thebeLite)
                            console.debug(`thebe-lite (v${(_e = (_d = window.thebeLite) === null || _d === void 0 ? void 0 : _d.version) !== null && _e !== void 0 ? _e : '0'}) loaded`);
                        clearInterval(timer);
                    }
                    if (attempts > ((_f = options === null || options === void 0 ? void 0 : options.attempts) !== null && _f !== void 0 ? _f : 50)) {
                        setError('thebe-core load failed');
                        setLoading(false);
                        clearInterval(timer);
                        console.warn('thebe load timed out');
                        if (!window.thebeCore)
                            console.debug('thebe-core failed to load');
                        if (!window.thebeLite)
                            console.debug('thebe-lite failed to load');
                    }
                    attempts += 1;
                }, (_a = options === null || options === void 0 ? void 0 : options.delay) !== null && _a !== void 0 ? _a : 300);
            }
            catch (err) {
                setError(err);
                setLoading(false);
            }
        }
    }, [startLoad]);
    return ((0, jsx_runtime_1.jsx)(ThebeLoaderContext.Provider, Object.assign({ value: { core, error, loading, load: () => setStartLoad(true) } }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children }) })));
}
exports.ThebeBundleLoaderProvider = ThebeBundleLoaderProvider;
function useThebeLoader() {
    const context = react_1.default.useContext(ThebeLoaderContext);
    return context !== null && context !== void 0 ? context : { loading: false, load: () => ({}) };
}
exports.useThebeLoader = useThebeLoader;
//# sourceMappingURL=ThebeLoaderProvider.js.map