react-code-locator 0.1.9 → 0.1.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +49 -44
- package/dist/babel.cjs +428 -40
- package/dist/babel.cjs.map +1 -1
- package/dist/babel.d.cts +12 -1
- package/dist/babel.d.ts +12 -1
- package/dist/babel.js +425 -29
- package/dist/babel.js.map +1 -1
- package/dist/babelInjectComponentSource.cjs +400 -38
- package/dist/babelInjectComponentSource.cjs.map +1 -1
- package/dist/babelInjectComponentSource.d.cts +3 -4
- package/dist/babelInjectComponentSource.d.ts +3 -4
- package/dist/babelInjectComponentSource.js +400 -28
- package/dist/babelInjectComponentSource.js.map +1 -1
- package/dist/client-sm5wi0uT.d.cts +15 -0
- package/dist/client-sm5wi0uT.d.ts +15 -0
- package/dist/client.cjs +157 -28
- package/dist/client.cjs.map +1 -1
- package/dist/client.d.cts +1 -14
- package/dist/client.d.ts +1 -14
- package/dist/client.js +157 -28
- package/dist/client.js.map +1 -1
- package/dist/esbuild.cjs +616 -0
- package/dist/esbuild.cjs.map +1 -0
- package/dist/esbuild.d.cts +25 -0
- package/dist/esbuild.d.ts +25 -0
- package/dist/esbuild.js +589 -0
- package/dist/esbuild.js.map +1 -0
- package/dist/index.cjs +843 -30
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +9 -1
- package/dist/index.d.ts +9 -1
- package/dist/index.js +830 -29
- package/dist/index.js.map +1 -1
- package/dist/sourceAdapter-DLWo_ABo.d.cts +15 -0
- package/dist/sourceAdapter-DLWo_ABo.d.ts +15 -0
- package/dist/swc.cjs +589 -0
- package/dist/swc.cjs.map +1 -0
- package/dist/swc.d.cts +29 -0
- package/dist/swc.d.ts +29 -0
- package/dist/swc.js +560 -0
- package/dist/swc.js.map +1 -0
- package/dist/vite.cjs +529 -84
- package/dist/vite.cjs.map +1 -1
- package/dist/vite.d.cts +20 -6
- package/dist/vite.d.ts +20 -6
- package/dist/vite.js +524 -72
- package/dist/vite.js.map +1 -1
- package/dist/webpackRuntimeEntry.cjs +157 -28
- package/dist/webpackRuntimeEntry.cjs.map +1 -1
- package/dist/webpackRuntimeEntry.js +157 -28
- package/dist/webpackRuntimeEntry.js.map +1 -1
- package/package.json +12 -1
package/dist/index.cjs
CHANGED
|
@@ -20,13 +20,94 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
20
20
|
// src/index.ts
|
|
21
21
|
var index_exports = {};
|
|
22
22
|
__export(index_exports, {
|
|
23
|
+
babelInjectComponentSource: () => babelInjectComponentSource,
|
|
24
|
+
babelSourceAdapter: () => babelSourceAdapter,
|
|
25
|
+
createBabelSourceAdapter: () => createBabelSourceAdapter,
|
|
26
|
+
createEsbuildSourceAdapter: () => createEsbuildSourceAdapter,
|
|
27
|
+
createSwcSourceAdapter: () => createSwcSourceAdapter,
|
|
28
|
+
createViteClientInjector: () => createViteClientInjector,
|
|
29
|
+
createViteSourceAdapter: () => createViteSourceAdapter,
|
|
30
|
+
defineSourceAdapter: () => defineSourceAdapter,
|
|
23
31
|
enableReactComponentJump: () => enableReactComponentJump,
|
|
24
|
-
|
|
32
|
+
esbuildSourceAdapter: () => esbuildSourceAdapter,
|
|
33
|
+
locateComponentSource: () => locateComponentSource,
|
|
34
|
+
reactComponentJump: () => createViteClientInjector,
|
|
35
|
+
swcSourceAdapter: () => swcSourceAdapter,
|
|
36
|
+
viteSourceAdapter: () => viteSourceAdapter
|
|
25
37
|
});
|
|
26
38
|
module.exports = __toCommonJS(index_exports);
|
|
27
39
|
|
|
28
40
|
// src/constants.ts
|
|
29
41
|
var SOURCE_PROP = "__componentSourceLoc";
|
|
42
|
+
var JSX_SOURCE_PROP = "$componentSourceLoc";
|
|
43
|
+
var JSX_SOURCE_REGISTRY_SYMBOL = "react-code-locator.jsxSourceRegistry";
|
|
44
|
+
|
|
45
|
+
// src/sourceMetadata.ts
|
|
46
|
+
function normalizeSlashes(value) {
|
|
47
|
+
return value.replace(/\\/g, "/");
|
|
48
|
+
}
|
|
49
|
+
function trimTrailingSlash(value) {
|
|
50
|
+
return value.replace(/\/+$/, "");
|
|
51
|
+
}
|
|
52
|
+
function splitPathSegments(value) {
|
|
53
|
+
return normalizeSlashes(value).split("/").filter(Boolean);
|
|
54
|
+
}
|
|
55
|
+
function computeRelativePath(fromPath, toPath) {
|
|
56
|
+
const fromSegments = splitPathSegments(fromPath);
|
|
57
|
+
const toSegments = splitPathSegments(toPath);
|
|
58
|
+
let sharedIndex = 0;
|
|
59
|
+
while (sharedIndex < fromSegments.length && sharedIndex < toSegments.length && fromSegments[sharedIndex] === toSegments[sharedIndex]) {
|
|
60
|
+
sharedIndex += 1;
|
|
61
|
+
}
|
|
62
|
+
const upSegments = new Array(Math.max(0, fromSegments.length - sharedIndex)).fill("..");
|
|
63
|
+
const downSegments = toSegments.slice(sharedIndex);
|
|
64
|
+
const relativeSegments = [...upSegments, ...downSegments];
|
|
65
|
+
return relativeSegments.length > 0 ? relativeSegments.join("/") : ".";
|
|
66
|
+
}
|
|
67
|
+
function normalizeProjectRoot(projectRoot) {
|
|
68
|
+
if (projectRoot) {
|
|
69
|
+
return trimTrailingSlash(normalizeSlashes(projectRoot));
|
|
70
|
+
}
|
|
71
|
+
return "";
|
|
72
|
+
}
|
|
73
|
+
function toRelativeSource(filename, loc, projectRoot) {
|
|
74
|
+
if (!filename || !loc) {
|
|
75
|
+
return null;
|
|
76
|
+
}
|
|
77
|
+
const root = normalizeProjectRoot(projectRoot);
|
|
78
|
+
const normalizedFilename = normalizeSlashes(filename);
|
|
79
|
+
const relPath = root && normalizedFilename.startsWith(`${root}/`) ? normalizedFilename.slice(root.length + 1) : root ? computeRelativePath(root, normalizedFilename) : normalizedFilename;
|
|
80
|
+
return `${relPath}:${loc.line}:${loc.column + 1}`;
|
|
81
|
+
}
|
|
82
|
+
function getSourceFile(source) {
|
|
83
|
+
if (!source) {
|
|
84
|
+
return null;
|
|
85
|
+
}
|
|
86
|
+
const match = source.match(/^(.*):\d+:\d+$/);
|
|
87
|
+
return match?.[1] ?? null;
|
|
88
|
+
}
|
|
89
|
+
function isProjectLocalFile(filename, projectRoot) {
|
|
90
|
+
if (!filename) {
|
|
91
|
+
return false;
|
|
92
|
+
}
|
|
93
|
+
const root = normalizeProjectRoot(projectRoot);
|
|
94
|
+
const normalizedFilename = normalizeSlashes(filename);
|
|
95
|
+
if (!root) {
|
|
96
|
+
return !normalizedFilename.startsWith("../") && !normalizedFilename.startsWith("/") && !/^[A-Za-z]:\//.test(normalizedFilename);
|
|
97
|
+
}
|
|
98
|
+
if (normalizedFilename.startsWith(`${root}/`) || normalizedFilename === root) {
|
|
99
|
+
return true;
|
|
100
|
+
}
|
|
101
|
+
const relativePath = computeRelativePath(root, normalizedFilename);
|
|
102
|
+
return !relativePath.startsWith("../");
|
|
103
|
+
}
|
|
104
|
+
function isExternalToProjectRoot(filename, projectRoot) {
|
|
105
|
+
return !isProjectLocalFile(filename, projectRoot);
|
|
106
|
+
}
|
|
107
|
+
function isProjectLocalSource(source, projectRoot) {
|
|
108
|
+
const file = getSourceFile(source);
|
|
109
|
+
return isProjectLocalFile(file ?? void 0, projectRoot);
|
|
110
|
+
}
|
|
30
111
|
|
|
31
112
|
// src/runtime.ts
|
|
32
113
|
function isTriggerPressed(event, triggerKey) {
|
|
@@ -74,7 +155,16 @@ function getSourceFromType(type) {
|
|
|
74
155
|
return typeof source === "string" ? source : null;
|
|
75
156
|
}
|
|
76
157
|
function getSourceFromProps(props) {
|
|
77
|
-
|
|
158
|
+
if (props && typeof props === "object") {
|
|
159
|
+
const registry = globalThis[Symbol.for(JSX_SOURCE_REGISTRY_SYMBOL)];
|
|
160
|
+
if (registry instanceof WeakMap) {
|
|
161
|
+
const intrinsicSource = registry.get(props);
|
|
162
|
+
if (typeof intrinsicSource === "string") {
|
|
163
|
+
return intrinsicSource;
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
const source = props?.[JSX_SOURCE_PROP];
|
|
78
168
|
return typeof source === "string" ? source : null;
|
|
79
169
|
}
|
|
80
170
|
function resolveComponentSourceFromFiber(fiber) {
|
|
@@ -95,35 +185,69 @@ function getDirectDebugSource(fiber) {
|
|
|
95
185
|
}
|
|
96
186
|
return null;
|
|
97
187
|
}
|
|
98
|
-
function
|
|
99
|
-
let current = fiber?._debugOwner ?? null;
|
|
100
|
-
while (current) {
|
|
101
|
-
const source = getSourceFromProps(current.pendingProps) ?? getSourceFromProps(current.memoizedProps) ?? getDirectDebugSource(current);
|
|
102
|
-
if (source) {
|
|
103
|
-
return source;
|
|
104
|
-
}
|
|
105
|
-
current = current._debugOwner ?? null;
|
|
106
|
-
}
|
|
107
|
-
return null;
|
|
108
|
-
}
|
|
109
|
-
function resolveNearestJsxSource(fiber) {
|
|
188
|
+
function resolveSourceCandidates(fiber) {
|
|
110
189
|
let current = fiber;
|
|
190
|
+
const jsxCandidates = [];
|
|
191
|
+
const componentCandidates = [];
|
|
111
192
|
while (current) {
|
|
112
|
-
const
|
|
113
|
-
if (
|
|
114
|
-
|
|
193
|
+
const jsxSource = getSourceFromProps(current.pendingProps) ?? getSourceFromProps(current.memoizedProps) ?? getDirectDebugSource(current);
|
|
194
|
+
if (jsxSource) {
|
|
195
|
+
const file = getSourceFile(jsxSource);
|
|
196
|
+
if (file && !jsxCandidates.some((candidate) => candidate.source === jsxSource)) {
|
|
197
|
+
jsxCandidates.push({ source: jsxSource, file });
|
|
198
|
+
}
|
|
199
|
+
}
|
|
200
|
+
const componentSource = getSourceFromType(current.type) ?? getSourceFromType(current.elementType);
|
|
201
|
+
if (componentSource) {
|
|
202
|
+
const file = getSourceFile(componentSource);
|
|
203
|
+
if (file && !componentCandidates.some((candidate) => candidate.source === componentSource)) {
|
|
204
|
+
componentCandidates.push({ source: componentSource, file });
|
|
205
|
+
}
|
|
115
206
|
}
|
|
116
207
|
current = current.return ?? null;
|
|
117
208
|
}
|
|
118
|
-
|
|
209
|
+
const direct = jsxCandidates[0]?.source ?? null;
|
|
210
|
+
const nearestProjectLocalComponentFile = componentCandidates.find((candidate) => isProjectLocalSource(candidate.source))?.file;
|
|
211
|
+
let screen = null;
|
|
212
|
+
if (nearestProjectLocalComponentFile) {
|
|
213
|
+
const matchingJsxCandidate = jsxCandidates.find((candidate) => candidate.file === nearestProjectLocalComponentFile);
|
|
214
|
+
if (matchingJsxCandidate) {
|
|
215
|
+
screen = matchingJsxCandidate.source;
|
|
216
|
+
} else {
|
|
217
|
+
const matchingComponentCandidate = componentCandidates.find(
|
|
218
|
+
(candidate) => candidate.file === nearestProjectLocalComponentFile
|
|
219
|
+
);
|
|
220
|
+
if (matchingComponentCandidate) {
|
|
221
|
+
screen = matchingComponentCandidate.source;
|
|
222
|
+
}
|
|
223
|
+
}
|
|
224
|
+
}
|
|
225
|
+
const implementationComponentCandidate = componentCandidates.find((candidate) => !isProjectLocalSource(candidate.source))?.source ?? null;
|
|
226
|
+
const implementationJsxCandidate = jsxCandidates.find((candidate) => !isProjectLocalSource(candidate.source))?.source ?? null;
|
|
227
|
+
const projectLocalJsxCandidate = jsxCandidates.find((candidate) => isProjectLocalSource(candidate.source))?.source ?? null;
|
|
228
|
+
const screenFallback = screen ?? projectLocalJsxCandidate ?? componentCandidates.find((candidate) => isProjectLocalSource(candidate.source))?.source ?? null;
|
|
229
|
+
return {
|
|
230
|
+
direct: direct ?? screenFallback,
|
|
231
|
+
screen: screenFallback,
|
|
232
|
+
implementation: implementationComponentCandidate ?? implementationJsxCandidate ?? screenFallback
|
|
233
|
+
};
|
|
234
|
+
}
|
|
235
|
+
function getModeDescription(mode) {
|
|
236
|
+
if (mode === "direct") {
|
|
237
|
+
return "Direct JSX";
|
|
238
|
+
}
|
|
239
|
+
if (mode === "screen") {
|
|
240
|
+
return "Screen source";
|
|
241
|
+
}
|
|
242
|
+
return "Implementation source";
|
|
119
243
|
}
|
|
120
244
|
function createStatusOverlay(triggerKey) {
|
|
121
245
|
if (typeof document === "undefined") {
|
|
122
246
|
return null;
|
|
123
247
|
}
|
|
124
248
|
const element = document.createElement("div");
|
|
125
|
-
let currentText = "";
|
|
126
249
|
let copyValue = null;
|
|
250
|
+
let currentMode = "screen";
|
|
127
251
|
let hideTimer = null;
|
|
128
252
|
element.setAttribute("data-react-code-locator", "true");
|
|
129
253
|
Object.assign(element.style, {
|
|
@@ -147,7 +271,6 @@ function createStatusOverlay(triggerKey) {
|
|
|
147
271
|
transition: "opacity 120ms ease"
|
|
148
272
|
});
|
|
149
273
|
const show = (message, tone) => {
|
|
150
|
-
currentText = message;
|
|
151
274
|
element.textContent = message;
|
|
152
275
|
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)";
|
|
153
276
|
element.style.opacity = "1";
|
|
@@ -158,7 +281,7 @@ function createStatusOverlay(triggerKey) {
|
|
|
158
281
|
hideTimer = setTimeout(() => {
|
|
159
282
|
element.style.opacity = "0";
|
|
160
283
|
element.style.pointerEvents = "none";
|
|
161
|
-
},
|
|
284
|
+
}, 2e3);
|
|
162
285
|
};
|
|
163
286
|
element.addEventListener("click", async () => {
|
|
164
287
|
if (!copyValue) {
|
|
@@ -171,7 +294,7 @@ function createStatusOverlay(triggerKey) {
|
|
|
171
294
|
show(`[react-code-locator] copy failed`, "error");
|
|
172
295
|
}
|
|
173
296
|
});
|
|
174
|
-
show(`[react-code-locator] enabled (${triggerKey}+click)`, "idle");
|
|
297
|
+
show(`[react-code-locator] enabled (${triggerKey}+click, alt+1/2/3 to switch mode)`, "idle");
|
|
175
298
|
const mount = () => {
|
|
176
299
|
if (!element.isConnected && document.body) {
|
|
177
300
|
document.body.appendChild(element);
|
|
@@ -189,6 +312,10 @@ function createStatusOverlay(triggerKey) {
|
|
|
189
312
|
setCopyValue(value) {
|
|
190
313
|
copyValue = value;
|
|
191
314
|
},
|
|
315
|
+
setMode(mode) {
|
|
316
|
+
currentMode = mode;
|
|
317
|
+
show(`[react-code-locator] ${getModeDescription(mode)}`, "idle");
|
|
318
|
+
},
|
|
192
319
|
remove() {
|
|
193
320
|
if (hideTimer) {
|
|
194
321
|
clearTimeout(hideTimer);
|
|
@@ -197,17 +324,18 @@ function createStatusOverlay(triggerKey) {
|
|
|
197
324
|
}
|
|
198
325
|
};
|
|
199
326
|
}
|
|
200
|
-
function locateComponentSource(target) {
|
|
327
|
+
function locateComponentSource(target, mode = "screen") {
|
|
201
328
|
const elementTarget = target instanceof Element ? target : target instanceof Node ? target.parentElement : null;
|
|
202
329
|
const fiber = getClosestReactFiber(elementTarget);
|
|
203
330
|
if (!fiber) {
|
|
204
331
|
return null;
|
|
205
332
|
}
|
|
206
|
-
const
|
|
207
|
-
|
|
333
|
+
const candidates = resolveSourceCandidates(fiber);
|
|
334
|
+
const source = candidates[mode] ?? candidates.screen ?? candidates.direct ?? candidates.implementation;
|
|
335
|
+
if (source) {
|
|
208
336
|
return {
|
|
209
|
-
source
|
|
210
|
-
mode
|
|
337
|
+
source,
|
|
338
|
+
mode
|
|
211
339
|
};
|
|
212
340
|
}
|
|
213
341
|
const componentSource = resolveComponentSourceFromFiber(fiber);
|
|
@@ -216,11 +344,12 @@ function locateComponentSource(target) {
|
|
|
216
344
|
}
|
|
217
345
|
return {
|
|
218
346
|
source: componentSource,
|
|
219
|
-
mode
|
|
347
|
+
mode
|
|
220
348
|
};
|
|
221
349
|
}
|
|
222
350
|
function enableReactComponentJump(options = {}) {
|
|
223
351
|
const overlay = createStatusOverlay(options.triggerKey ?? "shift");
|
|
352
|
+
let currentMode = "screen";
|
|
224
353
|
const {
|
|
225
354
|
triggerKey = "shift",
|
|
226
355
|
onLocate = (result) => {
|
|
@@ -236,6 +365,28 @@ function enableReactComponentJump(options = {}) {
|
|
|
236
365
|
}
|
|
237
366
|
} = options;
|
|
238
367
|
console.log("[react-code-locator] enabled", { triggerKey });
|
|
368
|
+
const keyHandler = (event) => {
|
|
369
|
+
if (!event.altKey) {
|
|
370
|
+
return;
|
|
371
|
+
}
|
|
372
|
+
if (event.code === "Digit1") {
|
|
373
|
+
currentMode = "direct";
|
|
374
|
+
overlay?.setMode(currentMode);
|
|
375
|
+
event.preventDefault();
|
|
376
|
+
return;
|
|
377
|
+
}
|
|
378
|
+
if (event.code === "Digit2") {
|
|
379
|
+
currentMode = "screen";
|
|
380
|
+
overlay?.setMode(currentMode);
|
|
381
|
+
event.preventDefault();
|
|
382
|
+
return;
|
|
383
|
+
}
|
|
384
|
+
if (event.code === "Digit3") {
|
|
385
|
+
currentMode = "implementation";
|
|
386
|
+
overlay?.setMode(currentMode);
|
|
387
|
+
event.preventDefault();
|
|
388
|
+
}
|
|
389
|
+
};
|
|
239
390
|
const handler = (event) => {
|
|
240
391
|
console.log("[react-code-locator] click", {
|
|
241
392
|
triggerKey,
|
|
@@ -248,7 +399,7 @@ function enableReactComponentJump(options = {}) {
|
|
|
248
399
|
if (!isTriggerPressed(event, triggerKey)) {
|
|
249
400
|
return;
|
|
250
401
|
}
|
|
251
|
-
const result = locateComponentSource(event.target);
|
|
402
|
+
const result = locateComponentSource(event.target, currentMode);
|
|
252
403
|
if (!result) {
|
|
253
404
|
onError(new Error("No React component source metadata found for clicked element."));
|
|
254
405
|
return;
|
|
@@ -258,14 +409,676 @@ function enableReactComponentJump(options = {}) {
|
|
|
258
409
|
onLocate(result);
|
|
259
410
|
};
|
|
260
411
|
document.addEventListener("click", handler, true);
|
|
412
|
+
document.addEventListener("keydown", keyHandler, true);
|
|
261
413
|
return () => {
|
|
262
414
|
document.removeEventListener("click", handler, true);
|
|
415
|
+
document.removeEventListener("keydown", keyHandler, true);
|
|
263
416
|
overlay?.remove();
|
|
264
417
|
};
|
|
265
418
|
}
|
|
419
|
+
|
|
420
|
+
// src/sourceAdapter.ts
|
|
421
|
+
function defineSourceAdapter(descriptor) {
|
|
422
|
+
return descriptor;
|
|
423
|
+
}
|
|
424
|
+
|
|
425
|
+
// src/babelInjectComponentSource.ts
|
|
426
|
+
var import_core = require("@babel/core");
|
|
427
|
+
var SOURCE_PROP_LOCAL = "_componentSourceLoc";
|
|
428
|
+
var SOURCE_PROPS_REST = "__reactCodeLocatorProps";
|
|
429
|
+
function isComponentName(name) {
|
|
430
|
+
return /^[A-Z]/.test(name);
|
|
431
|
+
}
|
|
432
|
+
function isCustomComponentTag(name) {
|
|
433
|
+
if (import_core.types.isJSXIdentifier(name)) {
|
|
434
|
+
return isComponentName(name.name);
|
|
435
|
+
}
|
|
436
|
+
if (import_core.types.isJSXMemberExpression(name)) {
|
|
437
|
+
return true;
|
|
438
|
+
}
|
|
439
|
+
return false;
|
|
440
|
+
}
|
|
441
|
+
function isIntrinsicElementTag(name) {
|
|
442
|
+
return import_core.types.isJSXIdentifier(name) && /^[a-z]/.test(name.name);
|
|
443
|
+
}
|
|
444
|
+
function isElementFactoryIdentifier(name) {
|
|
445
|
+
return name === "jsx" || name === "jsxs" || name === "jsxDEV" || name === "_jsx" || name === "_jsxs" || name === "_jsxDEV" || name === "createElement";
|
|
446
|
+
}
|
|
447
|
+
function isReactElementFactoryCall(pathNode) {
|
|
448
|
+
const callee = pathNode.node.callee;
|
|
449
|
+
if (import_core.types.isIdentifier(callee)) {
|
|
450
|
+
return isElementFactoryIdentifier(callee.name);
|
|
451
|
+
}
|
|
452
|
+
return import_core.types.isMemberExpression(callee) && import_core.types.isIdentifier(callee.object, { name: "React" }) && import_core.types.isIdentifier(callee.property, { name: "createElement" });
|
|
453
|
+
}
|
|
454
|
+
function getRootJsxIdentifierName(name) {
|
|
455
|
+
if (import_core.types.isJSXIdentifier(name)) {
|
|
456
|
+
return name.name;
|
|
457
|
+
}
|
|
458
|
+
if (import_core.types.isJSXMemberExpression(name)) {
|
|
459
|
+
return getRootJsxIdentifierName(name.object);
|
|
460
|
+
}
|
|
461
|
+
return null;
|
|
462
|
+
}
|
|
463
|
+
function isStyledModuleImport(binding) {
|
|
464
|
+
if (!binding) {
|
|
465
|
+
return false;
|
|
466
|
+
}
|
|
467
|
+
if (!binding.path.isImportSpecifier() && !binding.path.isImportDefaultSpecifier() && !binding.path.isImportNamespaceSpecifier()) {
|
|
468
|
+
return false;
|
|
469
|
+
}
|
|
470
|
+
const source = binding.path.parentPath.isImportDeclaration() ? binding.path.parentPath.node.source.value : null;
|
|
471
|
+
if (typeof source !== "string") {
|
|
472
|
+
return false;
|
|
473
|
+
}
|
|
474
|
+
const normalized = source.replace(/\\/g, "/");
|
|
475
|
+
return normalized === "./styled" || normalized === "../styled" || normalized.endsWith("/styled");
|
|
476
|
+
}
|
|
477
|
+
function isSupportedComponentInit(node) {
|
|
478
|
+
if (!node) {
|
|
479
|
+
return false;
|
|
480
|
+
}
|
|
481
|
+
if (import_core.types.isArrowFunctionExpression(node) || import_core.types.isFunctionExpression(node)) {
|
|
482
|
+
return true;
|
|
483
|
+
}
|
|
484
|
+
if (!import_core.types.isCallExpression(node)) {
|
|
485
|
+
return false;
|
|
486
|
+
}
|
|
487
|
+
if (import_core.types.isIdentifier(node.callee) && (node.callee.name === "memo" || node.callee.name === "forwardRef")) {
|
|
488
|
+
return true;
|
|
489
|
+
}
|
|
490
|
+
return import_core.types.isMemberExpression(node.callee) && import_core.types.isIdentifier(node.callee.object, { name: "React" }) && import_core.types.isIdentifier(node.callee.property) && (node.callee.property.name === "memo" || node.callee.property.name === "forwardRef");
|
|
491
|
+
}
|
|
492
|
+
function hasSourcePropBinding(pattern) {
|
|
493
|
+
return pattern.properties.some((property) => {
|
|
494
|
+
if (!import_core.types.isObjectProperty(property)) {
|
|
495
|
+
return false;
|
|
496
|
+
}
|
|
497
|
+
return import_core.types.isIdentifier(property.key) && property.key.name === JSX_SOURCE_PROP;
|
|
498
|
+
});
|
|
499
|
+
}
|
|
500
|
+
function injectSourcePropBinding(pattern) {
|
|
501
|
+
if (hasSourcePropBinding(pattern)) {
|
|
502
|
+
return;
|
|
503
|
+
}
|
|
504
|
+
const sourceBinding = import_core.types.objectProperty(
|
|
505
|
+
import_core.types.identifier(JSX_SOURCE_PROP),
|
|
506
|
+
import_core.types.identifier(SOURCE_PROP_LOCAL),
|
|
507
|
+
false,
|
|
508
|
+
false
|
|
509
|
+
);
|
|
510
|
+
const restIndex = pattern.properties.findIndex(
|
|
511
|
+
(property) => import_core.types.isRestElement(property)
|
|
512
|
+
);
|
|
513
|
+
if (restIndex === -1) {
|
|
514
|
+
pattern.properties.push(sourceBinding);
|
|
515
|
+
return;
|
|
516
|
+
}
|
|
517
|
+
pattern.properties.splice(restIndex, 0, sourceBinding);
|
|
518
|
+
}
|
|
519
|
+
function injectSourcePropIntoIdentifierParam(node, param) {
|
|
520
|
+
if (!import_core.types.isBlockStatement(node.body)) {
|
|
521
|
+
node.body = import_core.types.blockStatement([import_core.types.returnStatement(node.body)]);
|
|
522
|
+
}
|
|
523
|
+
const alreadyInjected = node.body.body.some(
|
|
524
|
+
(statement) => import_core.types.isVariableDeclaration(statement) && statement.declarations.some(
|
|
525
|
+
(declaration) => import_core.types.isIdentifier(declaration.id) && declaration.id.name === SOURCE_PROPS_REST
|
|
526
|
+
)
|
|
527
|
+
);
|
|
528
|
+
if (alreadyInjected) {
|
|
529
|
+
return;
|
|
530
|
+
}
|
|
531
|
+
node.body.body.unshift(
|
|
532
|
+
import_core.types.variableDeclaration("const", [
|
|
533
|
+
import_core.types.variableDeclarator(
|
|
534
|
+
import_core.types.objectPattern([
|
|
535
|
+
import_core.types.objectProperty(
|
|
536
|
+
import_core.types.identifier(JSX_SOURCE_PROP),
|
|
537
|
+
import_core.types.identifier(SOURCE_PROP_LOCAL),
|
|
538
|
+
false,
|
|
539
|
+
false
|
|
540
|
+
),
|
|
541
|
+
import_core.types.restElement(import_core.types.identifier(SOURCE_PROPS_REST))
|
|
542
|
+
]),
|
|
543
|
+
param
|
|
544
|
+
)
|
|
545
|
+
]),
|
|
546
|
+
import_core.types.expressionStatement(
|
|
547
|
+
import_core.types.assignmentExpression(
|
|
548
|
+
"=",
|
|
549
|
+
import_core.types.identifier(param.name),
|
|
550
|
+
import_core.types.identifier(SOURCE_PROPS_REST)
|
|
551
|
+
)
|
|
552
|
+
)
|
|
553
|
+
);
|
|
554
|
+
}
|
|
555
|
+
function injectSourcePropIntoFunctionParams(node) {
|
|
556
|
+
const firstParam = node.params[0];
|
|
557
|
+
if (!firstParam) {
|
|
558
|
+
return;
|
|
559
|
+
}
|
|
560
|
+
if (import_core.types.isObjectPattern(firstParam)) {
|
|
561
|
+
injectSourcePropBinding(firstParam);
|
|
562
|
+
return;
|
|
563
|
+
}
|
|
564
|
+
if (import_core.types.isIdentifier(firstParam)) {
|
|
565
|
+
injectSourcePropIntoIdentifierParam(node, firstParam);
|
|
566
|
+
}
|
|
567
|
+
}
|
|
568
|
+
function injectSourcePropIntoExpression(node) {
|
|
569
|
+
if (!node) {
|
|
570
|
+
return;
|
|
571
|
+
}
|
|
572
|
+
if (import_core.types.isFunctionExpression(node) || import_core.types.isArrowFunctionExpression(node)) {
|
|
573
|
+
injectSourcePropIntoFunctionParams(node);
|
|
574
|
+
return;
|
|
575
|
+
}
|
|
576
|
+
if (!import_core.types.isCallExpression(node)) {
|
|
577
|
+
return;
|
|
578
|
+
}
|
|
579
|
+
const firstArg = node.arguments[0];
|
|
580
|
+
if (firstArg && !import_core.types.isSpreadElement(firstArg) && (import_core.types.isFunctionExpression(firstArg) || import_core.types.isArrowFunctionExpression(firstArg))) {
|
|
581
|
+
injectSourcePropIntoFunctionParams(firstArg);
|
|
582
|
+
}
|
|
583
|
+
}
|
|
584
|
+
function getSourceValue(state, loc, projectRoot) {
|
|
585
|
+
const filename = state.file?.opts?.filename;
|
|
586
|
+
if (!filename || !loc) {
|
|
587
|
+
return null;
|
|
588
|
+
}
|
|
589
|
+
return toRelativeSource(filename, loc, projectRoot);
|
|
590
|
+
}
|
|
591
|
+
function buildAssignment(name, sourceValue) {
|
|
592
|
+
return import_core.types.expressionStatement(
|
|
593
|
+
import_core.types.assignmentExpression(
|
|
594
|
+
"=",
|
|
595
|
+
import_core.types.memberExpression(import_core.types.identifier(name), import_core.types.identifier(SOURCE_PROP)),
|
|
596
|
+
import_core.types.stringLiteral(sourceValue)
|
|
597
|
+
)
|
|
598
|
+
);
|
|
599
|
+
}
|
|
600
|
+
function buildIntrinsicSourceHelper() {
|
|
601
|
+
return import_core.types.functionDeclaration(
|
|
602
|
+
import_core.types.identifier("_markIntrinsicElementSource"),
|
|
603
|
+
[import_core.types.identifier("element"), import_core.types.identifier("source")],
|
|
604
|
+
import_core.types.blockStatement([
|
|
605
|
+
import_core.types.variableDeclaration("const", [
|
|
606
|
+
import_core.types.variableDeclarator(
|
|
607
|
+
import_core.types.identifier("registryKey"),
|
|
608
|
+
import_core.types.callExpression(
|
|
609
|
+
import_core.types.memberExpression(import_core.types.identifier("Symbol"), import_core.types.identifier("for")),
|
|
610
|
+
[import_core.types.stringLiteral(JSX_SOURCE_REGISTRY_SYMBOL)]
|
|
611
|
+
)
|
|
612
|
+
)
|
|
613
|
+
]),
|
|
614
|
+
import_core.types.variableDeclaration("let", [
|
|
615
|
+
import_core.types.variableDeclarator(
|
|
616
|
+
import_core.types.identifier("registry"),
|
|
617
|
+
import_core.types.memberExpression(import_core.types.identifier("globalThis"), import_core.types.identifier("registryKey"), true)
|
|
618
|
+
)
|
|
619
|
+
]),
|
|
620
|
+
import_core.types.ifStatement(
|
|
621
|
+
import_core.types.unaryExpression(
|
|
622
|
+
"!",
|
|
623
|
+
import_core.types.binaryExpression("instanceof", import_core.types.identifier("registry"), import_core.types.identifier("WeakMap"))
|
|
624
|
+
),
|
|
625
|
+
import_core.types.blockStatement([
|
|
626
|
+
import_core.types.expressionStatement(
|
|
627
|
+
import_core.types.assignmentExpression(
|
|
628
|
+
"=",
|
|
629
|
+
import_core.types.identifier("registry"),
|
|
630
|
+
import_core.types.assignmentExpression(
|
|
631
|
+
"=",
|
|
632
|
+
import_core.types.memberExpression(import_core.types.identifier("globalThis"), import_core.types.identifier("registryKey"), true),
|
|
633
|
+
import_core.types.newExpression(import_core.types.identifier("WeakMap"), [])
|
|
634
|
+
)
|
|
635
|
+
)
|
|
636
|
+
)
|
|
637
|
+
])
|
|
638
|
+
),
|
|
639
|
+
import_core.types.ifStatement(
|
|
640
|
+
import_core.types.logicalExpression(
|
|
641
|
+
"&&",
|
|
642
|
+
import_core.types.identifier("element"),
|
|
643
|
+
import_core.types.logicalExpression(
|
|
644
|
+
"&&",
|
|
645
|
+
import_core.types.binaryExpression("===", import_core.types.unaryExpression("typeof", import_core.types.identifier("element")), import_core.types.stringLiteral("object")),
|
|
646
|
+
import_core.types.binaryExpression(
|
|
647
|
+
"===",
|
|
648
|
+
import_core.types.unaryExpression("typeof", import_core.types.memberExpression(import_core.types.identifier("element"), import_core.types.identifier("props"))),
|
|
649
|
+
import_core.types.stringLiteral("object")
|
|
650
|
+
)
|
|
651
|
+
)
|
|
652
|
+
),
|
|
653
|
+
import_core.types.blockStatement([
|
|
654
|
+
import_core.types.expressionStatement(
|
|
655
|
+
import_core.types.callExpression(
|
|
656
|
+
import_core.types.memberExpression(import_core.types.identifier("registry"), import_core.types.identifier("set")),
|
|
657
|
+
[import_core.types.memberExpression(import_core.types.identifier("element"), import_core.types.identifier("props")), import_core.types.identifier("source")]
|
|
658
|
+
)
|
|
659
|
+
)
|
|
660
|
+
])
|
|
661
|
+
),
|
|
662
|
+
import_core.types.returnStatement(import_core.types.identifier("element"))
|
|
663
|
+
])
|
|
664
|
+
);
|
|
665
|
+
}
|
|
666
|
+
function ensureIntrinsicSourceHelper(programPath, state) {
|
|
667
|
+
if (state.injectedIntrinsicHelper) {
|
|
668
|
+
return;
|
|
669
|
+
}
|
|
670
|
+
const alreadyExists = programPath.node.body.some(
|
|
671
|
+
(node) => import_core.types.isFunctionDeclaration(node) && import_core.types.isIdentifier(node.id, { name: "_markIntrinsicElementSource" })
|
|
672
|
+
);
|
|
673
|
+
if (!alreadyExists) {
|
|
674
|
+
programPath.unshiftContainer("body", buildIntrinsicSourceHelper());
|
|
675
|
+
}
|
|
676
|
+
state.injectedIntrinsicHelper = true;
|
|
677
|
+
}
|
|
678
|
+
function visitDeclaration(declarationPath, insertAfterPath, state, seen, projectRoot) {
|
|
679
|
+
if (declarationPath.isFunctionDeclaration() || declarationPath.isClassDeclaration()) {
|
|
680
|
+
const name = declarationPath.node.id?.name;
|
|
681
|
+
if (!name || !isComponentName(name) || seen.has(name)) {
|
|
682
|
+
return;
|
|
683
|
+
}
|
|
684
|
+
if (declarationPath.isFunctionDeclaration()) {
|
|
685
|
+
injectSourcePropIntoFunctionParams(declarationPath.node);
|
|
686
|
+
}
|
|
687
|
+
const sourceValue = getSourceValue(
|
|
688
|
+
state,
|
|
689
|
+
declarationPath.node.loc?.start,
|
|
690
|
+
projectRoot
|
|
691
|
+
);
|
|
692
|
+
if (!sourceValue) {
|
|
693
|
+
return;
|
|
694
|
+
}
|
|
695
|
+
seen.add(name);
|
|
696
|
+
insertAfterPath.insertAfter(buildAssignment(name, sourceValue));
|
|
697
|
+
return;
|
|
698
|
+
}
|
|
699
|
+
if (!declarationPath.isVariableDeclaration()) {
|
|
700
|
+
return;
|
|
701
|
+
}
|
|
702
|
+
const assignments = declarationPath.node.declarations.flatMap(
|
|
703
|
+
(declarator) => {
|
|
704
|
+
if (!import_core.types.isIdentifier(declarator.id) || !isComponentName(declarator.id.name) || seen.has(declarator.id.name)) {
|
|
705
|
+
return [];
|
|
706
|
+
}
|
|
707
|
+
if (!declarator.init) {
|
|
708
|
+
return [];
|
|
709
|
+
}
|
|
710
|
+
if (!isSupportedComponentInit(declarator.init)) {
|
|
711
|
+
return [];
|
|
712
|
+
}
|
|
713
|
+
injectSourcePropIntoExpression(declarator.init);
|
|
714
|
+
const sourceValue = getSourceValue(
|
|
715
|
+
state,
|
|
716
|
+
declarator.loc?.start ?? declarator.init.loc?.start,
|
|
717
|
+
projectRoot
|
|
718
|
+
);
|
|
719
|
+
if (!sourceValue) {
|
|
720
|
+
return [];
|
|
721
|
+
}
|
|
722
|
+
seen.add(declarator.id.name);
|
|
723
|
+
return [buildAssignment(declarator.id.name, sourceValue)];
|
|
724
|
+
}
|
|
725
|
+
);
|
|
726
|
+
if (assignments.length > 0) {
|
|
727
|
+
insertAfterPath.insertAfter(assignments);
|
|
728
|
+
}
|
|
729
|
+
}
|
|
730
|
+
function babelInjectComponentSource(options = {}) {
|
|
731
|
+
const {
|
|
732
|
+
injectJsxSource = true,
|
|
733
|
+
injectComponentSource = true,
|
|
734
|
+
projectRoot
|
|
735
|
+
} = options;
|
|
736
|
+
return {
|
|
737
|
+
name: "babel-inject-component-source",
|
|
738
|
+
visitor: {
|
|
739
|
+
CallExpression(pathNode, state) {
|
|
740
|
+
if (!injectJsxSource) {
|
|
741
|
+
return;
|
|
742
|
+
}
|
|
743
|
+
if (!isReactElementFactoryCall(pathNode)) {
|
|
744
|
+
return;
|
|
745
|
+
}
|
|
746
|
+
if (pathNode.parentPath.isCallExpression() && import_core.types.isIdentifier(pathNode.parentPath.node.callee, {
|
|
747
|
+
name: "_markIntrinsicElementSource"
|
|
748
|
+
})) {
|
|
749
|
+
return;
|
|
750
|
+
}
|
|
751
|
+
const sourceValue = getSourceValue(
|
|
752
|
+
state,
|
|
753
|
+
pathNode.node.loc?.start,
|
|
754
|
+
projectRoot
|
|
755
|
+
);
|
|
756
|
+
if (!sourceValue) {
|
|
757
|
+
return;
|
|
758
|
+
}
|
|
759
|
+
const programPath = pathNode.findParent((parent) => parent.isProgram());
|
|
760
|
+
if (!programPath || !programPath.isProgram()) {
|
|
761
|
+
return;
|
|
762
|
+
}
|
|
763
|
+
ensureIntrinsicSourceHelper(programPath, state);
|
|
764
|
+
pathNode.replaceWith(
|
|
765
|
+
import_core.types.callExpression(import_core.types.identifier("_markIntrinsicElementSource"), [
|
|
766
|
+
pathNode.node,
|
|
767
|
+
import_core.types.stringLiteral(sourceValue)
|
|
768
|
+
])
|
|
769
|
+
);
|
|
770
|
+
pathNode.skip();
|
|
771
|
+
},
|
|
772
|
+
JSXElement: {
|
|
773
|
+
exit(pathNode, state) {
|
|
774
|
+
if (!injectJsxSource) {
|
|
775
|
+
return;
|
|
776
|
+
}
|
|
777
|
+
if (!isIntrinsicElementTag(pathNode.node.openingElement.name)) {
|
|
778
|
+
return;
|
|
779
|
+
}
|
|
780
|
+
if (pathNode.parentPath.isCallExpression() && import_core.types.isIdentifier(pathNode.parentPath.node.callee, { name: "_markIntrinsicElementSource" })) {
|
|
781
|
+
return;
|
|
782
|
+
}
|
|
783
|
+
const sourceValue = getSourceValue(
|
|
784
|
+
state,
|
|
785
|
+
pathNode.node.openingElement.loc?.start,
|
|
786
|
+
projectRoot
|
|
787
|
+
);
|
|
788
|
+
if (!sourceValue) {
|
|
789
|
+
return;
|
|
790
|
+
}
|
|
791
|
+
const programPath = pathNode.findParent((parent) => parent.isProgram());
|
|
792
|
+
if (!programPath || !programPath.isProgram()) {
|
|
793
|
+
return;
|
|
794
|
+
}
|
|
795
|
+
ensureIntrinsicSourceHelper(programPath, state);
|
|
796
|
+
const wrappedNode = import_core.types.callExpression(import_core.types.identifier("_markIntrinsicElementSource"), [
|
|
797
|
+
pathNode.node,
|
|
798
|
+
import_core.types.stringLiteral(sourceValue)
|
|
799
|
+
]);
|
|
800
|
+
if (pathNode.parentPath.isJSXElement() || pathNode.parentPath.isJSXFragment()) {
|
|
801
|
+
pathNode.replaceWith(import_core.types.jsxExpressionContainer(wrappedNode));
|
|
802
|
+
return;
|
|
803
|
+
}
|
|
804
|
+
if (pathNode.parentPath.isJSXExpressionContainer()) {
|
|
805
|
+
pathNode.parentPath.replaceWith(import_core.types.jsxExpressionContainer(wrappedNode));
|
|
806
|
+
return;
|
|
807
|
+
}
|
|
808
|
+
pathNode.replaceWith(wrappedNode);
|
|
809
|
+
}
|
|
810
|
+
},
|
|
811
|
+
JSXOpeningElement(pathNode, state) {
|
|
812
|
+
if (!injectJsxSource) {
|
|
813
|
+
return;
|
|
814
|
+
}
|
|
815
|
+
if (!isCustomComponentTag(pathNode.node.name)) {
|
|
816
|
+
return;
|
|
817
|
+
}
|
|
818
|
+
const rootIdentifierName = getRootJsxIdentifierName(pathNode.node.name);
|
|
819
|
+
if (rootIdentifierName && isExternalToProjectRoot(state.file?.opts?.filename, projectRoot) && isStyledModuleImport(pathNode.scope.getBinding(rootIdentifierName))) {
|
|
820
|
+
return;
|
|
821
|
+
}
|
|
822
|
+
const hasSourceProp = pathNode.node.attributes.some(
|
|
823
|
+
(attr) => import_core.types.isJSXAttribute(attr) && import_core.types.isJSXIdentifier(attr.name) && attr.name.name === JSX_SOURCE_PROP
|
|
824
|
+
);
|
|
825
|
+
if (hasSourceProp) {
|
|
826
|
+
return;
|
|
827
|
+
}
|
|
828
|
+
const filename = state.file?.opts?.filename;
|
|
829
|
+
const loc = pathNode.node.loc?.start;
|
|
830
|
+
if (!filename || !loc) {
|
|
831
|
+
return;
|
|
832
|
+
}
|
|
833
|
+
pathNode.node.attributes.push(
|
|
834
|
+
import_core.types.jsxAttribute(
|
|
835
|
+
import_core.types.jsxIdentifier(JSX_SOURCE_PROP),
|
|
836
|
+
import_core.types.stringLiteral(
|
|
837
|
+
getSourceValue(state, loc, projectRoot) ?? `${filename.replace(/\\/g, "/")}:${loc.line}:${loc.column + 1}`
|
|
838
|
+
)
|
|
839
|
+
)
|
|
840
|
+
);
|
|
841
|
+
},
|
|
842
|
+
Program(programPath, state) {
|
|
843
|
+
if (!injectComponentSource) {
|
|
844
|
+
return;
|
|
845
|
+
}
|
|
846
|
+
const seen = /* @__PURE__ */ new Set();
|
|
847
|
+
for (const childPath of programPath.get("body")) {
|
|
848
|
+
if (childPath.isExportNamedDeclaration() || childPath.isExportDefaultDeclaration()) {
|
|
849
|
+
const declarationPath = childPath.get("declaration");
|
|
850
|
+
if (!Array.isArray(declarationPath) && declarationPath.node) {
|
|
851
|
+
visitDeclaration(declarationPath, childPath, state, seen, projectRoot);
|
|
852
|
+
}
|
|
853
|
+
continue;
|
|
854
|
+
}
|
|
855
|
+
visitDeclaration(childPath, childPath, state, seen, projectRoot);
|
|
856
|
+
}
|
|
857
|
+
}
|
|
858
|
+
}
|
|
859
|
+
};
|
|
860
|
+
}
|
|
861
|
+
|
|
862
|
+
// src/babel.ts
|
|
863
|
+
function createBabelSourceAdapter(options = {}) {
|
|
864
|
+
const resolvedOptions = {
|
|
865
|
+
projectRoot: process.cwd(),
|
|
866
|
+
...options
|
|
867
|
+
};
|
|
868
|
+
return defineSourceAdapter({
|
|
869
|
+
kind: "babel",
|
|
870
|
+
name: "react-code-locator/babel",
|
|
871
|
+
options: resolvedOptions,
|
|
872
|
+
config: {
|
|
873
|
+
plugins: [[babelInjectComponentSource, resolvedOptions]]
|
|
874
|
+
}
|
|
875
|
+
});
|
|
876
|
+
}
|
|
877
|
+
var babelSourceAdapter = createBabelSourceAdapter();
|
|
878
|
+
|
|
879
|
+
// src/sourceTransform.ts
|
|
880
|
+
var import_core2 = require("@babel/core");
|
|
881
|
+
async function transformSourceWithLocator(code, options) {
|
|
882
|
+
const { filename, sourceMaps = true, projectRoot = process.cwd(), ...pluginOptions } = options;
|
|
883
|
+
const result = await (0, import_core2.transformAsync)(code, {
|
|
884
|
+
filename,
|
|
885
|
+
babelrc: false,
|
|
886
|
+
configFile: false,
|
|
887
|
+
sourceMaps,
|
|
888
|
+
parserOpts: {
|
|
889
|
+
sourceType: "module",
|
|
890
|
+
plugins: ["jsx", "typescript"]
|
|
891
|
+
},
|
|
892
|
+
generatorOpts: {
|
|
893
|
+
retainLines: true
|
|
894
|
+
},
|
|
895
|
+
plugins: [[babelInjectComponentSource, { ...pluginOptions, projectRoot }]]
|
|
896
|
+
});
|
|
897
|
+
return {
|
|
898
|
+
code: result?.code ?? code,
|
|
899
|
+
map: result?.map ?? null
|
|
900
|
+
};
|
|
901
|
+
}
|
|
902
|
+
|
|
903
|
+
// src/viteClientInjector.ts
|
|
904
|
+
var VIRTUAL_CLIENT_MODULE_ID = "virtual:react-code-locator/client";
|
|
905
|
+
var RESOLVED_VIRTUAL_CLIENT_MODULE_ID = `\0${VIRTUAL_CLIENT_MODULE_ID}`;
|
|
906
|
+
function createClientInjector(locatorOptions = {}) {
|
|
907
|
+
const serialized = JSON.stringify(locatorOptions);
|
|
908
|
+
return {
|
|
909
|
+
name: "react-code-locator-client-injector",
|
|
910
|
+
apply: "serve",
|
|
911
|
+
resolveId(id) {
|
|
912
|
+
if (id === VIRTUAL_CLIENT_MODULE_ID) {
|
|
913
|
+
return RESOLVED_VIRTUAL_CLIENT_MODULE_ID;
|
|
914
|
+
}
|
|
915
|
+
return null;
|
|
916
|
+
},
|
|
917
|
+
load(id) {
|
|
918
|
+
if (id !== RESOLVED_VIRTUAL_CLIENT_MODULE_ID) {
|
|
919
|
+
return null;
|
|
920
|
+
}
|
|
921
|
+
return `
|
|
922
|
+
import { enableReactComponentJump } from "react-code-locator/client";
|
|
923
|
+
|
|
924
|
+
enableReactComponentJump(${serialized});
|
|
925
|
+
`;
|
|
926
|
+
},
|
|
927
|
+
transformIndexHtml() {
|
|
928
|
+
return [
|
|
929
|
+
{
|
|
930
|
+
tag: "script",
|
|
931
|
+
attrs: {
|
|
932
|
+
type: "module",
|
|
933
|
+
src: `/@id/__x00__${VIRTUAL_CLIENT_MODULE_ID}`
|
|
934
|
+
},
|
|
935
|
+
injectTo: "head"
|
|
936
|
+
}
|
|
937
|
+
];
|
|
938
|
+
}
|
|
939
|
+
};
|
|
940
|
+
}
|
|
941
|
+
function createViteClientInjector(options = {}) {
|
|
942
|
+
const { command = "serve", locator = {}, injectClient = true } = options;
|
|
943
|
+
const isServe = command === "serve";
|
|
944
|
+
return [isServe && injectClient ? createClientInjector(locator) : null].filter(Boolean);
|
|
945
|
+
}
|
|
946
|
+
|
|
947
|
+
// src/vite.ts
|
|
948
|
+
function shouldTransformSource(id) {
|
|
949
|
+
if (id.includes("/node_modules/") || id.startsWith("\0")) {
|
|
950
|
+
return false;
|
|
951
|
+
}
|
|
952
|
+
return /\.[mc]?[jt]sx?$/.test(id);
|
|
953
|
+
}
|
|
954
|
+
function viteSourceTransformPlugin(options = {}) {
|
|
955
|
+
return {
|
|
956
|
+
name: "react-code-locator-source-transform",
|
|
957
|
+
enforce: "pre",
|
|
958
|
+
async transform(code, id) {
|
|
959
|
+
if (!shouldTransformSource(id)) {
|
|
960
|
+
return null;
|
|
961
|
+
}
|
|
962
|
+
return transformSourceWithLocator(code, {
|
|
963
|
+
filename: id,
|
|
964
|
+
...options
|
|
965
|
+
});
|
|
966
|
+
}
|
|
967
|
+
};
|
|
968
|
+
}
|
|
969
|
+
function createViteSourceAdapter(options = {}) {
|
|
970
|
+
const { babel = {}, ...viteOptions } = options;
|
|
971
|
+
const resolvedBabelOptions = {
|
|
972
|
+
projectRoot: process.cwd(),
|
|
973
|
+
...babel
|
|
974
|
+
};
|
|
975
|
+
const plugins = [
|
|
976
|
+
viteSourceTransformPlugin(resolvedBabelOptions),
|
|
977
|
+
...createViteClientInjector(viteOptions)
|
|
978
|
+
].filter(Boolean);
|
|
979
|
+
return defineSourceAdapter({
|
|
980
|
+
kind: "vite",
|
|
981
|
+
name: "react-code-locator/vite",
|
|
982
|
+
options: {
|
|
983
|
+
...viteOptions,
|
|
984
|
+
babel: resolvedBabelOptions
|
|
985
|
+
},
|
|
986
|
+
config: {
|
|
987
|
+
plugins
|
|
988
|
+
}
|
|
989
|
+
});
|
|
990
|
+
}
|
|
991
|
+
var viteSourceAdapter = createViteSourceAdapter();
|
|
992
|
+
|
|
993
|
+
// src/esbuild.ts
|
|
994
|
+
var import_promises = require("fs/promises");
|
|
995
|
+
function getEsbuildLoader(filename) {
|
|
996
|
+
if (filename.endsWith(".tsx")) {
|
|
997
|
+
return "tsx";
|
|
998
|
+
}
|
|
999
|
+
if (filename.endsWith(".ts")) {
|
|
1000
|
+
return "ts";
|
|
1001
|
+
}
|
|
1002
|
+
if (filename.endsWith(".jsx")) {
|
|
1003
|
+
return "jsx";
|
|
1004
|
+
}
|
|
1005
|
+
return "js";
|
|
1006
|
+
}
|
|
1007
|
+
function esbuildSourceTransformPlugin(options = {}) {
|
|
1008
|
+
return {
|
|
1009
|
+
name: "react-code-locator-source-transform",
|
|
1010
|
+
setup(build) {
|
|
1011
|
+
build.onLoad({ filter: /\.[mc]?[jt]sx?$/ }, async ({ path }) => {
|
|
1012
|
+
if (path.includes("/node_modules/")) {
|
|
1013
|
+
return null;
|
|
1014
|
+
}
|
|
1015
|
+
const code = await (0, import_promises.readFile)(path, "utf8");
|
|
1016
|
+
const result = await transformSourceWithLocator(code, {
|
|
1017
|
+
filename: path,
|
|
1018
|
+
...options
|
|
1019
|
+
});
|
|
1020
|
+
return {
|
|
1021
|
+
contents: result.code,
|
|
1022
|
+
loader: getEsbuildLoader(path)
|
|
1023
|
+
};
|
|
1024
|
+
});
|
|
1025
|
+
}
|
|
1026
|
+
};
|
|
1027
|
+
}
|
|
1028
|
+
function createEsbuildSourceAdapter(options = {}) {
|
|
1029
|
+
const resolvedOptions = {
|
|
1030
|
+
projectRoot: process.cwd(),
|
|
1031
|
+
...options
|
|
1032
|
+
};
|
|
1033
|
+
return defineSourceAdapter({
|
|
1034
|
+
kind: "esbuild",
|
|
1035
|
+
name: "react-code-locator/esbuild",
|
|
1036
|
+
options: resolvedOptions,
|
|
1037
|
+
config: {
|
|
1038
|
+
plugins: [esbuildSourceTransformPlugin(resolvedOptions)]
|
|
1039
|
+
}
|
|
1040
|
+
});
|
|
1041
|
+
}
|
|
1042
|
+
var esbuildSourceAdapter = createEsbuildSourceAdapter();
|
|
1043
|
+
|
|
1044
|
+
// src/swc.ts
|
|
1045
|
+
async function transformSourceWithSwcLocator(code, options) {
|
|
1046
|
+
return transformSourceWithLocator(code, options);
|
|
1047
|
+
}
|
|
1048
|
+
function createSwcSourceAdapter(options = {}) {
|
|
1049
|
+
const resolvedOptions = {
|
|
1050
|
+
projectRoot: process.cwd(),
|
|
1051
|
+
...options
|
|
1052
|
+
};
|
|
1053
|
+
const transform = (code, transformOptions) => transformSourceWithSwcLocator(code, {
|
|
1054
|
+
...resolvedOptions,
|
|
1055
|
+
...transformOptions
|
|
1056
|
+
});
|
|
1057
|
+
return defineSourceAdapter({
|
|
1058
|
+
kind: "swc",
|
|
1059
|
+
name: "react-code-locator/swc",
|
|
1060
|
+
options: resolvedOptions,
|
|
1061
|
+
config: {
|
|
1062
|
+
transform
|
|
1063
|
+
}
|
|
1064
|
+
});
|
|
1065
|
+
}
|
|
1066
|
+
var swcSourceAdapter = createSwcSourceAdapter();
|
|
266
1067
|
// Annotate the CommonJS export names for ESM import in node:
|
|
267
1068
|
0 && (module.exports = {
|
|
1069
|
+
babelInjectComponentSource,
|
|
1070
|
+
babelSourceAdapter,
|
|
1071
|
+
createBabelSourceAdapter,
|
|
1072
|
+
createEsbuildSourceAdapter,
|
|
1073
|
+
createSwcSourceAdapter,
|
|
1074
|
+
createViteClientInjector,
|
|
1075
|
+
createViteSourceAdapter,
|
|
1076
|
+
defineSourceAdapter,
|
|
268
1077
|
enableReactComponentJump,
|
|
269
|
-
|
|
1078
|
+
esbuildSourceAdapter,
|
|
1079
|
+
locateComponentSource,
|
|
1080
|
+
reactComponentJump,
|
|
1081
|
+
swcSourceAdapter,
|
|
1082
|
+
viteSourceAdapter
|
|
270
1083
|
});
|
|
271
1084
|
//# sourceMappingURL=index.cjs.map
|