@bleedingdev/modern-js-runtime 3.2.0-ultramodern.0

package/dist/cjs/router/runtime/tanstack/dataMutation.js

@@ -0,0 +1,345 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    Form: ()=>Form,
+    RouteActionResponseError: ()=>RouteActionResponseError,
+    useFetcher: ()=>useFetcher
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const react_router_namespaceObject = require("@tanstack/react-router");
+const external_react_namespaceObject = require("react");
+class RouteActionResponseError extends Error {
+    constructor(response, data){
+        super(`Route action failed with status ${response.status}`);
+        this.name = 'RouteActionResponseError';
+        this.response = response;
+        this.data = data;
+    }
+}
+function formDataToUrlSearchParams(formData) {
+    const searchParams = new URLSearchParams();
+    formData.forEach((value, key)=>{
+        if ('string' == typeof value) searchParams.append(key, value);
+    });
+    return searchParams;
+}
+function formDataToTextPlain(formData) {
+    return Array.from(formData.entries()).map(([key, value])=>`${key}=${String(value)}`).join('\n');
+}
+function toFormData(target) {
+    if (target instanceof HTMLFormElement) return new FormData(target);
+    if (target instanceof FormData) return target;
+    if (target instanceof URLSearchParams) {
+        const formData = new FormData();
+        target.forEach((value, key)=>{
+            formData.append(key, value);
+        });
+        return formData;
+    }
+    const formData = new FormData();
+    Object.entries(target).forEach(([key, value])=>{
+        if (null == value) return;
+        formData.append(key, String(value));
+    });
+    return formData;
+}
+function getSubmitter(event) {
+    const nativeEvent = event.nativeEvent;
+    const submitter = nativeEvent?.submitter;
+    if (submitter instanceof HTMLButtonElement || submitter instanceof HTMLInputElement) return submitter;
+    return null;
+}
+function createFormDataFromSubmit({ form, submitter }) {
+    if (submitter) try {
+        return new FormData(form, submitter);
+    } catch  {}
+    return new FormData(form);
+}
+function resolveSubmitOptionsFromForm({ form, submitter, action, method, encType }) {
+    const resolvedAction = submitter?.getAttribute('formaction') || action || form.getAttribute('action') || '.';
+    const resolvedMethod = (submitter?.getAttribute('formmethod') || method || form.getAttribute('method') || 'get').toLowerCase();
+    const resolvedEncType = submitter?.getAttribute('formenctype') || encType || form.getAttribute('enctype') || 'application/x-www-form-urlencoded';
+    return {
+        action: resolvedAction,
+        method: resolvedMethod,
+        encType: resolvedEncType
+    };
+}
+function resolveRouteHandlers(router, actionTo) {
+    const builtLocation = router.buildLocation({
+        to: actionTo
+    });
+    const href = router.getParsedLocationHref(builtLocation);
+    const matchedRoutes = router.getMatchedRoutes(builtLocation.pathname);
+    const routeStaticData = matchedRoutes.foundRoute?.options?.staticData;
+    const action = routeStaticData?.modernRouteAction;
+    const loader = routeStaticData?.modernRouteLoader;
+    return {
+        action,
+        loader,
+        href,
+        params: matchedRoutes.routeParams || {}
+    };
+}
+function isRedirectResponse(value) {
+    if (!(value instanceof Response)) return false;
+    return [
+        301,
+        302,
+        303,
+        307,
+        308
+    ].includes(value.status);
+}
+async function parseResponseData(response) {
+    if (204 === response.status) return null;
+    const contentType = response.headers.get('Content-Type') || '';
+    if (contentType.includes('application/json')) return response.json();
+    return response.text();
+}
+async function parseResponseResultOrThrow(response) {
+    const parsed = await parseResponseData(response);
+    if (!response.ok) throw new RouteActionResponseError(response, parsed);
+    return parsed;
+}
+async function submitRouteAction({ router, target, options = {}, isFetcher = false, onInvalidateStart }) {
+    const method = (options.method || 'post').toLowerCase();
+    const encType = options.encType || 'application/x-www-form-urlencoded';
+    const actionTo = options.action || '.';
+    const formData = toFormData(target);
+    const resolved = resolveRouteHandlers(router, actionTo);
+    if ('get' === method) {
+        const search = formDataToUrlSearchParams(formData).toString();
+        const requestUrl = new URL(resolved.href, window.location.origin);
+        requestUrl.search = search;
+        if (isFetcher && resolved.loader) {
+            const result = await resolved.loader({
+                request: new Request(requestUrl, {
+                    method: 'GET'
+                }),
+                params: resolved.params
+            });
+            if (result instanceof Response) {
+                const redirectTo = result.headers.get('X-Modernjs-Redirect') || result.headers.get('Location');
+                if (redirectTo || isRedirectResponse(result)) {
+                    await router.navigate({
+                        to: redirectTo || '/'
+                    });
+                    return parseResponseData(result);
+                }
+                return parseResponseResultOrThrow(result);
+            }
+            return result;
+        }
+        await router.navigate({
+            href: search ? `${resolved.href}?${search}` : resolved.href
+        });
+        return;
+    }
+    if (!resolved.action) throw new Error(`No route action found for "${actionTo}"`);
+    const headers = new Headers();
+    let body = null;
+    if (encType.includes('application/json')) {
+        headers.set('Content-Type', 'application/json');
+        body = JSON.stringify(Object.fromEntries(formDataToUrlSearchParams(formData).entries()));
+    } else if (encType.includes('text/plain')) {
+        headers.set('Content-Type', 'text/plain;charset=UTF-8');
+        body = formDataToTextPlain(formData);
+    } else if (encType.includes('application/x-www-form-urlencoded')) {
+        headers.set('Content-Type', 'application/x-www-form-urlencoded;charset=UTF-8');
+        body = formDataToUrlSearchParams(formData);
+    } else body = formData;
+    const request = new Request(new URL(resolved.href, window.location.origin), {
+        method: method.toUpperCase(),
+        headers,
+        body
+    });
+    const result = await resolved.action({
+        request,
+        params: resolved.params
+    });
+    if (result instanceof Response) {
+        const redirectTo = result.headers.get('X-Modernjs-Redirect') || result.headers.get('Location');
+        if (redirectTo || isRedirectResponse(result)) {
+            await router.navigate({
+                to: redirectTo || '/'
+            });
+            return parseResponseData(result);
+        }
+        const parsed = isFetcher ? await parseResponseResultOrThrow(result) : await parseResponseData(result);
+        onInvalidateStart?.();
+        await router.invalidate();
+        return parsed;
+    }
+    onInvalidateStart?.();
+    await router.invalidate();
+    return result;
+}
+function Form({ action, method = 'get', encType, reloadDocument, onSubmit, ...rest }) {
+    const router = (0, react_router_namespaceObject.useRouter)();
+    const handleSubmit = (0, external_react_namespaceObject.useCallback)(async (event)=>{
+        onSubmit?.(event);
+        if (event.defaultPrevented || reloadDocument) return;
+        event.preventDefault();
+        const submitter = getSubmitter(event);
+        const formData = createFormDataFromSubmit({
+            form: event.currentTarget,
+            submitter
+        });
+        const normalizedOptions = resolveSubmitOptionsFromForm({
+            form: event.currentTarget,
+            submitter,
+            action,
+            method,
+            encType
+        });
+        await submitRouteAction({
+            router,
+            target: formData,
+            options: normalizedOptions
+        });
+    }, [
+        action,
+        encType,
+        method,
+        onSubmit,
+        reloadDocument,
+        router
+    ]);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("form", {
+        ...rest,
+        action: action,
+        method: method,
+        encType: encType,
+        onSubmit: handleSubmit
+    });
+}
+function useFetcher() {
+    const router = (0, react_router_namespaceObject.useRouter)();
+    const [state, setState] = (0, external_react_namespaceObject.useState)('idle');
+    const [data, setData] = (0, external_react_namespaceObject.useState)(void 0);
+    const [error, setError] = (0, external_react_namespaceObject.useState)(void 0);
+    const requestStatesRef = (0, external_react_namespaceObject.useRef)(new Map());
+    const requestIdRef = (0, external_react_namespaceObject.useRef)(0);
+    const syncStateFromRequests = (0, external_react_namespaceObject.useCallback)(()=>{
+        let hasSubmitting = false;
+        let hasLoading = false;
+        requestStatesRef.current.forEach((requestState)=>{
+            if ('submitting' === requestState) hasSubmitting = true;
+            else if ('loading' === requestState) hasLoading = true;
+        });
+        if (hasSubmitting) return void setState('submitting');
+        if (hasLoading) return void setState('loading');
+        setState('idle');
+    }, []);
+    const setRequestState = (0, external_react_namespaceObject.useCallback)((requestId, requestState)=>{
+        requestStatesRef.current.set(requestId, requestState);
+        syncStateFromRequests();
+    }, [
+        syncStateFromRequests
+    ]);
+    const clearRequestState = (0, external_react_namespaceObject.useCallback)((requestId)=>{
+        requestStatesRef.current.delete(requestId);
+        syncStateFromRequests();
+    }, [
+        syncStateFromRequests
+    ]);
+    const submit = (0, external_react_namespaceObject.useCallback)(async (target, options)=>{
+        setError(void 0);
+        const requestId = ++requestIdRef.current;
+        const normalizedMethod = (options?.method || 'post').toLowerCase();
+        const isLoaderSubmit = 'get' === normalizedMethod;
+        setRequestState(requestId, isLoaderSubmit ? 'loading' : 'submitting');
+        try {
+            const result = await submitRouteAction({
+                router,
+                target,
+                options,
+                isFetcher: true,
+                onInvalidateStart: ()=>{
+                    if (!isLoaderSubmit) setRequestState(requestId, 'loading');
+                }
+            });
+            setData(result);
+        } catch (err) {
+            setError(err);
+            throw err;
+        } finally{
+            clearRequestState(requestId);
+        }
+    }, [
+        clearRequestState,
+        router,
+        setRequestState
+    ]);
+    const FetcherForm = (0, external_react_namespaceObject.useCallback)(({ action, method = 'get', encType, reloadDocument, onSubmit, ...rest })=>{
+        const handleSubmit = async (event)=>{
+            onSubmit?.(event);
+            if (event.defaultPrevented || reloadDocument) return;
+            event.preventDefault();
+            const submitter = getSubmitter(event);
+            const formData = createFormDataFromSubmit({
+                form: event.currentTarget,
+                submitter
+            });
+            const normalizedOptions = resolveSubmitOptionsFromForm({
+                form: event.currentTarget,
+                submitter,
+                action,
+                method,
+                encType
+            });
+            await submit(formData, normalizedOptions);
+        };
+        return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("form", {
+            ...rest,
+            action: action,
+            method: method,
+            encType: encType,
+            onSubmit: handleSubmit
+        });
+    }, [
+        submit
+    ]);
+    return {
+        state,
+        data,
+        error,
+        Form: FetcherForm,
+        submit
+    };
+}
+exports.Form = __webpack_exports__.Form;
+exports.RouteActionResponseError = __webpack_exports__.RouteActionResponseError;
+exports.useFetcher = __webpack_exports__.useFetcher;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "Form",
+    "RouteActionResponseError",
+    "useFetcher"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/router/runtime/tanstack/plugin.js

@@ -0,0 +1,239 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    tanstackRouterPlugin: ()=>tanstackRouterPlugin
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const merge_namespaceObject = require("@modern-js/runtime-utils/merge");
+const url_namespaceObject = require("@modern-js/runtime-utils/url");
+const react_router_namespaceObject = require("@tanstack/react-router");
+const client_namespaceObject = require("@tanstack/react-router/ssr/client");
+const external_react_namespaceObject = require("react");
+const index_js_namespaceObject = require("../../../core/context/index.js");
+const external_hooks_js_namespaceObject = require("../hooks.js");
+const external_lifecycle_js_namespaceObject = require("../lifecycle.js");
+const external_utils_js_namespaceObject = require("../utils.js");
+const external_basepathRewrite_js_namespaceObject = require("./basepathRewrite.js");
+const external_routeTree_js_namespaceObject = require("./routeTree.js");
+const client_js_namespaceObject = require("./rsc/client.js");
+const BLOCKING_SUBSCRIBE_SYMBOL = Symbol.for('@modern-js/plugin-runtime:tanstack-blocking-subscribe');
+const BLOCKING_STATE_SYMBOL = Symbol.for('@modern-js/plugin-runtime:tanstack-blocking-state');
+function normalizeBase(b) {
+    if (b.length > 1 && b.endsWith('/')) return b.slice(0, -1);
+    return b || '/';
+}
+function isSegmentPrefix(pathname, base) {
+    const b = normalizeBase(base);
+    const p = pathname || '/';
+    return p === b || p.startsWith(`${b}/`);
+}
+function wrapRouterSubscribeWithBlockState(router, getBlockNavState) {
+    if (!router || 'object' != typeof router) return;
+    const target = router;
+    target[BLOCKING_STATE_SYMBOL] = getBlockNavState;
+    if (target[BLOCKING_SUBSCRIBE_SYMBOL] || 'function' != typeof target.subscribe) return;
+    const originSubscribe = target.subscribe.bind(target);
+    target.subscribe = (eventType, listener)=>{
+        const wrappedListener = (...args)=>{
+            const blockRoute = target[BLOCKING_STATE_SYMBOL]?.() || false;
+            if (blockRoute) return;
+            return listener(...args);
+        };
+        return originSubscribe(eventType, wrappedListener);
+    };
+    target[BLOCKING_SUBSCRIBE_SYMBOL] = true;
+}
+function stripSyntheticNotFoundRoute(routes) {
+    return routes.filter((route)=>!('*' === route.path && !route.id && !route.loader)).map((route)=>{
+        if (!route.children?.length) return route;
+        return {
+            ...route,
+            children: stripSyntheticNotFoundRoute(route.children)
+        };
+    });
+}
+const tanstackRouterPlugin = (userConfig = {})=>({
+        name: '@modern-js/plugin-router-tanstack',
+        registryHooks: {
+            onAfterCreateRouter: external_hooks_js_namespaceObject.onAfterCreateRouter,
+            onAfterHydrateRouter: external_hooks_js_namespaceObject.onAfterHydrateRouter,
+            onBeforeCreateRouter: external_hooks_js_namespaceObject.onBeforeCreateRouter,
+            onBeforeHydrateRouter: external_hooks_js_namespaceObject.onBeforeHydrateRouter
+        },
+        setup: (api)=>{
+            api.onBeforeRender((context)=>{
+                const pluginConfig = api.getRuntimeConfig();
+                const mergedConfig = (0, merge_namespaceObject.merge)(pluginConfig.router || {}, userConfig);
+                if ("u" > typeof window && window._SSR_DATA && mergedConfig.unstable_reloadOnURLMismatch) {
+                    const { ssrContext } = context;
+                    const currentPathname = (0, url_namespaceObject.normalizePathname)(window.location.pathname);
+                    const initialPathname = ssrContext?.request?.pathname && (0, url_namespaceObject.normalizePathname)(ssrContext.request.pathname);
+                    if (initialPathname && initialPathname !== currentPathname) {
+                        const errorMsg = `The initial URL ${initialPathname} and the URL ${currentPathname} to be hydrated do not match, reload.`;
+                        console.error(errorMsg);
+                        window.location.reload();
+                    }
+                }
+                context.router = {
+                    useMatches: react_router_namespaceObject.useMatches,
+                    useLocation: react_router_namespaceObject.useLocation,
+                    useNavigate: react_router_namespaceObject.useNavigate,
+                    useRouter: react_router_namespaceObject.useRouter
+                };
+            });
+            api.wrapRoot((App)=>{
+                const mergedConfig = (0, merge_namespaceObject.merge)(api.getRuntimeConfig().router || {}, userConfig);
+                const { serverBase = [], supportHtml5History = true, basename = '', routesConfig, createRoutes } = mergedConfig;
+                const finalRouteConfig = {
+                    routes: (0, index_js_namespaceObject.getGlobalRoutes)(),
+                    globalApp: (0, index_js_namespaceObject.getGlobalLayoutApp)(),
+                    ...routesConfig
+                };
+                if (!finalRouteConfig.routes && !createRoutes) return App;
+                const hooks = api.getHooks();
+                let cachedRouteObjects;
+                const getRouteObjects = ()=>{
+                    if (void 0 !== cachedRouteObjects) return cachedRouteObjects;
+                    const routeObjects = createRoutes ? createRoutes() : (0, external_utils_js_namespaceObject.createRouteObjectsFromConfig)({
+                        routesConfig: finalRouteConfig
+                    }) || [];
+                    const normalizedRouteObjects = createRoutes ? routeObjects : stripSyntheticNotFoundRoute(routeObjects);
+                    cachedRouteObjects = hooks.modifyRoutes.call(normalizedRouteObjects);
+                    return cachedRouteObjects;
+                };
+                const selectBasePath = (pathname)=>{
+                    const match = serverBase.find((baseUrl)=>isSegmentPrefix(pathname, baseUrl));
+                    return match || '/';
+                };
+                let cachedRouteTree = null;
+                let cachedRouter = null;
+                let cachedRouterBasepath = null;
+                const RouterWrapper = ()=>{
+                    const runtimeContext = (0, external_react_namespaceObject.useContext)(index_js_namespaceObject.InternalRuntimeContext);
+                    const baseUrl = selectBasePath(location.pathname).replace(/^\/*/, '/');
+                    const _basename = '/' === baseUrl ? (0, external_utils_js_namespaceObject.urlJoin)(baseUrl, runtimeContext._internalRouterBaseName || basename || '') : baseUrl;
+                    const routeTree = (0, external_react_namespaceObject.useMemo)(()=>{
+                        if (cachedRouteTree) return cachedRouteTree;
+                        const routeObjects = getRouteObjects();
+                        if (!routeObjects.length) return null;
+                        cachedRouteTree = (0, external_routeTree_js_namespaceObject.createRouteTreeFromRouteObjects)(routeObjects);
+                        return cachedRouteTree;
+                    }, []);
+                    if (!routeTree) return App ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(App, {}) : null;
+                    const router = (0, external_react_namespaceObject.useMemo)(()=>{
+                        const lifecycleContext = {
+                            framework: 'tanstack',
+                            phase: 'client-create',
+                            routes: getRouteObjects(),
+                            runtimeContext,
+                            basename: _basename
+                        };
+                        hooks.onBeforeCreateRouter.call(lifecycleContext);
+                        if (cachedRouter && cachedRouterBasepath === _basename) {
+                            wrapRouterSubscribeWithBlockState(cachedRouter, runtimeContext.unstable_getBlockNavState);
+                            hooks.onAfterCreateRouter.call({
+                                ...lifecycleContext,
+                                router: cachedRouter,
+                                runtimeContext
+                            });
+                            return cachedRouter;
+                        }
+                        const history = supportHtml5History ? (0, react_router_namespaceObject.createBrowserHistory)() : (0, react_router_namespaceObject.createHashHistory)();
+                        const rewrite = (0, external_basepathRewrite_js_namespaceObject.createModernBasepathRewrite)(_basename);
+                        const serializationAdapters = (0, index_js_namespaceObject.getGlobalEnableRsc)() ? (0, client_js_namespaceObject.getTanstackRscSerializationAdapters)() : void 0;
+                        cachedRouter = (0, react_router_namespaceObject.createRouter)({
+                            routeTree,
+                            basepath: '/',
+                            rewrite,
+                            history,
+                            context: {},
+                            ...serializationAdapters ? {
+                                serializationAdapters
+                            } : {}
+                        });
+                        cachedRouterBasepath = _basename;
+                        wrapRouterSubscribeWithBlockState(cachedRouter, runtimeContext.unstable_getBlockNavState);
+                        hooks.onAfterCreateRouter.call({
+                            ...lifecycleContext,
+                            router: cachedRouter,
+                            runtimeContext
+                        });
+                        return cachedRouter;
+                    }, [
+                        _basename,
+                        routeTree,
+                        supportHtml5History,
+                        runtimeContext
+                    ]);
+                    const runtimeState = (0, external_lifecycle_js_namespaceObject.applyRouterRuntimeState)(runtimeContext, {
+                        framework: 'tanstack',
+                        basename: _basename,
+                        instance: router
+                    });
+                    const lifecycleContext = {
+                        framework: 'tanstack',
+                        phase: 'client-create',
+                        routes: getRouteObjects(),
+                        runtimeContext: runtimeState,
+                        basename: _basename,
+                        router
+                    };
+                    const hasSSRBootstrap = "u" > typeof window && Boolean(window.$_TSR);
+                    if (hasSSRBootstrap) hooks.onBeforeHydrateRouter.call({
+                        ...lifecycleContext,
+                        phase: 'hydrate',
+                        router,
+                        runtimeContext: runtimeState
+                    });
+                    const RouterContent = hasSSRBootstrap ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_namespaceObject.Suspense, {
+                        fallback: null,
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(client_namespaceObject.RouterClient, {
+                            router: router
+                        })
+                    }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_router_namespaceObject.RouterProvider, {
+                        router: router
+                    });
+                    if (hasSSRBootstrap) hooks.onAfterHydrateRouter.call({
+                        ...lifecycleContext,
+                        phase: 'hydrate',
+                        router,
+                        runtimeContext: runtimeState
+                    });
+                    return App ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(App, {
+                        children: RouterContent
+                    }) : RouterContent;
+                };
+                return RouterWrapper;
+            });
+        }
+    });
+exports.tanstackRouterPlugin = __webpack_exports__.tanstackRouterPlugin;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "tanstackRouterPlugin"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});