@storybook/tanstack-react 10.5.6 → 10.5.8

package/dist/_browser-chunks/{chunk-6UULZFFJ.js → chunk-TR4QWDPU.js}

@@ -9,6 +9,7 @@ import {
 var preview_exports = {};
 __export(preview_exports, {
   applyDecorators: () => applyDecorators,
+  beforeEach: () => beforeEach,
   loaders: () => loaders,
   optimizeDeps: () => optimizeDeps,
   parameters: () => parameters
@@ -16,16 +17,16 @@ __export(preview_exports, {
 import { applyDecorators as reactApplyDecorators } from "@storybook/react/entry-preview-docs";
 
 // src/routing/decorator.tsx
-import React from "react";
 import {
   createMemoryHistory,
   createRootRoute,
   createRoute as createRoute2,
   createRouter,
-  RouterProvider,
+  defaultStringifySearch,
   interpolatePath,
-  defaultStringifySearch
+  RouterProvider
 } from "@tanstack/react-router";
+import React from "react";
 
 // src/routing/duplicate-tree.ts
 import {
@@ -133,17 +134,15 @@ var StoryContext = React.createContext({ Story: () => null }), StoryFromContext
   return React.createElement(Story, null);
 }, tanstackRouteDecorator = (Story, context) => React.createElement(TanStackRouterStory, { Story, context });
 function TanStackRouterStory({ Story, context }) {
-  let routerContext = context.parameters.tanstack?.router?.useRouterContext?.({
+  let router = context.tanstackRouter, routerContext = context.parameters.tanstack?.router?.useRouterContext?.({
     storyContext: context
-  }), router = React.useMemo(
-    () => createStoryRouter({ Story: StoryFromContext, context, routerContext }),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [context.id]
-  ), providerContext = React.useMemo(
-    () => ({
-      ...context.parameters.tanstack?.router?.context,
-      ...routerContext
-    }),
+  });
+  if (!router)
+    throw new Error(
+      "No story router found on the story context: the `routerBeforeEach` hook of @storybook/tanstack-react did not run before rendering. Note that portable stories are not supported by this framework."
+    );
+  let providerContext = React.useMemo(
+    () => routerContext,
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [context.id, routerContext]
   );
@@ -242,6 +241,30 @@ function resolveTree(Story, context) {
   };
 }
 
+// src/routing/before-each.ts
+var storyRouters = /* @__PURE__ */ new Map(), routerBeforeEach = async (context) => {
+  let cached = storyRouters.get(context.id);
+  if (cached) {
+    context.tanstackRouter = cached;
+    return;
+  }
+  let storyContext = context, parameterContext = (context.parameters.tanstack?.router ?? {}).context, routerContext = typeof parameterContext == "function" ? parameterContext({ storyContext }) : parameterContext, router = createStoryRouter({
+    Story: StoryFromContext,
+    context: storyContext,
+    routerContext
+  }), load = router.load();
+  if (context.abortSignal && !context.abortSignal.aborted ? (load.catch(() => {
+  }), await Promise.race([
+    load,
+    new Promise(
+      (resolve) => context.abortSignal.addEventListener("abort", () => resolve(), { once: !0 })
+    )
+  ])) : await load, !context.abortSignal?.aborted)
+    return storyRouters.set(context.id, router), context.tanstackRouter = router, () => {
+      storyRouters.delete(context.id);
+    };
+};
+
 // src/routing/loader.ts
 import { RootRoute as RootRoute3 } from "@tanstack/react-router";
 function getComponentFromRoute(route) {
@@ -262,7 +285,7 @@ var routeComponentLoader = (context) => {
 };
 
 // src/preview.tsx
-var loaders = [routeComponentLoader], applyDecorators = (storyFn, allDecorators) => (
+var loaders = [routeComponentLoader], beforeEach = [routerBeforeEach], applyDecorators = (storyFn, allDecorators) => (
   // reorder decorators so `jsxDecorator` is innermost, and `tanstackRouteDecorator` is just outside it
   // There is an issue if `tanstackRouteDecorator` is innermost. All stories crashes due to a bug with the jsxDecorator.
   reactApplyDecorators(storyFn, [
@@ -279,6 +302,7 @@ var loaders = [routeComponentLoader], applyDecorators = (storyFn, allDecorators)
 
 export {
   loaders,
+  beforeEach,
   applyDecorators,
   parameters,
   optimizeDeps,

package/dist/chunk-B0pqNVvJ.d.ts

@@ -0,0 +1,135 @@
+import { ComponentType } from "react";
+import { CompatibleString } from "storybook/internal/types";
+import { AnyRoute, FileRoutesByPath, Register } from "@tanstack/react-router";
+import { Decorator } from "@storybook/react";
+import { AnyContext, ResolveParams, RouteOptions, RoutesByPath } from "@tanstack/router-core";
+import { BuilderOptions } from "@storybook/builder-vite";
+import { StorybookConfig } from "@storybook/react-vite";
+
+//#region code/frameworks/tanstack-react/.dts-emit/code/frameworks/tanstack-react/src/routing/types.d.ts
+/** Union of every registered full path (e.g. `'/' | '/admin/users' | '/$libraryId/$version'`). */
+type RegisteredFullPath = keyof Register['router']['routesByPath'];
+type IsAppRouteTree<TRoute> = TRoute extends Register['router']['routeTree'] ? true : false;
+type IsRoute<T> = T extends AnyRoute ? true : T extends FileRoutesByPath[keyof FileRoutesByPath] ? true : false;
+type ExtractAllPathsFromFileRoutes<TRoute extends FileRoutesByPath[keyof FileRoutesByPath]['preLoaderRoute'] | AnyRoute> = TRoute['path'];
+type StoryRoutePath<TRoute = undefined> = TRoute extends FileRoutesByPath[keyof FileRoutesByPath] ? ExtractAllPathsFromFileRoutes<TRoute> : keyof FileRoutesByPath | `/${string}`;
+type StoryRouteSearch<TRoute> = IsAppRouteTree<TRoute> extends true ? Record<string, unknown> : TRoute extends FileRoutesByPath[keyof FileRoutesByPath] ? TRoute['preLoaderRoute'] extends {
+  types: {
+    allSearch: infer A;
+  };
+} ? A : never : Record<string, unknown>;
+type StoryRouteFileOptions<TRoute = undefined> = IsRoute<TRoute> extends true ? TRoute extends {
+  options: infer O;
+} ? Pick<O, Extract<keyof O, 'loader' | 'beforeLoad' | 'validateSearch' | 'loaderDeps' | 'context' | 'params' | 'head' | 'search' | 'parseParams' | 'context'>> : Pick<RouteOptions<unknown>, 'loader' | 'beforeLoad' | 'validateSearch' | 'loaderDeps' | 'context' | 'params' | 'head' | 'search' | 'parseParams' | 'context'> : Pick<RouteOptions<unknown>, 'loader' | 'beforeLoad' | 'validateSearch' | 'loaderDeps' | 'context' | 'params' | 'head' | 'search' | 'parseParams' | 'context'>;
+type CreateStoryRouteOptions<TRoute = undefined> = StoryRouteFileOptions<TRoute> & {
+  path?: StoryRoutePath<TRoute>;
+};
+type StoryRouteOptions<TRoute = undefined> = CreateStoryRouteOptions<TRoute> | (TRoute extends AnyRoute ? TRoute : AnyRoute);
+/**
+ * Per-route override options for use inside `RouteTreeOverrides`.
+ * Users can override `loader`, `beforeLoad`, etc. for a specific route.
+ */
+interface RouteOverrideOptions<TRoute extends FileRoutesByPath[keyof FileRoutesByPath]['preLoaderRoute'] | undefined = undefined> {
+  /** Override the route's component. */
+  component?: TRoute extends FileRoutesByPath[keyof FileRoutesByPath]['preLoaderRoute'] ? TRoute['options']['component'] | ComponentType : ComponentType;
+  /** Override the route's loader function. */
+  loader?: TRoute extends FileRoutesByPath[keyof FileRoutesByPath]['preLoaderRoute'] ? TRoute['options']['loader'] | ((ctx: unknown) => Promise<unknown> | unknown) : (ctx: unknown) => Promise<unknown> | unknown;
+  /** Override the route's beforeLoad function. */
+  beforeLoad?: TRoute extends FileRoutesByPath[keyof FileRoutesByPath]['preLoaderRoute'] ? TRoute['options']['beforeLoad'] | ((ctx: unknown) => Promise<void> | void) : (ctx: unknown) => Promise<void> | void;
+  /** Override the route's search params validation. */
+  validateSearch?: TRoute extends FileRoutesByPath[keyof FileRoutesByPath]['preLoaderRoute'] ? TRoute['options']['validateSearch'] | ((search: unknown) => Promise<void> | void) : (search: unknown) => Promise<void> | void;
+  /** Override the route's loader dependencies. */
+  loaderDeps?: TRoute extends FileRoutesByPath[keyof FileRoutesByPath]['preLoaderRoute'] ? TRoute['options']['loaderDeps'] | string[] : string[];
+  /** Override the route's context function. */
+  context?: TRoute extends FileRoutesByPath[keyof FileRoutesByPath]['preLoaderRoute'] ? TRoute['options']['context'] | ((ctx: unknown) => Promise<unknown> | unknown) : (ctx: unknown) => Promise<unknown> | unknown;
+}
+/**
+ * A map of route overrides keyed by route ID.
+ * Each entry can override `loader`, `beforeLoad`, etc. for that route.
+ *
+ * @example
+ * ```ts
+ * routeOverrides: {
+ *   '/_authed': { beforeLoad: () => {} },
+ *   '/demo/form/simple/$id': {
+ *     loader: async () => ({ name: 'Mock User' }),
+ *   },
+ * }
+ * ```
+ */
+type RouteTreeOverrides = Partial<{ [routePath in keyof FileRoutesByPath]: RouteOverrideOptions<FileRoutesByPath[routePath]['preLoaderRoute']> | undefined }>;
+interface RouterParameters<TRoute = undefined, Path extends (TRoute extends AnyRoute ? keyof RoutesByPath<TRoute> : RegisteredFullPath) = (TRoute extends AnyRoute ? keyof RoutesByPath<TRoute> : keyof FileRoutesByPath)> {
+  route?: StoryRouteOptions<TRoute>;
+  /**
+   * Path to resolve the story route against.
+   * Constrained to known registered paths in route tree mode, but can be any string in app route mode (since the user may be passing a custom `route` that doesn't exist in the registered tree).
+   */
+  path?: Path;
+  /** URL params to interpolate into the path (e.g. `{ id: '42' }` for `/$id`). */
+  params?: ResolveParams<Path>;
+  /** Search/query params to append to the URL (e.g. `{ tab: 'details' }`). */
+  query?: Partial<StoryRouteSearch<TRoute>>;
+  /**
+   * Override options for specific routes in the app route tree (route tree mode only).
+   *
+   * Each key is a route ID (e.g. `'/about'`, `'__root__'`, `'/demo/form/simple/$id'`).
+   * Values can override `loader`, `beforeLoad`, etc. for that route.
+   *
+   * @example
+   * ```ts
+   * routeOverrides: {
+   *   '/_authed': { beforeLoad: () => {} },
+   *   '/demo/form/simple/$id': {
+   *     loader: async () => ({ name: 'Mock User' }),
+   *   },
+   * }
+   * ```
+   */
+  routeOverrides?: RouteTreeOverrides;
+  /** Object or factory; the factory runs before initial router load outside React, so loader and beforeLoad can read its values. */
+  context?: Record<string, unknown> | ((options: {
+    storyContext: Parameters<Decorator>[1];
+  }) => Record<string, unknown>);
+  /** React hook render context reaches components, not the initial loader or beforeLoad; use the context factory for loader-visible values. */
+  useRouterContext?: ({
+    storyContext
+  }: {
+    storyContext: Parameters<Decorator>[1];
+  }) => AnyContext;
+}
+//#endregion
+//#region code/frameworks/tanstack-react/.dts-emit/code/frameworks/tanstack-react/src/types.d.ts
+type FrameworkName = CompatibleString<'@storybook/tanstack-react'>;
+type BuilderName = CompatibleString<'@storybook/builder-vite'>;
+type FrameworkOptions = {
+  /** Builder options passed through to @storybook/builder-vite. */builder?: BuilderOptions;
+};
+type StorybookConfigFramework = {
+  framework: FrameworkName | {
+    name: FrameworkName;
+    options: FrameworkOptions;
+  };
+  core?: StorybookConfig['core'] & {
+    builder?: BuilderName | {
+      name: BuilderName;
+      options: BuilderOptions;
+    };
+  };
+};
+/** The interface for Storybook configuration in `main.ts` files. */
+type StorybookConfig$1 = Omit<StorybookConfig, keyof StorybookConfigFramework> & StorybookConfigFramework;
+/** Path constraint mirroring `RouterParameters`'s second generic. */
+type DefaultStoryPath<TRoute> = TRoute extends AnyRoute ? keyof RoutesByPath<TRoute> : RegisteredFullPath;
+interface TanStackPreviewOptions<TRoute = undefined, Path extends DefaultStoryPath<TRoute> = DefaultStoryPath<TRoute>> {
+  /** Router configuration for stories */
+  router?: RouterParameters<TRoute, Path>;
+}
+interface TanStackParameters<TRoute = undefined, Path extends DefaultStoryPath<TRoute> = DefaultStoryPath<TRoute>> {
+  /** TanStack framework configuration (router integration). */
+  tanstack?: TanStackPreviewOptions<TRoute, Path>;
+}
+interface TanStackTypes<TRoute = undefined, Path extends DefaultStoryPath<TRoute> = DefaultStoryPath<TRoute>> {
+  parameters: TanStackParameters<TRoute, Path>;
+}
+//#endregion
+export { TanStackPreviewOptions as a, IsRoute as c, StoryRouteOptions as d, TanStackParameters as i, RouterParameters as l, FrameworkOptions as n, TanStackTypes as o, StorybookConfig$1 as r, CreateStoryRouteOptions as s, DefaultStoryPath as t, StoryRouteFileOptions as u };