react-grab 0.0.11 → 0.0.13

package/dist/index.d.ts

@@ -1,3 +1,37 @@
-declare const init: () => () => void;
+interface StoreApi<T> {
+    getInitialState(): T;
+    getState(): T;
+    setState(partialState: ((prevState: T) => T) | Partial<T>): T;
+    subscribe(listener: Listener<T>): () => void;
+    subscribe<U>(listener: Listener<U>, selector: (state: T) => unknown): () => void;
+}
+type Listener<T> = (state: T, prevState: T | undefined) => (() => unknown) | void;
 
-export { init };
+type Hotkey = KeyboardEvent["key"];
+
+interface Options {
+    enabled?: boolean;
+    /**
+     * hotkey to trigger the overlay
+     *
+     * default: ["Meta", "C"]
+     */
+    hotkey?: Hotkey | Hotkey[];
+    /**
+     * time required (ms) to hold the key to trigger the overlay
+     *
+     * default: 1000
+     */
+    keyHoldDuration?: number;
+}
+interface LibStore {
+    keyPressTimestamps: Map<Hotkey, number>;
+    mouseX: number;
+    mouseY: number;
+    overlayMode: "copying" | "hidden" | "visible";
+    pressedKeys: Set<Hotkey>;
+}
+declare const libStore: StoreApi<LibStore>;
+declare const init: (options?: Options) => (() => void) | undefined;
+
+export { type Options, init, libStore };

package/dist/index.global.js

@@ -10,202 +10,210 @@ var ReactGrab = (function (exports) {
    * LICENSE file in the root directory of this source tree.
    */
 
-  // src/overlay.ts
-  var lerp = (start, end, factor) => {
-    return start + (end - start) * factor;
+  // src/hotkeys.ts
+  var FORM_TAGS_AND_ROLES = [
+    "input",
+    "textarea",
+    "select",
+    "searchbox",
+    "slider",
+    "spinbutton",
+    "menuitem",
+    "menuitemcheckbox",
+    "menuitemradio",
+    "option",
+    "radio",
+    "textbox"
+  ];
+  var isCustomElement = (element) => {
+    return Boolean(element.tagName) && !element.tagName.startsWith("-") && element.tagName.includes("-");
   };
-  var SELECTION_LERP_FACTOR = 0.99;
-  var createSelectionElement = ({
-    borderRadius,
-    height,
-    transform,
-    width,
-    x,
-    y
-  }) => {
-    const overlay = document.createElement("div");
-    overlay.style.position = "fixed";
-    overlay.style.top = `${y}px`;
-    overlay.style.left = `${x}px`;
-    overlay.style.width = `${width}px`;
-    overlay.style.height = `${height}px`;
-    overlay.style.borderRadius = borderRadius;
-    overlay.style.transform = transform;
-    overlay.style.pointerEvents = "none";
-    overlay.style.border = "2px solid #007AFF";
-    overlay.style.backgroundColor = "rgba(0, 122, 255, 0.1)";
-    overlay.style.zIndex = "2147483646";
-    overlay.style.boxSizing = "border-box";
-    overlay.style.display = "none";
-    overlay.animate(
-      [
-        { backgroundColor: "rgba(0, 122, 255, 0.1)" },
-        { backgroundColor: "rgba(0, 122, 255, 0.15)" },
-        { backgroundColor: "rgba(0, 122, 255, 0.1)" }
-      ],
-      {
-        duration: 2e3,
-        easing: "ease-in-out",
-        iterations: Infinity
-      }
-    );
-    return overlay;
+  var isReadonlyArray = (value) => {
+    return Array.isArray(value);
   };
-  var updateSelectionElement = (element, { borderRadius, height, transform, width, x, y }) => {
-    const currentTop = parseFloat(element.style.top) || 0;
-    const currentLeft = parseFloat(element.style.left) || 0;
-    const currentWidth = parseFloat(element.style.width) || 0;
-    const currentHeight = parseFloat(element.style.height) || 0;
-    const topValue = `${lerp(currentTop, y, SELECTION_LERP_FACTOR)}px`;
-    const leftValue = `${lerp(currentLeft, x, SELECTION_LERP_FACTOR)}px`;
-    const widthValue = `${lerp(currentWidth, width, SELECTION_LERP_FACTOR)}px`;
-    const heightValue = `${lerp(currentHeight, height, SELECTION_LERP_FACTOR)}px`;
-    if (element.style.top !== topValue) {
-      element.style.top = topValue;
-    }
-    if (element.style.left !== leftValue) {
-      element.style.left = leftValue;
-    }
-    if (element.style.width !== widthValue) {
-      element.style.width = widthValue;
-    }
-    if (element.style.height !== heightValue) {
-      element.style.height = heightValue;
-    }
-    if (element.style.borderRadius !== borderRadius) {
-      element.style.borderRadius = borderRadius;
-    }
-    if (element.style.transform !== transform) {
-      element.style.transform = transform;
+  var isHotkeyEnabledOnTagName = (event, enabledOnTags = false) => {
+    const { composed, target } = event;
+    let targetTagName;
+    let targetRole;
+    if (target instanceof HTMLElement && isCustomElement(target) && composed) {
+      const composedPath = event.composedPath();
+      const targetElement = composedPath[0];
+      if (targetElement instanceof HTMLElement) {
+        targetTagName = targetElement.tagName;
+        targetRole = targetElement.role;
+      }
+    } else if (target instanceof HTMLElement) {
+      targetTagName = target.tagName;
+      targetRole = target.role;
+    }
+    if (isReadonlyArray(enabledOnTags)) {
+      return Boolean(
+        targetTagName && enabledOnTags && enabledOnTags.some(
+          (tag) => typeof targetTagName === "string" && tag.toLowerCase() === targetTagName.toLowerCase() || tag === targetRole
+        )
+      );
     }
+    return Boolean(targetTagName && enabledOnTags && enabledOnTags);
   };
-  var SelectionOverlay = class {
-    element;
-    visible = false;
-    constructor(root) {
-      this.element = createSelectionElement({
-        borderRadius: "0px",
-        height: 0,
-        transform: "none",
-        width: 0,
-        x: -1e3,
-        y: -1e3
-      });
-      root.appendChild(this.element);
-    }
-    hide() {
-      this.visible = false;
-      this.element.style.display = "none";
-      this.element.style.pointerEvents = "none";
-    }
-    isVisible() {
-      return this.visible;
-    }
-    show() {
-      this.visible = true;
-      this.element.style.display = "block";
-      this.element.style.pointerEvents = "auto";
-    }
-    update(selection) {
-      updateSelectionElement(this.element, selection);
-    }
+  var isKeyboardEventTriggeredByInput = (event) => {
+    return isHotkeyEnabledOnTagName(event, FORM_TAGS_AND_ROLES);
   };
-  var createSpinner = () => {
-    const spinner = document.createElement("span");
-    spinner.style.display = "inline-block";
-    spinner.style.width = "8px";
-    spinner.style.height = "8px";
-    spinner.style.border = "1.5px solid #1e4ed8";
-    spinner.style.borderTopColor = "transparent";
-    spinner.style.borderRadius = "50%";
-    spinner.style.marginRight = "4px";
-    spinner.style.verticalAlign = "middle";
-    spinner.animate(
-      [
-        { transform: "rotate(0deg)" },
-        { transform: "rotate(360deg)" }
-      ],
-      {
-        duration: 600,
-        easing: "linear",
-        iterations: Infinity
+  var trackHotkeys = () => {
+    const handleKeyDown = (event) => {
+      if (isKeyboardEventTriggeredByInput(event)) {
+        return;
       }
-    );
-    return spinner;
-  };
-  var createIndicator = (x, y) => {
-    const indicator = document.createElement("div");
-    indicator.style.position = "fixed";
-    indicator.style.left = `${x}px`;
-    indicator.style.top = `${y - 4}px`;
-    indicator.style.transform = "translateY(-100%)";
-    indicator.style.padding = "0px 4px";
-    indicator.style.backgroundColor = "#dbeafe";
-    indicator.style.color = "#1e4ed8";
-    indicator.style.border = "1px solid #c7dbfb";
-    indicator.style.borderRadius = "4px";
-    indicator.style.fontSize = "11px";
-    indicator.style.fontWeight = "500";
-    indicator.style.fontFamily = "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif";
-    indicator.style.zIndex = "2147483647";
-    indicator.style.pointerEvents = "none";
-    indicator.style.opacity = "0";
-    indicator.style.transition = "opacity 0.2s ease-in-out";
-    indicator.style.display = "flex";
-    indicator.style.alignItems = "center";
-    return indicator;
-  };
-  var showCopyIndicator = (x, y) => {
-    const indicator = createIndicator(x, y);
-    const spinner = createSpinner();
-    const text = document.createElement("span");
-    text.textContent = "Copying\u2026";
-    indicator.appendChild(spinner);
-    indicator.appendChild(text);
-    document.body.appendChild(indicator);
-    requestAnimationFrame(() => {
-      indicator.style.opacity = "1";
-    });
+      if (event.code === undefined) {
+        return;
+      }
+      libStore.setState((state) => {
+        const newTimestamps = new Map(state.keyPressTimestamps);
+        if (!state.pressedKeys.has(event.key)) {
+          newTimestamps.set(event.key, Date.now());
+        }
+        return {
+          ...state,
+          keyPressTimestamps: newTimestamps,
+          pressedKeys: /* @__PURE__ */ new Set([event.key, ...state.pressedKeys])
+        };
+      });
+    };
+    const handleKeyUp = (event) => {
+      if (event.code === undefined) {
+        return;
+      }
+      libStore.setState((state) => {
+        const newTimestamps = new Map(state.keyPressTimestamps);
+        newTimestamps.delete(event.key);
+        return {
+          ...state,
+          keyPressTimestamps: newTimestamps,
+          pressedKeys: new Set(
+            [...state.pressedKeys].filter((key) => key !== event.key)
+          )
+        };
+      });
+    };
+    const handleBlur = () => {
+      libStore.setState((state) => ({
+        ...state,
+        keyPressTimestamps: /* @__PURE__ */ new Map(),
+        pressedKeys: /* @__PURE__ */ new Set()
+      }));
+    };
+    const handleContextmenu = () => {
+      libStore.setState((state) => ({
+        ...state,
+        keyPressTimestamps: /* @__PURE__ */ new Map(),
+        pressedKeys: /* @__PURE__ */ new Set()
+      }));
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    document.addEventListener("keyup", handleKeyUp);
+    window.addEventListener("blur", handleBlur);
+    window.addEventListener("contextmenu", handleContextmenu);
     return () => {
-      spinner.remove();
-      text.textContent = "Copied!";
-      setTimeout(() => {
-        indicator.style.opacity = "0";
-        setTimeout(() => {
-          document.body.removeChild(indicator);
-        }, 200);
-      }, 1500);
+      document.removeEventListener("keydown", handleKeyDown);
+      document.removeEventListener("keyup", handleKeyUp);
+      window.removeEventListener("blur", handleBlur);
+      window.removeEventListener("contextmenu", handleContextmenu);
     };
   };
-
-  // src/utils/copy-text.ts
-  var copyText = async (text) => {
-    if (navigator.clipboard && window.isSecureContext) {
-      try {
-        await navigator.clipboard.writeText(text);
-        return true;
-      } catch {
-      }
-    }
-    const textareaEl = document.createElement("textarea");
-    textareaEl.value = text;
-    textareaEl.setAttribute("readonly", "");
-    textareaEl.style.position = "fixed";
-    textareaEl.style.top = "-9999px";
-    textareaEl.style.opacity = "0";
-    textareaEl.style.pointerEvents = "none";
-    document.body.appendChild(textareaEl);
-    textareaEl.select();
-    textareaEl.setSelectionRange(0, textareaEl.value.length);
-    let didCopy = false;
-    try {
-      didCopy = document.execCommand("copy");
-    } catch {
-      didCopy = false;
-    } finally {
-      document.body.removeChild(textareaEl);
+  var isKeyPressed = (key) => {
+    const { pressedKeys } = libStore.getState();
+    if (key.length === 1) {
+      return pressedKeys.has(key.toLowerCase()) || pressedKeys.has(key.toUpperCase());
     }
-    return didCopy;
+    return pressedKeys.has(key);
+  };
+  var watchKeyHeldFor = (key, duration, onHeld) => {
+    let timeoutId = null;
+    let unsubscribe = null;
+    const cleanup = () => {
+      if (timeoutId !== null) {
+        clearTimeout(timeoutId);
+        timeoutId = null;
+      }
+      if (unsubscribe !== null) {
+        unsubscribe();
+        unsubscribe = null;
+      }
+    };
+    const checkSingleKeyPressed = (keyToCheck, pressedKeys) => {
+      if (keyToCheck.length === 1) {
+        return pressedKeys.has(keyToCheck.toLowerCase()) || pressedKeys.has(keyToCheck.toUpperCase());
+      }
+      return pressedKeys.has(keyToCheck);
+    };
+    const checkAllKeysPressed = (pressedKeys) => {
+      if (Array.isArray(key)) {
+        return key.every(
+          (keyFromCombo) => checkSingleKeyPressed(keyFromCombo, pressedKeys)
+        );
+      }
+      return checkSingleKeyPressed(key, pressedKeys);
+    };
+    const getKeyFromTimestamps = (keyToFind, timestamps) => {
+      if (keyToFind.length === 1) {
+        return timestamps.get(keyToFind.toLowerCase()) || timestamps.get(keyToFind.toUpperCase());
+      }
+      return timestamps.get(keyToFind);
+    };
+    const getEarliestPressTime = (timestamps) => {
+      const keysToInspect = Array.isArray(key) ? key : [key];
+      let earliest;
+      for (const keyFromCombo of keysToInspect) {
+        const timestamp = getKeyFromTimestamps(keyFromCombo, timestamps);
+        if (timestamp === undefined) {
+          return undefined;
+        }
+        if (earliest === undefined || timestamp < earliest) {
+          earliest = timestamp;
+        }
+      }
+      return earliest;
+    };
+    const scheduleCallback = () => {
+      const state = libStore.getState();
+      const { keyPressTimestamps, pressedKeys } = state;
+      if (!checkAllKeysPressed(pressedKeys)) {
+        if (timeoutId !== null) {
+          clearTimeout(timeoutId);
+          timeoutId = null;
+        }
+        return;
+      }
+      const earliestPressTime = getEarliestPressTime(keyPressTimestamps);
+      if (earliestPressTime === undefined) {
+        if (timeoutId !== null) {
+          clearTimeout(timeoutId);
+          timeoutId = null;
+        }
+        return;
+      }
+      const elapsed = Date.now() - earliestPressTime;
+      const remaining = duration - elapsed;
+      if (remaining <= 0) {
+        onHeld();
+        cleanup();
+        return;
+      }
+      if (timeoutId !== null) {
+        clearTimeout(timeoutId);
+      }
+      timeoutId = setTimeout(() => {
+        onHeld();
+        cleanup();
+      }, remaining);
+    };
+    unsubscribe = libStore.subscribe(
+      () => {
+        scheduleCallback();
+      },
+      (state) => state.pressedKeys
+    );
+    scheduleCallback();
+    return cleanup;
   };
 
   // node_modules/.pnpm/bippy@0.3.31_@types+react@19.2.2_react@19.2.0/node_modules/bippy/dist/src-R2iEnVC1.js
@@ -306,6 +314,7 @@ var ReactGrab = (function (exports) {
     return rdtHook;
   };
   var patchRDTHook = (onActive) => {
+    if (onActive) onActiveListeners.add(onActive);
     try {
       const rdtHook = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
       if (!rdtHook) return;
@@ -386,6 +395,28 @@ var ReactGrab = (function (exports) {
     if (!unwrappedType) return null;
     return unwrappedType.displayName || unwrappedType.name || null;
   };
+  var instrument = (options) => {
+    return getRDTHook(() => {
+      const rdtHook = getRDTHook();
+      options.onActive?.();
+      rdtHook._instrumentationSource = options.name ?? BIPPY_INSTRUMENTATION_STRING;
+      const prevOnCommitFiberRoot = rdtHook.onCommitFiberRoot;
+      if (options.onCommitFiberRoot) rdtHook.onCommitFiberRoot = (rendererID, root, priority) => {
+        if (prevOnCommitFiberRoot) prevOnCommitFiberRoot(rendererID, root, priority);
+        options.onCommitFiberRoot?.(rendererID, root, priority);
+      };
+      const prevOnCommitFiberUnmount = rdtHook.onCommitFiberUnmount;
+      if (options.onCommitFiberUnmount) rdtHook.onCommitFiberUnmount = (rendererID, root) => {
+        if (prevOnCommitFiberUnmount) prevOnCommitFiberUnmount(rendererID, root);
+        options.onCommitFiberUnmount?.(rendererID, root);
+      };
+      const prevOnPostCommitFiberRoot = rdtHook.onPostCommitFiberRoot;
+      if (options.onPostCommitFiberRoot) rdtHook.onPostCommitFiberRoot = (rendererID, root) => {
+        if (prevOnPostCommitFiberRoot) prevOnPostCommitFiberRoot(rendererID, root);
+        options.onPostCommitFiberRoot?.(rendererID, root);
+      };
+    });
+  };
   var getFiberFromHostInstance = (hostInstance) => {
     const rdtHook = getRDTHook();
     for (const renderer of rdtHook.renderers.values()) try {
@@ -399,6 +430,7 @@ var ReactGrab = (function (exports) {
     }
     return null;
   };
+  var _fiberRoots = /* @__PURE__ */ new Set();
   safelyInstallRDTHook();
 
   // node_modules/.pnpm/bippy@0.3.31_@types+react@19.2.2_react@19.2.0/node_modules/bippy/dist/source-DWOhEbf2.js
@@ -2181,14 +2213,18 @@ ${error.stack}`;
     return matches;
   };
 
-  // src/utils/data.ts
+  // src/instrumentation.ts
+  var fiberRoots = _fiberRoots;
+  instrument({
+    onCommitFiberRoot(_, fiberRoot) {
+      fiberRoots.add(fiberRoot);
+    }
+  });
   var getStack = async (element) => {
     const fiber = getFiberFromHostInstance(element);
     if (!fiber) return null;
     const stackTrace = getFiberStackTrace(fiber);
-    console.log(stackTrace);
     const rawOwnerStack = await getOwnerStack(stackTrace);
-    console.log(rawOwnerStack);
     const stack = rawOwnerStack.map((item) => ({
       componentName: item.name,
       fileName: item.source?.fileName
@@ -2376,7 +2412,9 @@ ${error.stack}`;
           lines.push(`${indent2}  </${prevSibling.tagName.toLowerCase()}>`);
         } else if (targetIndex > 0) {
           const indent2 = "  ".repeat(ancestors.length);
-          lines.push(`${indent2}  ... (${targetIndex} element${targetIndex === 1 ? "" : "s"})`);
+          lines.push(
+            `${indent2}  ... (${targetIndex} element${targetIndex === 1 ? "" : "s"})`
+          );
         }
       }
     }
@@ -2386,7 +2424,9 @@ ${error.stack}`;
     const childrenCount = element.children.length;
     if (textContent && childrenCount === 0 && textContent.length < 40) {
       lines.push(
-        `${indent}  ${getElementTag(element)}${textContent}${getClosingTag(element)}`
+        `${indent}  ${getElementTag(element)}${textContent}${getClosingTag(
+        element
+      )}`
       );
     } else {
       lines.push(indent + "  " + getElementTag(element));
@@ -2423,24 +2463,299 @@ ${error.stack}`;
     return lines.join("\n");
   };
 
-  // src/utils/is-element-visible.ts
-  var isElementVisible = (element, computedStyle = null) => {
-    if (!computedStyle) {
-      computedStyle = window.getComputedStyle(element);
+  // src/overlay.ts
+  var VIEWPORT_MARGIN_PX = 8;
+  var LABEL_OFFSET_PX = 6;
+  var INDICATOR_CLAMP_PADDING_PX = 4;
+  var INDICATOR_SUCCESS_VISIBLE_MS = 1500;
+  var INDICATOR_FADE_MS = 200;
+  var INDICATOR_TOTAL_HIDE_DELAY_MS = INDICATOR_SUCCESS_VISIBLE_MS + INDICATOR_FADE_MS;
+  var lerp = (start, end, factor) => {
+    return start + (end - start) * factor;
+  };
+  var SELECTION_LERP_FACTOR = 0.95;
+  var createSelectionElement = ({
+    borderRadius,
+    height,
+    transform,
+    width,
+    x,
+    y
+  }) => {
+    const overlay = document.createElement("div");
+    overlay.style.position = "fixed";
+    overlay.style.top = `${y}px`;
+    overlay.style.left = `${x}px`;
+    overlay.style.width = `${width}px`;
+    overlay.style.height = `${height}px`;
+    overlay.style.borderRadius = borderRadius;
+    overlay.style.transform = transform;
+    overlay.style.pointerEvents = "none";
+    overlay.style.border = "1px solid rgb(210, 57, 192)";
+    overlay.style.backgroundColor = "rgba(210, 57, 192, 0.2)";
+    overlay.style.zIndex = "2147483646";
+    overlay.style.boxSizing = "border-box";
+    overlay.style.display = "none";
+    return overlay;
+  };
+  var updateSelectionElement = (element, { borderRadius, height, transform, width, x, y }) => {
+    const currentTop = parseFloat(element.style.top) || 0;
+    const currentLeft = parseFloat(element.style.left) || 0;
+    const currentWidth = parseFloat(element.style.width) || 0;
+    const currentHeight = parseFloat(element.style.height) || 0;
+    const topValue = `${lerp(currentTop, y, SELECTION_LERP_FACTOR)}px`;
+    const leftValue = `${lerp(currentLeft, x, SELECTION_LERP_FACTOR)}px`;
+    const widthValue = `${lerp(currentWidth, width, SELECTION_LERP_FACTOR)}px`;
+    const heightValue = `${lerp(currentHeight, height, SELECTION_LERP_FACTOR)}px`;
+    if (element.style.top !== topValue) {
+      element.style.top = topValue;
+    }
+    if (element.style.left !== leftValue) {
+      element.style.left = leftValue;
+    }
+    if (element.style.width !== widthValue) {
+      element.style.width = widthValue;
+    }
+    if (element.style.height !== heightValue) {
+      element.style.height = heightValue;
+    }
+    if (element.style.borderRadius !== borderRadius) {
+      element.style.borderRadius = borderRadius;
     }
-    return computedStyle.display !== "none" && computedStyle.visibility !== "hidden";
+    if (element.style.transform !== transform) {
+      element.style.transform = transform;
+    }
+  };
+  var createSelectionOverlay = (root) => {
+    const element = createSelectionElement({
+      borderRadius: "0px",
+      height: 0,
+      transform: "none",
+      width: 0,
+      x: -1e3,
+      y: -1e3
+    });
+    root.appendChild(element);
+    let visible = false;
+    return {
+      hide: () => {
+        visible = false;
+        element.style.display = "none";
+        element.style.pointerEvents = "none";
+      },
+      isVisible: () => visible,
+      show: () => {
+        visible = true;
+        element.style.display = "block";
+        element.style.pointerEvents = "auto";
+      },
+      update: (selection) => {
+        updateSelectionElement(element, selection);
+      }
+    };
+  };
+  var createSpinner = () => {
+    const spinner = document.createElement("span");
+    spinner.style.display = "inline-block";
+    spinner.style.width = "8px";
+    spinner.style.height = "8px";
+    spinner.style.border = "1.5px solid rgb(210, 57, 192)";
+    spinner.style.borderTopColor = "transparent";
+    spinner.style.borderRadius = "50%";
+    spinner.style.marginRight = "4px";
+    spinner.style.verticalAlign = "middle";
+    spinner.animate(
+      [{ transform: "rotate(0deg)" }, { transform: "rotate(360deg)" }],
+      {
+        duration: 600,
+        easing: "linear",
+        iterations: Infinity
+      }
+    );
+    return spinner;
+  };
+  var activeIndicator = null;
+  var createIndicator = () => {
+    const indicator = document.createElement("div");
+    indicator.style.position = "fixed";
+    indicator.style.top = "calc(8px + env(safe-area-inset-top))";
+    indicator.style.padding = "2px 6px";
+    indicator.style.backgroundColor = "#fde7f7";
+    indicator.style.color = "#b21c8e";
+    indicator.style.border = "1px solid #f7c5ec";
+    indicator.style.borderRadius = "4px";
+    indicator.style.fontSize = "11px";
+    indicator.style.fontWeight = "500";
+    indicator.style.fontFamily = "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif";
+    indicator.style.zIndex = "2147483647";
+    indicator.style.pointerEvents = "none";
+    indicator.style.opacity = "0";
+    indicator.style.transition = "opacity 0.2s ease-in-out";
+    indicator.style.display = "flex";
+    indicator.style.alignItems = "center";
+    indicator.style.maxWidth = "calc(100vw - (16px + env(safe-area-inset-left) + env(safe-area-inset-right)))";
+    indicator.style.overflow = "hidden";
+    indicator.style.textOverflow = "ellipsis";
+    indicator.style.whiteSpace = "nowrap";
+    return indicator;
+  };
+  var showLabel = (selectionLeftPx, selectionTopPx, tagName) => {
+    let indicator = activeIndicator;
+    let isNewIndicator = false;
+    if (!indicator) {
+      indicator = createIndicator();
+      document.body.appendChild(indicator);
+      activeIndicator = indicator;
+      isNewIndicator = true;
+      isProcessing = false;
+    }
+    if (!isProcessing) {
+      const labelText = indicator.querySelector("span");
+      if (labelText) {
+        const tagNameMonospace = document.createElement("span");
+        tagNameMonospace.textContent = tagName ? `<${tagName}>` : "<element>";
+        tagNameMonospace.style.fontFamily = "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace";
+        tagNameMonospace.style.fontVariantNumeric = "tabular-nums";
+        labelText.replaceChildren(tagNameMonospace);
+      } else {
+        const newLabelText = document.createElement("span");
+        const tagNameMonospace = document.createElement("span");
+        tagNameMonospace.textContent = tagName ? `<${tagName}>` : "<element>";
+        tagNameMonospace.style.fontFamily = "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace";
+        tagNameMonospace.style.fontVariantNumeric = "tabular-nums";
+        newLabelText.appendChild(tagNameMonospace);
+        indicator.appendChild(newLabelText);
+      }
+    }
+    const indicatorRect = indicator.getBoundingClientRect();
+    const viewportWidthPx = window.innerWidth;
+    const viewportHeightPx = window.innerHeight;
+    let indicatorLeftPx = Math.round(selectionLeftPx);
+    let indicatorTopPx = Math.round(selectionTopPx) - indicatorRect.height - LABEL_OFFSET_PX;
+    const CLAMPED_PADDING = INDICATOR_CLAMP_PADDING_PX;
+    const minLeft = VIEWPORT_MARGIN_PX;
+    const minTop = VIEWPORT_MARGIN_PX;
+    const maxLeft = viewportWidthPx - indicatorRect.width - VIEWPORT_MARGIN_PX;
+    const maxTop = viewportHeightPx - indicatorRect.height - VIEWPORT_MARGIN_PX;
+    const willClampLeft = indicatorLeftPx < minLeft;
+    const willClampTop = indicatorTopPx < minTop;
+    const isClamped = willClampLeft || willClampTop;
+    indicatorLeftPx = Math.max(minLeft, Math.min(indicatorLeftPx, maxLeft));
+    indicatorTopPx = Math.max(minTop, Math.min(indicatorTopPx, maxTop));
+    if (isClamped) {
+      indicatorLeftPx += CLAMPED_PADDING;
+      indicatorTopPx += CLAMPED_PADDING;
+    }
+    indicator.style.left = `${indicatorLeftPx}px`;
+    indicator.style.top = `${indicatorTopPx}px`;
+    indicator.style.right = "auto";
+    if (isNewIndicator) {
+      requestAnimationFrame(() => {
+        indicator.style.opacity = "1";
+      });
+    } else if (indicator.style.opacity !== "1") {
+      indicator.style.opacity = "1";
+    }
+  };
+  var isProcessing = false;
+  var updateLabelToProcessing = () => {
+    if (!activeIndicator || isProcessing) return () => {
+    };
+    isProcessing = true;
+    const indicator = activeIndicator;
+    indicator.innerHTML = "";
+    const loadingSpinner = createSpinner();
+    const labelText = document.createElement("span");
+    labelText.textContent = "Grabbing\u2026";
+    indicator.appendChild(loadingSpinner);
+    indicator.appendChild(labelText);
+    return (tagName) => {
+      if (!activeIndicator) {
+        isProcessing = false;
+        return;
+      }
+      indicator.textContent = "";
+      const checkmarkIcon = document.createElement("span");
+      checkmarkIcon.textContent = "\u2713";
+      checkmarkIcon.style.display = "inline-block";
+      checkmarkIcon.style.marginRight = "4px";
+      checkmarkIcon.style.fontWeight = "600";
+      const newLabelText = document.createElement("span");
+      const tagNameMonospace = document.createElement("span");
+      tagNameMonospace.textContent = tagName ? `<${tagName}>` : "<element>";
+      tagNameMonospace.style.fontFamily = "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace";
+      tagNameMonospace.style.fontVariantNumeric = "tabular-nums";
+      newLabelText.appendChild(document.createTextNode("Grabbed "));
+      newLabelText.appendChild(tagNameMonospace);
+      indicator.appendChild(checkmarkIcon);
+      indicator.appendChild(newLabelText);
+      setTimeout(() => {
+        indicator.style.opacity = "0";
+        setTimeout(() => {
+          indicator.remove();
+          if (activeIndicator === indicator) {
+            activeIndicator = null;
+          }
+          isProcessing = false;
+        }, INDICATOR_FADE_MS);
+      }, INDICATOR_SUCCESS_VISIBLE_MS);
+    };
+  };
+  var hideLabel = () => {
+    if (activeIndicator) {
+      activeIndicator.remove();
+      activeIndicator = null;
+    }
+    isProcessing = false;
+  };
+
+  // src/utils/copy-text.ts
+  var IS_NAVIGATOR_CLIPBOARD_AVAILABLE = typeof window !== "undefined" && window.navigator.clipboard && window.isSecureContext;
+  var copyTextToClipboard = async (text) => {
+    if (IS_NAVIGATOR_CLIPBOARD_AVAILABLE) {
+      try {
+        await navigator.clipboard.writeText(text);
+        return true;
+      } catch {
+      }
+    }
+    const textareaElement = document.createElement("textarea");
+    textareaElement.value = text;
+    textareaElement.setAttribute("readonly", "");
+    textareaElement.style.position = "fixed";
+    textareaElement.style.top = "-9999px";
+    textareaElement.style.opacity = "0";
+    textareaElement.style.pointerEvents = "none";
+    const doc = document.body || document.documentElement;
+    doc.appendChild(textareaElement);
+    textareaElement.select();
+    textareaElement.setSelectionRange(0, textareaElement.value.length);
+    let didCopyToClipboard = false;
+    try {
+      didCopyToClipboard = document.execCommand("copy");
+    } catch {
+      didCopyToClipboard = false;
+    } finally {
+      doc.removeChild(textareaElement);
+    }
+    return didCopyToClipboard;
+  };
+
+  // src/utils/is-element-visible.ts
+  var isElementVisible = (element, computedStyle = window.getComputedStyle(element)) => {
+    return computedStyle.display !== "none" && computedStyle.visibility !== "hidden" && computedStyle.opacity !== "0";
   };
 
   // src/utils/mount-root.ts
   var ATTRIBUTE_NAME = "data-react-grab";
   var mountRoot = () => {
-    const existingHost = document.querySelector(`[${ATTRIBUTE_NAME}]`);
-    if (existingHost) {
-      const existingRoot = existingHost.shadowRoot?.querySelector(
+    const mountedHost = document.querySelector(`[${ATTRIBUTE_NAME}]`);
+    if (mountedHost) {
+      const mountedRoot = mountedHost.shadowRoot?.querySelector(
         `[${ATTRIBUTE_NAME}]`
       );
-      if (existingRoot instanceof HTMLDivElement && existingHost.shadowRoot) {
-        return existingRoot;
+      if (mountedRoot instanceof HTMLDivElement && mountedHost.shadowRoot) {
+        return mountedRoot;
       }
     }
     const host = document.createElement("div");
@@ -2451,7 +2766,6 @@ ${error.stack}`;
     host.style.left = "0";
     const shadowRoot = host.attachShadow({ mode: "open" });
     const root = document.createElement("div");
-    root.style.transition = "opacity 0.1s ease-out";
     root.setAttribute(ATTRIBUTE_NAME, "true");
     shadowRoot.appendChild(root);
     const doc = document.body ?? document.documentElement;
@@ -2472,6 +2786,77 @@ ${error.stack}`;
     return setTimeout(callback, 0);
   };
 
+  // src/utils/store.ts
+  var createStore = (initializer) => {
+    const subscriberMap = /* @__PURE__ */ new Map();
+    let currentListenerIndex = 0;
+    let currentState;
+    const setState = (maybeStateOrReducer) => {
+      const prevState = currentState;
+      const resolvedState = typeof maybeStateOrReducer === "function" ? maybeStateOrReducer(prevState) : maybeStateOrReducer;
+      const nextState = {
+        ...prevState,
+        ...resolvedState
+      };
+      currentState = nextState;
+      for (const entry of subscriberMap.values()) {
+        if (entry.type === "selected" /* Selected */) {
+          const nextSelectedValue = entry.selector(nextState);
+          const prevSelectedValue = entry.prevSelectedValue;
+          if (!Object.is(prevSelectedValue, nextSelectedValue)) {
+            entry.prevSelectedValue = nextSelectedValue;
+            entry.listener(nextSelectedValue, prevSelectedValue);
+          }
+        } else {
+          entry.listener(nextState, prevState);
+        }
+      }
+      return currentState;
+    };
+    const getState = () => {
+      return currentState;
+    };
+    const initialState = initializer(setState, getState);
+    currentState = initialState;
+    const subscribeWithSelector = (listener, selector) => {
+      const index = String(currentListenerIndex++);
+      const wrappedListener = (value, prevValue) => listener(value, prevValue);
+      const entry = {
+        listener: wrappedListener,
+        prevSelectedValue: selector(currentState),
+        selector,
+        type: "selected" /* Selected */
+      };
+      subscriberMap.set(index, entry);
+      return () => {
+        subscriberMap.delete(index);
+      };
+    };
+    const subscribeToFullState = (listener) => {
+      const index = String(currentListenerIndex++);
+      const entry = {
+        listener,
+        type: "full" /* Full */
+      };
+      subscriberMap.set(index, entry);
+      return () => {
+        subscriberMap.delete(index);
+      };
+    };
+    function subscribe(subscriber, selector) {
+      return selector ? subscribeWithSelector(subscriber, selector) : subscribeToFullState(subscriber);
+    }
+    const store = {
+      getInitialState() {
+        return initialState;
+      },
+      getState,
+      setState,
+      subscribe
+    };
+    return store;
+  };
+
   // src/utils/throttle.ts
   var throttle = (fn, delay) => {
     let timeout = null;
@@ -2494,167 +2879,288 @@ ${error.stack}`;
   };
 
   // src/index.ts
-  var TICK_INTERVAL = 50;
   var THROTTLE_DELAY = 16;
-  var init = () => {
+  var libStore = createStore(() => ({
+    keyPressTimestamps: /* @__PURE__ */ new Map(),
+    mouseX: -1e3,
+    mouseY: -1e3,
+    overlayMode: "hidden",
+    pressedKeys: /* @__PURE__ */ new Set()
+  }));
+  var init = (options = {}) => {
+    if (options.enabled === false) {
+      return;
+    }
+    const resolvedOptions = {
+      enabled: true,
+      hotkey: ["Meta", "C"],
+      keyHoldDuration: 500,
+      ...options
+    };
     const root = mountRoot();
-    let mouseX = 0;
-    let mouseY = 0;
-    let shiftKeyTimeout = null;
-    let currentHoveredElement = null;
-    const isFocusedInInput = () => {
-      const active = document.activeElement;
-      return active?.tagName === "INPUT" || active?.tagName === "TEXTAREA";
-    };
-    const selectionOverlay = new SelectionOverlay(root);
-    const render = () => {
-      if (!selectionOverlay.isVisible()) return;
-      const element = document.elementsFromPoint(mouseX, mouseY).filter((element2) => !element2.hasAttribute(ATTRIBUTE_NAME))[0];
-      if (!element) {
-        currentHoveredElement = null;
+    const selectionOverlay = createSelectionOverlay(root);
+    let hoveredElement = null;
+    let isCopying = false;
+    const checkIsActivationHotkeyPressed = () => {
+      if (Array.isArray(resolvedOptions.hotkey)) {
+        for (const key of resolvedOptions.hotkey) {
+          if (!isKeyPressed(key)) {
+            return false;
+          }
+        }
+        return true;
+      }
+      return isKeyPressed(resolvedOptions.hotkey);
+    };
+    let cleanupActivationHotkeyWatcher = null;
+    const handleKeyStateChange = (pressedKeys) => {
+      const { overlayMode } = libStore.getState();
+      if (pressedKeys.has("Escape") || pressedKeys.has("Esc")) {
+        libStore.setState((state) => {
+          const nextPressedKeys = new Set(state.pressedKeys);
+          nextPressedKeys.delete("Escape");
+          nextPressedKeys.delete("Esc");
+          const nextTimestamps = new Map(state.keyPressTimestamps);
+          nextTimestamps.delete("Escape");
+          nextTimestamps.delete("Esc");
+          const activationKeys = Array.isArray(resolvedOptions.hotkey) ? resolvedOptions.hotkey : [resolvedOptions.hotkey];
+          for (const activationKey of activationKeys) {
+            if (activationKey.length === 1) {
+              nextPressedKeys.delete(activationKey.toLowerCase());
+              nextPressedKeys.delete(activationKey.toUpperCase());
+              nextTimestamps.delete(activationKey.toLowerCase());
+              nextTimestamps.delete(activationKey.toUpperCase());
+            } else {
+              nextPressedKeys.delete(activationKey);
+              nextTimestamps.delete(activationKey);
+            }
+          }
+          return {
+            ...state,
+            keyPressTimestamps: nextTimestamps,
+            overlayMode: "hidden",
+            pressedKeys: nextPressedKeys
+          };
+        });
+        if (cleanupActivationHotkeyWatcher) {
+          cleanupActivationHotkeyWatcher();
+          cleanupActivationHotkeyWatcher = null;
+        }
         return;
       }
-      const computedStyle = window.getComputedStyle(element);
-      if (!isElementVisible(element, computedStyle)) return;
-      const rect = element.getBoundingClientRect();
-      currentHoveredElement = element;
-      selectionOverlay.update({
-        borderRadius: computedStyle.borderRadius,
-        height: rect.height,
-        transform: computedStyle.transform,
-        width: rect.width,
-        x: rect.left,
-        y: rect.top
-      });
+      const isActivationHotkeyPressed = checkIsActivationHotkeyPressed();
+      if (!isActivationHotkeyPressed) {
+        if (cleanupActivationHotkeyWatcher) {
+          cleanupActivationHotkeyWatcher();
+          cleanupActivationHotkeyWatcher = null;
+        }
+        if (overlayMode !== "hidden") {
+          libStore.setState((state) => ({
+            ...state,
+            overlayMode: "hidden"
+          }));
+        }
+        return;
+      }
+      if (overlayMode === "hidden" && !cleanupActivationHotkeyWatcher) {
+        cleanupActivationHotkeyWatcher = watchKeyHeldFor(
+          resolvedOptions.hotkey,
+          resolvedOptions.keyHoldDuration,
+          () => {
+            libStore.setState((state) => ({
+              ...state,
+              overlayMode: "visible"
+            }));
+            cleanupActivationHotkeyWatcher = null;
+          }
+        );
+      }
     };
-    const throttledRender = throttle(() => {
-      scheduleRunWhenIdle(() => {
-        render();
-      });
+    const cleanupKeyStateChangeSubscription = libStore.subscribe(
+      handleKeyStateChange,
+      (state) => state.pressedKeys
+    );
+    const handleMouseMove = throttle((event) => {
+      libStore.setState((state) => ({
+        ...state,
+        mouseX: event.clientX,
+        mouseY: event.clientY
+      }));
     }, THROTTLE_DELAY);
-    window.addEventListener("mousemove", (event) => {
-      mouseX = event.clientX;
-      mouseY = event.clientY;
-      throttledRender();
-    });
-    window.addEventListener("resize", () => {
-      throttledRender();
-    });
-    window.addEventListener("scroll", () => {
-      throttledRender();
-    });
-    let timeout = null;
-    const nextTick = () => {
-      timeout = window.setTimeout(() => {
-        throttledRender();
-        nextTick();
-      }, TICK_INTERVAL);
-    };
-    nextTick();
-    window.addEventListener("keydown", (event) => {
-      if (event.key === "Meta") {
-        if (isFocusedInInput()) return;
-        if (shiftKeyTimeout !== null) {
-          window.clearTimeout(shiftKeyTimeout);
+    const handleMouseDown = (event) => {
+      if (event.button !== 0) {
+        return;
+      }
+      const { overlayMode } = libStore.getState();
+      if (overlayMode === "hidden") {
+        return;
+      }
+      event.preventDefault();
+      event.stopPropagation();
+      event.stopImmediatePropagation();
+      libStore.setState((state) => ({
+        ...state,
+        overlayMode: "copying"
+      }));
+    };
+    window.addEventListener("mousemove", handleMouseMove);
+    window.addEventListener("mousedown", handleMouseDown);
+    const cleanupTrackHotkeys = trackHotkeys();
+    const getElementAtPosition = (x, y) => {
+      const elements = document.elementsFromPoint(x, y);
+      for (const element of elements) {
+        if (element.closest(`[${ATTRIBUTE_NAME}]`)) {
+          continue;
         }
-        shiftKeyTimeout = window.setTimeout(() => {
-          selectionOverlay.show();
-          throttledRender();
-        }, 200);
+        const computedStyle = window.getComputedStyle(element);
+        if (!isElementVisible(element, computedStyle)) {
+          continue;
+        }
+        return element;
       }
-      if (event.key === "Escape") {
+      return null;
+    };
+    const handleCopy = async (element) => {
+      const cleanupIndicator = updateLabelToProcessing();
+      try {
+        const stack = await getStack(element);
+        const htmlSnippet = getHTMLSnippet(element);
+        let text = htmlSnippet;
+        if (stack) {
+          const filteredStack = filterStack(stack);
+          const serializedStack = serializeStack(filteredStack);
+          text = `${htmlSnippet}
+
+Component owner stack:
+${serializedStack}`;
+        }
+        await copyTextToClipboard(
+          `
+
+<referenced_element>
+${text}
+</referenced_element>`
+        );
+        const tagName = (element.tagName || "").toLowerCase();
+        cleanupIndicator(tagName);
+      } catch {
+        cleanupIndicator();
+      }
+    };
+    const handleRender = throttle((state) => {
+      const { mouseX, mouseY, overlayMode } = state;
+      if (overlayMode === "hidden") {
         if (selectionOverlay.isVisible()) {
           selectionOverlay.hide();
-          if (shiftKeyTimeout !== null) {
-            window.clearTimeout(shiftKeyTimeout);
-            shiftKeyTimeout = null;
+          if (!isCopying) {
+            hideLabel();
           }
+          hoveredElement = null;
         }
+        return;
       }
-      if ((event.key === "c" || event.key === "C") && event.metaKey) {
-        if (selectionOverlay.isVisible() && currentHoveredElement) {
-          event.preventDefault();
-          event.stopPropagation();
-          event.stopImmediatePropagation();
-          const element = currentHoveredElement;
-          const rect = element.getBoundingClientRect();
-          const showSuccess = showCopyIndicator(rect.left, rect.top);
-          getStack(element).then((stack) => {
-            const htmlSnippet = getHTMLSnippet(element);
-            let output = htmlSnippet;
-            if (stack) {
-              const filteredStack = filterStack(stack);
-              const serializedStack = serializeStack(filteredStack);
-              output = `${serializedStack}
-
-${htmlSnippet}`;
-            }
-            return copyText(output);
-          }).then((success) => {
-            if (success) {
-              showSuccess();
-            }
-          }).catch(() => {
-          });
+      if (overlayMode === "copying" && hoveredElement) {
+        const computedStyle2 = window.getComputedStyle(hoveredElement);
+        const rect2 = hoveredElement.getBoundingClientRect();
+        selectionOverlay.update({
+          borderRadius: computedStyle2.borderRadius || "0px",
+          height: rect2.height,
+          transform: computedStyle2.transform || "none",
+          width: rect2.width,
+          x: rect2.left,
+          y: rect2.top
+        });
+        if (!selectionOverlay.isVisible()) {
+          selectionOverlay.show();
         }
-      }
-    });
-    window.addEventListener("mousedown", (event) => {
-      if (event.button !== 0) return;
-      if (selectionOverlay.isVisible()) {
-        event.preventDefault();
-        event.stopPropagation();
-        event.stopImmediatePropagation();
-        if (currentHoveredElement) {
-          const element = currentHoveredElement;
-          const rect = element.getBoundingClientRect();
-          const showSuccess = showCopyIndicator(rect.left, rect.top);
-          getStack(element).then((stack) => {
-            const htmlSnippet = getHTMLSnippet(element);
-            let output = htmlSnippet;
-            if (stack) {
-              const filteredStack = filterStack(stack);
-              const serializedStack = serializeStack(filteredStack);
-              output = `## Referenced element:
-${htmlSnippet}
-Stack trace:
-${serializedStack}
-
-Path: ${window.location.pathname}`;
-            }
-            return copyText(output);
-          }).then((success) => {
-            if (success) {
-              showSuccess();
-            }
-          }).catch(() => {
+        if (!isCopying) {
+          isCopying = true;
+          void handleCopy(hoveredElement).finally(() => {
+            libStore.setState((state2) => ({
+              ...state2,
+              overlayMode: "hidden"
+            }));
+            selectionOverlay.hide();
+            window.setTimeout(() => {
+              isCopying = false;
+            }, INDICATOR_TOTAL_HIDE_DELAY_MS);
           });
         }
+        return;
       }
-    });
-    window.addEventListener("keyup", (event) => {
-      if (event.key === "Meta") {
-        if (shiftKeyTimeout !== null) {
-          window.clearTimeout(shiftKeyTimeout);
-          shiftKeyTimeout = null;
+      const element = getElementAtPosition(mouseX, mouseY);
+      if (!element) {
+        if (selectionOverlay.isVisible()) {
+          selectionOverlay.hide();
+          if (!isCopying) {
+            hideLabel();
+          }
         }
-        selectionOverlay.hide();
+        hoveredElement = null;
+        return;
+      }
+      const tagName = (element.tagName || "").toLowerCase();
+      hoveredElement = element;
+      const rect = element.getBoundingClientRect();
+      const computedStyle = window.getComputedStyle(element);
+      const borderRadius = computedStyle.borderRadius || "0px";
+      const transform = computedStyle.transform || "none";
+      selectionOverlay.update({
+        borderRadius,
+        height: rect.height,
+        transform,
+        width: rect.width,
+        x: rect.left,
+        y: rect.top
+      });
+      if (!selectionOverlay.isVisible()) {
+        selectionOverlay.show();
       }
+      showLabel(rect.left, rect.top, tagName);
+    }, 10);
+    const cleanupRenderSubscription = libStore.subscribe((state) => {
+      scheduleRunWhenIdle(() => {
+        handleRender(state);
+      });
     });
+    let timeout = null;
+    const render = () => {
+      timeout = window.setTimeout(() => {
+        scheduleRunWhenIdle(() => {
+          handleRender(libStore.getState());
+          render();
+        });
+      }, 100);
+    };
+    render();
     return () => {
+      window.removeEventListener("mousemove", handleMouseMove);
+      window.removeEventListener("mousedown", handleMouseDown);
+      cleanupTrackHotkeys();
+      cleanupRenderSubscription();
+      cleanupKeyStateChangeSubscription();
       if (timeout) {
         window.clearTimeout(timeout);
-        timeout = null;
       }
-      if (shiftKeyTimeout !== null) {
-        window.clearTimeout(shiftKeyTimeout);
-        shiftKeyTimeout = null;
+      if (cleanupActivationHotkeyWatcher) {
+        cleanupActivationHotkeyWatcher();
       }
-      root.remove();
-      throttledRender.cancel();
     };
   };
-  init();
+  if (typeof window !== "undefined" && typeof document !== "undefined") {
+    const currentScript = document.currentScript;
+    let options = {};
+    if (currentScript) {
+      const maybeOptions = currentScript.getAttribute("data-options");
+      if (maybeOptions) {
+        try {
+          options = JSON.parse(maybeOptions);
+        } catch {
+        }
+      }
+    }
+    init(options);
+  }
   /*! Bundled license information:
 
   bippy/dist/src-R2iEnVC1.js:
@@ -2699,6 +3205,7 @@ Path: ${window.location.pathname}`;
   */
 
   exports.init = init;
+  exports.libStore = libStore;
 
   return exports;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-grab",
-  "version": "0.0.11",
+  "version": "0.0.13",
   "description": "",
   "keywords": [],
   "homepage": "https://github.com/aidenybai/react-grab#readme",