react-code-locator 0.1.8 → 0.1.12

package/dist/index.js

@@ -1,5 +1,77 @@
 // src/constants.ts
 var SOURCE_PROP = "__componentSourceLoc";
+var JSX_SOURCE_PROP = "$componentSourceLoc";
+var JSX_SOURCE_REGISTRY_SYMBOL = "react-code-locator.jsxSourceRegistry";
+
+// src/sourceMetadata.ts
+function normalizeSlashes(value) {
+  return value.replace(/\\/g, "/");
+}
+function trimTrailingSlash(value) {
+  return value.replace(/\/+$/, "");
+}
+function splitPathSegments(value) {
+  return normalizeSlashes(value).split("/").filter(Boolean);
+}
+function computeRelativePath(fromPath, toPath) {
+  const fromSegments = splitPathSegments(fromPath);
+  const toSegments = splitPathSegments(toPath);
+  let sharedIndex = 0;
+  while (sharedIndex < fromSegments.length && sharedIndex < toSegments.length && fromSegments[sharedIndex] === toSegments[sharedIndex]) {
+    sharedIndex += 1;
+  }
+  const upSegments = new Array(Math.max(0, fromSegments.length - sharedIndex)).fill("..");
+  const downSegments = toSegments.slice(sharedIndex);
+  const relativeSegments = [...upSegments, ...downSegments];
+  return relativeSegments.length > 0 ? relativeSegments.join("/") : ".";
+}
+function normalizeProjectRoot(projectRoot) {
+  if (projectRoot) {
+    return trimTrailingSlash(normalizeSlashes(projectRoot));
+  }
+  if (typeof process !== "undefined" && typeof process.cwd === "function") {
+    return trimTrailingSlash(normalizeSlashes(process.cwd()));
+  }
+  return "";
+}
+function toRelativeSource(filename, loc, projectRoot) {
+  if (!filename || !loc) {
+    return null;
+  }
+  const root = normalizeProjectRoot(projectRoot);
+  const normalizedFilename = normalizeSlashes(filename);
+  const relPath = root && normalizedFilename.startsWith(`${root}/`) ? normalizedFilename.slice(root.length + 1) : root ? computeRelativePath(root, normalizedFilename) : normalizedFilename;
+  return `${relPath}:${loc.line}:${loc.column + 1}`;
+}
+function getSourceFile(source) {
+  if (!source) {
+    return null;
+  }
+  const match = source.match(/^(.*):\d+:\d+$/);
+  return match?.[1] ?? null;
+}
+function isProjectLocalFile(filename, projectRoot) {
+  if (!filename) {
+    return false;
+  }
+  const root = normalizeProjectRoot(projectRoot);
+  const normalizedFilename = normalizeSlashes(filename);
+  if (!root) {
+    return !normalizedFilename.startsWith("../") && !normalizedFilename.startsWith("/") && !/^[A-Za-z]:\//.test(normalizedFilename);
+  }
+  if (normalizedFilename.startsWith(`${root}/`) || normalizedFilename === root) {
+    return true;
+  }
+  const relativePath = computeRelativePath(root, normalizedFilename);
+  return !relativePath.startsWith("../");
+}
+function isExternalToProjectRoot(filename, projectRoot) {
+  return !isProjectLocalFile(filename, projectRoot);
+}
+function isProjectLocalSource(source, projectRoot) {
+  const file = getSourceFile(source);
+  return isProjectLocalFile(file ?? void 0, projectRoot);
+}
 
 // src/runtime.ts
 function isTriggerPressed(event, triggerKey) {
@@ -47,19 +119,17 @@ function getSourceFromType(type) {
   return typeof source === "string" ? source : null;
 }
 function getSourceFromProps(props) {
-  const source = props?.[SOURCE_PROP];
-  return typeof source === "string" ? source : null;
-}
-function resolveJsxSourceFromFiber(fiber) {
-  let current = fiber;
-  while (current) {
-    const source = getSourceFromProps(current.pendingProps) ?? getSourceFromProps(current.memoizedProps);
-    if (source) {
-      return source;
+  if (props && typeof props === "object") {
+    const registry = globalThis[Symbol.for(JSX_SOURCE_REGISTRY_SYMBOL)];
+    if (registry instanceof WeakMap) {
+      const intrinsicSource = registry.get(props);
+      if (typeof intrinsicSource === "string") {
+        return intrinsicSource;
+      }
     }
-    current = current.return ?? null;
   }
-  return null;
+  const source = props?.[JSX_SOURCE_PROP];
+  return typeof source === "string" ? source : null;
 }
 function resolveComponentSourceFromFiber(fiber) {
   let current = fiber;
@@ -72,24 +142,76 @@ function resolveComponentSourceFromFiber(fiber) {
   }
   return null;
 }
-function getDebugSource(fiber) {
+function getDirectDebugSource(fiber) {
+  const debugSource = fiber?._debugSource;
+  if (debugSource?.fileName && typeof debugSource.lineNumber === "number") {
+    return `${debugSource.fileName.replace(/\\/g, "/")}:${debugSource.lineNumber}:${debugSource.columnNumber ?? 1}`;
+  }
+  return null;
+}
+function resolveSourceCandidates(fiber) {
   let current = fiber;
+  const jsxCandidates = [];
+  const componentCandidates = [];
   while (current) {
-    const debugSource = current._debugSource;
-    if (debugSource?.fileName && typeof debugSource.lineNumber === "number") {
-      return `${debugSource.fileName.replace(/\\/g, "/")}:${debugSource.lineNumber}:${debugSource.columnNumber ?? 1}`;
+    const jsxSource = getSourceFromProps(current.pendingProps) ?? getSourceFromProps(current.memoizedProps) ?? getDirectDebugSource(current);
+    if (jsxSource) {
+      const file = getSourceFile(jsxSource);
+      if (file && !jsxCandidates.some((candidate) => candidate.source === jsxSource)) {
+        jsxCandidates.push({ source: jsxSource, file });
+      }
+    }
+    const componentSource = getSourceFromType(current.type) ?? getSourceFromType(current.elementType);
+    if (componentSource) {
+      const file = getSourceFile(componentSource);
+      if (file && !componentCandidates.some((candidate) => candidate.source === componentSource)) {
+        componentCandidates.push({ source: componentSource, file });
+      }
     }
     current = current.return ?? null;
   }
-  return null;
+  const direct = jsxCandidates[0]?.source ?? null;
+  const nearestProjectLocalComponentFile = componentCandidates.find((candidate) => isProjectLocalSource(candidate.source))?.file;
+  let screen = null;
+  if (nearestProjectLocalComponentFile) {
+    const matchingJsxCandidate = jsxCandidates.find((candidate) => candidate.file === nearestProjectLocalComponentFile);
+    if (matchingJsxCandidate) {
+      screen = matchingJsxCandidate.source;
+    } else {
+      const matchingComponentCandidate = componentCandidates.find(
+        (candidate) => candidate.file === nearestProjectLocalComponentFile
+      );
+      if (matchingComponentCandidate) {
+        screen = matchingComponentCandidate.source;
+      }
+    }
+  }
+  const implementationComponentCandidate = componentCandidates.find((candidate) => !isProjectLocalSource(candidate.source))?.source ?? null;
+  const implementationJsxCandidate = jsxCandidates.find((candidate) => !isProjectLocalSource(candidate.source))?.source ?? null;
+  const projectLocalJsxCandidate = jsxCandidates.find((candidate) => isProjectLocalSource(candidate.source))?.source ?? null;
+  const screenFallback = screen ?? projectLocalJsxCandidate ?? componentCandidates.find((candidate) => isProjectLocalSource(candidate.source))?.source ?? null;
+  return {
+    direct: direct ?? screenFallback,
+    screen: screenFallback,
+    implementation: implementationComponentCandidate ?? implementationJsxCandidate ?? screenFallback
+  };
+}
+function getModeDescription(mode) {
+  if (mode === "direct") {
+    return "Direct JSX";
+  }
+  if (mode === "screen") {
+    return "Screen source";
+  }
+  return "Implementation source";
 }
 function createStatusOverlay(triggerKey) {
   if (typeof document === "undefined") {
     return null;
   }
   const element = document.createElement("div");
-  let currentText = "";
   let copyValue = null;
+  let currentMode = "screen";
   let hideTimer = null;
   element.setAttribute("data-react-code-locator", "true");
   Object.assign(element.style, {
@@ -113,7 +235,6 @@ function createStatusOverlay(triggerKey) {
     transition: "opacity 120ms ease"
   });
   const show = (message, tone) => {
-    currentText = message;
     element.textContent = message;
     element.style.background = tone === "success" ? "rgba(6, 95, 70, 0.92)" : tone === "error" ? "rgba(153, 27, 27, 0.94)" : "rgba(17, 24, 39, 0.92)";
     element.style.opacity = "1";
@@ -124,7 +245,7 @@ function createStatusOverlay(triggerKey) {
     hideTimer = setTimeout(() => {
       element.style.opacity = "0";
       element.style.pointerEvents = "none";
-    }, 1500);
+    }, 2e3);
   };
   element.addEventListener("click", async () => {
     if (!copyValue) {
@@ -137,7 +258,7 @@ function createStatusOverlay(triggerKey) {
       show(`[react-code-locator] copy failed`, "error");
     }
   });
-  show(`[react-code-locator] enabled (${triggerKey}+click)`, "idle");
+  show(`[react-code-locator] enabled (${triggerKey}+click, alt+1/2/3 to switch mode)`, "idle");
   const mount = () => {
     if (!element.isConnected && document.body) {
       document.body.appendChild(element);
@@ -155,6 +276,10 @@ function createStatusOverlay(triggerKey) {
     setCopyValue(value) {
       copyValue = value;
     },
+    setMode(mode) {
+      currentMode = mode;
+      show(`[react-code-locator] ${getModeDescription(mode)}`, "idle");
+    },
     remove() {
       if (hideTimer) {
         clearTimeout(hideTimer);
@@ -163,17 +288,18 @@ function createStatusOverlay(triggerKey) {
     }
   };
 }
-function locateComponentSource(target) {
+function locateComponentSource(target, mode = "screen") {
   const elementTarget = target instanceof Element ? target : target instanceof Node ? target.parentElement : null;
   const fiber = getClosestReactFiber(elementTarget);
   if (!fiber) {
     return null;
   }
-  const jsxSource = resolveJsxSourceFromFiber(fiber) ?? getDebugSource(fiber);
-  if (jsxSource) {
+  const candidates = resolveSourceCandidates(fiber);
+  const source = candidates[mode] ?? candidates.screen ?? candidates.direct ?? candidates.implementation;
+  if (source) {
     return {
-      source: jsxSource,
-      mode: "jsx"
+      source,
+      mode
     };
   }
   const componentSource = resolveComponentSourceFromFiber(fiber);
@@ -182,11 +308,12 @@ function locateComponentSource(target) {
   }
   return {
     source: componentSource,
-    mode: "component"
+    mode
   };
 }
 function enableReactComponentJump(options = {}) {
   const overlay = createStatusOverlay(options.triggerKey ?? "shift");
+  let currentMode = "screen";
   const {
     triggerKey = "shift",
     onLocate = (result) => {
@@ -202,6 +329,28 @@ function enableReactComponentJump(options = {}) {
     }
   } = options;
   console.log("[react-code-locator] enabled", { triggerKey });
+  const keyHandler = (event) => {
+    if (!event.altKey) {
+      return;
+    }
+    if (event.code === "Digit1") {
+      currentMode = "direct";
+      overlay?.setMode(currentMode);
+      event.preventDefault();
+      return;
+    }
+    if (event.code === "Digit2") {
+      currentMode = "screen";
+      overlay?.setMode(currentMode);
+      event.preventDefault();
+      return;
+    }
+    if (event.code === "Digit3") {
+      currentMode = "implementation";
+      overlay?.setMode(currentMode);
+      event.preventDefault();
+    }
+  };
   const handler = (event) => {
     console.log("[react-code-locator] click", {
       triggerKey,
@@ -214,7 +363,7 @@ function enableReactComponentJump(options = {}) {
     if (!isTriggerPressed(event, triggerKey)) {
       return;
     }
-    const result = locateComponentSource(event.target);
+    const result = locateComponentSource(event.target, currentMode);
     if (!result) {
       onError(new Error("No React component source metadata found for clicked element."));
       return;
@@ -224,13 +373,656 @@ function enableReactComponentJump(options = {}) {
     onLocate(result);
   };
   document.addEventListener("click", handler, true);
+  document.addEventListener("keydown", keyHandler, true);
   return () => {
     document.removeEventListener("click", handler, true);
+    document.removeEventListener("keydown", keyHandler, true);
     overlay?.remove();
   };
 }
+
+// src/sourceAdapter.ts
+function defineSourceAdapter(descriptor) {
+  return descriptor;
+}
+
+// src/babelInjectComponentSource.ts
+import { types as t } from "@babel/core";
+var SOURCE_PROP_LOCAL = "_componentSourceLoc";
+var SOURCE_PROPS_REST = "__reactCodeLocatorProps";
+function isComponentName(name) {
+  return /^[A-Z]/.test(name);
+}
+function isCustomComponentTag(name) {
+  if (t.isJSXIdentifier(name)) {
+    return isComponentName(name.name);
+  }
+  if (t.isJSXMemberExpression(name)) {
+    return true;
+  }
+  return false;
+}
+function isIntrinsicElementTag(name) {
+  return t.isJSXIdentifier(name) && /^[a-z]/.test(name.name);
+}
+function isElementFactoryIdentifier(name) {
+  return name === "jsx" || name === "jsxs" || name === "jsxDEV" || name === "_jsx" || name === "_jsxs" || name === "_jsxDEV" || name === "createElement";
+}
+function isReactElementFactoryCall(pathNode) {
+  const callee = pathNode.node.callee;
+  if (t.isIdentifier(callee)) {
+    return isElementFactoryIdentifier(callee.name);
+  }
+  return t.isMemberExpression(callee) && t.isIdentifier(callee.object, { name: "React" }) && t.isIdentifier(callee.property, { name: "createElement" });
+}
+function getRootJsxIdentifierName(name) {
+  if (t.isJSXIdentifier(name)) {
+    return name.name;
+  }
+  if (t.isJSXMemberExpression(name)) {
+    return getRootJsxIdentifierName(name.object);
+  }
+  return null;
+}
+function isStyledModuleImport(binding) {
+  if (!binding) {
+    return false;
+  }
+  if (!binding.path.isImportSpecifier() && !binding.path.isImportDefaultSpecifier() && !binding.path.isImportNamespaceSpecifier()) {
+    return false;
+  }
+  const source = binding.path.parentPath.isImportDeclaration() ? binding.path.parentPath.node.source.value : null;
+  if (typeof source !== "string") {
+    return false;
+  }
+  const normalized = source.replace(/\\/g, "/");
+  return normalized === "./styled" || normalized === "../styled" || normalized.endsWith("/styled");
+}
+function isSupportedComponentInit(node) {
+  if (!node) {
+    return false;
+  }
+  if (t.isArrowFunctionExpression(node) || t.isFunctionExpression(node)) {
+    return true;
+  }
+  if (!t.isCallExpression(node)) {
+    return false;
+  }
+  if (t.isIdentifier(node.callee) && (node.callee.name === "memo" || node.callee.name === "forwardRef")) {
+    return true;
+  }
+  return t.isMemberExpression(node.callee) && t.isIdentifier(node.callee.object, { name: "React" }) && t.isIdentifier(node.callee.property) && (node.callee.property.name === "memo" || node.callee.property.name === "forwardRef");
+}
+function hasSourcePropBinding(pattern) {
+  return pattern.properties.some((property) => {
+    if (!t.isObjectProperty(property)) {
+      return false;
+    }
+    return t.isIdentifier(property.key) && property.key.name === JSX_SOURCE_PROP;
+  });
+}
+function injectSourcePropBinding(pattern) {
+  if (hasSourcePropBinding(pattern)) {
+    return;
+  }
+  const sourceBinding = t.objectProperty(
+    t.identifier(JSX_SOURCE_PROP),
+    t.identifier(SOURCE_PROP_LOCAL),
+    false,
+    false
+  );
+  const restIndex = pattern.properties.findIndex(
+    (property) => t.isRestElement(property)
+  );
+  if (restIndex === -1) {
+    pattern.properties.push(sourceBinding);
+    return;
+  }
+  pattern.properties.splice(restIndex, 0, sourceBinding);
+}
+function injectSourcePropIntoIdentifierParam(node, param) {
+  if (!t.isBlockStatement(node.body)) {
+    node.body = t.blockStatement([t.returnStatement(node.body)]);
+  }
+  const alreadyInjected = node.body.body.some(
+    (statement) => t.isVariableDeclaration(statement) && statement.declarations.some(
+      (declaration) => t.isIdentifier(declaration.id) && declaration.id.name === SOURCE_PROPS_REST
+    )
+  );
+  if (alreadyInjected) {
+    return;
+  }
+  node.body.body.unshift(
+    t.variableDeclaration("const", [
+      t.variableDeclarator(
+        t.objectPattern([
+          t.objectProperty(
+            t.identifier(JSX_SOURCE_PROP),
+            t.identifier(SOURCE_PROP_LOCAL),
+            false,
+            false
+          ),
+          t.restElement(t.identifier(SOURCE_PROPS_REST))
+        ]),
+        param
+      )
+    ]),
+    t.expressionStatement(
+      t.assignmentExpression(
+        "=",
+        t.identifier(param.name),
+        t.identifier(SOURCE_PROPS_REST)
+      )
+    )
+  );
+}
+function injectSourcePropIntoFunctionParams(node) {
+  const firstParam = node.params[0];
+  if (!firstParam) {
+    return;
+  }
+  if (t.isObjectPattern(firstParam)) {
+    injectSourcePropBinding(firstParam);
+    return;
+  }
+  if (t.isIdentifier(firstParam)) {
+    injectSourcePropIntoIdentifierParam(node, firstParam);
+  }
+}
+function injectSourcePropIntoExpression(node) {
+  if (!node) {
+    return;
+  }
+  if (t.isFunctionExpression(node) || t.isArrowFunctionExpression(node)) {
+    injectSourcePropIntoFunctionParams(node);
+    return;
+  }
+  if (!t.isCallExpression(node)) {
+    return;
+  }
+  const firstArg = node.arguments[0];
+  if (firstArg && !t.isSpreadElement(firstArg) && (t.isFunctionExpression(firstArg) || t.isArrowFunctionExpression(firstArg))) {
+    injectSourcePropIntoFunctionParams(firstArg);
+  }
+}
+function getSourceValue(state, loc, projectRoot) {
+  const filename = state.file?.opts?.filename;
+  if (!filename || !loc) {
+    return null;
+  }
+  return toRelativeSource(filename, loc, projectRoot);
+}
+function buildAssignment(name, sourceValue) {
+  return t.expressionStatement(
+    t.assignmentExpression(
+      "=",
+      t.memberExpression(t.identifier(name), t.identifier(SOURCE_PROP)),
+      t.stringLiteral(sourceValue)
+    )
+  );
+}
+function buildIntrinsicSourceHelper() {
+  return t.functionDeclaration(
+    t.identifier("_markIntrinsicElementSource"),
+    [t.identifier("element"), t.identifier("source")],
+    t.blockStatement([
+      t.variableDeclaration("const", [
+        t.variableDeclarator(
+          t.identifier("registryKey"),
+          t.callExpression(
+            t.memberExpression(t.identifier("Symbol"), t.identifier("for")),
+            [t.stringLiteral(JSX_SOURCE_REGISTRY_SYMBOL)]
+          )
+        )
+      ]),
+      t.variableDeclaration("let", [
+        t.variableDeclarator(
+          t.identifier("registry"),
+          t.memberExpression(t.identifier("globalThis"), t.identifier("registryKey"), true)
+        )
+      ]),
+      t.ifStatement(
+        t.unaryExpression(
+          "!",
+          t.binaryExpression("instanceof", t.identifier("registry"), t.identifier("WeakMap"))
+        ),
+        t.blockStatement([
+          t.expressionStatement(
+            t.assignmentExpression(
+              "=",
+              t.identifier("registry"),
+              t.assignmentExpression(
+                "=",
+                t.memberExpression(t.identifier("globalThis"), t.identifier("registryKey"), true),
+                t.newExpression(t.identifier("WeakMap"), [])
+              )
+            )
+          )
+        ])
+      ),
+      t.ifStatement(
+        t.logicalExpression(
+          "&&",
+          t.identifier("element"),
+          t.logicalExpression(
+            "&&",
+            t.binaryExpression("===", t.unaryExpression("typeof", t.identifier("element")), t.stringLiteral("object")),
+            t.binaryExpression(
+              "===",
+              t.unaryExpression("typeof", t.memberExpression(t.identifier("element"), t.identifier("props"))),
+              t.stringLiteral("object")
+            )
+          )
+        ),
+        t.blockStatement([
+          t.expressionStatement(
+            t.callExpression(
+              t.memberExpression(t.identifier("registry"), t.identifier("set")),
+              [t.memberExpression(t.identifier("element"), t.identifier("props")), t.identifier("source")]
+            )
+          )
+        ])
+      ),
+      t.returnStatement(t.identifier("element"))
+    ])
+  );
+}
+function ensureIntrinsicSourceHelper(programPath, state) {
+  if (state.injectedIntrinsicHelper) {
+    return;
+  }
+  const alreadyExists = programPath.node.body.some(
+    (node) => t.isFunctionDeclaration(node) && t.isIdentifier(node.id, { name: "_markIntrinsicElementSource" })
+  );
+  if (!alreadyExists) {
+    programPath.unshiftContainer("body", buildIntrinsicSourceHelper());
+  }
+  state.injectedIntrinsicHelper = true;
+}
+function visitDeclaration(declarationPath, insertAfterPath, state, seen, projectRoot) {
+  if (declarationPath.isFunctionDeclaration() || declarationPath.isClassDeclaration()) {
+    const name = declarationPath.node.id?.name;
+    if (!name || !isComponentName(name) || seen.has(name)) {
+      return;
+    }
+    if (declarationPath.isFunctionDeclaration()) {
+      injectSourcePropIntoFunctionParams(declarationPath.node);
+    }
+    const sourceValue = getSourceValue(
+      state,
+      declarationPath.node.loc?.start,
+      projectRoot
+    );
+    if (!sourceValue) {
+      return;
+    }
+    seen.add(name);
+    insertAfterPath.insertAfter(buildAssignment(name, sourceValue));
+    return;
+  }
+  if (!declarationPath.isVariableDeclaration()) {
+    return;
+  }
+  const assignments = declarationPath.node.declarations.flatMap(
+    (declarator) => {
+      if (!t.isIdentifier(declarator.id) || !isComponentName(declarator.id.name) || seen.has(declarator.id.name)) {
+        return [];
+      }
+      if (!declarator.init) {
+        return [];
+      }
+      if (!isSupportedComponentInit(declarator.init)) {
+        return [];
+      }
+      injectSourcePropIntoExpression(declarator.init);
+      const sourceValue = getSourceValue(
+        state,
+        declarator.loc?.start ?? declarator.init.loc?.start,
+        projectRoot
+      );
+      if (!sourceValue) {
+        return [];
+      }
+      seen.add(declarator.id.name);
+      return [buildAssignment(declarator.id.name, sourceValue)];
+    }
+  );
+  if (assignments.length > 0) {
+    insertAfterPath.insertAfter(assignments);
+  }
+}
+function babelInjectComponentSource(options = {}) {
+  const {
+    injectJsxSource = true,
+    injectComponentSource = true,
+    projectRoot
+  } = options;
+  return {
+    name: "babel-inject-component-source",
+    visitor: {
+      CallExpression(pathNode, state) {
+        if (!injectJsxSource) {
+          return;
+        }
+        if (!isReactElementFactoryCall(pathNode)) {
+          return;
+        }
+        if (pathNode.parentPath.isCallExpression() && t.isIdentifier(pathNode.parentPath.node.callee, {
+          name: "_markIntrinsicElementSource"
+        })) {
+          return;
+        }
+        const sourceValue = getSourceValue(
+          state,
+          pathNode.node.loc?.start,
+          projectRoot
+        );
+        if (!sourceValue) {
+          return;
+        }
+        const programPath = pathNode.findParent((parent) => parent.isProgram());
+        if (!programPath || !programPath.isProgram()) {
+          return;
+        }
+        ensureIntrinsicSourceHelper(programPath, state);
+        pathNode.replaceWith(
+          t.callExpression(t.identifier("_markIntrinsicElementSource"), [
+            pathNode.node,
+            t.stringLiteral(sourceValue)
+          ])
+        );
+        pathNode.skip();
+      },
+      JSXElement: {
+        exit(pathNode, state) {
+          if (!injectJsxSource) {
+            return;
+          }
+          if (!isIntrinsicElementTag(pathNode.node.openingElement.name)) {
+            return;
+          }
+          if (pathNode.parentPath.isCallExpression() && t.isIdentifier(pathNode.parentPath.node.callee, { name: "_markIntrinsicElementSource" })) {
+            return;
+          }
+          const sourceValue = getSourceValue(
+            state,
+            pathNode.node.openingElement.loc?.start,
+            projectRoot
+          );
+          if (!sourceValue) {
+            return;
+          }
+          const programPath = pathNode.findParent((parent) => parent.isProgram());
+          if (!programPath || !programPath.isProgram()) {
+            return;
+          }
+          ensureIntrinsicSourceHelper(programPath, state);
+          const wrappedNode = t.callExpression(t.identifier("_markIntrinsicElementSource"), [
+            pathNode.node,
+            t.stringLiteral(sourceValue)
+          ]);
+          if (pathNode.parentPath.isJSXElement() || pathNode.parentPath.isJSXFragment()) {
+            pathNode.replaceWith(t.jsxExpressionContainer(wrappedNode));
+            return;
+          }
+          if (pathNode.parentPath.isJSXExpressionContainer()) {
+            pathNode.parentPath.replaceWith(t.jsxExpressionContainer(wrappedNode));
+            return;
+          }
+          pathNode.replaceWith(wrappedNode);
+        }
+      },
+      JSXOpeningElement(pathNode, state) {
+        if (!injectJsxSource) {
+          return;
+        }
+        if (!isCustomComponentTag(pathNode.node.name)) {
+          return;
+        }
+        const rootIdentifierName = getRootJsxIdentifierName(pathNode.node.name);
+        if (rootIdentifierName && isExternalToProjectRoot(state.file?.opts?.filename, projectRoot) && isStyledModuleImport(pathNode.scope.getBinding(rootIdentifierName))) {
+          return;
+        }
+        const hasSourceProp = pathNode.node.attributes.some(
+          (attr) => t.isJSXAttribute(attr) && t.isJSXIdentifier(attr.name) && attr.name.name === JSX_SOURCE_PROP
+        );
+        if (hasSourceProp) {
+          return;
+        }
+        const filename = state.file?.opts?.filename;
+        const loc = pathNode.node.loc?.start;
+        if (!filename || !loc) {
+          return;
+        }
+        pathNode.node.attributes.push(
+          t.jsxAttribute(
+            t.jsxIdentifier(JSX_SOURCE_PROP),
+            t.stringLiteral(
+              getSourceValue(state, loc, projectRoot) ?? `${filename.replace(/\\/g, "/")}:${loc.line}:${loc.column + 1}`
+            )
+          )
+        );
+      },
+      Program(programPath, state) {
+        if (!injectComponentSource) {
+          return;
+        }
+        const seen = /* @__PURE__ */ new Set();
+        for (const childPath of programPath.get("body")) {
+          if (childPath.isExportNamedDeclaration() || childPath.isExportDefaultDeclaration()) {
+            const declarationPath = childPath.get("declaration");
+            if (!Array.isArray(declarationPath) && declarationPath.node) {
+              visitDeclaration(declarationPath, childPath, state, seen, projectRoot);
+            }
+            continue;
+          }
+          visitDeclaration(childPath, childPath, state, seen, projectRoot);
+        }
+      }
+    }
+  };
+}
+
+// src/babel.ts
+function createBabelSourceAdapter(options = {}) {
+  return defineSourceAdapter({
+    kind: "babel",
+    name: "react-code-locator/babel",
+    options,
+    config: {
+      plugins: [[babelInjectComponentSource, options]]
+    }
+  });
+}
+var babelSourceAdapter = createBabelSourceAdapter();
+
+// src/sourceTransform.ts
+import { transformAsync } from "@babel/core";
+async function transformSourceWithLocator(code, options) {
+  const { filename, sourceMaps = true, ...pluginOptions } = options;
+  const result = await transformAsync(code, {
+    filename,
+    babelrc: false,
+    configFile: false,
+    sourceMaps,
+    parserOpts: {
+      sourceType: "module",
+      plugins: ["jsx", "typescript"]
+    },
+    generatorOpts: {
+      retainLines: true
+    },
+    plugins: [[babelInjectComponentSource, pluginOptions]]
+  });
+  return {
+    code: result?.code ?? code,
+    map: result?.map ?? null
+  };
+}
+
+// src/viteClientInjector.ts
+var VIRTUAL_CLIENT_MODULE_ID = "virtual:react-code-locator/client";
+var RESOLVED_VIRTUAL_CLIENT_MODULE_ID = `\0${VIRTUAL_CLIENT_MODULE_ID}`;
+function createClientInjector(locatorOptions = {}) {
+  const serialized = JSON.stringify(locatorOptions);
+  return {
+    name: "react-code-locator-client-injector",
+    apply: "serve",
+    resolveId(id) {
+      if (id === VIRTUAL_CLIENT_MODULE_ID) {
+        return RESOLVED_VIRTUAL_CLIENT_MODULE_ID;
+      }
+      return null;
+    },
+    load(id) {
+      if (id !== RESOLVED_VIRTUAL_CLIENT_MODULE_ID) {
+        return null;
+      }
+      return `
+        import { enableReactComponentJump } from "react-code-locator/client";
+
+        enableReactComponentJump(${serialized});
+      `;
+    },
+    transformIndexHtml() {
+      return [
+        {
+          tag: "script",
+          attrs: {
+            type: "module",
+            src: `/@id/__x00__${VIRTUAL_CLIENT_MODULE_ID}`
+          },
+          injectTo: "head"
+        }
+      ];
+    }
+  };
+}
+function createViteClientInjector(options = {}) {
+  const { command = "serve", locator = {}, injectClient = true } = options;
+  const isServe = command === "serve";
+  return [isServe && injectClient ? createClientInjector(locator) : null].filter(Boolean);
+}
+
+// src/vite.ts
+function shouldTransformSource(id) {
+  if (id.includes("/node_modules/") || id.startsWith("\0")) {
+    return false;
+  }
+  return /\.[mc]?[jt]sx?$/.test(id);
+}
+function viteSourceTransformPlugin(options = {}) {
+  return {
+    name: "react-code-locator-source-transform",
+    enforce: "pre",
+    async transform(code, id) {
+      if (!shouldTransformSource(id)) {
+        return null;
+      }
+      return transformSourceWithLocator(code, {
+        filename: id,
+        ...options
+      });
+    }
+  };
+}
+function createViteSourceAdapter(options = {}) {
+  const { babel = {}, ...viteOptions } = options;
+  const plugins = [
+    viteSourceTransformPlugin(babel),
+    ...createViteClientInjector(viteOptions)
+  ].filter(Boolean);
+  return defineSourceAdapter({
+    kind: "vite",
+    name: "react-code-locator/vite",
+    options,
+    config: {
+      plugins
+    }
+  });
+}
+var viteSourceAdapter = createViteSourceAdapter();
+
+// src/esbuild.ts
+import { readFile } from "fs/promises";
+function getEsbuildLoader(filename) {
+  if (filename.endsWith(".tsx")) {
+    return "tsx";
+  }
+  if (filename.endsWith(".ts")) {
+    return "ts";
+  }
+  if (filename.endsWith(".jsx")) {
+    return "jsx";
+  }
+  return "js";
+}
+function esbuildSourceTransformPlugin(options = {}) {
+  return {
+    name: "react-code-locator-source-transform",
+    setup(build) {
+      build.onLoad({ filter: /\.[mc]?[jt]sx?$/ }, async ({ path }) => {
+        if (path.includes("/node_modules/")) {
+          return null;
+        }
+        const code = await readFile(path, "utf8");
+        const result = await transformSourceWithLocator(code, {
+          filename: path,
+          ...options
+        });
+        return {
+          contents: result.code,
+          loader: getEsbuildLoader(path)
+        };
+      });
+    }
+  };
+}
+function createEsbuildSourceAdapter(options = {}) {
+  return defineSourceAdapter({
+    kind: "esbuild",
+    name: "react-code-locator/esbuild",
+    options,
+    config: {
+      plugins: [esbuildSourceTransformPlugin(options)]
+    }
+  });
+}
+var esbuildSourceAdapter = createEsbuildSourceAdapter();
+
+// src/swc.ts
+async function transformSourceWithSwcLocator(code, options) {
+  return transformSourceWithLocator(code, options);
+}
+function createSwcSourceAdapter(options = {}) {
+  const transform = (code, transformOptions) => transformSourceWithSwcLocator(code, {
+    ...options,
+    ...transformOptions
+  });
+  return defineSourceAdapter({
+    kind: "swc",
+    name: "react-code-locator/swc",
+    options,
+    config: {
+      transform
+    }
+  });
+}
+var swcSourceAdapter = createSwcSourceAdapter();
 export {
+  babelInjectComponentSource,
+  babelSourceAdapter,
+  createBabelSourceAdapter,
+  createEsbuildSourceAdapter,
+  createSwcSourceAdapter,
+  createViteClientInjector,
+  createViteSourceAdapter,
+  defineSourceAdapter,
   enableReactComponentJump,
-  locateComponentSource
+  esbuildSourceAdapter,
+  locateComponentSource,
+  createViteClientInjector as reactComponentJump,
+  swcSourceAdapter,
+  viteSourceAdapter
 };
 //# sourceMappingURL=index.js.map