react-grab 0.1.21 → 0.1.23
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/bin/cli.js +2 -0
- package/dist/chunk-4CCAJASE.js +118 -0
- package/dist/chunk-VO5P2ZP5.cjs +118 -0
- package/dist/core/index.cjs +1 -1
- package/dist/core/index.js +1 -1
- package/dist/index.cjs +2 -2
- package/dist/index.global.js +32 -32
- package/dist/index.js +1 -1
- package/dist/react.cjs +88 -33
- package/dist/react.js +88 -33
- package/package.json +7 -2
- package/dist/chunk-A4P2NQ77.cjs +0 -118
- package/dist/chunk-GYJRJR7H.js +0 -118
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {i}from'./chunk-
|
|
1
|
+
import {i}from'./chunk-4CCAJASE.js';export{f as DEFAULT_THEME,g as commentPlugin,c as formatElementInfo,e as generateSnippet,b as getStack,i as init,a as isInstrumentationActive,h as openPlugin}from'./chunk-4CCAJASE.js';/**
|
|
2
2
|
* @license MIT
|
|
3
3
|
*
|
|
4
4
|
* Copyright (c) 2025 Aiden Bai
|
package/dist/react.cjs
CHANGED
|
@@ -2152,7 +2152,7 @@ var VERSION, VIEWPORT_MARGIN_PX, OFFSCREEN_POSITION, SELECTION_LERP_FACTOR, FEED
|
|
|
2152
2152
|
var init_constants = __esm({
|
|
2153
2153
|
"src/constants.ts"() {
|
|
2154
2154
|
"use strict";
|
|
2155
|
-
VERSION = "0.1.
|
|
2155
|
+
VERSION = "0.1.23";
|
|
2156
2156
|
VIEWPORT_MARGIN_PX = 8;
|
|
2157
2157
|
OFFSCREEN_POSITION = -1e3;
|
|
2158
2158
|
SELECTION_LERP_FACTOR = 0.95;
|
|
@@ -2799,6 +2799,7 @@ var init_store2 = __esm({
|
|
|
2799
2799
|
if (store.current.state === "justCopied") {
|
|
2800
2800
|
const shouldReturnToActive = store.current.wasActive && !store.wasActivatedByToggle;
|
|
2801
2801
|
if (shouldReturnToActive) {
|
|
2802
|
+
actions.clearFrozenElement();
|
|
2802
2803
|
setStore("current", {
|
|
2803
2804
|
state: "active",
|
|
2804
2805
|
phase: "hovering",
|
|
@@ -3927,7 +3928,7 @@ var init_truncate_string = __esm({
|
|
|
3927
3928
|
});
|
|
3928
3929
|
|
|
3929
3930
|
// src/core/context.ts
|
|
3930
|
-
var NON_COMPONENT_PREFIXES, NEXT_INTERNAL_COMPONENT_NAMES, REACT_INTERNAL_COMPONENT_NAMES, cachedIsNextProject, checkIsNextProject, checkIsInternalComponentName, checkIsSourceComponentName, SERVER_COMPONENT_URL_PREFIXES, isServerComponentUrl, devirtualizeServerUrl, symbolicateServerFrames, extractServerFramesFromDebugStack, enrichServerFrameLocations, stackCache, fetchStackForElement, getStack, getNearestComponentName, resolveSourceFromStack, isUsefulComponentName, getComponentDisplayName, hasSourceFiles, getComponentNamesFromFiber, formatStackContext, getStackContext, getElementContext, getFallbackContext, truncateAttrValue, formatPriorityAttrs, getHTMLPreview;
|
|
3931
|
+
var NON_COMPONENT_PREFIXES, NEXT_INTERNAL_COMPONENT_NAMES, REACT_INTERNAL_COMPONENT_NAMES, cachedIsNextProject, checkIsNextProject, checkIsInternalComponentName, checkIsSourceComponentName, SERVER_COMPONENT_URL_PREFIXES, isServerComponentUrl, devirtualizeServerUrl, symbolicateServerFrames, extractServerFramesFromDebugStack, enrichServerFrameLocations, findNearestFiberElement, stackCache, fetchStackForElement, getStack, getNearestComponentName, resolveSourceFromStack, isUsefulComponentName, getComponentDisplayName, hasSourceFiles, getComponentNamesFromFiber, formatStackContext, getStackContext, getElementContext, getFallbackContext, truncateAttrValue, formatPriorityAttrs, getHTMLPreview;
|
|
3931
3932
|
var init_context = __esm({
|
|
3932
3933
|
"src/core/context.ts"() {
|
|
3933
3934
|
"use strict";
|
|
@@ -4118,6 +4119,15 @@ var init_context = __esm({
|
|
|
4118
4119
|
};
|
|
4119
4120
|
});
|
|
4120
4121
|
};
|
|
4122
|
+
findNearestFiberElement = (element) => {
|
|
4123
|
+
if (!Ee()) return element;
|
|
4124
|
+
let current = element;
|
|
4125
|
+
while (current) {
|
|
4126
|
+
if (Pe(current)) return current;
|
|
4127
|
+
current = current.parentElement;
|
|
4128
|
+
}
|
|
4129
|
+
return element;
|
|
4130
|
+
};
|
|
4121
4131
|
stackCache = /* @__PURE__ */ new WeakMap();
|
|
4122
4132
|
fetchStackForElement = async (element) => {
|
|
4123
4133
|
try {
|
|
@@ -4135,10 +4145,11 @@ var init_context = __esm({
|
|
|
4135
4145
|
};
|
|
4136
4146
|
getStack = (element) => {
|
|
4137
4147
|
if (!Ee()) return Promise.resolve([]);
|
|
4138
|
-
const
|
|
4148
|
+
const resolvedElement = findNearestFiberElement(element);
|
|
4149
|
+
const cached = stackCache.get(resolvedElement);
|
|
4139
4150
|
if (cached) return cached;
|
|
4140
|
-
const promise = fetchStackForElement(
|
|
4141
|
-
stackCache.set(
|
|
4151
|
+
const promise = fetchStackForElement(resolvedElement);
|
|
4152
|
+
stackCache.set(resolvedElement, promise);
|
|
4142
4153
|
return promise;
|
|
4143
4154
|
};
|
|
4144
4155
|
getNearestComponentName = async (element) => {
|
|
@@ -4174,7 +4185,8 @@ var init_context = __esm({
|
|
|
4174
4185
|
};
|
|
4175
4186
|
getComponentDisplayName = (element) => {
|
|
4176
4187
|
if (!Ee()) return null;
|
|
4177
|
-
const
|
|
4188
|
+
const resolvedElement = findNearestFiberElement(element);
|
|
4189
|
+
const fiber = Pe(resolvedElement);
|
|
4178
4190
|
if (!fiber) return null;
|
|
4179
4191
|
let currentFiber = fiber.return;
|
|
4180
4192
|
while (currentFiber) {
|
|
@@ -4261,12 +4273,13 @@ var init_context = __esm({
|
|
|
4261
4273
|
return "";
|
|
4262
4274
|
};
|
|
4263
4275
|
getElementContext = async (element, options = {}) => {
|
|
4264
|
-
const
|
|
4265
|
-
const
|
|
4276
|
+
const resolvedElement = findNearestFiberElement(element);
|
|
4277
|
+
const html = getHTMLPreview(resolvedElement);
|
|
4278
|
+
const stackContext = await getStackContext(resolvedElement, options);
|
|
4266
4279
|
if (stackContext) {
|
|
4267
4280
|
return `${html}${stackContext}`;
|
|
4268
4281
|
}
|
|
4269
|
-
return getFallbackContext(
|
|
4282
|
+
return getFallbackContext(resolvedElement);
|
|
4270
4283
|
};
|
|
4271
4284
|
getFallbackContext = (element) => {
|
|
4272
4285
|
const tagName = getTagName(element);
|
|
@@ -4734,13 +4747,6 @@ var init_overlay_canvas = __esm({
|
|
|
4734
4747
|
initializeCanvas();
|
|
4735
4748
|
scheduleAnimationFrame();
|
|
4736
4749
|
};
|
|
4737
|
-
createEffect(on(() => [props.mouseX, props.mouseY], ([mouseX, mouseY]) => {
|
|
4738
|
-
const targetX = mouseX ?? 0;
|
|
4739
|
-
const targetY = mouseY ?? 0;
|
|
4740
|
-
crosshairCurrentPosition.x = targetX;
|
|
4741
|
-
crosshairCurrentPosition.y = targetY;
|
|
4742
|
-
scheduleAnimationFrame();
|
|
4743
|
-
}));
|
|
4744
4750
|
createEffect(on(() => props.crosshairVisible, () => {
|
|
4745
4751
|
scheduleAnimationFrame();
|
|
4746
4752
|
}));
|
|
@@ -4865,6 +4871,15 @@ var init_overlay_canvas = __esm({
|
|
|
4865
4871
|
onMount(() => {
|
|
4866
4872
|
initializeCanvas();
|
|
4867
4873
|
scheduleAnimationFrame();
|
|
4874
|
+
const handlePointerMove = (event) => {
|
|
4875
|
+
if (!event.isPrimary) return;
|
|
4876
|
+
crosshairCurrentPosition.x = event.clientX;
|
|
4877
|
+
crosshairCurrentPosition.y = event.clientY;
|
|
4878
|
+
scheduleAnimationFrame();
|
|
4879
|
+
};
|
|
4880
|
+
window.addEventListener("pointermove", handlePointerMove, {
|
|
4881
|
+
passive: true
|
|
4882
|
+
});
|
|
4868
4883
|
window.addEventListener("resize", handleWindowResize);
|
|
4869
4884
|
let currentDprMediaQuery = null;
|
|
4870
4885
|
const handleDevicePixelRatioChange = () => {
|
|
@@ -4883,6 +4898,7 @@ var init_overlay_canvas = __esm({
|
|
|
4883
4898
|
};
|
|
4884
4899
|
setupDprMediaQuery();
|
|
4885
4900
|
onCleanup(() => {
|
|
4901
|
+
window.removeEventListener("pointermove", handlePointerMove);
|
|
4886
4902
|
window.removeEventListener("resize", handleWindowResize);
|
|
4887
4903
|
if (currentDprMediaQuery) {
|
|
4888
4904
|
currentDprMediaQuery.removeEventListener("change", handleDevicePixelRatioChange);
|
|
@@ -8660,8 +8676,8 @@ var init_selection_label = __esm({
|
|
|
8660
8676
|
computedArrowPosition: null
|
|
8661
8677
|
};
|
|
8662
8678
|
}
|
|
8663
|
-
const viewportWidth = window.innerWidth;
|
|
8664
|
-
const viewportHeight = window.innerHeight;
|
|
8679
|
+
const viewportWidth = window.visualViewport?.width ?? window.innerWidth;
|
|
8680
|
+
const viewportHeight = window.visualViewport?.height ?? window.innerHeight;
|
|
8665
8681
|
const isSelectionVisibleInViewport = bounds.x + bounds.width > 0 && bounds.x < viewportWidth && bounds.y + bounds.height > 0 && bounds.y < viewportHeight;
|
|
8666
8682
|
if (!isSelectionVisibleInViewport) {
|
|
8667
8683
|
return {
|
|
@@ -9378,7 +9394,7 @@ var init_safe_polygon = __esm({
|
|
|
9378
9394
|
});
|
|
9379
9395
|
|
|
9380
9396
|
// src/utils/freeze-updates.ts
|
|
9381
|
-
var isUpdatesPaused, getOrCache, patchedDispatchers, wrappedDispatchCache, wrappedStartTransitionCache, pendingStoreCallbacks, pendingTransitionCallbacks, pendingStateUpdates, pausedQueueStates, pausedContextStates, renderersWithPatchedDispatcher, typedFiberRoots, getFiberRoot, collectFiberRoots, mergePendingChains, pauseHookQueue, resumeHookQueue, pauseContextDependency, resumeContextDependency, forEachHookQueue, forEachContextDependency, traverseFibers, pauseFiber, resumeFiber, patchDispatcher, installDispatcherPatching, scheduleReactUpdate, invokeCallbacks, initializeFreezeSupport, freezeUpdates;
|
|
9397
|
+
var isUpdatesPaused, getOrCache, patchedDispatchers, wrappedDispatchCache, wrappedStartTransitionCache, pendingStoreCallbacks, pendingTransitionCallbacks, pendingStateUpdates, pausedQueueStates, pausedContextStates, renderersWithPatchedDispatcher, typedFiberRoots, getFiberRoot, collectFiberRoots, mergePendingChains, pauseHookQueue, extractActionsFromChain, resumeHookQueue, pauseContextDependency, resumeContextDependency, forEachHookQueue, forEachContextDependency, traverseFibers, pauseFiber, resumeFiber, patchDispatcher, installDispatcherPatching, scheduleReactUpdate, invokeCallbacks, initializeFreezeSupport, freezeUpdates;
|
|
9382
9398
|
var init_freeze_updates = __esm({
|
|
9383
9399
|
"src/utils/freeze-updates.ts"() {
|
|
9384
9400
|
"use strict";
|
|
@@ -9470,26 +9486,42 @@ var init_freeze_updates = __esm({
|
|
|
9470
9486
|
Object.defineProperty(queue, "pending", {
|
|
9471
9487
|
configurable: true,
|
|
9472
9488
|
enumerable: true,
|
|
9473
|
-
get: () => isUpdatesPaused ?
|
|
9489
|
+
get: () => isUpdatesPaused ? null : currentPendingValue,
|
|
9474
9490
|
set: (newValue) => {
|
|
9475
9491
|
if (isUpdatesPaused) {
|
|
9476
|
-
|
|
9492
|
+
if (newValue !== null) {
|
|
9493
|
+
pauseState.bufferedPending = mergePendingChains(
|
|
9494
|
+
pauseState.bufferedPending ?? null,
|
|
9495
|
+
newValue
|
|
9496
|
+
);
|
|
9497
|
+
}
|
|
9498
|
+
return;
|
|
9477
9499
|
}
|
|
9478
9500
|
currentPendingValue = newValue;
|
|
9479
9501
|
}
|
|
9480
9502
|
});
|
|
9481
9503
|
pausedQueueStates.set(queue, pauseState);
|
|
9482
9504
|
};
|
|
9505
|
+
extractActionsFromChain = (pending) => {
|
|
9506
|
+
if (!pending) return [];
|
|
9507
|
+
const actions = [];
|
|
9508
|
+
const first = pending.next;
|
|
9509
|
+
if (!first) return [];
|
|
9510
|
+
let current = first;
|
|
9511
|
+
do {
|
|
9512
|
+
if (current) {
|
|
9513
|
+
actions.push(current.action);
|
|
9514
|
+
current = current.next;
|
|
9515
|
+
}
|
|
9516
|
+
} while (current && current !== first);
|
|
9517
|
+
return actions;
|
|
9518
|
+
};
|
|
9483
9519
|
resumeHookQueue = (queue) => {
|
|
9484
9520
|
const pauseState = pausedQueueStates.get(queue);
|
|
9485
9521
|
if (!pauseState) return;
|
|
9486
9522
|
if (pauseState.originalGetSnapshot) {
|
|
9487
9523
|
queue.getSnapshot = pauseState.originalGetSnapshot;
|
|
9488
9524
|
}
|
|
9489
|
-
const mergedPending = mergePendingChains(
|
|
9490
|
-
pauseState.pendingValueAtPause ?? null,
|
|
9491
|
-
pauseState.bufferedPending ?? null
|
|
9492
|
-
);
|
|
9493
9525
|
if (pauseState.originalPendingDescriptor) {
|
|
9494
9526
|
Object.defineProperty(
|
|
9495
9527
|
queue,
|
|
@@ -9499,7 +9531,19 @@ var init_freeze_updates = __esm({
|
|
|
9499
9531
|
} else {
|
|
9500
9532
|
delete queue.pending;
|
|
9501
9533
|
}
|
|
9502
|
-
queue.pending =
|
|
9534
|
+
queue.pending = null;
|
|
9535
|
+
const dispatch = queue.dispatch;
|
|
9536
|
+
if (typeof dispatch === "function") {
|
|
9537
|
+
const pendingActions = extractActionsFromChain(
|
|
9538
|
+
pauseState.pendingValueAtPause ?? null
|
|
9539
|
+
);
|
|
9540
|
+
const bufferedActions = extractActionsFromChain(
|
|
9541
|
+
pauseState.bufferedPending ?? null
|
|
9542
|
+
);
|
|
9543
|
+
for (const action of [...pendingActions, ...bufferedActions]) {
|
|
9544
|
+
pendingStateUpdates.push(() => dispatch(action));
|
|
9545
|
+
}
|
|
9546
|
+
}
|
|
9503
9547
|
pausedQueueStates.delete(queue);
|
|
9504
9548
|
};
|
|
9505
9549
|
pauseContextDependency = (contextDependency) => {
|
|
@@ -12981,12 +13025,6 @@ var init_renderer = __esm({
|
|
|
12981
13025
|
get crosshairVisible() {
|
|
12982
13026
|
return props.crosshairVisible;
|
|
12983
13027
|
},
|
|
12984
|
-
get mouseX() {
|
|
12985
|
-
return props.mouseX;
|
|
12986
|
-
},
|
|
12987
|
-
get mouseY() {
|
|
12988
|
-
return props.mouseY;
|
|
12989
|
-
},
|
|
12990
13028
|
get selectionVisible() {
|
|
12991
13029
|
return props.selectionVisible;
|
|
12992
13030
|
},
|
|
@@ -15418,7 +15456,7 @@ var init_log_intro = __esm({
|
|
|
15418
15456
|
init_is_extension_context();
|
|
15419
15457
|
logIntro = () => {
|
|
15420
15458
|
try {
|
|
15421
|
-
const version = "0.1.
|
|
15459
|
+
const version = "0.1.23";
|
|
15422
15460
|
const logoDataUri = `data:image/svg+xml;base64,${btoa(LOGO_SVG)}`;
|
|
15423
15461
|
console.log(
|
|
15424
15462
|
`%cReact Grab${version ? ` v${version}` : ""}%c
|
|
@@ -17818,8 +17856,13 @@ var init_core = __esm({
|
|
|
17818
17856
|
if (!event.isPrimary) return;
|
|
17819
17857
|
if (isEventFromOverlay(event, "data-react-grab-ignore-events")) return;
|
|
17820
17858
|
if (store.contextMenuPosition !== null) return;
|
|
17859
|
+
const isActive = isRendererActive() || isCopying() || isDragging();
|
|
17821
17860
|
const hasModifierKeyHeld = event.metaKey || event.ctrlKey;
|
|
17822
17861
|
handlePointerUp(event.clientX, event.clientY, hasModifierKeyHeld);
|
|
17862
|
+
if (isActive) {
|
|
17863
|
+
event.preventDefault();
|
|
17864
|
+
event.stopImmediatePropagation();
|
|
17865
|
+
}
|
|
17823
17866
|
}, {
|
|
17824
17867
|
capture: true
|
|
17825
17868
|
});
|
|
@@ -17936,6 +17979,18 @@ var init_core = __esm({
|
|
|
17936
17979
|
previousViewportHeight = currentViewportHeight;
|
|
17937
17980
|
handleViewportChange();
|
|
17938
17981
|
});
|
|
17982
|
+
const visualViewport = window.visualViewport;
|
|
17983
|
+
if (visualViewport) {
|
|
17984
|
+
const {
|
|
17985
|
+
signal
|
|
17986
|
+
} = eventListenerManager;
|
|
17987
|
+
visualViewport.addEventListener("resize", handleViewportChange, {
|
|
17988
|
+
signal
|
|
17989
|
+
});
|
|
17990
|
+
visualViewport.addEventListener("scroll", handleViewportChange, {
|
|
17991
|
+
signal
|
|
17992
|
+
});
|
|
17993
|
+
}
|
|
17939
17994
|
let boundsRecalcIntervalId = null;
|
|
17940
17995
|
let viewportChangeFrameId = null;
|
|
17941
17996
|
const startBoundsRecalcIntervalIfNeeded = () => {
|
package/dist/react.js
CHANGED
|
@@ -2140,7 +2140,7 @@ var VERSION, VIEWPORT_MARGIN_PX, OFFSCREEN_POSITION, SELECTION_LERP_FACTOR, FEED
|
|
|
2140
2140
|
var init_constants = __esm({
|
|
2141
2141
|
"src/constants.ts"() {
|
|
2142
2142
|
"use strict";
|
|
2143
|
-
VERSION = "0.1.
|
|
2143
|
+
VERSION = "0.1.23";
|
|
2144
2144
|
VIEWPORT_MARGIN_PX = 8;
|
|
2145
2145
|
OFFSCREEN_POSITION = -1e3;
|
|
2146
2146
|
SELECTION_LERP_FACTOR = 0.95;
|
|
@@ -2787,6 +2787,7 @@ var init_store2 = __esm({
|
|
|
2787
2787
|
if (store.current.state === "justCopied") {
|
|
2788
2788
|
const shouldReturnToActive = store.current.wasActive && !store.wasActivatedByToggle;
|
|
2789
2789
|
if (shouldReturnToActive) {
|
|
2790
|
+
actions.clearFrozenElement();
|
|
2790
2791
|
setStore("current", {
|
|
2791
2792
|
state: "active",
|
|
2792
2793
|
phase: "hovering",
|
|
@@ -3915,7 +3916,7 @@ var init_truncate_string = __esm({
|
|
|
3915
3916
|
});
|
|
3916
3917
|
|
|
3917
3918
|
// src/core/context.ts
|
|
3918
|
-
var NON_COMPONENT_PREFIXES, NEXT_INTERNAL_COMPONENT_NAMES, REACT_INTERNAL_COMPONENT_NAMES, cachedIsNextProject, checkIsNextProject, checkIsInternalComponentName, checkIsSourceComponentName, SERVER_COMPONENT_URL_PREFIXES, isServerComponentUrl, devirtualizeServerUrl, symbolicateServerFrames, extractServerFramesFromDebugStack, enrichServerFrameLocations, stackCache, fetchStackForElement, getStack, getNearestComponentName, resolveSourceFromStack, isUsefulComponentName, getComponentDisplayName, hasSourceFiles, getComponentNamesFromFiber, formatStackContext, getStackContext, getElementContext, getFallbackContext, truncateAttrValue, formatPriorityAttrs, getHTMLPreview;
|
|
3919
|
+
var NON_COMPONENT_PREFIXES, NEXT_INTERNAL_COMPONENT_NAMES, REACT_INTERNAL_COMPONENT_NAMES, cachedIsNextProject, checkIsNextProject, checkIsInternalComponentName, checkIsSourceComponentName, SERVER_COMPONENT_URL_PREFIXES, isServerComponentUrl, devirtualizeServerUrl, symbolicateServerFrames, extractServerFramesFromDebugStack, enrichServerFrameLocations, findNearestFiberElement, stackCache, fetchStackForElement, getStack, getNearestComponentName, resolveSourceFromStack, isUsefulComponentName, getComponentDisplayName, hasSourceFiles, getComponentNamesFromFiber, formatStackContext, getStackContext, getElementContext, getFallbackContext, truncateAttrValue, formatPriorityAttrs, getHTMLPreview;
|
|
3919
3920
|
var init_context = __esm({
|
|
3920
3921
|
"src/core/context.ts"() {
|
|
3921
3922
|
"use strict";
|
|
@@ -4106,6 +4107,15 @@ var init_context = __esm({
|
|
|
4106
4107
|
};
|
|
4107
4108
|
});
|
|
4108
4109
|
};
|
|
4110
|
+
findNearestFiberElement = (element) => {
|
|
4111
|
+
if (!Ee()) return element;
|
|
4112
|
+
let current = element;
|
|
4113
|
+
while (current) {
|
|
4114
|
+
if (Pe(current)) return current;
|
|
4115
|
+
current = current.parentElement;
|
|
4116
|
+
}
|
|
4117
|
+
return element;
|
|
4118
|
+
};
|
|
4109
4119
|
stackCache = /* @__PURE__ */ new WeakMap();
|
|
4110
4120
|
fetchStackForElement = async (element) => {
|
|
4111
4121
|
try {
|
|
@@ -4123,10 +4133,11 @@ var init_context = __esm({
|
|
|
4123
4133
|
};
|
|
4124
4134
|
getStack = (element) => {
|
|
4125
4135
|
if (!Ee()) return Promise.resolve([]);
|
|
4126
|
-
const
|
|
4136
|
+
const resolvedElement = findNearestFiberElement(element);
|
|
4137
|
+
const cached = stackCache.get(resolvedElement);
|
|
4127
4138
|
if (cached) return cached;
|
|
4128
|
-
const promise = fetchStackForElement(
|
|
4129
|
-
stackCache.set(
|
|
4139
|
+
const promise = fetchStackForElement(resolvedElement);
|
|
4140
|
+
stackCache.set(resolvedElement, promise);
|
|
4130
4141
|
return promise;
|
|
4131
4142
|
};
|
|
4132
4143
|
getNearestComponentName = async (element) => {
|
|
@@ -4162,7 +4173,8 @@ var init_context = __esm({
|
|
|
4162
4173
|
};
|
|
4163
4174
|
getComponentDisplayName = (element) => {
|
|
4164
4175
|
if (!Ee()) return null;
|
|
4165
|
-
const
|
|
4176
|
+
const resolvedElement = findNearestFiberElement(element);
|
|
4177
|
+
const fiber = Pe(resolvedElement);
|
|
4166
4178
|
if (!fiber) return null;
|
|
4167
4179
|
let currentFiber = fiber.return;
|
|
4168
4180
|
while (currentFiber) {
|
|
@@ -4249,12 +4261,13 @@ var init_context = __esm({
|
|
|
4249
4261
|
return "";
|
|
4250
4262
|
};
|
|
4251
4263
|
getElementContext = async (element, options = {}) => {
|
|
4252
|
-
const
|
|
4253
|
-
const
|
|
4264
|
+
const resolvedElement = findNearestFiberElement(element);
|
|
4265
|
+
const html = getHTMLPreview(resolvedElement);
|
|
4266
|
+
const stackContext = await getStackContext(resolvedElement, options);
|
|
4254
4267
|
if (stackContext) {
|
|
4255
4268
|
return `${html}${stackContext}`;
|
|
4256
4269
|
}
|
|
4257
|
-
return getFallbackContext(
|
|
4270
|
+
return getFallbackContext(resolvedElement);
|
|
4258
4271
|
};
|
|
4259
4272
|
getFallbackContext = (element) => {
|
|
4260
4273
|
const tagName = getTagName(element);
|
|
@@ -4722,13 +4735,6 @@ var init_overlay_canvas = __esm({
|
|
|
4722
4735
|
initializeCanvas();
|
|
4723
4736
|
scheduleAnimationFrame();
|
|
4724
4737
|
};
|
|
4725
|
-
createEffect(on(() => [props.mouseX, props.mouseY], ([mouseX, mouseY]) => {
|
|
4726
|
-
const targetX = mouseX ?? 0;
|
|
4727
|
-
const targetY = mouseY ?? 0;
|
|
4728
|
-
crosshairCurrentPosition.x = targetX;
|
|
4729
|
-
crosshairCurrentPosition.y = targetY;
|
|
4730
|
-
scheduleAnimationFrame();
|
|
4731
|
-
}));
|
|
4732
4738
|
createEffect(on(() => props.crosshairVisible, () => {
|
|
4733
4739
|
scheduleAnimationFrame();
|
|
4734
4740
|
}));
|
|
@@ -4853,6 +4859,15 @@ var init_overlay_canvas = __esm({
|
|
|
4853
4859
|
onMount(() => {
|
|
4854
4860
|
initializeCanvas();
|
|
4855
4861
|
scheduleAnimationFrame();
|
|
4862
|
+
const handlePointerMove = (event) => {
|
|
4863
|
+
if (!event.isPrimary) return;
|
|
4864
|
+
crosshairCurrentPosition.x = event.clientX;
|
|
4865
|
+
crosshairCurrentPosition.y = event.clientY;
|
|
4866
|
+
scheduleAnimationFrame();
|
|
4867
|
+
};
|
|
4868
|
+
window.addEventListener("pointermove", handlePointerMove, {
|
|
4869
|
+
passive: true
|
|
4870
|
+
});
|
|
4856
4871
|
window.addEventListener("resize", handleWindowResize);
|
|
4857
4872
|
let currentDprMediaQuery = null;
|
|
4858
4873
|
const handleDevicePixelRatioChange = () => {
|
|
@@ -4871,6 +4886,7 @@ var init_overlay_canvas = __esm({
|
|
|
4871
4886
|
};
|
|
4872
4887
|
setupDprMediaQuery();
|
|
4873
4888
|
onCleanup(() => {
|
|
4889
|
+
window.removeEventListener("pointermove", handlePointerMove);
|
|
4874
4890
|
window.removeEventListener("resize", handleWindowResize);
|
|
4875
4891
|
if (currentDprMediaQuery) {
|
|
4876
4892
|
currentDprMediaQuery.removeEventListener("change", handleDevicePixelRatioChange);
|
|
@@ -8648,8 +8664,8 @@ var init_selection_label = __esm({
|
|
|
8648
8664
|
computedArrowPosition: null
|
|
8649
8665
|
};
|
|
8650
8666
|
}
|
|
8651
|
-
const viewportWidth = window.innerWidth;
|
|
8652
|
-
const viewportHeight = window.innerHeight;
|
|
8667
|
+
const viewportWidth = window.visualViewport?.width ?? window.innerWidth;
|
|
8668
|
+
const viewportHeight = window.visualViewport?.height ?? window.innerHeight;
|
|
8653
8669
|
const isSelectionVisibleInViewport = bounds.x + bounds.width > 0 && bounds.x < viewportWidth && bounds.y + bounds.height > 0 && bounds.y < viewportHeight;
|
|
8654
8670
|
if (!isSelectionVisibleInViewport) {
|
|
8655
8671
|
return {
|
|
@@ -9366,7 +9382,7 @@ var init_safe_polygon = __esm({
|
|
|
9366
9382
|
});
|
|
9367
9383
|
|
|
9368
9384
|
// src/utils/freeze-updates.ts
|
|
9369
|
-
var isUpdatesPaused, getOrCache, patchedDispatchers, wrappedDispatchCache, wrappedStartTransitionCache, pendingStoreCallbacks, pendingTransitionCallbacks, pendingStateUpdates, pausedQueueStates, pausedContextStates, renderersWithPatchedDispatcher, typedFiberRoots, getFiberRoot, collectFiberRoots, mergePendingChains, pauseHookQueue, resumeHookQueue, pauseContextDependency, resumeContextDependency, forEachHookQueue, forEachContextDependency, traverseFibers, pauseFiber, resumeFiber, patchDispatcher, installDispatcherPatching, scheduleReactUpdate, invokeCallbacks, initializeFreezeSupport, freezeUpdates;
|
|
9385
|
+
var isUpdatesPaused, getOrCache, patchedDispatchers, wrappedDispatchCache, wrappedStartTransitionCache, pendingStoreCallbacks, pendingTransitionCallbacks, pendingStateUpdates, pausedQueueStates, pausedContextStates, renderersWithPatchedDispatcher, typedFiberRoots, getFiberRoot, collectFiberRoots, mergePendingChains, pauseHookQueue, extractActionsFromChain, resumeHookQueue, pauseContextDependency, resumeContextDependency, forEachHookQueue, forEachContextDependency, traverseFibers, pauseFiber, resumeFiber, patchDispatcher, installDispatcherPatching, scheduleReactUpdate, invokeCallbacks, initializeFreezeSupport, freezeUpdates;
|
|
9370
9386
|
var init_freeze_updates = __esm({
|
|
9371
9387
|
"src/utils/freeze-updates.ts"() {
|
|
9372
9388
|
"use strict";
|
|
@@ -9458,26 +9474,42 @@ var init_freeze_updates = __esm({
|
|
|
9458
9474
|
Object.defineProperty(queue, "pending", {
|
|
9459
9475
|
configurable: true,
|
|
9460
9476
|
enumerable: true,
|
|
9461
|
-
get: () => isUpdatesPaused ?
|
|
9477
|
+
get: () => isUpdatesPaused ? null : currentPendingValue,
|
|
9462
9478
|
set: (newValue) => {
|
|
9463
9479
|
if (isUpdatesPaused) {
|
|
9464
|
-
|
|
9480
|
+
if (newValue !== null) {
|
|
9481
|
+
pauseState.bufferedPending = mergePendingChains(
|
|
9482
|
+
pauseState.bufferedPending ?? null,
|
|
9483
|
+
newValue
|
|
9484
|
+
);
|
|
9485
|
+
}
|
|
9486
|
+
return;
|
|
9465
9487
|
}
|
|
9466
9488
|
currentPendingValue = newValue;
|
|
9467
9489
|
}
|
|
9468
9490
|
});
|
|
9469
9491
|
pausedQueueStates.set(queue, pauseState);
|
|
9470
9492
|
};
|
|
9493
|
+
extractActionsFromChain = (pending) => {
|
|
9494
|
+
if (!pending) return [];
|
|
9495
|
+
const actions = [];
|
|
9496
|
+
const first = pending.next;
|
|
9497
|
+
if (!first) return [];
|
|
9498
|
+
let current = first;
|
|
9499
|
+
do {
|
|
9500
|
+
if (current) {
|
|
9501
|
+
actions.push(current.action);
|
|
9502
|
+
current = current.next;
|
|
9503
|
+
}
|
|
9504
|
+
} while (current && current !== first);
|
|
9505
|
+
return actions;
|
|
9506
|
+
};
|
|
9471
9507
|
resumeHookQueue = (queue) => {
|
|
9472
9508
|
const pauseState = pausedQueueStates.get(queue);
|
|
9473
9509
|
if (!pauseState) return;
|
|
9474
9510
|
if (pauseState.originalGetSnapshot) {
|
|
9475
9511
|
queue.getSnapshot = pauseState.originalGetSnapshot;
|
|
9476
9512
|
}
|
|
9477
|
-
const mergedPending = mergePendingChains(
|
|
9478
|
-
pauseState.pendingValueAtPause ?? null,
|
|
9479
|
-
pauseState.bufferedPending ?? null
|
|
9480
|
-
);
|
|
9481
9513
|
if (pauseState.originalPendingDescriptor) {
|
|
9482
9514
|
Object.defineProperty(
|
|
9483
9515
|
queue,
|
|
@@ -9487,7 +9519,19 @@ var init_freeze_updates = __esm({
|
|
|
9487
9519
|
} else {
|
|
9488
9520
|
delete queue.pending;
|
|
9489
9521
|
}
|
|
9490
|
-
queue.pending =
|
|
9522
|
+
queue.pending = null;
|
|
9523
|
+
const dispatch = queue.dispatch;
|
|
9524
|
+
if (typeof dispatch === "function") {
|
|
9525
|
+
const pendingActions = extractActionsFromChain(
|
|
9526
|
+
pauseState.pendingValueAtPause ?? null
|
|
9527
|
+
);
|
|
9528
|
+
const bufferedActions = extractActionsFromChain(
|
|
9529
|
+
pauseState.bufferedPending ?? null
|
|
9530
|
+
);
|
|
9531
|
+
for (const action of [...pendingActions, ...bufferedActions]) {
|
|
9532
|
+
pendingStateUpdates.push(() => dispatch(action));
|
|
9533
|
+
}
|
|
9534
|
+
}
|
|
9491
9535
|
pausedQueueStates.delete(queue);
|
|
9492
9536
|
};
|
|
9493
9537
|
pauseContextDependency = (contextDependency) => {
|
|
@@ -12969,12 +13013,6 @@ var init_renderer = __esm({
|
|
|
12969
13013
|
get crosshairVisible() {
|
|
12970
13014
|
return props.crosshairVisible;
|
|
12971
13015
|
},
|
|
12972
|
-
get mouseX() {
|
|
12973
|
-
return props.mouseX;
|
|
12974
|
-
},
|
|
12975
|
-
get mouseY() {
|
|
12976
|
-
return props.mouseY;
|
|
12977
|
-
},
|
|
12978
13016
|
get selectionVisible() {
|
|
12979
13017
|
return props.selectionVisible;
|
|
12980
13018
|
},
|
|
@@ -15406,7 +15444,7 @@ var init_log_intro = __esm({
|
|
|
15406
15444
|
init_is_extension_context();
|
|
15407
15445
|
logIntro = () => {
|
|
15408
15446
|
try {
|
|
15409
|
-
const version = "0.1.
|
|
15447
|
+
const version = "0.1.23";
|
|
15410
15448
|
const logoDataUri = `data:image/svg+xml;base64,${btoa(LOGO_SVG)}`;
|
|
15411
15449
|
console.log(
|
|
15412
15450
|
`%cReact Grab${version ? ` v${version}` : ""}%c
|
|
@@ -17806,8 +17844,13 @@ var init_core = __esm({
|
|
|
17806
17844
|
if (!event.isPrimary) return;
|
|
17807
17845
|
if (isEventFromOverlay(event, "data-react-grab-ignore-events")) return;
|
|
17808
17846
|
if (store.contextMenuPosition !== null) return;
|
|
17847
|
+
const isActive = isRendererActive() || isCopying() || isDragging();
|
|
17809
17848
|
const hasModifierKeyHeld = event.metaKey || event.ctrlKey;
|
|
17810
17849
|
handlePointerUp(event.clientX, event.clientY, hasModifierKeyHeld);
|
|
17850
|
+
if (isActive) {
|
|
17851
|
+
event.preventDefault();
|
|
17852
|
+
event.stopImmediatePropagation();
|
|
17853
|
+
}
|
|
17811
17854
|
}, {
|
|
17812
17855
|
capture: true
|
|
17813
17856
|
});
|
|
@@ -17924,6 +17967,18 @@ var init_core = __esm({
|
|
|
17924
17967
|
previousViewportHeight = currentViewportHeight;
|
|
17925
17968
|
handleViewportChange();
|
|
17926
17969
|
});
|
|
17970
|
+
const visualViewport = window.visualViewport;
|
|
17971
|
+
if (visualViewport) {
|
|
17972
|
+
const {
|
|
17973
|
+
signal
|
|
17974
|
+
} = eventListenerManager;
|
|
17975
|
+
visualViewport.addEventListener("resize", handleViewportChange, {
|
|
17976
|
+
signal
|
|
17977
|
+
});
|
|
17978
|
+
visualViewport.addEventListener("scroll", handleViewportChange, {
|
|
17979
|
+
signal
|
|
17980
|
+
});
|
|
17981
|
+
}
|
|
17927
17982
|
let boundsRecalcIntervalId = null;
|
|
17928
17983
|
let viewportChangeFrameId = null;
|
|
17929
17984
|
const startBoundsRecalcIntervalIfNeeded = () => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-grab",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.23",
|
|
4
4
|
"description": "Select context for coding agents directly from your website",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"agent",
|
|
@@ -22,7 +22,11 @@
|
|
|
22
22
|
"type": "git",
|
|
23
23
|
"url": "git+https://github.com/aidenybai/react-grab.git"
|
|
24
24
|
},
|
|
25
|
+
"bin": {
|
|
26
|
+
"react-grab": "./bin/cli.js"
|
|
27
|
+
},
|
|
25
28
|
"files": [
|
|
29
|
+
"bin",
|
|
26
30
|
"dist",
|
|
27
31
|
"package.json",
|
|
28
32
|
"README.md",
|
|
@@ -79,7 +83,8 @@
|
|
|
79
83
|
"dependencies": {
|
|
80
84
|
"@medv/finder": "^4.0.2",
|
|
81
85
|
"bippy": "^0.5.30",
|
|
82
|
-
"solid-js": "^1.9.10"
|
|
86
|
+
"solid-js": "^1.9.10",
|
|
87
|
+
"@react-grab/cli": "0.1.23"
|
|
83
88
|
},
|
|
84
89
|
"devDependencies": {
|
|
85
90
|
"@babel/core": "^7.28.5",
|