@shopify/react-async/dist/provider.js

Tools for creating powerful, asynchronously-loaded React components.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var async_1 = require("@shopify/async");
var react_idle_1 = require("@shopify/react-idle");
var hooks_1 = require("./hooks");
var types_1 = require("./types");
function createAsyncContext(_a) {
    var id = _a.id, load = _a.load;
    var resolver = async_1.createResolver({ id: id, load: load });
    var Context = react_1.default.createContext(null);
    // Just like a "normal" value returned from `createContext`, rendering
    // the value itself is not supported. This component is just a placeholder
    // to provide a more useful error.
    function Root() {
        throw new Error('Do not attempt to render the result of calling `createAsyncContext()` directly. Render its `.Provider` component instead.');
    }
    function Provider(props) {
        var _a = hooks_1.useAsync(resolver, {
            assets: types_1.AssetTiming.Immediate,
        }), load = _a.load, resolved = _a.resolved;
        react_1.useEffect(function () {
            load();
        }, [load]);
        return react_1.default.createElement(Context.Provider, tslib_1.__assign({ value: resolved }, props));
    }
    function Consumer(props) {
        return react_1.default.createElement(Context.Consumer, tslib_1.__assign({}, props));
    }
    function usePreload() {
        return hooks_1.useAsync(resolver, {
            assets: types_1.AssetTiming.NextPage,
        }).load;
    }
    function Preload() {
        var preload = usePreload();
        react_idle_1.useIdleCallback(preload);
        return null;
    }
    function Prefetch() {
        var preload = usePreload();
        react_1.useEffect(function () {
            preload();
        }, [preload]);
        return null;
    }
    var FinalComponent = Root;
    Reflect.defineProperty(FinalComponent, 'resolver', {
        value: resolver,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'Provider', {
        value: Provider,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'Consumer', {
        value: Consumer,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'Context', {
        value: Context,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'Preload', {
        value: Preload,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'Prefetch', {
        value: Prefetch,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'KeepFresh', {
        value: Preload,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'usePreload', {
        value: usePreload,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'usePrefetch', {
        value: usePreload,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'useKeepFresh', {
        value: usePreload,
        writable: false,
    });
    return FinalComponent;
}
exports.createAsyncContext = createAsyncContext;