vite-plugin-storybook-nextjs 0.0.1--canary.1.c7603ba.0

package/dist/index.js

@@ -0,0 +1,945 @@
+import path, { resolve, join } from 'node:path';
+import { getDefineEnv } from 'next/dist/build/webpack/plugins/define-env-plugin';
+import { loadEnvConfig } from '@next/env';
+import Log from 'next/dist/build/output/log';
+import { transform, loadBindings, lockfilePatchPromise } from 'next/dist/build/swc';
+import loadConfig from 'next/dist/server/config';
+import { PHASE_TEST, CONFIG_FILES } from 'next/dist/shared/lib/constants';
+import fs from 'node:fs/promises';
+import { fetchCSSFromGoogleFonts } from 'next/dist/compiled/@next/font/dist/google/fetch-css-from-google-fonts';
+import { getFontAxes } from 'next/dist/compiled/@next/font/dist/google/get-font-axes';
+import { getGoogleFontsUrl } from 'next/dist/compiled/@next/font/dist/google/get-google-fonts-url';
+import { validateGoogleFontFunctionCall } from 'next/dist/compiled/@next/font/dist/google/validate-google-font-function-call';
+import loaderUtils from 'next/dist/compiled/loader-utils3';
+import { validateLocalFontFunctionCall } from 'next/dist/compiled/@next/font/dist/local/validate-local-font-function-call';
+import dedent3, { dedent } from 'ts-dedent';
+import loadJsConfig from 'next/dist/build/load-jsconfig';
+import { findPagesDir } from 'next/dist/lib/find-pages-dir';
+import { getSupportedBrowsers } from 'next/dist/build/utils';
+import { getParserOptions } from 'next/dist/build/swc/options';
+import fs2 from 'node:fs';
+import { cpus } from 'node:os';
+import { fileURLToPath, URL } from 'node:url';
+import imageSizeOf from 'image-size';
+
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined") return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+var nextDistPath = /(next[\\/]dist[\\/]shared[\\/]lib)|(next[\\/]dist[\\/]client)|(next[\\/]dist[\\/]pages)/;
+async function getConfig(dir) {
+  const conf = await loadConfig(PHASE_TEST, dir);
+  return conf;
+}
+async function getConfigPaths(dir) {
+  return CONFIG_FILES.map((file) => join(dir, file));
+}
+async function loadEnvironmentConfig(dir) {
+  const dev = false;
+  return loadEnvConfig(dir, dev, Log);
+}
+async function loadSWCBindingsEagerly(nextConfig) {
+  await loadBindings(nextConfig?.experimental?.useWasmBinary);
+  if (lockfilePatchPromise.cur) {
+    await lockfilePatchPromise.cur;
+  }
+}
+function shouldOutputCommonJs(filename) {
+  return filename.endsWith(".cjs") || nextDistPath.test(filename);
+}
+
+// src/plugins/next-env/plugin.ts
+function vitePluginNextConfig(rootDir) {
+  let nextConfig;
+  let envConfig;
+  let isDev;
+  const resolvedDir = resolve(rootDir);
+  return {
+    name: "vite-plugin-storybook-nextjs-swc",
+    async config(config, env) {
+      nextConfig = await getConfig(resolvedDir);
+      envConfig = (await loadEnvironmentConfig(resolvedDir)).combinedEnv;
+      isDev = env.mode === "development";
+      const publicNextEnvMap = Object.fromEntries(
+        Object.entries(envConfig).filter(([key]) => key.startsWith("NEXT_PUBLIC_")).map(([key, value]) => {
+          return [`process.env.${key}`, JSON.stringify(value)];
+        })
+      );
+      return {
+        ...config,
+        define: {
+          ...config.define,
+          ...publicNextEnvMap,
+          ...getDefineEnv({
+            isTurbopack: false,
+            config: nextConfig,
+            isClient: true,
+            isEdgeServer: false,
+            isNodeOrEdgeCompilation: false,
+            isNodeServer: false,
+            clientRouterFilters: void 0,
+            dev: isDev,
+            middlewareMatchers: void 0,
+            hasRewrites: false,
+            distDir: nextConfig.distDir,
+            fetchCacheKeyPrefix: nextConfig?.experimental?.fetchCacheKeyPrefix
+          })
+        }
+      };
+    }
+  };
+}
+var cssCache = /* @__PURE__ */ new Map();
+async function getFontFaceDeclarations(options) {
+  const {
+    fontFamily,
+    weights,
+    styles,
+    selectedVariableAxes,
+    display,
+    variable
+  } = validateGoogleFontFunctionCall(options.fontFamily, options.props);
+  const fontAxes = getFontAxes(
+    fontFamily,
+    weights,
+    styles,
+    selectedVariableAxes
+  );
+  const url = getGoogleFontsUrl(fontFamily, fontAxes, display);
+  try {
+    const hasCachedCSS = cssCache.has(url);
+    const fontFaceCSS = hasCachedCSS ? cssCache.get(url) : await fetchCSSFromGoogleFonts(url, fontFamily, true).catch(() => null);
+    if (!hasCachedCSS) {
+      cssCache.set(url, fontFaceCSS);
+    } else {
+      cssCache.delete(url);
+    }
+    if (fontFaceCSS === null) {
+      throw new Error(
+        `Failed to fetch \`${fontFamily}\` from Google Fonts with URL: \`${url}\``
+      );
+    }
+    return {
+      id: loaderUtils.getHashDigest(url, "md5", "hex", 6),
+      fontFamily,
+      fontFaceCSS,
+      weights,
+      styles,
+      variable
+    };
+  } catch (error) {
+    throw new Error(
+      `Failed to fetch \`${fontFamily}\` from Google Fonts with URL: \`${url}\``
+    );
+  }
+}
+var getPlaceholderFontUrl = (refId) => `__%%import.meta.ROLLUP_FILE_URL_${refId}%%__`;
+getPlaceholderFontUrl.regexp = /__%%import\.meta\.ROLLUP_FILE_URL_(.*?)%%__/g;
+async function getFontFaceDeclarations2(options) {
+  const localFontSrc = options.props.metaSrc;
+  const {
+    weight,
+    style,
+    variable,
+    declarations = []
+  } = validateLocalFontFunctionCall("", options.props);
+  const id = `font-${loaderUtils.getHashDigest(
+    Buffer.from(JSON.stringify(localFontSrc)),
+    "md5",
+    "hex",
+    6
+  )}`;
+  const fontDeclarations = declarations.map(
+    ({ prop, value }) => `${prop}: ${value};`
+  ).join("\n");
+  const getFontFaceCSS = () => {
+    if (localFontSrc) {
+      if ("fontReferenceId" in localFontSrc) {
+        return dedent`@font-face {
+					font-family: ${id};
+					src: url(${localFontSrc.fontReferenceId ? getPlaceholderFontUrl(localFontSrc.fontReferenceId) : `.${localFontSrc.fontPath}`})
+					${fontDeclarations}
+				}`;
+      }
+      return localFontSrc.map((font) => {
+        return dedent`@font-face {
+						font-family: ${id};
+						src: url(${font.path.fontReferenceId ? getPlaceholderFontUrl(font.path.fontReferenceId) : `.${font.path.fontPath}`});
+						${font.weight ? `font-weight: ${font.weight};` : ""}
+						${font.style ? `font-style: ${font.style};` : ""}
+						${fontDeclarations}
+					}`;
+      }).join("");
+    }
+    return "";
+  };
+  return {
+    id,
+    fontFamily: id,
+    fontFaceCSS: getFontFaceCSS(),
+    weights: weight ? [weight] : [],
+    styles: style ? [style] : [],
+    variable
+  };
+}
+
+// src/plugins/next-font/utils/get-css-meta.ts
+function getCSSMeta(options) {
+  const className = getClassName(options);
+  const style = getStylesObj(options);
+  const variableClassName = `__variable_${className}`;
+  const classNamesCSS = `
+    .${className} {
+      font-family: ${options.fontFamily};
+      ${isNextCSSPropertyValid(options.styles) ? `font-style: ${options.styles[0]};` : ""}
+      ${isNextCSSPropertyValid(options.weights) ? `font-weight: ${options.weights[0]};` : ""}
+    }
+
+    ${options.variable ? `.${variableClassName} { ${options.variable}: '${options.fontFamily}'; }` : ""}
+  `;
+  const fontFaceCSS = `${changeFontDisplayToSwap(options.fontFaceCSS)}`;
+  return {
+    className,
+    fontFaceCSS,
+    classNamesCSS,
+    style,
+    ...options.variable ? { variableClassName } : {}
+  };
+}
+function getClassName({ styles, weights, fontFamily }) {
+  const font = fontFamily.replaceAll(" ", "-").toLowerCase();
+  const style = isNextCSSPropertyValid(styles) ? styles[0] : null;
+  const weight = isNextCSSPropertyValid(weights) ? weights[0] : null;
+  return `${font}${style ? `-${style}` : ""}${weight ? `-${weight}` : ""}`;
+}
+function getStylesObj({ styles, weights, fontFamily }) {
+  return {
+    fontFamily,
+    ...isNextCSSPropertyValid(styles) ? { fontStyle: styles[0] } : {},
+    ...isNextCSSPropertyValid(weights) ? { fontWeight: weights[0] } : {}
+  };
+}
+function isNextCSSPropertyValid(prop) {
+  return prop.length === 1 && prop[0] !== "variable";
+}
+function changeFontDisplayToSwap(css) {
+  return css.replaceAll("font-display: optional;", "font-display: block;");
+}
+function setFontDeclarationsInHead({
+  id,
+  fontFaceCSS,
+  classNamesCSS
+}) {
+  const regex = new RegExp(getPlaceholderFontUrl.regexp);
+  const fontPaths = fontFaceCSS.matchAll(regex);
+  const fontPathsImportUrls = [];
+  if (fontPaths) {
+    for (const match of fontFaceCSS.matchAll(regex)) {
+      fontPathsImportUrls.push({
+        id: match[1],
+        path: match[0].replaceAll(/__%%|%%__/g, "")
+      });
+    }
+  }
+  return dedent3`
+  const fontPaths = [${fontPathsImportUrls.map((fontPath) => `{id: '${fontPath.id}', path: ${fontPath.path}}`).join(", ")}];
+  if (!document.getElementById('id-${id}')) {
+    let fontDeclarations = \`${fontFaceCSS}\`;
+    fontPaths.forEach((fontPath, i) => {
+      fontDeclarations = fontDeclarations.replace('__%%import.meta.ROLLUP_FILE_URL_' + fontPath.id + '%%__', fontPath.path.toString());
+    });
+    const style = document.createElement('style');
+    style.setAttribute('id', 'font-face-${id}');
+    style.innerHTML = fontDeclarations;
+    document.head.appendChild(style);
+
+    const classNamesCSS = \`${classNamesCSS}\`;
+    const classNamesStyle = document.createElement('style');
+    classNamesStyle.setAttribute('id', 'classnames-${id}');
+    classNamesStyle.innerHTML = classNamesCSS;
+    document.head.appendChild(classNamesStyle);
+  }
+`;
+}
+
+// src/plugins/next-font/plugin.ts
+var includePattern = /next(\\|\/|\\\\).*(\\|\/|\\\\)target\.css.*$/;
+var virtualModuleId = "virtual:next-font";
+function configureNextFont() {
+  let devMode = true;
+  const fontAssetPaths = /* @__PURE__ */ new Map();
+  return {
+    name: "configure-next-font",
+    async config(config, env) {
+      devMode = env.mode === "development";
+      return config;
+    },
+    configureServer(server) {
+      server.middlewares.use(async (req, res, next) => {
+        if (req.url && fontAssetPaths.has(req.url)) {
+          const fontAbsoluteAssetPath = fontAssetPaths.get(req.url);
+          const fontFileExtension = path.extname(fontAbsoluteAssetPath);
+          try {
+            const fontData = await fs.readFile(fontAbsoluteAssetPath);
+            switch (fontFileExtension) {
+              case ".woff":
+                res.setHeader("Content-Type", "font/woff");
+                break;
+              case ".woff2":
+                res.setHeader("Content-Type", "font/woff2");
+                break;
+              case ".ttf":
+                res.setHeader("Content-Type", "font/ttf");
+                break;
+              case ".otf":
+                res.setHeader("Content-Type", "font/otf");
+                break;
+              default:
+                res.setHeader("Content-Type", "font");
+            }
+            res.end(fontData);
+          } catch (e) {
+            console.error(
+              `Could not read font file ${fontAbsoluteAssetPath}:`,
+              e
+            );
+            res.statusCode = 404;
+            res.end();
+          }
+        } else {
+          next();
+        }
+      });
+    },
+    async resolveId(source, importer) {
+      if (!includePattern.test(source) || !importer) {
+        return null;
+      }
+      const [sourceWithoutQuery, rawQuery] = source.split("?");
+      const queryParams = JSON.parse(rawQuery);
+      const fontOptions = {
+        filename: queryParams.path ?? "",
+        fontFamily: queryParams.import ?? "",
+        props: queryParams.arguments?.[0] ?? {},
+        source: importer
+      };
+      if (fontOptions.source.endsWith("html")) {
+        return null;
+      }
+      let fontFaceDeclaration;
+      const pathSep = path.sep;
+      if (sourceWithoutQuery.endsWith(
+        ["next", "font", "google", "target.css"].join(pathSep)
+      )) {
+        fontFaceDeclaration = await getFontFaceDeclarations(fontOptions);
+      }
+      if (sourceWithoutQuery.endsWith(
+        ["next", "font", "local", "target.css"].join(pathSep)
+      )) {
+        const importerDirPath = path.dirname(fontOptions.filename);
+        const emitFont = async (importerRelativeFontPath) => {
+          const fontExtension = path.extname(importerRelativeFontPath);
+          const fontBaseName = path.basename(
+            importerRelativeFontPath,
+            fontExtension
+          );
+          const fontPath = path.join(importerDirPath, importerRelativeFontPath);
+          if (devMode) {
+            fontAssetPaths.set(importerRelativeFontPath, fontPath);
+            return {
+              fontPath: importerRelativeFontPath,
+              fontReferenceId: void 0
+            };
+          }
+          try {
+            const fontData = await fs.readFile(fontPath);
+            const fontReferenceId = this.emitFile({
+              name: `${fontBaseName}${fontExtension}`,
+              type: "asset",
+              source: fontData
+            });
+            return { fontReferenceId, fontPath };
+          } catch (err) {
+            console.error(`Could not read font file ${fontPath}:`, err);
+            return void 0;
+          }
+        };
+        const loaderOptions = {
+          ...fontOptions
+        };
+        if (loaderOptions) {
+          if (typeof fontOptions.props.src === "string") {
+            const font = await emitFont(fontOptions.props.src);
+            loaderOptions.props.metaSrc = font;
+          } else {
+            loaderOptions.props.metaSrc = (await Promise.all(
+              (fontOptions.props.src ?? []).map(async (fontSrc) => {
+                const font = await emitFont(fontSrc.path);
+                if (!font) {
+                  return void 0;
+                }
+                return {
+                  ...fontSrc,
+                  path: font
+                };
+              })
+            )).filter((font) => font !== void 0);
+          }
+        }
+        fontFaceDeclaration = await getFontFaceDeclarations2(loaderOptions);
+      }
+      return {
+        id: `${virtualModuleId}?${rawQuery}`,
+        meta: {
+          fontFaceDeclaration
+        }
+      };
+    },
+    load(id) {
+      const [source] = id.split("?");
+      if (source !== virtualModuleId) {
+        return void 0;
+      }
+      const moduleInfo = this.getModuleInfo(id);
+      const fontFaceDeclaration = moduleInfo?.meta?.fontFaceDeclaration;
+      if (typeof fontFaceDeclaration !== "undefined") {
+        const cssMeta = getCSSMeta(fontFaceDeclaration);
+        return `
+				${setFontDeclarationsInHead({
+          fontFaceCSS: cssMeta.fontFaceCSS,
+          id: fontFaceDeclaration.id,
+          classNamesCSS: cssMeta.classNamesCSS
+        })}
+			
+				export default {
+				  className: "${cssMeta.className}", 
+				  style: ${JSON.stringify(cssMeta.style)}
+				  ${cssMeta.variableClassName ? `, variable: "${cssMeta.variableClassName}"` : ""}
+				}
+				`;
+      }
+      return "export default {}";
+    }
+  };
+}
+
+// src/utils/swc/styles.ts
+function getStyledComponentsOptions(styledComponentsConfig, development) {
+  if (!styledComponentsConfig) {
+    return null;
+  }
+  if (typeof styledComponentsConfig === "object") {
+    return {
+      ...styledComponentsConfig,
+      displayName: styledComponentsConfig.displayName ?? Boolean(development)
+    };
+  }
+  return {
+    displayName: Boolean(development)
+  };
+}
+function getEmotionOptions(emotionConfig, development) {
+  if (!emotionConfig) {
+    return null;
+  }
+  let autoLabel = !!development;
+  switch (typeof emotionConfig === "object" && emotionConfig.autoLabel) {
+    case "never":
+      autoLabel = false;
+      break;
+    case "always":
+      autoLabel = true;
+      break;
+  }
+  return {
+    enabled: true,
+    autoLabel,
+    sourcemap: development,
+    ...typeof emotionConfig === "object" && {
+      importMap: emotionConfig.importMap,
+      labelFormat: emotionConfig.labelFormat,
+      sourcemap: development && emotionConfig.sourceMap
+    }
+  };
+}
+
+// src/utils/swc/options.ts
+var regeneratorRuntimePath = __require.resolve(
+  "next/dist/compiled/regenerator-runtime"
+);
+function getBaseSWCOptions({
+  filename,
+  development,
+  hasReactRefresh,
+  globalWindow,
+  esm,
+  modularizeImports,
+  swcPlugins,
+  compilerOptions,
+  resolvedBaseUrl,
+  jsConfig,
+  swcCacheDir
+}) {
+  const parserConfig = getParserOptions({ filename, jsConfig });
+  const paths = jsConfig?.compilerOptions?.paths;
+  const enableDecorators = Boolean(
+    jsConfig?.compilerOptions?.experimentalDecorators
+  );
+  const emitDecoratorMetadata = Boolean(
+    jsConfig?.compilerOptions?.emitDecoratorMetadata
+  );
+  const useDefineForClassFields = Boolean(
+    jsConfig?.compilerOptions?.useDefineForClassFields
+  );
+  const plugins = (swcPlugins ?? []).filter(Array.isArray).map(([name, options]) => [__require.resolve(name), options]);
+  return {
+    jsc: {
+      ...resolvedBaseUrl && paths ? {
+        baseUrl: resolvedBaseUrl.baseUrl,
+        paths
+      } : {},
+      externalHelpers: false,
+      parser: parserConfig,
+      experimental: {
+        keepImportAttributes: true,
+        emitAssertForImportAttributes: true,
+        plugins,
+        cacheRoot: swcCacheDir
+      },
+      transform: {
+        legacyDecorator: enableDecorators,
+        decoratorMetadata: emitDecoratorMetadata,
+        useDefineForClassFields,
+        react: {
+          importSource: jsConfig?.compilerOptions?.jsxImportSource ?? (compilerOptions?.emotion ? "@emotion/react" : "react"),
+          runtime: "automatic",
+          pragmaFrag: "React.Fragment",
+          throwIfNamespace: true,
+          development: !!development,
+          useBuiltins: true,
+          refresh: !!hasReactRefresh
+        },
+        optimizer: {
+          simplify: false,
+          // TODO: Figuring out for what globals are exactly used for
+          globals: {
+            typeofs: {
+              window: globalWindow ? "object" : "undefined"
+            },
+            envs: {
+              NODE_ENV: development ? '"development"' : '"production"'
+            }
+          }
+        },
+        regenerator: {
+          importPath: regeneratorRuntimePath
+        }
+      }
+    },
+    sourceMaps: "inline",
+    removeConsole: compilerOptions?.removeConsole,
+    reactRemoveProperties: false,
+    // Map the k-v map to an array of pairs.
+    modularizeImports: modularizeImports ? Object.fromEntries(
+      Object.entries(modularizeImports).map(([mod, config]) => [
+        mod,
+        {
+          ...config,
+          transform: typeof config.transform === "string" ? config.transform : Object.entries(config.transform).map(([key, value]) => [
+            key,
+            value
+          ])
+        }
+      ])
+    ) : void 0,
+    relay: compilerOptions?.relay,
+    // Always transform styled-jsx and error when `client-only` condition is triggered
+    styledJsx: {},
+    // Disable css-in-js libs (without client-only integration) transform on server layer for server components
+    emotion: getEmotionOptions(compilerOptions?.emotion, development),
+    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+    styledComponents: getStyledComponentsOptions(
+      compilerOptions?.styledComponents,
+      development
+    ),
+    serverComponents: void 0,
+    serverActions: void 0,
+    // For app router we prefer to bundle ESM,
+    // On server side of pages router we prefer CJS.
+    preferEsm: esm
+  };
+}
+
+// src/utils/swc/transform.ts
+var getVitestSWCTransformConfig = ({
+  filename,
+  inputSourceMap,
+  isServerEnvironment,
+  loadedJSConfig,
+  nextDirectories,
+  nextConfig,
+  rootDir,
+  isDev
+}) => {
+  const esm = true;
+  const baseOptions = getBaseSWCOptions({
+    filename,
+    development: false,
+    hasReactRefresh: false,
+    globalWindow: !isServerEnvironment,
+    modularizeImports: nextConfig.modularizeImports,
+    jsConfig: loadedJSConfig.jsConfig,
+    resolvedBaseUrl: loadedJSConfig.resolvedBaseUrl,
+    swcPlugins: nextConfig.experimental.swcPlugins,
+    compilerOptions: nextConfig?.compilerOptions,
+    esm,
+    swcCacheDir: path.join(
+      rootDir,
+      nextConfig.distDir ?? ".next",
+      "cache",
+      "swc"
+    )
+  });
+  const useCjsModules = shouldOutputCommonJs(filename);
+  return {
+    ...baseOptions,
+    fontLoaders: {
+      fontLoaders: ["next/font/local", "next/font/google"],
+      relativeFilePathFromRoot: path.relative(rootDir, filename)
+    },
+    cjsRequireOptimizer: {
+      packages: {
+        "next/server": {
+          transforms: {
+            NextRequest: "next/dist/server/web/spec-extension/request",
+            NextResponse: "next/dist/server/web/spec-extension/response",
+            ImageResponse: "next/dist/server/web/spec-extension/image-response",
+            userAgentFromString: "next/dist/server/web/spec-extension/user-agent",
+            userAgent: "next/dist/server/web/spec-extension/user-agent"
+          }
+        }
+      }
+    },
+    ...isServerEnvironment ? {
+      env: {
+        targets: {
+          // Targets the current version of Node.js
+          node: process.versions.node
+        }
+      }
+    } : {
+      env: {
+        targets: getSupportedBrowsers(rootDir, isDev)
+      }
+    },
+    module: {
+      type: esm && !useCjsModules ? "es6" : "commonjs"
+    },
+    disableNextSsg: true,
+    disablePageConfig: true,
+    pagesDir: nextDirectories.pagesDir,
+    appDir: nextDirectories.appDir,
+    inputSourceMap: inputSourceMap && typeof inputSourceMap === "object" ? JSON.stringify(inputSourceMap) : void 0,
+    sourceFileName: filename,
+    filename
+  };
+};
+
+// src/utils/typescript.ts
+var isDefined = (value) => value !== void 0;
+
+// src/plugins/next-swc/plugin.ts
+var excluded = /[\\/](cache[\\/][^\\/]+\.zip[\\/]node_modules|virtual:)[\\/]/g;
+var included = /\.((c|m)?(j|t)sx?)$/;
+function vitePluginNextSwc(rootDir, nextConfigResolver) {
+  let loadedJSConfig;
+  let nextDirectories;
+  let isServerEnvironment;
+  let isDev;
+  const resolvedDir = resolve(rootDir);
+  return {
+    name: "vite-plugin-storybook-nextjs-swc",
+    async config(config, env) {
+      const nextConfig = await nextConfigResolver.promise;
+      nextDirectories = findPagesDir(resolvedDir);
+      loadedJSConfig = await loadJsConfig(resolvedDir, nextConfig);
+      (await loadEnvironmentConfig(resolvedDir)).combinedEnv;
+      isDev = env.mode === "development";
+      await loadSWCBindingsEagerly(nextConfig);
+      const serverWatchIgnored = config.server?.watch?.ignored;
+      const isServerWatchIgnoredArray = Array.isArray(serverWatchIgnored);
+      if (config.test?.environment === "node" || config.test?.environment === "edge-runtime" || config.test?.browser?.enabled !== false) {
+        isServerEnvironment = true;
+      }
+      return {
+        resolve: {
+          alias: {
+            "@opentelemetry/api": "next/dist/compiled/@opentelemetry/api"
+          }
+        },
+        esbuild: {
+          // We will use Next.js custom SWC transpiler instead of Vite's build-in esbuild
+          exclude: [/node_modules/, /.m?(t|j)sx?/]
+        },
+        server: {
+          watch: {
+            ignored: [
+              ...isServerWatchIgnoredArray ? serverWatchIgnored : [serverWatchIgnored],
+              "/.next/"
+            ].filter(isDefined)
+          }
+        }
+      };
+    },
+    async transform(code, id) {
+      if (!excluded.test(id) && included.test(id)) {
+        const inputSourceMap = this.getCombinedSourcemap();
+        const output = await transform(
+          code,
+          getVitestSWCTransformConfig({
+            filename: id,
+            inputSourceMap,
+            isServerEnvironment,
+            loadedJSConfig,
+            nextConfig: await nextConfigResolver.promise,
+            nextDirectories,
+            rootDir,
+            isDev
+          })
+        );
+        return output;
+      }
+    }
+  };
+}
+
+// src/polyfills/promise-with-resolvers.ts
+if (typeof Promise.withResolvers === "undefined") {
+  Promise.withResolvers = () => {
+    let resolve4;
+    let reject;
+    const promise = new Promise((res, rej) => {
+      resolve4 = res;
+      reject = rej;
+    });
+    return { promise, resolve: resolve4, reject };
+  };
+}
+var includePattern2 = /\.(png|jpg|jpeg|gif|webp|avif|ico|bmp|svg)$/;
+var excludeImporterPattern = /\.(css|scss|sass)$/;
+var virtualImage = "virtual:next-image";
+var virtualNextImage = "virtual:next/image";
+var virtualNextLegacyImage = "virtual:next/legacy/image";
+var virtualNextImageDefaultLoader = "virtual:next/image-default-loader";
+var virtualNextImageContext = "virtual:next/image-context";
+var sharp;
+try {
+  sharp = __require("sharp");
+  if (sharp && sharp.concurrency() > 1) {
+    const divisor = process.env.NODE_ENV === "development" ? 4 : 2;
+    sharp.concurrency(Math.floor(Math.max(cpus().length / divisor, 1)));
+  }
+} catch (e) {
+  console.warn(
+    "You have to install sharp in order to use image optimization features in Next.js. AVIF support is also disabled."
+  );
+}
+function vitePluginNextImage(nextConfigResolver) {
+  return {
+    name: "vite-plugin-storybook-nextjs-image",
+    config(config, env) {
+      env.mode === "development";
+      return {
+        ...config,
+        resolve: {
+          ...config.resolve,
+          alias: {
+            react: "next/dist/compiled/react",
+            "react-dom": "next/dist/compiled/react-dom"
+          }
+        }
+      };
+    },
+    async resolveId(id, importer) {
+      if (includePattern2.test(id) && !excludeImporterPattern.test(importer ?? "") && !importer?.startsWith(virtualImage)) {
+        return {
+          id: `${virtualImage}?${id}`,
+          meta: {
+            id,
+            importer: importer ?? ""
+          }
+        };
+      }
+      if (id === "next/image" && importer !== virtualNextImage) {
+        return virtualNextImage;
+      }
+      if (id === "next/legacy/image" && importer !== virtualNextLegacyImage) {
+        return virtualNextLegacyImage;
+      }
+      if (id === "sb-original/image-context") {
+        return virtualNextImageContext;
+      }
+      if (id === "sb-original/default-loader") {
+        return virtualNextImageDefaultLoader;
+      }
+      return null;
+    },
+    async load(id) {
+      if (virtualNextImage === id) {
+        return (await fs2.promises.readFile(
+          fileURLToPath(
+            new URL(
+              "./plugins/next-image/alias/next-image.js",
+              import.meta.url
+            )
+          )
+        )).toString("utf-8");
+      }
+      if (virtualNextLegacyImage === id) {
+        return (await fs2.promises.readFile(
+          fileURLToPath(
+            new URL(
+              "./plugins/next-image/alias/next-legacy-image.js",
+              import.meta.url
+            )
+          )
+        )).toString("utf-8");
+      }
+      if (virtualNextImageDefaultLoader === id) {
+        return (await fs2.promises.readFile(
+          fileURLToPath(
+            new URL(
+              "./plugins/next-image/alias/image-default-loader.js",
+              import.meta.url
+            )
+          )
+        )).toString("utf-8");
+      }
+      if (virtualNextImageContext === id) {
+        return (await fs2.promises.readFile(
+          fileURLToPath(
+            new URL(
+              "./plugins/next-image/alias/image-context.js",
+              import.meta.url
+            )
+          )
+        )).toString("utf-8");
+      }
+      const [source] = id.split("?");
+      if (virtualImage === source) {
+        const moduleInfo = this.getModuleInfo(id);
+        const meta = moduleInfo?.meta;
+        path.basename(id);
+        const nextConfig = await nextConfigResolver.promise;
+        const extension = meta.id.split(".").pop();
+        const imagePath = path.join(path.dirname(meta.importer), meta.id);
+        try {
+          if (nextConfig.images?.disableStaticImages) {
+            return dedent3`
+						import image from "${imagePath}";
+						export default image;
+					`;
+          }
+          const imageData = await fs2.promises.readFile(imagePath);
+          let width;
+          let height;
+          if (extension === "avif" && sharp) {
+            const transformer = sharp(Buffer.from(imageData));
+            const result = await transformer.metadata();
+            width = result.width;
+            height = result.height;
+          } else {
+            const result = imageSizeOf(imageData);
+            width = result.width;
+            height = result.height;
+          }
+          return dedent3`
+						import src from "${imagePath}";
+						export default {
+							src,
+							height: ${height},
+							width: ${width},
+							blurDataURL: src
+						};
+					`;
+        } catch (err) {
+          console.error(`Could not read font file ${imagePath}:`, err);
+          return void 0;
+        }
+      }
+      return null;
+    }
+  };
+}
+
+// src/index.ts
+function VitePlugin({ dir = process.cwd() } = {}) {
+  const resolvedDir = resolve(dir);
+  const nextConfigResolver = Promise.withResolvers();
+  const nextFontPlugin = configureNextFont();
+  const nextSwcPlugin = vitePluginNextSwc(dir, nextConfigResolver);
+  const nextEnvPlugin = vitePluginNextConfig(dir);
+  const nextImagePlugin = vitePluginNextImage(nextConfigResolver);
+  return {
+    name: "vite-plugin-storybook-nextjs",
+    async buildStart() {
+      for (const configPath of await getConfigPaths(resolvedDir)) {
+        this.addWatchFile(configPath);
+      }
+    },
+    enforce: "pre",
+    configureServer(server) {
+      nextFontPlugin.configureServer.call(this, server);
+    },
+    async config(config, env) {
+      nextConfigResolver.resolve(await getConfig(resolvedDir));
+      const mergedNextSwcConfig = await nextSwcPlugin.config.call(
+        this,
+        config,
+        env
+      );
+      const mergedNextEnvConfig = await nextEnvPlugin.config.call(
+        this,
+        mergedNextSwcConfig,
+        env
+      );
+      const mergedNextFontConfig = await nextFontPlugin.config.call(
+        this,
+        mergedNextEnvConfig,
+        env
+      );
+      const mergedNextImageConfig = await nextImagePlugin.config.call(
+        this,
+        mergedNextFontConfig,
+        env
+      );
+      return mergedNextImageConfig;
+    },
+    async resolveId(source, importer, options) {
+      const nextFontResolver = await nextFontPlugin.resolveId.call(
+        this,
+        source,
+        importer
+      );
+      if (nextFontResolver) {
+        return nextFontResolver;
+      }
+      return nextImagePlugin.resolveId.call(this, source, importer);
+    },
+    load(id) {
+      const nextFontLoaderResult = nextFontPlugin.load.call(this, id);
+      if (nextFontLoaderResult) {
+        return nextFontLoaderResult;
+      }
+      return nextImagePlugin.load.call(this, id);
+    },
+    transform(code, id) {
+      return nextSwcPlugin.transform.call(this, code, id);
+    }
+  };
+}
+var src_default = VitePlugin;
+
+export { src_default as default };