react-code-locator 0.1.4

package/dist/vite.js

@@ -0,0 +1,173 @@
+// src/elementLocatorReact.ts
+import react from "@vitejs/plugin-react";
+
+// src/babelInjectComponentSource.ts
+import path from "path";
+import { types as t } from "@babel/core";
+
+// src/constants.ts
+var SOURCE_PROP = "__componentSourceLoc";
+
+// src/babelInjectComponentSource.ts
+function isComponentName(name) {
+  return /^[A-Z]/.test(name);
+}
+function getSourceValue(state, loc) {
+  const filename = state.file?.opts?.filename;
+  if (!filename || !loc) {
+    return null;
+  }
+  const relPath = path.relative(process.cwd(), filename).replace(/\\/g, "/");
+  return `${relPath}:${loc.line}:${loc.column + 1}`;
+}
+function buildAssignment(name, sourceValue) {
+  return t.expressionStatement(
+    t.assignmentExpression(
+      "=",
+      t.memberExpression(t.identifier(name), t.identifier(SOURCE_PROP)),
+      t.stringLiteral(sourceValue)
+    )
+  );
+}
+function visitDeclaration(declarationPath, insertAfterPath, state, seen) {
+  if (declarationPath.isFunctionDeclaration() || declarationPath.isClassDeclaration()) {
+    const name = declarationPath.node.id?.name;
+    if (!name || !isComponentName(name) || seen.has(name)) {
+      return;
+    }
+    const sourceValue = getSourceValue(state, declarationPath.node.loc?.start);
+    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 (!t.isArrowFunctionExpression(declarator.init) && !t.isFunctionExpression(declarator.init)) {
+      return [];
+    }
+    const sourceValue = getSourceValue(state, declarator.loc?.start ?? declarator.init.loc?.start);
+    if (!sourceValue) {
+      return [];
+    }
+    seen.add(declarator.id.name);
+    return [buildAssignment(declarator.id.name, sourceValue)];
+  });
+  if (assignments.length > 0) {
+    insertAfterPath.insertAfter(assignments);
+  }
+}
+function babelInjectComponentSource() {
+  return {
+    name: "babel-inject-component-source",
+    visitor: {
+      JSXOpeningElement(pathNode, state) {
+        const hasSourceProp = pathNode.node.attributes.some(
+          (attr) => t.isJSXAttribute(attr) && t.isJSXIdentifier(attr.name) && attr.name.name === "__source"
+        );
+        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("__source"),
+            t.jsxExpressionContainer(
+              t.objectExpression([
+                t.objectProperty(t.identifier("fileName"), t.stringLiteral(filename)),
+                t.objectProperty(t.identifier("lineNumber"), t.numericLiteral(loc.line)),
+                t.objectProperty(t.identifier("columnNumber"), t.numericLiteral(loc.column + 1))
+              ])
+            )
+          )
+        );
+      },
+      Program(programPath, state) {
+        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);
+            }
+            continue;
+          }
+          visitDeclaration(childPath, childPath, state, seen);
+        }
+      }
+    }
+  };
+}
+
+// src/elementLocatorReact.ts
+function withLocatorBabel(reactOptions = {}) {
+  const baseBabel = reactOptions.babel;
+  if (typeof baseBabel === "function") {
+    return {
+      ...reactOptions,
+      babel(id, options) {
+        const result = baseBabel(id, options);
+        const resolved2 = result ?? {};
+        const plugins = [...resolved2.plugins ?? [], babelInjectComponentSource];
+        return {
+          ...resolved2,
+          plugins
+        };
+      }
+    };
+  }
+  const resolved = baseBabel ?? {};
+  return {
+    ...reactOptions,
+    babel: {
+      ...resolved,
+      plugins: [...resolved.plugins ?? [], babelInjectComponentSource]
+    }
+  };
+}
+function createClientInjector(locatorOptions = {}) {
+  const serialized = JSON.stringify(locatorOptions);
+  return {
+    name: "element-locator-client-injector",
+    apply: "serve",
+    transformIndexHtml() {
+      return [
+        {
+          tag: "script",
+          attrs: {
+            type: "module"
+          },
+          children: `import { enableReactComponentJump } from "react-component-jump/client"; enableReactComponentJump(${serialized});`,
+          injectTo: "head"
+        }
+      ];
+    }
+  };
+}
+function elementLocatorReact(options = {}) {
+  const { command = "serve", react: reactOptions, locator = {}, injectClient = true } = options;
+  const isServe = command === "serve";
+  return [
+    react(isServe ? withLocatorBabel(reactOptions) : reactOptions),
+    isServe && injectClient ? createClientInjector(locator) : null
+  ].filter(Boolean);
+}
+export {
+  elementLocatorReact,
+  elementLocatorReact as reactComponentJump
+};
+//# sourceMappingURL=vite.js.map

package/dist/vite.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/elementLocatorReact.ts","../src/babelInjectComponentSource.ts","../src/constants.ts"],"sourcesContent":["import type { TransformOptions, PluginItem } from \"@babel/core\";\nimport react, { type Options as ReactOptions } from \"@vitejs/plugin-react\";\nimport type { Plugin, PluginOption } from \"vite\";\nimport { babelInjectComponentSource } from \"./babelInjectComponentSource\";\nimport { type LocatorOptions } from \"./runtime\";\n\nexport type ElementLocatorReactOptions = {\n  command?: \"serve\" | \"build\";\n  react?: ReactOptions;\n  locator?: LocatorOptions;\n  injectClient?: boolean;\n};\n\nfunction withLocatorBabel(reactOptions: ReactOptions = {}): ReactOptions {\n  const baseBabel = reactOptions.babel;\n\n  if (typeof baseBabel === \"function\") {\n    return {\n      ...reactOptions,\n      babel(id, options) {\n        const result = baseBabel(id, options);\n        const resolved = (result ?? {}) as TransformOptions;\n        const plugins = [...(resolved.plugins ?? []), babelInjectComponentSource as PluginItem];\n\n        return {\n          ...resolved,\n          plugins,\n        };\n      },\n    };\n  }\n\n  const resolved = (baseBabel ?? {}) as TransformOptions;\n  return {\n    ...reactOptions,\n    babel: {\n      ...resolved,\n      plugins: [...(resolved.plugins ?? []), babelInjectComponentSource as PluginItem],\n    },\n  };\n}\n\nfunction createClientInjector(locatorOptions: LocatorOptions = {}): Plugin {\n  const serialized = JSON.stringify(locatorOptions);\n\n  return {\n    name: \"element-locator-client-injector\",\n    apply: \"serve\",\n    transformIndexHtml() {\n      return [\n        {\n          tag: \"script\",\n          attrs: {\n            type: \"module\",\n          },\n          children: `import { enableReactComponentJump } from \"react-component-jump/client\"; enableReactComponentJump(${serialized});`,\n          injectTo: \"head\",\n        },\n      ];\n    },\n  };\n}\n\nexport function elementLocatorReact(options: ElementLocatorReactOptions = {}): PluginOption[] {\n  const { command = \"serve\", react: reactOptions, locator = {}, injectClient = true } = options;\n  const isServe = command === \"serve\";\n\n  return [\n    react(isServe ? withLocatorBabel(reactOptions) : reactOptions),\n    isServe && injectClient ? createClientInjector(locator) : null,\n  ].filter(Boolean);\n}\n","import path from \"node:path\";\nimport { types as t, type NodePath, type PluginObj } from \"@babel/core\";\nimport { SOURCE_PROP } from \"./constants\";\n\ntype BabelState = {\n  file?: {\n    opts?: {\n      filename?: string;\n    };\n  };\n};\n\nfunction isComponentName(name: string) {\n  return /^[A-Z]/.test(name);\n}\n\nfunction getSourceValue(state: BabelState, loc: { line: number; column: number } | null | undefined) {\n  const filename = state.file?.opts?.filename;\n  if (!filename || !loc) {\n    return null;\n  }\n\n  const relPath = path.relative(process.cwd(), filename).replace(/\\\\/g, \"/\");\n  return `${relPath}:${loc.line}:${loc.column + 1}`;\n}\n\nfunction buildAssignment(name: string, sourceValue: string) {\n  return t.expressionStatement(\n    t.assignmentExpression(\n      \"=\",\n      t.memberExpression(t.identifier(name), t.identifier(SOURCE_PROP)),\n      t.stringLiteral(sourceValue),\n    ),\n  );\n}\n\nfunction visitDeclaration(\n  declarationPath: NodePath,\n  insertAfterPath: NodePath,\n  state: BabelState,\n  seen: Set<string>,\n) {\n  if (declarationPath.isFunctionDeclaration() || declarationPath.isClassDeclaration()) {\n    const name = declarationPath.node.id?.name;\n    if (!name || !isComponentName(name) || seen.has(name)) {\n      return;\n    }\n\n    const sourceValue = getSourceValue(state, declarationPath.node.loc?.start);\n    if (!sourceValue) {\n      return;\n    }\n\n    seen.add(name);\n    insertAfterPath.insertAfter(buildAssignment(name, sourceValue));\n    return;\n  }\n\n  if (!declarationPath.isVariableDeclaration()) {\n    return;\n  }\n\n  const assignments = declarationPath.node.declarations.flatMap((declarator) => {\n    if (!t.isIdentifier(declarator.id) || !isComponentName(declarator.id.name) || seen.has(declarator.id.name)) {\n      return [];\n    }\n\n    if (!declarator.init) {\n      return [];\n    }\n\n    if (!t.isArrowFunctionExpression(declarator.init) && !t.isFunctionExpression(declarator.init)) {\n      return [];\n    }\n\n    const sourceValue = getSourceValue(state, declarator.loc?.start ?? declarator.init.loc?.start);\n    if (!sourceValue) {\n      return [];\n    }\n\n    seen.add(declarator.id.name);\n    return [buildAssignment(declarator.id.name, sourceValue)];\n  });\n\n  if (assignments.length > 0) {\n    insertAfterPath.insertAfter(assignments);\n  }\n}\n\nexport function babelInjectComponentSource(): PluginObj<BabelState> {\n  return {\n    name: \"babel-inject-component-source\",\n    visitor: {\n      JSXOpeningElement(pathNode, state) {\n        const hasSourceProp = pathNode.node.attributes.some(\n          (attr) => t.isJSXAttribute(attr) && t.isJSXIdentifier(attr.name) && attr.name.name === \"__source\",\n        );\n        if (hasSourceProp) {\n          return;\n        }\n\n        const filename = state.file?.opts?.filename;\n        const loc = pathNode.node.loc?.start;\n        if (!filename || !loc) {\n          return;\n        }\n\n        pathNode.node.attributes.push(\n          t.jsxAttribute(\n            t.jsxIdentifier(\"__source\"),\n            t.jsxExpressionContainer(\n              t.objectExpression([\n                t.objectProperty(t.identifier(\"fileName\"), t.stringLiteral(filename)),\n                t.objectProperty(t.identifier(\"lineNumber\"), t.numericLiteral(loc.line)),\n                t.objectProperty(t.identifier(\"columnNumber\"), t.numericLiteral(loc.column + 1)),\n              ]),\n            ),\n          ),\n        );\n      },\n      Program(programPath, state) {\n        const seen = new Set<string>();\n\n        for (const childPath of programPath.get(\"body\")) {\n          if (childPath.isExportNamedDeclaration() || childPath.isExportDefaultDeclaration()) {\n            const declarationPath = childPath.get(\"declaration\");\n            if (!Array.isArray(declarationPath) && declarationPath.node) {\n              visitDeclaration(declarationPath, childPath, state, seen);\n            }\n            continue;\n          }\n\n          visitDeclaration(childPath, childPath, state, seen);\n        }\n      },\n    },\n  };\n}\n","export const SOURCE_PROP = \"__componentSourceLoc\";\n\n"],"mappings":"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","names":["resolved"]}

package/dist/webpack.cjs

@@ -0,0 +1,68 @@
+"use strict";
+
+// src/webpack.cts
+var path = require("path");
+function injectEntry(entry, runtimeEntry) {
+  if (!entry) {
+    return entry;
+  }
+  if (typeof entry === "string") {
+    return [runtimeEntry, entry];
+  }
+  if (Array.isArray(entry)) {
+    return [runtimeEntry, ...entry];
+  }
+  return Object.fromEntries(
+    Object.entries(entry).map(([key, value]) => {
+      if (Array.isArray(value)) {
+        return [key, [runtimeEntry, ...value]];
+      }
+      return [key, [runtimeEntry, value]];
+    })
+  );
+}
+function patchRules(rules, babelPluginPath) {
+  if (!rules) {
+    return;
+  }
+  for (const rule of rules) {
+    if (rule.oneOf) {
+      patchRules(rule.oneOf, babelPluginPath);
+    }
+    if (rule.loader?.includes("babel-loader")) {
+      rule.options = {
+        ...rule.options ?? {},
+        plugins: [...rule.options?.plugins ?? [], babelPluginPath]
+      };
+    }
+    if (rule.use) {
+      rule.use = rule.use.map((useEntry) => {
+        if (!useEntry.loader?.includes("babel-loader")) {
+          return useEntry;
+        }
+        return {
+          ...useEntry,
+          options: {
+            ...useEntry.options ?? {},
+            plugins: [...useEntry.options?.plugins ?? [], babelPluginPath]
+          }
+        };
+      });
+    }
+  }
+}
+function withReactComponentJump(config, options = {}) {
+  const { env = process.env.NODE_ENV ?? "development" } = options;
+  if (env !== "development") {
+    return config;
+  }
+  const babelPluginPath = path.join(__dirname, "babelInjectComponentSource.cjs");
+  const runtimeEntry = path.join(__dirname, "webpackRuntimeEntry.cjs");
+  patchRules(config.module?.rules, babelPluginPath);
+  config.entry = injectEntry(config.entry, runtimeEntry);
+  return config;
+}
+module.exports = {
+  withReactComponentJump
+};
+//# sourceMappingURL=webpack.cjs.map

package/dist/webpack.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/webpack.cts"],"sourcesContent":["const path = require(\"node:path\");\n\ntype WebpackAdapterOptions = {\n  env?: \"development\" | \"production\" | string;\n};\n\ntype Rule = {\n  oneOf?: Rule[];\n  use?: Array<{ loader?: string; options?: { plugins?: unknown[] } }>;\n  loader?: string;\n  options?: { plugins?: unknown[] };\n};\n\ntype WebpackConfig = {\n  entry?: string | string[] | Record<string, string | string[]>;\n  module?: {\n    rules?: Rule[];\n  };\n};\n\nfunction injectEntry(entry: WebpackConfig[\"entry\"], runtimeEntry: string) {\n  if (!entry) {\n    return entry;\n  }\n\n  if (typeof entry === \"string\") {\n    return [runtimeEntry, entry];\n  }\n\n  if (Array.isArray(entry)) {\n    return [runtimeEntry, ...entry];\n  }\n\n  return Object.fromEntries(\n    Object.entries(entry).map(([key, value]) => {\n      if (Array.isArray(value)) {\n        return [key, [runtimeEntry, ...value]];\n      }\n\n      return [key, [runtimeEntry, value]];\n    }),\n  );\n}\n\nfunction patchRules(rules: Rule[] | undefined, babelPluginPath: string) {\n  if (!rules) {\n    return;\n  }\n\n  for (const rule of rules) {\n    if (rule.oneOf) {\n      patchRules(rule.oneOf, babelPluginPath);\n    }\n\n    if (rule.loader?.includes(\"babel-loader\")) {\n      rule.options = {\n        ...(rule.options ?? {}),\n        plugins: [...(rule.options?.plugins ?? []), babelPluginPath],\n      };\n    }\n\n    if (rule.use) {\n      rule.use = rule.use.map((useEntry) => {\n        if (!useEntry.loader?.includes(\"babel-loader\")) {\n          return useEntry;\n        }\n\n        return {\n          ...useEntry,\n          options: {\n            ...(useEntry.options ?? {}),\n            plugins: [...(useEntry.options?.plugins ?? []), babelPluginPath],\n          },\n        };\n      });\n    }\n  }\n}\n\nfunction withReactComponentJump(config: WebpackConfig, options: WebpackAdapterOptions = {}) {\n  const { env = process.env.NODE_ENV ?? \"development\" } = options;\n  if (env !== \"development\") {\n    return config;\n  }\n\n  const babelPluginPath = path.join(__dirname, \"babelInjectComponentSource.cjs\");\n  const runtimeEntry = path.join(__dirname, \"webpackRuntimeEntry.cjs\");\n\n  patchRules(config.module?.rules, babelPluginPath);\n  config.entry = injectEntry(config.entry, runtimeEntry);\n  return config;\n}\n\nmodule.exports = {\n  withReactComponentJump,\n};\n"],"mappings":";;;AAAA,IAAM,OAAO,QAAQ,MAAW;AAoBhC,SAAS,YAAY,OAA+B,cAAsB;AACxE,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO,CAAC,cAAc,KAAK;AAAA,EAC7B;AAEA,MAAI,MAAM,QAAQ,KAAK,GAAG;AACxB,WAAO,CAAC,cAAc,GAAG,KAAK;AAAA,EAChC;AAEA,SAAO,OAAO;AAAA,IACZ,OAAO,QAAQ,KAAK,EAAE,IAAI,CAAC,CAAC,KAAK,KAAK,MAAM;AAC1C,UAAI,MAAM,QAAQ,KAAK,GAAG;AACxB,eAAO,CAAC,KAAK,CAAC,cAAc,GAAG,KAAK,CAAC;AAAA,MACvC;AAEA,aAAO,CAAC,KAAK,CAAC,cAAc,KAAK,CAAC;AAAA,IACpC,CAAC;AAAA,EACH;AACF;AAEA,SAAS,WAAW,OAA2B,iBAAyB;AACtE,MAAI,CAAC,OAAO;AACV;AAAA,EACF;AAEA,aAAW,QAAQ,OAAO;AACxB,QAAI,KAAK,OAAO;AACd,iBAAW,KAAK,OAAO,eAAe;AAAA,IACxC;AAEA,QAAI,KAAK,QAAQ,SAAS,cAAc,GAAG;AACzC,WAAK,UAAU;AAAA,QACb,GAAI,KAAK,WAAW,CAAC;AAAA,QACrB,SAAS,CAAC,GAAI,KAAK,SAAS,WAAW,CAAC,GAAI,eAAe;AAAA,MAC7D;AAAA,IACF;AAEA,QAAI,KAAK,KAAK;AACZ,WAAK,MAAM,KAAK,IAAI,IAAI,CAAC,aAAa;AACpC,YAAI,CAAC,SAAS,QAAQ,SAAS,cAAc,GAAG;AAC9C,iBAAO;AAAA,QACT;AAEA,eAAO;AAAA,UACL,GAAG;AAAA,UACH,SAAS;AAAA,YACP,GAAI,SAAS,WAAW,CAAC;AAAA,YACzB,SAAS,CAAC,GAAI,SAAS,SAAS,WAAW,CAAC,GAAI,eAAe;AAAA,UACjE;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AACF;AAEA,SAAS,uBAAuB,QAAuB,UAAiC,CAAC,GAAG;AAC1F,QAAM,EAAE,MAAM,QAAQ,IAAI,YAAY,cAAc,IAAI;AACxD,MAAI,QAAQ,eAAe;AACzB,WAAO;AAAA,EACT;AAEA,QAAM,kBAAkB,KAAK,KAAK,WAAW,gCAAgC;AAC7E,QAAM,eAAe,KAAK,KAAK,WAAW,yBAAyB;AAEnE,aAAW,OAAO,QAAQ,OAAO,eAAe;AAChD,SAAO,QAAQ,YAAY,OAAO,OAAO,YAAY;AACrD,SAAO;AACT;AAEA,OAAO,UAAU;AAAA,EACf;AACF;","names":[]}

package/dist/webpack.d.cts

@@ -0,0 +1,2 @@
+
+export {  }

package/dist/webpack.d.ts

@@ -0,0 +1,2 @@
+
+export {  }

package/dist/webpack.js

@@ -0,0 +1,82 @@
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __commonJS = (cb, mod) => function __require2() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+
+// src/webpack.cts
+var require_webpack = __commonJS({
+  "src/webpack.cts"(exports, module) {
+    var path = __require("path");
+    function injectEntry(entry, runtimeEntry) {
+      if (!entry) {
+        return entry;
+      }
+      if (typeof entry === "string") {
+        return [runtimeEntry, entry];
+      }
+      if (Array.isArray(entry)) {
+        return [runtimeEntry, ...entry];
+      }
+      return Object.fromEntries(
+        Object.entries(entry).map(([key, value]) => {
+          if (Array.isArray(value)) {
+            return [key, [runtimeEntry, ...value]];
+          }
+          return [key, [runtimeEntry, value]];
+        })
+      );
+    }
+    function patchRules(rules, babelPluginPath) {
+      if (!rules) {
+        return;
+      }
+      for (const rule of rules) {
+        if (rule.oneOf) {
+          patchRules(rule.oneOf, babelPluginPath);
+        }
+        if (rule.loader?.includes("babel-loader")) {
+          rule.options = {
+            ...rule.options ?? {},
+            plugins: [...rule.options?.plugins ?? [], babelPluginPath]
+          };
+        }
+        if (rule.use) {
+          rule.use = rule.use.map((useEntry) => {
+            if (!useEntry.loader?.includes("babel-loader")) {
+              return useEntry;
+            }
+            return {
+              ...useEntry,
+              options: {
+                ...useEntry.options ?? {},
+                plugins: [...useEntry.options?.plugins ?? [], babelPluginPath]
+              }
+            };
+          });
+        }
+      }
+    }
+    function withReactComponentJump(config, options = {}) {
+      const { env = process.env.NODE_ENV ?? "development" } = options;
+      if (env !== "development") {
+        return config;
+      }
+      const babelPluginPath = path.join(__dirname, "babelInjectComponentSource.cjs");
+      const runtimeEntry = path.join(__dirname, "webpackRuntimeEntry.cjs");
+      patchRules(config.module?.rules, babelPluginPath);
+      config.entry = injectEntry(config.entry, runtimeEntry);
+      return config;
+    }
+    module.exports = {
+      withReactComponentJump
+    };
+  }
+});
+export default require_webpack();
+//# sourceMappingURL=webpack.js.map

package/dist/webpack.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/webpack.cts"],"sourcesContent":["const path = require(\"node:path\");\n\ntype WebpackAdapterOptions = {\n  env?: \"development\" | \"production\" | string;\n};\n\ntype Rule = {\n  oneOf?: Rule[];\n  use?: Array<{ loader?: string; options?: { plugins?: unknown[] } }>;\n  loader?: string;\n  options?: { plugins?: unknown[] };\n};\n\ntype WebpackConfig = {\n  entry?: string | string[] | Record<string, string | string[]>;\n  module?: {\n    rules?: Rule[];\n  };\n};\n\nfunction injectEntry(entry: WebpackConfig[\"entry\"], runtimeEntry: string) {\n  if (!entry) {\n    return entry;\n  }\n\n  if (typeof entry === \"string\") {\n    return [runtimeEntry, entry];\n  }\n\n  if (Array.isArray(entry)) {\n    return [runtimeEntry, ...entry];\n  }\n\n  return Object.fromEntries(\n    Object.entries(entry).map(([key, value]) => {\n      if (Array.isArray(value)) {\n        return [key, [runtimeEntry, ...value]];\n      }\n\n      return [key, [runtimeEntry, value]];\n    }),\n  );\n}\n\nfunction patchRules(rules: Rule[] | undefined, babelPluginPath: string) {\n  if (!rules) {\n    return;\n  }\n\n  for (const rule of rules) {\n    if (rule.oneOf) {\n      patchRules(rule.oneOf, babelPluginPath);\n    }\n\n    if (rule.loader?.includes(\"babel-loader\")) {\n      rule.options = {\n        ...(rule.options ?? {}),\n        plugins: [...(rule.options?.plugins ?? []), babelPluginPath],\n      };\n    }\n\n    if (rule.use) {\n      rule.use = rule.use.map((useEntry) => {\n        if (!useEntry.loader?.includes(\"babel-loader\")) {\n          return useEntry;\n        }\n\n        return {\n          ...useEntry,\n          options: {\n            ...(useEntry.options ?? {}),\n            plugins: [...(useEntry.options?.plugins ?? []), babelPluginPath],\n          },\n        };\n      });\n    }\n  }\n}\n\nfunction withReactComponentJump(config: WebpackConfig, options: WebpackAdapterOptions = {}) {\n  const { env = process.env.NODE_ENV ?? \"development\" } = options;\n  if (env !== \"development\") {\n    return config;\n  }\n\n  const babelPluginPath = path.join(__dirname, \"babelInjectComponentSource.cjs\");\n  const runtimeEntry = path.join(__dirname, \"webpackRuntimeEntry.cjs\");\n\n  patchRules(config.module?.rules, babelPluginPath);\n  config.entry = injectEntry(config.entry, runtimeEntry);\n  return config;\n}\n\nmodule.exports = {\n  withReactComponentJump,\n};\n"],"mappings":";;;;;;;;;;;;AAAA;AAAA;AAAA,QAAM,OAAO,UAAQ,MAAW;AAoBhC,aAAS,YAAY,OAA+B,cAAsB;AACxE,UAAI,CAAC,OAAO;AACV,eAAO;AAAA,MACT;AAEA,UAAI,OAAO,UAAU,UAAU;AAC7B,eAAO,CAAC,cAAc,KAAK;AAAA,MAC7B;AAEA,UAAI,MAAM,QAAQ,KAAK,GAAG;AACxB,eAAO,CAAC,cAAc,GAAG,KAAK;AAAA,MAChC;AAEA,aAAO,OAAO;AAAA,QACZ,OAAO,QAAQ,KAAK,EAAE,IAAI,CAAC,CAAC,KAAK,KAAK,MAAM;AAC1C,cAAI,MAAM,QAAQ,KAAK,GAAG;AACxB,mBAAO,CAAC,KAAK,CAAC,cAAc,GAAG,KAAK,CAAC;AAAA,UACvC;AAEA,iBAAO,CAAC,KAAK,CAAC,cAAc,KAAK,CAAC;AAAA,QACpC,CAAC;AAAA,MACH;AAAA,IACF;AAEA,aAAS,WAAW,OAA2B,iBAAyB;AACtE,UAAI,CAAC,OAAO;AACV;AAAA,MACF;AAEA,iBAAW,QAAQ,OAAO;AACxB,YAAI,KAAK,OAAO;AACd,qBAAW,KAAK,OAAO,eAAe;AAAA,QACxC;AAEA,YAAI,KAAK,QAAQ,SAAS,cAAc,GAAG;AACzC,eAAK,UAAU;AAAA,YACb,GAAI,KAAK,WAAW,CAAC;AAAA,YACrB,SAAS,CAAC,GAAI,KAAK,SAAS,WAAW,CAAC,GAAI,eAAe;AAAA,UAC7D;AAAA,QACF;AAEA,YAAI,KAAK,KAAK;AACZ,eAAK,MAAM,KAAK,IAAI,IAAI,CAAC,aAAa;AACpC,gBAAI,CAAC,SAAS,QAAQ,SAAS,cAAc,GAAG;AAC9C,qBAAO;AAAA,YACT;AAEA,mBAAO;AAAA,cACL,GAAG;AAAA,cACH,SAAS;AAAA,gBACP,GAAI,SAAS,WAAW,CAAC;AAAA,gBACzB,SAAS,CAAC,GAAI,SAAS,SAAS,WAAW,CAAC,GAAI,eAAe;AAAA,cACjE;AAAA,YACF;AAAA,UACF,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAEA,aAAS,uBAAuB,QAAuB,UAAiC,CAAC,GAAG;AAC1F,YAAM,EAAE,MAAM,QAAQ,IAAI,YAAY,cAAc,IAAI;AACxD,UAAI,QAAQ,eAAe;AACzB,eAAO;AAAA,MACT;AAEA,YAAM,kBAAkB,KAAK,KAAK,WAAW,gCAAgC;AAC7E,YAAM,eAAe,KAAK,KAAK,WAAW,yBAAyB;AAEnE,iBAAW,OAAO,QAAQ,OAAO,eAAe;AAChD,aAAO,QAAQ,YAAY,OAAO,OAAO,YAAY;AACrD,aAAO;AAAA,IACT;AAEA,WAAO,UAAU;AAAA,MACf;AAAA,IACF;AAAA;AAAA;","names":[]}

package/dist/webpackRuntimeEntry.cjs

@@ -0,0 +1,128 @@
+"use strict";
+
+// src/constants.ts
+var SOURCE_PROP = "__componentSourceLoc";
+
+// src/runtime.ts
+function isTriggerPressed(event, triggerKey) {
+  if (triggerKey === "none") {
+    return true;
+  }
+  if (triggerKey === "alt") {
+    return event.altKey;
+  }
+  if (triggerKey === "meta") {
+    return event.metaKey;
+  }
+  if (triggerKey === "ctrl") {
+    return event.ctrlKey;
+  }
+  return event.shiftKey;
+}
+function getReactFiberKey(element) {
+  return Object.keys(element).find((key) => key.startsWith("__reactFiber$") || key.startsWith("__reactInternalInstance$"));
+}
+function getClosestReactFiber(target) {
+  let current = target;
+  while (current) {
+    const fiberKey = getReactFiberKey(current);
+    if (fiberKey) {
+      return current[fiberKey];
+    }
+    current = current.parentElement;
+  }
+  return null;
+}
+function getSourceFromType(type) {
+  if (!type) {
+    return null;
+  }
+  if (typeof type === "function") {
+    const source2 = type[SOURCE_PROP];
+    return typeof source2 === "string" ? source2 : null;
+  }
+  if (typeof type !== "object") {
+    return null;
+  }
+  const record = type;
+  const source = record[SOURCE_PROP] ?? record.type?.[SOURCE_PROP] ?? record.render?.[SOURCE_PROP];
+  return typeof source === "string" ? source : null;
+}
+function resolveSourceFromFiber(fiber) {
+  let current = fiber;
+  while (current) {
+    const source = getSourceFromType(current.type) ?? getSourceFromType(current.elementType);
+    if (source) {
+      return source;
+    }
+    current = current.return ?? null;
+  }
+  return null;
+}
+function getDebugSource(fiber) {
+  let current = fiber;
+  while (current) {
+    const debugSource = current._debugSource;
+    if (debugSource?.fileName && typeof debugSource.lineNumber === "number") {
+      return `${debugSource.fileName.replace(/\\/g, "/")}:${debugSource.lineNumber}:${debugSource.columnNumber ?? 1}`;
+    }
+    current = current.return ?? null;
+  }
+  return null;
+}
+function locateComponentSource(target) {
+  const elementTarget = target instanceof Element ? target : target instanceof Node ? target.parentElement : null;
+  const fiber = getClosestReactFiber(elementTarget);
+  if (!fiber) {
+    return null;
+  }
+  const debugSource = getDebugSource(fiber);
+  if (debugSource) {
+    return {
+      source: debugSource,
+      mode: "jsx"
+    };
+  }
+  const componentSource = resolveSourceFromFiber(fiber);
+  if (!componentSource) {
+    return null;
+  }
+  return {
+    source: componentSource,
+    mode: "component"
+  };
+}
+function enableReactComponentJump(options = {}) {
+  const {
+    triggerKey = "shift",
+    onLocate = (result) => {
+      console.log(`[react-component-jump] ${result.source}`);
+    },
+    onError = (error) => {
+      console.error("[react-component-jump]", error);
+    }
+  } = options;
+  const handler = (event) => {
+    if (!isTriggerPressed(event, triggerKey)) {
+      return;
+    }
+    const result = locateComponentSource(event.target);
+    if (!result) {
+      onError(new Error("No React component source metadata found for clicked element."));
+      return;
+    }
+    event.preventDefault();
+    event.stopPropagation();
+    onLocate(result);
+  };
+  document.addEventListener("click", handler, true);
+  return () => {
+    document.removeEventListener("click", handler, true);
+  };
+}
+
+// src/webpackRuntimeEntry.ts
+if (typeof document !== "undefined") {
+  enableReactComponentJump();
+}
+//# sourceMappingURL=webpackRuntimeEntry.cjs.map

package/dist/webpackRuntimeEntry.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/constants.ts","../src/runtime.ts","../src/webpackRuntimeEntry.ts"],"sourcesContent":["export const SOURCE_PROP = \"__componentSourceLoc\";\n\n","import { SOURCE_PROP } from \"./constants\";\n\nexport type TriggerKey = \"alt\" | \"meta\" | \"ctrl\" | \"shift\" | \"none\";\n\ntype ReactFiber = {\n  return?: ReactFiber | null;\n  type?: unknown;\n  elementType?: unknown;\n  _debugSource?: {\n    fileName?: string;\n    lineNumber?: number;\n    columnNumber?: number;\n  } | null;\n};\n\nexport type LocatorResult = {\n  source: string;\n  mode: \"jsx\" | \"component\";\n};\n\nexport type LocatorOptions = {\n  triggerKey?: TriggerKey;\n  onLocate?: (result: LocatorResult) => void;\n  onError?: (error: unknown) => void;\n};\n\nfunction isTriggerPressed(event: MouseEvent, triggerKey: TriggerKey) {\n  if (triggerKey === \"none\") {\n    return true;\n  }\n\n  if (triggerKey === \"alt\") {\n    return event.altKey;\n  }\n\n  if (triggerKey === \"meta\") {\n    return event.metaKey;\n  }\n\n  if (triggerKey === \"ctrl\") {\n    return event.ctrlKey;\n  }\n\n  return event.shiftKey;\n}\n\nfunction getReactFiberKey(element: Element) {\n  return Object.keys(element).find((key) => key.startsWith(\"__reactFiber$\") || key.startsWith(\"__reactInternalInstance$\"));\n}\n\nfunction getClosestReactFiber(target: Element | null) {\n  let current = target;\n\n  while (current) {\n    const fiberKey = getReactFiberKey(current);\n    if (fiberKey) {\n      return (current as unknown as Record<string, unknown>)[fiberKey] as ReactFiber;\n    }\n\n    current = current.parentElement;\n  }\n\n  return null;\n}\n\nfunction getSourceFromType(type: unknown) {\n  if (!type) {\n    return null;\n  }\n\n  if (typeof type === \"function\") {\n    const source = (type as unknown as Record<string, unknown>)[SOURCE_PROP];\n    return typeof source === \"string\" ? source : null;\n  }\n\n  if (typeof type !== \"object\") {\n    return null;\n  }\n\n  const record = type as {\n    type?: Record<string, unknown>;\n    render?: Record<string, unknown>;\n    [SOURCE_PROP]?: unknown;\n  };\n\n  const source = record[SOURCE_PROP] ?? record.type?.[SOURCE_PROP] ?? record.render?.[SOURCE_PROP];\n  return typeof source === \"string\" ? source : null;\n}\n\nfunction resolveSourceFromFiber(fiber: ReactFiber | null) {\n  let current = fiber;\n\n  while (current) {\n    const source = getSourceFromType(current.type) ?? getSourceFromType(current.elementType);\n    if (source) {\n      return source;\n    }\n\n    current = current.return ?? null;\n  }\n\n  return null;\n}\n\nfunction getDebugSource(fiber: ReactFiber | null) {\n  let current = fiber;\n\n  while (current) {\n    const debugSource = current._debugSource;\n    if (debugSource?.fileName && typeof debugSource.lineNumber === \"number\") {\n      return `${debugSource.fileName.replace(/\\\\/g, \"/\")}:${debugSource.lineNumber}:${debugSource.columnNumber ?? 1}`;\n    }\n\n    current = current.return ?? null;\n  }\n\n  return null;\n}\n\nexport function locateComponentSource(target: EventTarget | null): LocatorResult | null {\n  const elementTarget =\n    target instanceof Element ? target : target instanceof Node ? target.parentElement : null;\n  const fiber = getClosestReactFiber(elementTarget);\n  if (!fiber) {\n    return null;\n  }\n\n  const debugSource = getDebugSource(fiber);\n  if (debugSource) {\n    return {\n      source: debugSource,\n      mode: \"jsx\",\n    };\n  }\n\n  const componentSource = resolveSourceFromFiber(fiber);\n  if (!componentSource) {\n    return null;\n  }\n\n  return {\n    source: componentSource,\n    mode: \"component\",\n  };\n}\n\nexport function enableReactComponentJump(options: LocatorOptions = {}) {\n  const {\n    triggerKey = \"shift\",\n    onLocate = (result) => {\n      console.log(`[react-component-jump] ${result.source}`);\n    },\n    onError = (error) => {\n      console.error(\"[react-component-jump]\", error);\n    },\n  } = options;\n\n  const handler = (event: MouseEvent) => {\n    if (!isTriggerPressed(event, triggerKey)) {\n      return;\n    }\n\n    const result = locateComponentSource(event.target);\n    if (!result) {\n      onError(new Error(\"No React component source metadata found for clicked element.\"));\n      return;\n    }\n\n    event.preventDefault();\n    event.stopPropagation();\n    onLocate(result);\n  };\n\n  document.addEventListener(\"click\", handler, true);\n\n  return () => {\n    document.removeEventListener(\"click\", handler, true);\n  };\n}\n","import { enableReactComponentJump } from \"./runtime\";\n\nif (typeof document !== \"undefined\") {\n  enableReactComponentJump();\n}\n\n"],"mappings":"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","names":["source"]}

package/dist/webpackRuntimeEntry.d.cts

@@ -0,0 +1,2 @@
+
+export {  }

package/dist/webpackRuntimeEntry.d.ts

@@ -0,0 +1,2 @@
+
+export {  }

package/dist/webpackRuntimeEntry.js

@@ -0,0 +1,126 @@
+// src/constants.ts
+var SOURCE_PROP = "__componentSourceLoc";
+
+// src/runtime.ts
+function isTriggerPressed(event, triggerKey) {
+  if (triggerKey === "none") {
+    return true;
+  }
+  if (triggerKey === "alt") {
+    return event.altKey;
+  }
+  if (triggerKey === "meta") {
+    return event.metaKey;
+  }
+  if (triggerKey === "ctrl") {
+    return event.ctrlKey;
+  }
+  return event.shiftKey;
+}
+function getReactFiberKey(element) {
+  return Object.keys(element).find((key) => key.startsWith("__reactFiber$") || key.startsWith("__reactInternalInstance$"));
+}
+function getClosestReactFiber(target) {
+  let current = target;
+  while (current) {
+    const fiberKey = getReactFiberKey(current);
+    if (fiberKey) {
+      return current[fiberKey];
+    }
+    current = current.parentElement;
+  }
+  return null;
+}
+function getSourceFromType(type) {
+  if (!type) {
+    return null;
+  }
+  if (typeof type === "function") {
+    const source2 = type[SOURCE_PROP];
+    return typeof source2 === "string" ? source2 : null;
+  }
+  if (typeof type !== "object") {
+    return null;
+  }
+  const record = type;
+  const source = record[SOURCE_PROP] ?? record.type?.[SOURCE_PROP] ?? record.render?.[SOURCE_PROP];
+  return typeof source === "string" ? source : null;
+}
+function resolveSourceFromFiber(fiber) {
+  let current = fiber;
+  while (current) {
+    const source = getSourceFromType(current.type) ?? getSourceFromType(current.elementType);
+    if (source) {
+      return source;
+    }
+    current = current.return ?? null;
+  }
+  return null;
+}
+function getDebugSource(fiber) {
+  let current = fiber;
+  while (current) {
+    const debugSource = current._debugSource;
+    if (debugSource?.fileName && typeof debugSource.lineNumber === "number") {
+      return `${debugSource.fileName.replace(/\\/g, "/")}:${debugSource.lineNumber}:${debugSource.columnNumber ?? 1}`;
+    }
+    current = current.return ?? null;
+  }
+  return null;
+}
+function locateComponentSource(target) {
+  const elementTarget = target instanceof Element ? target : target instanceof Node ? target.parentElement : null;
+  const fiber = getClosestReactFiber(elementTarget);
+  if (!fiber) {
+    return null;
+  }
+  const debugSource = getDebugSource(fiber);
+  if (debugSource) {
+    return {
+      source: debugSource,
+      mode: "jsx"
+    };
+  }
+  const componentSource = resolveSourceFromFiber(fiber);
+  if (!componentSource) {
+    return null;
+  }
+  return {
+    source: componentSource,
+    mode: "component"
+  };
+}
+function enableReactComponentJump(options = {}) {
+  const {
+    triggerKey = "shift",
+    onLocate = (result) => {
+      console.log(`[react-component-jump] ${result.source}`);
+    },
+    onError = (error) => {
+      console.error("[react-component-jump]", error);
+    }
+  } = options;
+  const handler = (event) => {
+    if (!isTriggerPressed(event, triggerKey)) {
+      return;
+    }
+    const result = locateComponentSource(event.target);
+    if (!result) {
+      onError(new Error("No React component source metadata found for clicked element."));
+      return;
+    }
+    event.preventDefault();
+    event.stopPropagation();
+    onLocate(result);
+  };
+  document.addEventListener("click", handler, true);
+  return () => {
+    document.removeEventListener("click", handler, true);
+  };
+}
+
+// src/webpackRuntimeEntry.ts
+if (typeof document !== "undefined") {
+  enableReactComponentJump();
+}
+//# sourceMappingURL=webpackRuntimeEntry.js.map

package/dist/webpackRuntimeEntry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/constants.ts","../src/runtime.ts","../src/webpackRuntimeEntry.ts"],"sourcesContent":["export const SOURCE_PROP = \"__componentSourceLoc\";\n\n","import { SOURCE_PROP } from \"./constants\";\n\nexport type TriggerKey = \"alt\" | \"meta\" | \"ctrl\" | \"shift\" | \"none\";\n\ntype ReactFiber = {\n  return?: ReactFiber | null;\n  type?: unknown;\n  elementType?: unknown;\n  _debugSource?: {\n    fileName?: string;\n    lineNumber?: number;\n    columnNumber?: number;\n  } | null;\n};\n\nexport type LocatorResult = {\n  source: string;\n  mode: \"jsx\" | \"component\";\n};\n\nexport type LocatorOptions = {\n  triggerKey?: TriggerKey;\n  onLocate?: (result: LocatorResult) => void;\n  onError?: (error: unknown) => void;\n};\n\nfunction isTriggerPressed(event: MouseEvent, triggerKey: TriggerKey) {\n  if (triggerKey === \"none\") {\n    return true;\n  }\n\n  if (triggerKey === \"alt\") {\n    return event.altKey;\n  }\n\n  if (triggerKey === \"meta\") {\n    return event.metaKey;\n  }\n\n  if (triggerKey === \"ctrl\") {\n    return event.ctrlKey;\n  }\n\n  return event.shiftKey;\n}\n\nfunction getReactFiberKey(element: Element) {\n  return Object.keys(element).find((key) => key.startsWith(\"__reactFiber$\") || key.startsWith(\"__reactInternalInstance$\"));\n}\n\nfunction getClosestReactFiber(target: Element | null) {\n  let current = target;\n\n  while (current) {\n    const fiberKey = getReactFiberKey(current);\n    if (fiberKey) {\n      return (current as unknown as Record<string, unknown>)[fiberKey] as ReactFiber;\n    }\n\n    current = current.parentElement;\n  }\n\n  return null;\n}\n\nfunction getSourceFromType(type: unknown) {\n  if (!type) {\n    return null;\n  }\n\n  if (typeof type === \"function\") {\n    const source = (type as unknown as Record<string, unknown>)[SOURCE_PROP];\n    return typeof source === \"string\" ? source : null;\n  }\n\n  if (typeof type !== \"object\") {\n    return null;\n  }\n\n  const record = type as {\n    type?: Record<string, unknown>;\n    render?: Record<string, unknown>;\n    [SOURCE_PROP]?: unknown;\n  };\n\n  const source = record[SOURCE_PROP] ?? record.type?.[SOURCE_PROP] ?? record.render?.[SOURCE_PROP];\n  return typeof source === \"string\" ? source : null;\n}\n\nfunction resolveSourceFromFiber(fiber: ReactFiber | null) {\n  let current = fiber;\n\n  while (current) {\n    const source = getSourceFromType(current.type) ?? getSourceFromType(current.elementType);\n    if (source) {\n      return source;\n    }\n\n    current = current.return ?? null;\n  }\n\n  return null;\n}\n\nfunction getDebugSource(fiber: ReactFiber | null) {\n  let current = fiber;\n\n  while (current) {\n    const debugSource = current._debugSource;\n    if (debugSource?.fileName && typeof debugSource.lineNumber === \"number\") {\n      return `${debugSource.fileName.replace(/\\\\/g, \"/\")}:${debugSource.lineNumber}:${debugSource.columnNumber ?? 1}`;\n    }\n\n    current = current.return ?? null;\n  }\n\n  return null;\n}\n\nexport function locateComponentSource(target: EventTarget | null): LocatorResult | null {\n  const elementTarget =\n    target instanceof Element ? target : target instanceof Node ? target.parentElement : null;\n  const fiber = getClosestReactFiber(elementTarget);\n  if (!fiber) {\n    return null;\n  }\n\n  const debugSource = getDebugSource(fiber);\n  if (debugSource) {\n    return {\n      source: debugSource,\n      mode: \"jsx\",\n    };\n  }\n\n  const componentSource = resolveSourceFromFiber(fiber);\n  if (!componentSource) {\n    return null;\n  }\n\n  return {\n    source: componentSource,\n    mode: \"component\",\n  };\n}\n\nexport function enableReactComponentJump(options: LocatorOptions = {}) {\n  const {\n    triggerKey = \"shift\",\n    onLocate = (result) => {\n      console.log(`[react-component-jump] ${result.source}`);\n    },\n    onError = (error) => {\n      console.error(\"[react-component-jump]\", error);\n    },\n  } = options;\n\n  const handler = (event: MouseEvent) => {\n    if (!isTriggerPressed(event, triggerKey)) {\n      return;\n    }\n\n    const result = locateComponentSource(event.target);\n    if (!result) {\n      onError(new Error(\"No React component source metadata found for clicked element.\"));\n      return;\n    }\n\n    event.preventDefault();\n    event.stopPropagation();\n    onLocate(result);\n  };\n\n  document.addEventListener(\"click\", handler, true);\n\n  return () => {\n    document.removeEventListener(\"click\", handler, true);\n  };\n}\n","import { enableReactComponentJump } from \"./runtime\";\n\nif (typeof document !== \"undefined\") {\n  enableReactComponentJump();\n}\n\n"],"mappings":"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","names":["source"]}