react-native-grab 0.0.6 → 0.0.8
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 +4 -5
- package/dist/cjs/react-native/copy.js +17 -1
- package/dist/cjs/react-native/copy.js.map +1 -1
- package/dist/cjs/react-native/dev-menu.js +2 -2
- package/dist/cjs/react-native/dev-menu.js.map +1 -1
- package/dist/cjs/react-native/grab-controller.js +17 -0
- package/dist/cjs/react-native/grab-controller.js.map +1 -0
- package/dist/cjs/react-native/grab-overlay.js +11 -30
- package/dist/cjs/react-native/grab-overlay.js.map +1 -1
- package/dist/cjs/react-native/index.js +3 -1
- package/dist/cjs/react-native/index.js.map +1 -1
- package/dist/esm/react-native/copy.js +14 -1
- package/dist/esm/react-native/copy.js.map +1 -1
- package/dist/esm/react-native/dev-menu.js +2 -2
- package/dist/esm/react-native/dev-menu.js.map +1 -1
- package/dist/esm/react-native/grab-controller.js +12 -0
- package/dist/esm/react-native/grab-controller.js.map +1 -0
- package/dist/esm/react-native/grab-overlay.js +12 -31
- package/dist/esm/react-native/grab-overlay.js.map +1 -1
- package/dist/esm/react-native/index.js +1 -0
- package/dist/esm/react-native/index.js.map +1 -1
- package/dist/types/react-native/copy.d.ts.map +1 -1
- package/dist/types/react-native/grab-controller.d.ts +5 -0
- package/dist/types/react-native/grab-controller.d.ts.map +1 -0
- package/dist/types/react-native/grab-overlay.d.ts.map +1 -1
- package/dist/types/react-native/index.d.ts +1 -0
- package/dist/types/react-native/index.d.ts.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -65,11 +65,10 @@ Notes:
|
|
|
65
65
|
## Workflow
|
|
66
66
|
|
|
67
67
|
1. Start your app in development.
|
|
68
|
-
2. Open the React Native Dev Menu and select `React Native Grab
|
|
69
|
-
3.
|
|
70
|
-
4.
|
|
71
|
-
5.
|
|
72
|
-
6. Paste into Codex/Cursor/Claude Code/Copilot with your requested change.
|
|
68
|
+
2. Open the React Native Dev Menu and select `React Native Grab`.
|
|
69
|
+
3. Touch and move on screen to select elements, then release to capture.
|
|
70
|
+
4. Context is sent to Metro and copied to your host clipboard.
|
|
71
|
+
5. Paste into Codex/Cursor/Claude Code/Copilot with your requested change.
|
|
73
72
|
|
|
74
73
|
## Development (this repo)
|
|
75
74
|
|
|
@@ -1,12 +1,28 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
2
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
6
|
exports.copyViaMetro = void 0;
|
|
7
|
+
const getDevServer_1 = __importDefault(require("react-native/Libraries/Core/Devtools/getDevServer"));
|
|
4
8
|
const DEFAULT_COPY_ENDPOINT = "/__react-native-grab/copy";
|
|
9
|
+
const hasProtocol = (url) => /^https?:\/\//i.test(url);
|
|
10
|
+
const resolveEndpointUrl = (endpoint) => {
|
|
11
|
+
const resolvedEndpoint = endpoint ?? DEFAULT_COPY_ENDPOINT;
|
|
12
|
+
if (hasProtocol(resolvedEndpoint)) {
|
|
13
|
+
return resolvedEndpoint;
|
|
14
|
+
}
|
|
15
|
+
const baseUrl = (0, getDevServer_1.default)().url;
|
|
16
|
+
const normalizedEndpoint = resolvedEndpoint.startsWith("/")
|
|
17
|
+
? resolvedEndpoint.slice(1)
|
|
18
|
+
: resolvedEndpoint;
|
|
19
|
+
return `${baseUrl}${normalizedEndpoint}`;
|
|
20
|
+
};
|
|
5
21
|
const copyViaMetro = async (text, options = {}) => {
|
|
6
22
|
if (!text.trim()) {
|
|
7
23
|
throw new Error("Text to copy cannot be empty");
|
|
8
24
|
}
|
|
9
|
-
const response = await fetch(options.endpoint
|
|
25
|
+
const response = await fetch(resolveEndpointUrl(options.endpoint), {
|
|
10
26
|
method: "POST",
|
|
11
27
|
headers: { "Content-Type": "application/json" },
|
|
12
28
|
body: JSON.stringify({ text }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"copy.js","sourceRoot":"","sources":["../../../src/react-native/copy.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"copy.js","sourceRoot":"","sources":["../../../src/react-native/copy.ts"],"names":[],"mappings":";;;;;;AAAA,qGAA6E;AAE7E,MAAM,qBAAqB,GAAG,2BAA2B,CAAC;AAgB1D,MAAM,WAAW,GAAG,CAAC,GAAW,EAAW,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAExE,MAAM,kBAAkB,GAAG,CAAC,QAAiB,EAAU,EAAE;IACvD,MAAM,gBAAgB,GAAG,QAAQ,IAAI,qBAAqB,CAAC;IAE3D,IAAI,WAAW,CAAC,gBAAgB,CAAC,EAAE,CAAC;QAClC,OAAO,gBAAgB,CAAC;IAC1B,CAAC;IAED,MAAM,OAAO,GAAG,IAAA,sBAAY,GAAE,CAAC,GAAG,CAAC;IACnC,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,UAAU,CAAC,GAAG,CAAC;QACzD,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC;QAC3B,CAAC,CAAC,gBAAgB,CAAC;IAErB,OAAO,GAAG,OAAO,GAAG,kBAAkB,EAAE,CAAC;AAC3C,CAAC,CAAC;AAEK,MAAM,YAAY,GAAG,KAAK,EAC/B,IAAY,EACZ,UAA+B,EAAE,EAClB,EAAE;IACjB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;QACjB,MAAM,IAAI,KAAK,CAAC,8BAA8B,CAAC,CAAC;IAClD,CAAC;IAED,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,kBAAkB,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;QACjE,MAAM,EAAE,MAAM;QACd,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;QAC/C,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,EAAE,IAAI,EAA+B,CAAC;QAC3D,MAAM,EAAE,OAAO,CAAC,MAAM;KACvB,CAAC,CAAC;IAEH,IAAI,OAAwC,CAAC;IAC7C,IAAI,CAAC;QACH,OAAO,GAAG,CAAC,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAwB,CAAC;IAC3D,CAAC;IAAC,MAAM,CAAC;QACP,OAAO,GAAG,SAAS,CAAC;IACtB,CAAC;IAED,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,OAAO,EAAE,EAAE,KAAK,KAAK,EAAE,CAAC;QAC1C,MAAM,IAAI,KAAK,CAAC,OAAO,EAAE,KAAK,IAAI,mCAAmC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC;IAC1F,CAAC;AACH,CAAC,CAAC;AAzBW,QAAA,YAAY,gBAyBvB"}
|
|
@@ -8,7 +8,7 @@ const useDevMenu = (onToggle) => {
|
|
|
8
8
|
const onToggleRef = (0, utils_1.useLatest)(onToggle);
|
|
9
9
|
// Add to React Native Dev Menu
|
|
10
10
|
(0, react_1.useEffect)(() => {
|
|
11
|
-
react_native_1.DevSettings.addMenuItem("React Native Grab
|
|
11
|
+
react_native_1.DevSettings.addMenuItem("React Native Grab", () => {
|
|
12
12
|
onToggleRef.current();
|
|
13
13
|
});
|
|
14
14
|
}, []);
|
|
@@ -18,7 +18,7 @@ const useDevMenu = (onToggle) => {
|
|
|
18
18
|
const expoDevMenuModule = require("expo-dev-menu");
|
|
19
19
|
expoDevMenuModule.registerDevMenuItems([
|
|
20
20
|
{
|
|
21
|
-
name: "React Native Grab
|
|
21
|
+
name: "React Native Grab",
|
|
22
22
|
callback: () => {
|
|
23
23
|
onToggleRef.current();
|
|
24
24
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dev-menu.js","sourceRoot":"","sources":["../../../src/react-native/dev-menu.ts"],"names":[],"mappings":";;;AAAA,iCAAkC;AAClC,+CAA2C;AAC3C,mCAAoC;AAG7B,MAAM,UAAU,GAAG,CAAC,QAAoB,EAAE,EAAE;IACjD,MAAM,WAAW,GAAG,IAAA,iBAAS,EAAC,QAAQ,CAAC,CAAC;IAExC,+BAA+B;IAC/B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,0BAAW,CAAC,WAAW,CAAC,
|
|
1
|
+
{"version":3,"file":"dev-menu.js","sourceRoot":"","sources":["../../../src/react-native/dev-menu.ts"],"names":[],"mappings":";;;AAAA,iCAAkC;AAClC,+CAA2C;AAC3C,mCAAoC;AAG7B,MAAM,UAAU,GAAG,CAAC,QAAoB,EAAE,EAAE;IACjD,MAAM,WAAW,GAAG,IAAA,iBAAS,EAAC,QAAQ,CAAC,CAAC;IAExC,+BAA+B;IAC/B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,0BAAW,CAAC,WAAW,CAAC,mBAAmB,EAAE,GAAG,EAAE;YAChD,WAAW,CAAC,OAAO,EAAE,CAAC;QACxB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,oCAAoC;IACpC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC;YACH,MAAM,iBAAiB,GAAG,OAAO,CAAC,eAAe,CAA6B,CAAC;YAE/E,iBAAiB,CAAC,oBAAoB,CAAC;gBACrC;oBACE,IAAI,EAAE,mBAAmB;oBACzB,QAAQ,EAAE,GAAG,EAAE;wBACb,WAAW,CAAC,OAAO,EAAE,CAAC;oBACxB,CAAC;iBACF;aACF,CAAC,CAAC;QACL,CAAC;QAAC,MAAM,CAAC;YACP,iEAAiE;QACnE,CAAC;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;AACT,CAAC,CAAC;AA3BW,QAAA,UAAU,cA2BrB"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.enableGrabbing = exports.setEnableGrabbingHandler = void 0;
|
|
4
|
+
let enableGrabbingHandler = null;
|
|
5
|
+
const setEnableGrabbingHandler = (handler) => {
|
|
6
|
+
enableGrabbingHandler = handler;
|
|
7
|
+
};
|
|
8
|
+
exports.setEnableGrabbingHandler = setEnableGrabbingHandler;
|
|
9
|
+
const enableGrabbing = () => {
|
|
10
|
+
if (!enableGrabbingHandler) {
|
|
11
|
+
console.error("[react-native-grab] Cannot enable grabbing. Ensure ReactNativeGrabRoot is mounted.");
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
enableGrabbingHandler();
|
|
15
|
+
};
|
|
16
|
+
exports.enableGrabbing = enableGrabbing;
|
|
17
|
+
//# sourceMappingURL=grab-controller.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"grab-controller.js","sourceRoot":"","sources":["../../../src/react-native/grab-controller.ts"],"names":[],"mappings":";;;AAEA,IAAI,qBAAqB,GAAiC,IAAI,CAAC;AAExD,MAAM,wBAAwB,GAAG,CAAC,OAAqC,EAAE,EAAE;IAChF,qBAAqB,GAAG,OAAO,CAAC;AAClC,CAAC,CAAC;AAFW,QAAA,wBAAwB,4BAEnC;AAEK,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC3B,OAAO,CAAC,KAAK,CACX,oFAAoF,CACrF,CAAC;QACF,OAAO;IACT,CAAC;IAED,qBAAqB,EAAE,CAAC;AAC1B,CAAC,CAAC;AATW,QAAA,cAAc,kBASzB"}
|
|
@@ -10,6 +10,7 @@ const dev_menu_1 = require("./dev-menu");
|
|
|
10
10
|
const description_1 = require("./description");
|
|
11
11
|
const copy_1 = require("./copy");
|
|
12
12
|
const full_screen_overlay_1 = require("./full-screen-overlay");
|
|
13
|
+
const grab_controller_1 = require("./grab-controller");
|
|
13
14
|
const COPY_BADGE_DURATION_MS = 1600;
|
|
14
15
|
const CALLSTACK_PRIMARY = "#8232FF";
|
|
15
16
|
const HIGHLIGHT_FILL = "rgba(130, 50, 255, 0.2)";
|
|
@@ -17,7 +18,6 @@ const BADGE_BACKGROUND = "rgba(130, 50, 255, 0.92)";
|
|
|
17
18
|
const ReactNativeGrabOverlay = () => {
|
|
18
19
|
const copyBadgeTimeoutRef = (0, react_1.useRef)(null);
|
|
19
20
|
const [state, setState] = (0, react_1.useState)({
|
|
20
|
-
isButtonEnabled: false,
|
|
21
21
|
isSessionEnabled: false,
|
|
22
22
|
grabbedElement: null,
|
|
23
23
|
isCopyBadgeVisible: false,
|
|
@@ -36,14 +36,6 @@ const ReactNativeGrabOverlay = () => {
|
|
|
36
36
|
isSessionEnabled: false,
|
|
37
37
|
}));
|
|
38
38
|
}, []);
|
|
39
|
-
const toggleButtonEnabled = (0, react_1.useCallback)(() => {
|
|
40
|
-
setState((prev) => ({
|
|
41
|
-
...prev,
|
|
42
|
-
isButtonEnabled: !prev.isButtonEnabled,
|
|
43
|
-
isSessionEnabled: !prev.isButtonEnabled ? prev.isSessionEnabled : false,
|
|
44
|
-
grabbedElement: !prev.isButtonEnabled ? prev.grabbedElement : null,
|
|
45
|
-
}));
|
|
46
|
-
}, []);
|
|
47
39
|
(0, react_1.useEffect)(() => {
|
|
48
40
|
return () => {
|
|
49
41
|
if (copyBadgeTimeoutRef.current) {
|
|
@@ -67,7 +59,13 @@ const ReactNativeGrabOverlay = () => {
|
|
|
67
59
|
copyBadgeTimeoutRef.current = null;
|
|
68
60
|
}, COPY_BADGE_DURATION_MS);
|
|
69
61
|
}, []);
|
|
70
|
-
(0,
|
|
62
|
+
(0, react_1.useEffect)(() => {
|
|
63
|
+
(0, grab_controller_1.setEnableGrabbingHandler)(startSession);
|
|
64
|
+
return () => {
|
|
65
|
+
(0, grab_controller_1.setEnableGrabbingHandler)(null);
|
|
66
|
+
};
|
|
67
|
+
}, [startSession]);
|
|
68
|
+
(0, dev_menu_1.useDevMenu)(startSession);
|
|
71
69
|
const getElementAtPoint = (nativePageX, nativePageY) => {
|
|
72
70
|
const appRootShadowNode = (0, containers_1.getAppRootShadowNode)();
|
|
73
71
|
const focusedScreenShadowNode = (0, containers_1.getFocusedScreenShadowNode)();
|
|
@@ -115,7 +113,7 @@ const ReactNativeGrabOverlay = () => {
|
|
|
115
113
|
showCopiedBadge();
|
|
116
114
|
}
|
|
117
115
|
catch {
|
|
118
|
-
|
|
116
|
+
console.error("[react-native-grab] Copying failed. Ensure your Metro config is wrapped with withReactNativeGrab(...) and Metro has been restarted.");
|
|
119
117
|
}
|
|
120
118
|
finally {
|
|
121
119
|
stopSession();
|
|
@@ -123,7 +121,7 @@ const ReactNativeGrabOverlay = () => {
|
|
|
123
121
|
})();
|
|
124
122
|
},
|
|
125
123
|
})).current;
|
|
126
|
-
return ((0, jsx_runtime_1.jsx)(full_screen_overlay_1.FullScreenOverlay, { children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { pointerEvents: "box-none", style: styles.overlayRoot, children: [state.
|
|
124
|
+
return ((0, jsx_runtime_1.jsx)(full_screen_overlay_1.FullScreenOverlay, { children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { pointerEvents: "box-none", style: styles.overlayRoot, children: [state.isSessionEnabled && ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: [react_native_1.StyleSheet.absoluteFill], ...panResponder.panHandlers })), state.isSessionEnabled && ((0, jsx_runtime_1.jsx)(react_native_1.View, { pointerEvents: "none", style: styles.topBadge, children: (0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.topBadgeText, children: "Touch and move around to grab" }) })), state.isCopyBadgeVisible && ((0, jsx_runtime_1.jsx)(react_native_1.View, { pointerEvents: "none", style: styles.topBadge, children: (0, jsx_runtime_1.jsx)(react_native_1.Text, { style: styles.topBadgeText, children: "Element copied" }) })), !!state.grabbedElement && ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: [
|
|
127
125
|
{
|
|
128
126
|
position: "absolute",
|
|
129
127
|
left: state.grabbedElement.rect[0],
|
|
@@ -143,24 +141,7 @@ exports.ReactNativeGrabOverlay = ReactNativeGrabOverlay;
|
|
|
143
141
|
const styles = react_native_1.StyleSheet.create({
|
|
144
142
|
overlayRoot: {
|
|
145
143
|
...react_native_1.StyleSheet.absoluteFillObject,
|
|
146
|
-
zIndex:
|
|
147
|
-
elevation: 2147483647,
|
|
148
|
-
},
|
|
149
|
-
floatingButton: {
|
|
150
|
-
position: "absolute",
|
|
151
|
-
right: 18,
|
|
152
|
-
bottom: 28,
|
|
153
|
-
borderRadius: 999,
|
|
154
|
-
paddingHorizontal: 16,
|
|
155
|
-
paddingVertical: 10,
|
|
156
|
-
backgroundColor: BADGE_BACKGROUND,
|
|
157
|
-
zIndex: 2147483647,
|
|
158
|
-
elevation: 2147483647,
|
|
159
|
-
},
|
|
160
|
-
floatingButtonText: {
|
|
161
|
-
color: "#FFFFFF",
|
|
162
|
-
fontSize: 14,
|
|
163
|
-
fontWeight: "700",
|
|
144
|
+
zIndex: 9999,
|
|
164
145
|
},
|
|
165
146
|
topBadge: {
|
|
166
147
|
position: "absolute",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grab-overlay.js","sourceRoot":"","sources":["../../../src/react-native/grab-overlay.tsx"],"names":[],"mappings":";;;;AAAA,iCAAiE;AACjE,+
|
|
1
|
+
{"version":3,"file":"grab-overlay.js","sourceRoot":"","sources":["../../../src/react-native/grab-overlay.tsx"],"names":[],"mappings":";;;;AAAA,iCAAiE;AACjE,+CAAsF;AACtF,6CAAgF;AAChF,uCAA6D;AAE7D,yCAAwC;AACxC,+CAA+C;AAC/C,iCAAsC;AACtC,+DAA0D;AAC1D,uDAA6D;AAO7D,MAAM,sBAAsB,GAAG,IAAI,CAAC;AACpC,MAAM,iBAAiB,GAAG,SAAS,CAAC;AACpC,MAAM,cAAc,GAAG,yBAAyB,CAAC;AACjD,MAAM,gBAAgB,GAAG,0BAA0B,CAAC;AAE7C,MAAM,sBAAsB,GAAG,GAAG,EAAE;IACzC,MAAM,mBAAmB,GAAG,IAAA,cAAM,EAAuC,IAAI,CAAC,CAAC;IAC/E,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC;QACjC,gBAAgB,EAAE,KAAK;QACvB,cAAc,EAAE,IAAyB;QACzC,kBAAkB,EAAE,KAAK;KAC1B,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QACpC,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YAClB,GAAG,IAAI;YACP,cAAc,EAAE,IAAI;YACpB,gBAAgB,EAAE,IAAI;SACvB,CAAC,CAAC,CAAC;IACN,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,WAAW,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QACnC,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YAClB,GAAG,IAAI;YACP,cAAc,EAAE,IAAI;YACpB,gBAAgB,EAAE,KAAK;SACxB,CAAC,CAAC,CAAC;IACN,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,IAAI,mBAAmB,CAAC,OAAO,EAAE,CAAC;gBAChC,YAAY,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC;YAC5C,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,oBAAoB,GAAG,IAAA,mBAAW,EAAC,CAAC,cAAiC,EAAE,EAAE;QAC7E,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YAClB,GAAG,IAAI;YACP,cAAc;SACf,CAAC,CAAC,CAAC;IACN,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,eAAe,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QACvC,IAAI,mBAAmB,CAAC,OAAO,EAAE,CAAC;YAChC,YAAY,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC;QAC5C,CAAC;QAED,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,kBAAkB,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;QAE5D,mBAAmB,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;YAC5C,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;YAC7D,mBAAmB,CAAC,OAAO,GAAG,IAAI,CAAC;QACrC,CAAC,EAAE,sBAAsB,CAAC,CAAC;IAC7B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAA,0CAAwB,EAAC,YAAY,CAAC,CAAC;QACvC,OAAO,GAAG,EAAE;YACV,IAAA,0CAAwB,EAAC,IAAI,CAAC,CAAC;QACjC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,IAAA,qBAAU,EAAC,YAAY,CAAC,CAAC;IAEzB,MAAM,iBAAiB,GAAG,CACxB,WAAmB,EACnB,WAAmB,EACmD,EAAE;QACxE,MAAM,iBAAiB,GAAG,IAAA,iCAAoB,GAAE,CAAC;QACjD,MAAM,uBAAuB,GAAG,IAAA,uCAA0B,GAAE,CAAC;QAE7D,MAAM,yBAAyB,GAAG,IAAA,yBAAe,EAAC,iBAAiB,CAAC,CAAC;QACrE,MAAM,+BAA+B,GAAG,IAAA,yBAAe,EAAC,uBAAuB,CAAC,CAAC;QAEjF,IAAI,oBAAoB,GAAG,+BAA+B,CAAC,CAAC,CAAC,CAAC;QAC9D,IAAI,mBAAmB,GAAG,+BAA+B,CAAC,CAAC,CAAC,CAAC;QAC7D,IAAI,aAAa,GAAG,yBAAyB,CAAC,CAAC,CAAC,CAAC;QAEjD,MAAM,MAAM,GAAG,aAAa,GAAG,mBAAmB,GAAG,oBAAoB,CAAC;QAC1E,MAAM,KAAK,GAAG,WAAW,CAAC;QAC1B,MAAM,KAAK,GAAG,WAAW,GAAG,CAAC,aAAa,GAAG,mBAAmB,CAAC,CAAC;QAElE,MAAM,YAAY,GAAG,IAAA,yBAAe,EAAC,uBAAuB,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;QAC5E,MAAM,UAAU,GAAG,YAAY,EAAE,SAAS,EAAE,IAAI,CAAC;QAEjD,IAAI,CAAC,UAAU,EAAE,CAAC;YAChB,OAAO,IAAI,CAAC;QACd,CAAC;QAED,MAAM,IAAI,GAAG,qBAAqB,CAAC,qBAAqB,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;QAC3E,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC1F,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,WAA6B,EAAE,EAAE;QACpD,MAAM,MAAM,GAAG,iBAAiB,CAAC,WAAW,CAAC,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC;QAEvE,IAAI,CAAC,MAAM,EAAE,CAAC;YACZ,oBAAoB,CAAC,IAAI,CAAC,CAAC;YAC3B,OAAO,IAAI,CAAC;QACd,CAAC;QAED,oBAAoB,CAAC,MAAM,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,KAAK,EAAE,MAAkB,EAAiB,EAAE;QACjE,MAAM,WAAW,GAAG,MAAM,IAAA,4BAAc,EAAC,MAAM,CAAC,SAAS,CAAC,CAAC;QAC3D,MAAM,IAAA,mBAAY,EAAC,WAAW,CAAC,CAAC;IAClC,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,IAAA,cAAM,EACzB,2BAAY,CAAC,MAAM,CAAC;QAClB,mCAAmC,EAAE,GAAG,EAAE,CAAC,IAAI;QAC/C,kCAAkC,EAAE,GAAG,EAAE,CAAC,IAAI;QAE9C,mBAAmB,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,WAAW,CAAC,GAAG,CAAC,WAAW,CAAC;QAC1D,kBAAkB,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,WAAW,CAAC,GAAG,CAAC,WAAW,CAAC;QACzD,qBAAqB,EAAE,CAAC,GAAG,EAAE,EAAE;YAC7B,KAAK,CAAC,KAAK,IAAI,EAAE;gBACf,IAAI,CAAC;oBACH,MAAM,MAAM,GAAG,iBAAiB,CAAC,GAAG,CAAC,WAAW,CAAC,KAAK,EAAE,GAAG,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;oBAC/E,IAAI,CAAC,MAAM,EAAE,CAAC;wBACZ,OAAO;oBACT,CAAC;oBAED,MAAM,cAAc,CAAC,MAAM,CAAC,CAAC;oBAC7B,eAAe,EAAE,CAAC;gBACpB,CAAC;gBAAC,MAAM,CAAC;oBACP,OAAO,CAAC,KAAK,CACX,qIAAqI,CACtI,CAAC;gBACJ,CAAC;wBAAS,CAAC;oBACT,WAAW,EAAE,CAAC;gBAChB,CAAC;YACH,CAAC,CAAC,EAAE,CAAC;QACP,CAAC;KACF,CAAC,CACH,CAAC,OAAO,CAAC;IAEV,OAAO,CACL,uBAAC,uCAAiB,cAChB,wBAAC,mBAAI,IAAC,aAAa,EAAC,UAAU,EAAC,KAAK,EAAE,MAAM,CAAC,WAAW,aACrD,KAAK,CAAC,gBAAgB,IAAI,CACzB,uBAAC,mBAAI,IAAC,KAAK,EAAE,CAAC,yBAAU,CAAC,YAAY,CAAC,KAAM,YAAY,CAAC,WAAW,GAAI,CACzE,EAEA,KAAK,CAAC,gBAAgB,IAAI,CACzB,uBAAC,mBAAI,IAAC,aAAa,EAAC,MAAM,EAAC,KAAK,EAAE,MAAM,CAAC,QAAQ,YAC/C,uBAAC,mBAAI,IAAC,KAAK,EAAE,MAAM,CAAC,YAAY,8CAAsC,GACjE,CACR,EAEA,KAAK,CAAC,kBAAkB,IAAI,CAC3B,uBAAC,mBAAI,IAAC,aAAa,EAAC,MAAM,EAAC,KAAK,EAAE,MAAM,CAAC,QAAQ,YAC/C,uBAAC,mBAAI,IAAC,KAAK,EAAE,MAAM,CAAC,YAAY,+BAAuB,GAClD,CACR,EAEA,CAAC,CAAC,KAAK,CAAC,cAAc,IAAI,CACzB,uBAAC,mBAAI,IACH,KAAK,EAAE;wBACL;4BACE,QAAQ,EAAE,UAAU;4BACpB,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC;4BAClC,GAAG,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC;4BACjC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC;4BACnC,MAAM,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC;4BACpC,aAAa,EAAE,MAAM;yBACtB;wBACD;4BACE,eAAe,EAAE,cAAc;4BAC/B,WAAW,EAAE,CAAC;4BACd,WAAW,EAAE,iBAAiB;yBAC/B;qBACF,GACD,CACH,IACI,GACW,CACrB,CAAC;AACJ,CAAC,CAAC;AAhLW,QAAA,sBAAsB,0BAgLjC;AAEF,MAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,WAAW,EAAE;QACX,GAAG,yBAAU,CAAC,kBAAkB;QAChC,MAAM,EAAE,IAAI;KACb;IACD,QAAQ,EAAE;QACR,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,EAAE;QACP,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,GAAG;QACjB,iBAAiB,EAAE,EAAE;QACrB,eAAe,EAAE,CAAC;QAClB,eAAe,EAAE,gBAAgB;KAClC;IACD,YAAY,EAAE;QACZ,KAAK,EAAE,SAAS;QAChB,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,KAAK;KAClB;CACF,CAAC,CAAC"}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.copyViaMetro = exports.ReactNativeGrabScreen = exports.ReactNativeGrabRoot = void 0;
|
|
3
|
+
exports.enableGrabbing = exports.copyViaMetro = exports.ReactNativeGrabScreen = exports.ReactNativeGrabRoot = void 0;
|
|
4
4
|
var grab_root_1 = require("./grab-root");
|
|
5
5
|
Object.defineProperty(exports, "ReactNativeGrabRoot", { enumerable: true, get: function () { return grab_root_1.ReactNativeGrabRoot; } });
|
|
6
6
|
var grab_screen_1 = require("./grab-screen");
|
|
7
7
|
Object.defineProperty(exports, "ReactNativeGrabScreen", { enumerable: true, get: function () { return grab_screen_1.ReactNativeGrabScreen; } });
|
|
8
8
|
var copy_1 = require("./copy");
|
|
9
9
|
Object.defineProperty(exports, "copyViaMetro", { enumerable: true, get: function () { return copy_1.copyViaMetro; } });
|
|
10
|
+
var grab_controller_1 = require("./grab-controller");
|
|
11
|
+
Object.defineProperty(exports, "enableGrabbing", { enumerable: true, get: function () { return grab_controller_1.enableGrabbing; } });
|
|
10
12
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/react-native/index.ts"],"names":[],"mappings":";;;AAAA,yCAAiF;AAAxE,gHAAA,mBAAmB,OAAA;AAC5B,6CAAuF;AAA9E,oHAAA,qBAAqB,OAAA;AAC9B,+BAAsC;AAA7B,oGAAA,YAAY,OAAA"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/react-native/index.ts"],"names":[],"mappings":";;;AAAA,yCAAiF;AAAxE,gHAAA,mBAAmB,OAAA;AAC5B,6CAAuF;AAA9E,oHAAA,qBAAqB,OAAA;AAC9B,+BAAsC;AAA7B,oGAAA,YAAY,OAAA;AACrB,qDAAmD;AAA1C,iHAAA,cAAc,OAAA"}
|
|
@@ -1,9 +1,22 @@
|
|
|
1
|
+
import getDevServer from "react-native/Libraries/Core/Devtools/getDevServer";
|
|
1
2
|
const DEFAULT_COPY_ENDPOINT = "/__react-native-grab/copy";
|
|
3
|
+
const hasProtocol = (url) => /^https?:\/\//i.test(url);
|
|
4
|
+
const resolveEndpointUrl = (endpoint) => {
|
|
5
|
+
const resolvedEndpoint = endpoint ?? DEFAULT_COPY_ENDPOINT;
|
|
6
|
+
if (hasProtocol(resolvedEndpoint)) {
|
|
7
|
+
return resolvedEndpoint;
|
|
8
|
+
}
|
|
9
|
+
const baseUrl = getDevServer().url;
|
|
10
|
+
const normalizedEndpoint = resolvedEndpoint.startsWith("/")
|
|
11
|
+
? resolvedEndpoint.slice(1)
|
|
12
|
+
: resolvedEndpoint;
|
|
13
|
+
return `${baseUrl}${normalizedEndpoint}`;
|
|
14
|
+
};
|
|
2
15
|
export const copyViaMetro = async (text, options = {}) => {
|
|
3
16
|
if (!text.trim()) {
|
|
4
17
|
throw new Error("Text to copy cannot be empty");
|
|
5
18
|
}
|
|
6
|
-
const response = await fetch(options.endpoint
|
|
19
|
+
const response = await fetch(resolveEndpointUrl(options.endpoint), {
|
|
7
20
|
method: "POST",
|
|
8
21
|
headers: { "Content-Type": "application/json" },
|
|
9
22
|
body: JSON.stringify({ text }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"copy.js","sourceRoot":"","sources":["../../../src/react-native/copy.ts"],"names":[],"mappings":"AAAA,MAAM,qBAAqB,GAAG,2BAA2B,CAAC;AAgB1D,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,EAC/B,IAAY,EACZ,UAA+B,EAAE,EAClB,EAAE;IACjB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;QACjB,MAAM,IAAI,KAAK,CAAC,8BAA8B,CAAC,CAAC;IAClD,CAAC;IAED,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,OAAO,CAAC,QAAQ,
|
|
1
|
+
{"version":3,"file":"copy.js","sourceRoot":"","sources":["../../../src/react-native/copy.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,mDAAmD,CAAC;AAE7E,MAAM,qBAAqB,GAAG,2BAA2B,CAAC;AAgB1D,MAAM,WAAW,GAAG,CAAC,GAAW,EAAW,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAExE,MAAM,kBAAkB,GAAG,CAAC,QAAiB,EAAU,EAAE;IACvD,MAAM,gBAAgB,GAAG,QAAQ,IAAI,qBAAqB,CAAC;IAE3D,IAAI,WAAW,CAAC,gBAAgB,CAAC,EAAE,CAAC;QAClC,OAAO,gBAAgB,CAAC;IAC1B,CAAC;IAED,MAAM,OAAO,GAAG,YAAY,EAAE,CAAC,GAAG,CAAC;IACnC,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,UAAU,CAAC,GAAG,CAAC;QACzD,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC;QAC3B,CAAC,CAAC,gBAAgB,CAAC;IAErB,OAAO,GAAG,OAAO,GAAG,kBAAkB,EAAE,CAAC;AAC3C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,EAC/B,IAAY,EACZ,UAA+B,EAAE,EAClB,EAAE;IACjB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;QACjB,MAAM,IAAI,KAAK,CAAC,8BAA8B,CAAC,CAAC;IAClD,CAAC;IAED,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,kBAAkB,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;QACjE,MAAM,EAAE,MAAM;QACd,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;QAC/C,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,EAAE,IAAI,EAA+B,CAAC;QAC3D,MAAM,EAAE,OAAO,CAAC,MAAM;KACvB,CAAC,CAAC;IAEH,IAAI,OAAwC,CAAC;IAC7C,IAAI,CAAC;QACH,OAAO,GAAG,CAAC,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAwB,CAAC;IAC3D,CAAC;IAAC,MAAM,CAAC;QACP,OAAO,GAAG,SAAS,CAAC;IACtB,CAAC;IAED,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,OAAO,EAAE,EAAE,KAAK,KAAK,EAAE,CAAC;QAC1C,MAAM,IAAI,KAAK,CAAC,OAAO,EAAE,KAAK,IAAI,mCAAmC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC;IAC1F,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -5,7 +5,7 @@ export const useDevMenu = (onToggle) => {
|
|
|
5
5
|
const onToggleRef = useLatest(onToggle);
|
|
6
6
|
// Add to React Native Dev Menu
|
|
7
7
|
useEffect(() => {
|
|
8
|
-
DevSettings.addMenuItem("React Native Grab
|
|
8
|
+
DevSettings.addMenuItem("React Native Grab", () => {
|
|
9
9
|
onToggleRef.current();
|
|
10
10
|
});
|
|
11
11
|
}, []);
|
|
@@ -15,7 +15,7 @@ export const useDevMenu = (onToggle) => {
|
|
|
15
15
|
const expoDevMenuModule = require("expo-dev-menu");
|
|
16
16
|
expoDevMenuModule.registerDevMenuItems([
|
|
17
17
|
{
|
|
18
|
-
name: "React Native Grab
|
|
18
|
+
name: "React Native Grab",
|
|
19
19
|
callback: () => {
|
|
20
20
|
onToggleRef.current();
|
|
21
21
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dev-menu.js","sourceRoot":"","sources":["../../../src/react-native/dev-menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGpC,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,QAAoB,EAAE,EAAE;IACjD,MAAM,WAAW,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC;IAExC,+BAA+B;IAC/B,SAAS,CAAC,GAAG,EAAE;QACb,WAAW,CAAC,WAAW,CAAC,
|
|
1
|
+
{"version":3,"file":"dev-menu.js","sourceRoot":"","sources":["../../../src/react-native/dev-menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGpC,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,QAAoB,EAAE,EAAE;IACjD,MAAM,WAAW,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC;IAExC,+BAA+B;IAC/B,SAAS,CAAC,GAAG,EAAE;QACb,WAAW,CAAC,WAAW,CAAC,mBAAmB,EAAE,GAAG,EAAE;YAChD,WAAW,CAAC,OAAO,EAAE,CAAC;QACxB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,oCAAoC;IACpC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC;YACH,MAAM,iBAAiB,GAAG,OAAO,CAAC,eAAe,CAA6B,CAAC;YAE/E,iBAAiB,CAAC,oBAAoB,CAAC;gBACrC;oBACE,IAAI,EAAE,mBAAmB;oBACzB,QAAQ,EAAE,GAAG,EAAE;wBACb,WAAW,CAAC,OAAO,EAAE,CAAC;oBACxB,CAAC;iBACF;aACF,CAAC,CAAC;QACL,CAAC;QAAC,MAAM,CAAC;YACP,iEAAiE;QACnE,CAAC;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;AACT,CAAC,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
let enableGrabbingHandler = null;
|
|
2
|
+
export const setEnableGrabbingHandler = (handler) => {
|
|
3
|
+
enableGrabbingHandler = handler;
|
|
4
|
+
};
|
|
5
|
+
export const enableGrabbing = () => {
|
|
6
|
+
if (!enableGrabbingHandler) {
|
|
7
|
+
console.error("[react-native-grab] Cannot enable grabbing. Ensure ReactNativeGrabRoot is mounted.");
|
|
8
|
+
return;
|
|
9
|
+
}
|
|
10
|
+
enableGrabbingHandler();
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=grab-controller.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"grab-controller.js","sourceRoot":"","sources":["../../../src/react-native/grab-controller.ts"],"names":[],"mappings":"AAEA,IAAI,qBAAqB,GAAiC,IAAI,CAAC;AAE/D,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,OAAqC,EAAE,EAAE;IAChF,qBAAqB,GAAG,OAAO,CAAC;AAClC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC3B,OAAO,CAAC,KAAK,CACX,oFAAoF,CACrF,CAAC;QACF,OAAO;IACT,CAAC;IAED,qBAAqB,EAAE,CAAC;AAC1B,CAAC,CAAC"}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useCallback, useEffect, useRef, useState } from "react";
|
|
3
|
-
import { PanResponder,
|
|
3
|
+
import { PanResponder, StyleSheet, Text, View } from "react-native";
|
|
4
4
|
import { getAppRootShadowNode, getFocusedScreenShadowNode } from "./containers";
|
|
5
5
|
import { findNodeAtPoint, measureInWindow } from "./measure";
|
|
6
6
|
import { useDevMenu } from "./dev-menu";
|
|
7
7
|
import { getDescription } from "./description";
|
|
8
8
|
import { copyViaMetro } from "./copy";
|
|
9
9
|
import { FullScreenOverlay } from "./full-screen-overlay";
|
|
10
|
+
import { setEnableGrabbingHandler } from "./grab-controller";
|
|
10
11
|
const COPY_BADGE_DURATION_MS = 1600;
|
|
11
12
|
const CALLSTACK_PRIMARY = "#8232FF";
|
|
12
13
|
const HIGHLIGHT_FILL = "rgba(130, 50, 255, 0.2)";
|
|
@@ -14,7 +15,6 @@ const BADGE_BACKGROUND = "rgba(130, 50, 255, 0.92)";
|
|
|
14
15
|
export const ReactNativeGrabOverlay = () => {
|
|
15
16
|
const copyBadgeTimeoutRef = useRef(null);
|
|
16
17
|
const [state, setState] = useState({
|
|
17
|
-
isButtonEnabled: false,
|
|
18
18
|
isSessionEnabled: false,
|
|
19
19
|
grabbedElement: null,
|
|
20
20
|
isCopyBadgeVisible: false,
|
|
@@ -33,14 +33,6 @@ export const ReactNativeGrabOverlay = () => {
|
|
|
33
33
|
isSessionEnabled: false,
|
|
34
34
|
}));
|
|
35
35
|
}, []);
|
|
36
|
-
const toggleButtonEnabled = useCallback(() => {
|
|
37
|
-
setState((prev) => ({
|
|
38
|
-
...prev,
|
|
39
|
-
isButtonEnabled: !prev.isButtonEnabled,
|
|
40
|
-
isSessionEnabled: !prev.isButtonEnabled ? prev.isSessionEnabled : false,
|
|
41
|
-
grabbedElement: !prev.isButtonEnabled ? prev.grabbedElement : null,
|
|
42
|
-
}));
|
|
43
|
-
}, []);
|
|
44
36
|
useEffect(() => {
|
|
45
37
|
return () => {
|
|
46
38
|
if (copyBadgeTimeoutRef.current) {
|
|
@@ -64,7 +56,13 @@ export const ReactNativeGrabOverlay = () => {
|
|
|
64
56
|
copyBadgeTimeoutRef.current = null;
|
|
65
57
|
}, COPY_BADGE_DURATION_MS);
|
|
66
58
|
}, []);
|
|
67
|
-
|
|
59
|
+
useEffect(() => {
|
|
60
|
+
setEnableGrabbingHandler(startSession);
|
|
61
|
+
return () => {
|
|
62
|
+
setEnableGrabbingHandler(null);
|
|
63
|
+
};
|
|
64
|
+
}, [startSession]);
|
|
65
|
+
useDevMenu(startSession);
|
|
68
66
|
const getElementAtPoint = (nativePageX, nativePageY) => {
|
|
69
67
|
const appRootShadowNode = getAppRootShadowNode();
|
|
70
68
|
const focusedScreenShadowNode = getFocusedScreenShadowNode();
|
|
@@ -112,7 +110,7 @@ export const ReactNativeGrabOverlay = () => {
|
|
|
112
110
|
showCopiedBadge();
|
|
113
111
|
}
|
|
114
112
|
catch {
|
|
115
|
-
|
|
113
|
+
console.error("[react-native-grab] Copying failed. Ensure your Metro config is wrapped with withReactNativeGrab(...) and Metro has been restarted.");
|
|
116
114
|
}
|
|
117
115
|
finally {
|
|
118
116
|
stopSession();
|
|
@@ -120,7 +118,7 @@ export const ReactNativeGrabOverlay = () => {
|
|
|
120
118
|
})();
|
|
121
119
|
},
|
|
122
120
|
})).current;
|
|
123
|
-
return (_jsx(FullScreenOverlay, { children: _jsxs(View, { pointerEvents: "box-none", style: styles.overlayRoot, children: [state.
|
|
121
|
+
return (_jsx(FullScreenOverlay, { children: _jsxs(View, { pointerEvents: "box-none", style: styles.overlayRoot, children: [state.isSessionEnabled && (_jsx(View, { style: [StyleSheet.absoluteFill], ...panResponder.panHandlers })), state.isSessionEnabled && (_jsx(View, { pointerEvents: "none", style: styles.topBadge, children: _jsx(Text, { style: styles.topBadgeText, children: "Touch and move around to grab" }) })), state.isCopyBadgeVisible && (_jsx(View, { pointerEvents: "none", style: styles.topBadge, children: _jsx(Text, { style: styles.topBadgeText, children: "Element copied" }) })), !!state.grabbedElement && (_jsx(View, { style: [
|
|
124
122
|
{
|
|
125
123
|
position: "absolute",
|
|
126
124
|
left: state.grabbedElement.rect[0],
|
|
@@ -139,24 +137,7 @@ export const ReactNativeGrabOverlay = () => {
|
|
|
139
137
|
const styles = StyleSheet.create({
|
|
140
138
|
overlayRoot: {
|
|
141
139
|
...StyleSheet.absoluteFillObject,
|
|
142
|
-
zIndex:
|
|
143
|
-
elevation: 2147483647,
|
|
144
|
-
},
|
|
145
|
-
floatingButton: {
|
|
146
|
-
position: "absolute",
|
|
147
|
-
right: 18,
|
|
148
|
-
bottom: 28,
|
|
149
|
-
borderRadius: 999,
|
|
150
|
-
paddingHorizontal: 16,
|
|
151
|
-
paddingVertical: 10,
|
|
152
|
-
backgroundColor: BADGE_BACKGROUND,
|
|
153
|
-
zIndex: 2147483647,
|
|
154
|
-
elevation: 2147483647,
|
|
155
|
-
},
|
|
156
|
-
floatingButtonText: {
|
|
157
|
-
color: "#FFFFFF",
|
|
158
|
-
fontSize: 14,
|
|
159
|
-
fontWeight: "700",
|
|
140
|
+
zIndex: 9999,
|
|
160
141
|
},
|
|
161
142
|
topBadge: {
|
|
162
143
|
position: "absolute",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grab-overlay.js","sourceRoot":"","sources":["../../../src/react-native/grab-overlay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAAoB,YAAY,EAAE,
|
|
1
|
+
{"version":3,"file":"grab-overlay.js","sourceRoot":"","sources":["../../../src/react-native/grab-overlay.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/react-native/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAiC,MAAM,aAAa,CAAC;AACjF,OAAO,EAAE,qBAAqB,EAAmC,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/react-native/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAiC,MAAM,aAAa,CAAC;AACjF,OAAO,EAAE,qBAAqB,EAAmC,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"copy.d.ts","sourceRoot":"","sources":["../../../src/react-native/copy.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"copy.d.ts","sourceRoot":"","sources":["../../../src/react-native/copy.ts"],"names":[],"mappings":"AAaA,KAAK,mBAAmB,GAAG;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB,CAAC;AAmBF,eAAO,MAAM,YAAY,GACvB,MAAM,MAAM,EACZ,UAAS,mBAAwB,KAChC,OAAO,CAAC,IAAI,CAsBd,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"grab-controller.d.ts","sourceRoot":"","sources":["../../../src/react-native/grab-controller.ts"],"names":[],"mappings":"AAAA,KAAK,qBAAqB,GAAG,MAAM,IAAI,CAAC;AAIxC,eAAO,MAAM,wBAAwB,GAAI,SAAS,qBAAqB,GAAG,IAAI,SAE7E,CAAC;AAEF,eAAO,MAAM,cAAc,YAS1B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grab-overlay.d.ts","sourceRoot":"","sources":["../../../src/react-native/grab-overlay.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"grab-overlay.d.ts","sourceRoot":"","sources":["../../../src/react-native/grab-overlay.tsx"],"names":[],"mappings":"AAqBA,eAAO,MAAM,sBAAsB,+CAgLlC,CAAC"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export { ReactNativeGrabRoot, type ReactNativeGrabRootProps } from "./grab-root";
|
|
2
2
|
export { ReactNativeGrabScreen, type ReactNativeGrabScreenProps } from "./grab-screen";
|
|
3
3
|
export { copyViaMetro } from "./copy";
|
|
4
|
+
export { enableGrabbing } from "./grab-controller";
|
|
4
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react-native/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,aAAa,CAAC;AACjF,OAAO,EAAE,qBAAqB,EAAE,KAAK,0BAA0B,EAAE,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react-native/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,aAAa,CAAC;AACjF,OAAO,EAAE,qBAAqB,EAAE,KAAK,0BAA0B,EAAE,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC"}
|