semantic-inspector 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 semantic-inspector contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,113 @@
+# semantic-inspector
+
+A dev-only React inspector for vibe-coding. Hit a hotkey to enter inspect mode:
+hovering highlights the element under the cursor and shows its component name +
+`file:line`. **Click** copies that text identifier to the clipboard;
+**Shift+click** copies a PNG screenshot of just that element. Built for pasting
+precise UI context into an AI chat in seconds.
+
+Stack: Vite + `@vitejs/plugin-react` + React 18/19. Zero runtime cost in
+production — you gate where it mounts.
+
+## Install
+
+```sh
+npm i -D semantic-inspector
+```
+
+`react` / `react-dom` are peer deps (>=18). `vite` is an optional peer — only
+needed if you use the Vite plugin entry point.
+
+## How it works
+
+Source locations come from a **build-time stamp**, not React internals. A Babel
+pass adds `data-loc="<path>:<line>"` and `data-comp="<Component>"` to JSX host
+elements (`div`, `section`, …). The runtime reads those DOM attributes, so it
+stays robust across React versions. If a node isn't stamped (prod build, foreign
+node), it degrades gracefully: fiber `displayName` → filename → tag name.
+
+## Three entry points
+
+| Import                          | What it is                                                              |
+| ------------------------------- | ---------------------------------------------------------------------- |
+| `semantic-inspector`            | `<SemanticInspector/>` — the overlay + hotkey + clipboard runtime.     |
+| `semantic-inspector/vite`       | `stampLocVite()` — Vite plugin that stamps `data-loc` / `data-comp`.   |
+| `semantic-inspector/babel`      | Raw Babel plugin, for the babel variant of `@vitejs/plugin-react`.     |
+
+## Usage
+
+### 1. Stamp source locations (Vite plugin)
+
+`@vitejs/plugin-react` **v6** transpiles via oxc (no Babel hook), so stamp with a
+separate `pre` plugin:
+
+```ts
+import react from '@vitejs/plugin-react';
+import { stampLocVite } from 'semantic-inspector/vite';
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  // stampLocVite first (enforce: 'pre'), then react()
+  plugins: [stampLocVite({ rootDir: process.cwd() }), react()]
+});
+```
+
+`rootDir` is the base for the relative path written into `data-loc`.
+
+On the **Babel variant** of plugin-react you can skip the separate pre-pass:
+
+```ts
+import react from '@vitejs/plugin-react';
+import stampLoc from 'semantic-inspector/babel';
+
+react({ babel: { plugins: [[stampLoc, { rootDir: process.cwd() }]] } });
+```
+
+### 2. Mount it (behind your own dev flag, ideally lazy)
+
+```tsx
+import { lazy, Suspense } from 'react';
+
+const SemanticInspector = lazy(() =>
+  import('semantic-inspector').then((m) => ({ default: m.SemanticInspector }))
+);
+
+{
+  import.meta.env.DEV && (
+    <Suspense fallback={null}>
+      <SemanticInspector onCopy={(kind) => toast(`${kind} copied`)} />
+    </Suspense>
+  );
+}
+```
+
+## Props
+
+| prop         | default                  | purpose                                  |
+| ------------ | ------------------------ | ---------------------------------------- |
+| `hotkey`     | `'Alt+Shift+S'`          | toggle inspect mode (Esc exits)          |
+| `formatText` | `` `${comp} — ${loc}` `` | format of the text copied on click       |
+| `onCopy`     | —                        | callback after a copy (telemetry/toasts) |
+| `onError`    | —                        | callback on clipboard/screenshot failure |
+
+## Notes
+
+- `navigator.clipboard` requires a secure context (localhost / https) and a
+  user gesture — that's why copy happens on **click**, not hover.
+- Screenshots use `modern-screenshot` (DOM→canvas): cross-origin `<img>` without
+  CORS and some exotic CSS may not render.
+- On a prod React build without `data-loc`, the name falls back to the fiber
+  (minified) or tag — degraded mode. Full mode needs the build-time stamp.
+
+## Development
+
+```sh
+npm install
+npm test         # vitest
+npm run typecheck
+npm run build    # tsup -> dist/ (esm + cjs + d.ts)
+```
+
+## License
+
+MIT

package/dist/babel.cjs

@@ -0,0 +1,64 @@
+'use strict';
+
+// src/stampLocBabel.ts
+function isHostElement(name) {
+  return name.type === "JSXIdentifier" && /^[a-z]/.test(name.name);
+}
+function hasAttr(el, attrName) {
+  return el.attributes.some(
+    (a) => a.type === "JSXAttribute" && a.name.type === "JSXIdentifier" && a.name.name === attrName
+  );
+}
+function nearestComponentName(path) {
+  let p = path;
+  while (p) {
+    const node = p.node;
+    if (node.type === "FunctionDeclaration" && node.id && /^[A-Z]/.test(node.id.name)) {
+      return node.id.name;
+    }
+    if (node.type === "FunctionExpression" || node.type === "ArrowFunctionExpression") {
+      const parent = p.parentPath?.node;
+      if (parent?.type === "VariableDeclarator" && parent.id.type === "Identifier" && /^[A-Z]/.test(parent.id.name)) {
+        return parent.id.name;
+      }
+    }
+    p = p.parentPath;
+  }
+  return null;
+}
+function stampLocBabel(babel, opts = {}) {
+  const t = babel.types;
+  const attrLoc = opts.attrLoc ?? "data-loc";
+  const attrComp = opts.attrComp ?? "data-comp";
+  const rootDir = opts.rootDir ?? process.cwd();
+  const attr = (name, value) => t.jsxAttribute(t.jsxIdentifier(name), t.stringLiteral(value));
+  const toRel = (file) => {
+    let root = rootDir;
+    while (root.endsWith("/")) root = root.slice(0, -1);
+    const rel = file.startsWith(root + "/") ? file.slice(root.length + 1) : file;
+    return rel.split("\\").join("/");
+  };
+  return {
+    name: "stamp-loc",
+    visitor: {
+      JSXOpeningElement(path, state) {
+        const node = path.node;
+        if (!isHostElement(node.name)) return;
+        const filename = state.file.opts.filename;
+        const loc = node.loc;
+        if (!filename || !loc) return;
+        if (!hasAttr(node, attrLoc)) {
+          node.attributes.push(attr(attrLoc, `${toRel(filename)}:${loc.start.line}`));
+        }
+        if (!hasAttr(node, attrComp)) {
+          const comp = nearestComponentName(path);
+          if (comp) node.attributes.push(attr(attrComp, comp));
+        }
+      }
+    }
+  };
+}
+
+module.exports = stampLocBabel;
+//# sourceMappingURL=babel.cjs.map
+//# sourceMappingURL=babel.cjs.map

package/dist/babel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/stampLocBabel.ts"],"names":[],"mappings":"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","file":"babel.cjs","sourcesContent":["import type { NodePath, PluginObj, types as BabelTypes } from '@babel/core';\n\nexport interface StampLocOptions {\n  /** Имя атрибута пути. Default 'data-loc'. */\n  attrLoc?: string;\n  /** Имя атрибута компонента. Default 'data-comp'. */\n  attrComp?: string;\n  /** База для относительного пути в data-loc. Default process.cwd(). */\n  rootDir?: string;\n}\n\nfunction isHostElement(name: BabelTypes.JSXOpeningElement['name']): boolean {\n  return name.type === 'JSXIdentifier' && /^[a-z]/.test(name.name);\n}\n\nfunction hasAttr(el: BabelTypes.JSXOpeningElement, attrName: string): boolean {\n  return el.attributes.some(\n    (a) => a.type === 'JSXAttribute' && a.name.type === 'JSXIdentifier' && a.name.name === attrName\n  );\n}\n\n// Ближайшая функция-компонент с PascalCase-именем вверх по дереву:\n//   function Foo() {}  |  const Foo = () => {}  |  const Foo = function () {}\nfunction nearestComponentName(path: NodePath): string | null {\n  let p: NodePath | null = path;\n  while (p) {\n    const node = p.node;\n    if (node.type === 'FunctionDeclaration' && node.id && /^[A-Z]/.test(node.id.name)) {\n      return node.id.name;\n    }\n    if (node.type === 'FunctionExpression' || node.type === 'ArrowFunctionExpression') {\n      const parent = p.parentPath?.node;\n      if (parent?.type === 'VariableDeclarator' && parent.id.type === 'Identifier' && /^[A-Z]/.test(parent.id.name)) {\n        return parent.id.name;\n      }\n    }\n    p = p.parentPath;\n  }\n  return null;\n}\n\n/**\n * Babel-плагин: вешает data-loc=\"<path>:<line>\" и data-comp=\"<Component>\" на\n * JSX host-элементы (div, section, ...). Рантайм-инспектор читает эти DOM-атрибуты\n * (не React-internals), поэтому устойчив к версии React. Компонентные теги\n * (PascalCase) пропускаем — они не дают собственного DOM-узла.\n */\nexport default function stampLocBabel(babel: { types: typeof BabelTypes }, opts: StampLocOptions = {}): PluginObj {\n  const t = babel.types;\n  const attrLoc = opts.attrLoc ?? 'data-loc';\n  const attrComp = opts.attrComp ?? 'data-comp';\n  const rootDir = opts.rootDir ?? process.cwd();\n\n  const attr = (name: string, value: string) => t.jsxAttribute(t.jsxIdentifier(name), t.stringLiteral(value));\n\n  // path.relative без node:path, чтобы плагин не тянул узловые модули в чужих средах.\n  const toRel = (file: string): string => {\n    let root = rootDir;\n    while (root.endsWith('/')) root = root.slice(0, -1);\n    const rel = file.startsWith(root + '/') ? file.slice(root.length + 1) : file;\n    return rel.split('\\\\').join('/');\n  };\n\n  return {\n    name: 'stamp-loc',\n    visitor: {\n      JSXOpeningElement(path, state) {\n        const node = path.node;\n        if (!isHostElement(node.name)) return;\n\n        const filename = state.file.opts.filename;\n        const loc = node.loc;\n        if (!filename || !loc) return;\n\n        if (!hasAttr(node, attrLoc)) {\n          node.attributes.push(attr(attrLoc, `${toRel(filename)}:${loc.start.line}`));\n        }\n        if (!hasAttr(node, attrComp)) {\n          const comp = nearestComponentName(path);\n          if (comp) node.attributes.push(attr(attrComp, comp));\n        }\n      }\n    }\n  };\n}\n"]}

package/dist/babel.d.cts

@@ -0,0 +1,21 @@
+import { types, PluginObj } from '@babel/core';
+
+interface StampLocOptions {
+    /** Имя атрибута пути. Default 'data-loc'. */
+    attrLoc?: string;
+    /** Имя атрибута компонента. Default 'data-comp'. */
+    attrComp?: string;
+    /** База для относительного пути в data-loc. Default process.cwd(). */
+    rootDir?: string;
+}
+/**
+ * Babel-плагин: вешает data-loc="<path>:<line>" и data-comp="<Component>" на
+ * JSX host-элементы (div, section, ...). Рантайм-инспектор читает эти DOM-атрибуты
+ * (не React-internals), поэтому устойчив к версии React. Компонентные теги
+ * (PascalCase) пропускаем — они не дают собственного DOM-узла.
+ */
+declare function stampLocBabel(babel: {
+    types: typeof types;
+}, opts?: StampLocOptions): PluginObj;
+
+export { type StampLocOptions, stampLocBabel as default };

package/dist/babel.d.ts

@@ -0,0 +1,21 @@
+import { types, PluginObj } from '@babel/core';
+
+interface StampLocOptions {
+    /** Имя атрибута пути. Default 'data-loc'. */
+    attrLoc?: string;
+    /** Имя атрибута компонента. Default 'data-comp'. */
+    attrComp?: string;
+    /** База для относительного пути в data-loc. Default process.cwd(). */
+    rootDir?: string;
+}
+/**
+ * Babel-плагин: вешает data-loc="<path>:<line>" и data-comp="<Component>" на
+ * JSX host-элементы (div, section, ...). Рантайм-инспектор читает эти DOM-атрибуты
+ * (не React-internals), поэтому устойчив к версии React. Компонентные теги
+ * (PascalCase) пропускаем — они не дают собственного DOM-узла.
+ */
+declare function stampLocBabel(babel: {
+    types: typeof types;
+}, opts?: StampLocOptions): PluginObj;
+
+export { type StampLocOptions, stampLocBabel as default };

package/dist/babel.js

@@ -0,0 +1,3 @@
+export { stampLocBabel as default } from './chunk-AAPCI2HO.js';
+//# sourceMappingURL=babel.js.map
+//# sourceMappingURL=babel.js.map

package/dist/babel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"babel.js"}

package/dist/chunk-AAPCI2HO.js

@@ -0,0 +1,62 @@
+// src/stampLocBabel.ts
+function isHostElement(name) {
+  return name.type === "JSXIdentifier" && /^[a-z]/.test(name.name);
+}
+function hasAttr(el, attrName) {
+  return el.attributes.some(
+    (a) => a.type === "JSXAttribute" && a.name.type === "JSXIdentifier" && a.name.name === attrName
+  );
+}
+function nearestComponentName(path) {
+  let p = path;
+  while (p) {
+    const node = p.node;
+    if (node.type === "FunctionDeclaration" && node.id && /^[A-Z]/.test(node.id.name)) {
+      return node.id.name;
+    }
+    if (node.type === "FunctionExpression" || node.type === "ArrowFunctionExpression") {
+      const parent = p.parentPath?.node;
+      if (parent?.type === "VariableDeclarator" && parent.id.type === "Identifier" && /^[A-Z]/.test(parent.id.name)) {
+        return parent.id.name;
+      }
+    }
+    p = p.parentPath;
+  }
+  return null;
+}
+function stampLocBabel(babel, opts = {}) {
+  const t = babel.types;
+  const attrLoc = opts.attrLoc ?? "data-loc";
+  const attrComp = opts.attrComp ?? "data-comp";
+  const rootDir = opts.rootDir ?? process.cwd();
+  const attr = (name, value) => t.jsxAttribute(t.jsxIdentifier(name), t.stringLiteral(value));
+  const toRel = (file) => {
+    let root = rootDir;
+    while (root.endsWith("/")) root = root.slice(0, -1);
+    const rel = file.startsWith(root + "/") ? file.slice(root.length + 1) : file;
+    return rel.split("\\").join("/");
+  };
+  return {
+    name: "stamp-loc",
+    visitor: {
+      JSXOpeningElement(path, state) {
+        const node = path.node;
+        if (!isHostElement(node.name)) return;
+        const filename = state.file.opts.filename;
+        const loc = node.loc;
+        if (!filename || !loc) return;
+        if (!hasAttr(node, attrLoc)) {
+          node.attributes.push(attr(attrLoc, `${toRel(filename)}:${loc.start.line}`));
+        }
+        if (!hasAttr(node, attrComp)) {
+          const comp = nearestComponentName(path);
+          if (comp) node.attributes.push(attr(attrComp, comp));
+        }
+      }
+    }
+  };
+}
+
+export { stampLocBabel };
+//# sourceMappingURL=chunk-AAPCI2HO.js.map
+//# sourceMappingURL=chunk-AAPCI2HO.js.map

package/dist/chunk-AAPCI2HO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/stampLocBabel.ts"],"names":[],"mappings":"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","file":"chunk-AAPCI2HO.js","sourcesContent":["import type { NodePath, PluginObj, types as BabelTypes } from '@babel/core';\n\nexport interface StampLocOptions {\n  /** Имя атрибута пути. Default 'data-loc'. */\n  attrLoc?: string;\n  /** Имя атрибута компонента. Default 'data-comp'. */\n  attrComp?: string;\n  /** База для относительного пути в data-loc. Default process.cwd(). */\n  rootDir?: string;\n}\n\nfunction isHostElement(name: BabelTypes.JSXOpeningElement['name']): boolean {\n  return name.type === 'JSXIdentifier' && /^[a-z]/.test(name.name);\n}\n\nfunction hasAttr(el: BabelTypes.JSXOpeningElement, attrName: string): boolean {\n  return el.attributes.some(\n    (a) => a.type === 'JSXAttribute' && a.name.type === 'JSXIdentifier' && a.name.name === attrName\n  );\n}\n\n// Ближайшая функция-компонент с PascalCase-именем вверх по дереву:\n//   function Foo() {}  |  const Foo = () => {}  |  const Foo = function () {}\nfunction nearestComponentName(path: NodePath): string | null {\n  let p: NodePath | null = path;\n  while (p) {\n    const node = p.node;\n    if (node.type === 'FunctionDeclaration' && node.id && /^[A-Z]/.test(node.id.name)) {\n      return node.id.name;\n    }\n    if (node.type === 'FunctionExpression' || node.type === 'ArrowFunctionExpression') {\n      const parent = p.parentPath?.node;\n      if (parent?.type === 'VariableDeclarator' && parent.id.type === 'Identifier' && /^[A-Z]/.test(parent.id.name)) {\n        return parent.id.name;\n      }\n    }\n    p = p.parentPath;\n  }\n  return null;\n}\n\n/**\n * Babel-плагин: вешает data-loc=\"<path>:<line>\" и data-comp=\"<Component>\" на\n * JSX host-элементы (div, section, ...). Рантайм-инспектор читает эти DOM-атрибуты\n * (не React-internals), поэтому устойчив к версии React. Компонентные теги\n * (PascalCase) пропускаем — они не дают собственного DOM-узла.\n */\nexport default function stampLocBabel(babel: { types: typeof BabelTypes }, opts: StampLocOptions = {}): PluginObj {\n  const t = babel.types;\n  const attrLoc = opts.attrLoc ?? 'data-loc';\n  const attrComp = opts.attrComp ?? 'data-comp';\n  const rootDir = opts.rootDir ?? process.cwd();\n\n  const attr = (name: string, value: string) => t.jsxAttribute(t.jsxIdentifier(name), t.stringLiteral(value));\n\n  // path.relative без node:path, чтобы плагин не тянул узловые модули в чужих средах.\n  const toRel = (file: string): string => {\n    let root = rootDir;\n    while (root.endsWith('/')) root = root.slice(0, -1);\n    const rel = file.startsWith(root + '/') ? file.slice(root.length + 1) : file;\n    return rel.split('\\\\').join('/');\n  };\n\n  return {\n    name: 'stamp-loc',\n    visitor: {\n      JSXOpeningElement(path, state) {\n        const node = path.node;\n        if (!isHostElement(node.name)) return;\n\n        const filename = state.file.opts.filename;\n        const loc = node.loc;\n        if (!filename || !loc) return;\n\n        if (!hasAttr(node, attrLoc)) {\n          node.attributes.push(attr(attrLoc, `${toRel(filename)}:${loc.start.line}`));\n        }\n        if (!hasAttr(node, attrComp)) {\n          const comp = nearestComponentName(path);\n          if (comp) node.attributes.push(attr(attrComp, comp));\n        }\n      }\n    }\n  };\n}\n"]}

package/dist/index.cjs

@@ -0,0 +1,244 @@
+'use strict';
+
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+var modernScreenshot = require('modern-screenshot');
+
+// src/SemanticInspector.tsx
+var Z = 2147483600;
+var badge = {
+  position: "fixed",
+  bottom: 12,
+  left: 12,
+  zIndex: Z + 2,
+  padding: "6px 10px",
+  borderRadius: 6,
+  font: "12px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace",
+  background: "rgba(17,17,17,0.92)",
+  color: "#fff",
+  pointerEvents: "none",
+  boxShadow: "0 2px 8px rgba(0,0,0,0.3)"
+};
+var toastStyle = {
+  position: "fixed",
+  bottom: 12,
+  right: 12,
+  zIndex: Z + 2,
+  padding: "6px 10px",
+  borderRadius: 6,
+  font: "12px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace",
+  background: "rgba(22,101,52,0.95)",
+  color: "#fff",
+  pointerEvents: "none",
+  maxWidth: "60vw",
+  whiteSpace: "nowrap",
+  overflow: "hidden",
+  textOverflow: "ellipsis"
+};
+function boxStyle(r) {
+  return {
+    position: "fixed",
+    left: r.left,
+    top: r.top,
+    width: r.width,
+    height: r.height,
+    zIndex: Z,
+    outline: "2px solid #6366f1",
+    background: "rgba(99,102,241,0.12)",
+    pointerEvents: "none",
+    transition: "all 60ms ease-out"
+  };
+}
+function tipStyle(r) {
+  const top = r.top > 26 ? r.top - 24 : r.bottom + 4;
+  return {
+    position: "fixed",
+    left: r.left,
+    top,
+    zIndex: Z + 1,
+    padding: "2px 6px",
+    borderRadius: 4,
+    font: "11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace",
+    background: "#6366f1",
+    color: "#fff",
+    pointerEvents: "none",
+    whiteSpace: "nowrap"
+  };
+}
+function Overlay({ target, toast }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { style: badge, children: "\u2316 inspect \xB7 click=name \xB7 \u21E7click=shot \xB7 Esc=exit" }),
+    target && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: boxStyle(target.rect) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: tipStyle(target.rect), children: [
+        target.comp,
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { opacity: 0.75 }, children: [
+          " \xB7 ",
+          target.loc ?? "no source"
+        ] })
+      ] })
+    ] }),
+    toast && /* @__PURE__ */ jsxRuntime.jsx("div", { style: toastStyle, children: toast })
+  ] });
+}
+async function copyText(text) {
+  await navigator.clipboard.writeText(text);
+}
+async function copyElementShot(el) {
+  const blob = await modernScreenshot.domToBlob(el);
+  if (!blob) throw new Error("screenshot produced empty blob");
+  await navigator.clipboard.write([new ClipboardItem({ "image/png": blob })]);
+}
+
+// src/resolveTarget.ts
+var LOC_ATTR = "data-loc";
+var COMP_ATTR = "data-comp";
+function resolveTarget(el) {
+  if (!el) return null;
+  const target = el.closest(`[${LOC_ATTR}]`) ?? el;
+  const loc = target.getAttribute(LOC_ATTR);
+  const comp = target.getAttribute(COMP_ATTR) ?? fiberName(target) ?? fallbackName(target, loc);
+  return { comp, loc, el: target, rect: target.getBoundingClientRect() };
+}
+function fallbackName(el, loc) {
+  if (loc) {
+    const base = loc.split(":")[0].split("/").pop()?.replace(/\.[jt]sx?$/, "");
+    if (base) return base;
+  }
+  return el.tagName.toLowerCase();
+}
+function fiberName(el) {
+  const key = Object.keys(el).find((k) => k.startsWith("__reactFiber$") || k.startsWith("__reactInternalInstance$"));
+  if (!key) return null;
+  let fiber = el[key] ?? null;
+  while (fiber) {
+    const t = fiber.type;
+    const name = t && typeof t !== "string" ? t.displayName ?? t.name : void 0;
+    if (name && /^[A-Z]/.test(name)) return name;
+    fiber = fiber.return;
+  }
+  return null;
+}
+
+// src/useInspector.ts
+var DEFAULT_HOTKEY = "Alt+Shift+S";
+function defaultFormat(t) {
+  return t.loc ? `${t.comp} \u2014 ${t.loc}` : t.comp;
+}
+function matchHotkey(e, hotkey) {
+  const parts = hotkey.split("+").map((p) => p.trim().toLowerCase());
+  const key = parts[parts.length - 1];
+  const want = (m, alt) => parts.includes(m) || (alt ? parts.includes(alt) : false);
+  if (e.altKey !== want("alt")) return false;
+  if (e.shiftKey !== want("shift")) return false;
+  if (e.ctrlKey !== want("ctrl", "control")) return false;
+  if (e.metaKey !== want("meta", "cmd")) return false;
+  return e.key.toLowerCase() === key || e.code.toLowerCase() === `key${key}`;
+}
+function useInspector(opts = {}) {
+  const { hotkey = DEFAULT_HOTKEY } = opts;
+  const [active, setActive] = react.useState(false);
+  const [target, setTarget] = react.useState(null);
+  const cbRef = react.useRef(opts);
+  cbRef.current = opts;
+  react.useEffect(() => {
+    function onKey(e) {
+      if (matchHotkey(e, hotkey)) {
+        e.preventDefault();
+        setActive((a) => !a);
+      } else if (e.key === "Escape") {
+        setActive(false);
+      }
+    }
+    window.addEventListener("keydown", onKey);
+    return () => {
+      window.removeEventListener("keydown", onKey);
+    };
+  }, [hotkey]);
+  react.useEffect(() => {
+    if (!active) {
+      setTarget(null);
+      return;
+    }
+    function onMove(e) {
+      setTarget(resolveTarget(document.elementFromPoint(e.clientX, e.clientY)));
+    }
+    function onClick(e) {
+      const t = resolveTarget(document.elementFromPoint(e.clientX, e.clientY));
+      if (!t) return;
+      e.preventDefault();
+      e.stopPropagation();
+      const { formatText = defaultFormat, onCopy, onError } = cbRef.current;
+      const done = (kind, payload) => {
+        onCopy?.(kind, payload);
+      };
+      const fail = (kind, err) => {
+        onError?.(kind, err);
+      };
+      if (e.shiftKey) {
+        copyElementShot(t.el).then(
+          () => {
+            done("screenshot", t.comp);
+          },
+          (err) => {
+            fail("screenshot", err);
+          }
+        );
+      } else {
+        const text = formatText({ comp: t.comp, loc: t.loc });
+        copyText(text).then(
+          () => {
+            done("text", text);
+          },
+          (err) => {
+            fail("text", err);
+          }
+        );
+      }
+    }
+    window.addEventListener("mousemove", onMove, true);
+    window.addEventListener("click", onClick, true);
+    const prevCursor = document.body.style.cursor;
+    document.body.style.cursor = "crosshair";
+    return () => {
+      window.removeEventListener("mousemove", onMove, true);
+      window.removeEventListener("click", onClick, true);
+      document.body.style.cursor = prevCursor;
+    };
+  }, [active]);
+  return { active, target };
+}
+var TOAST_MS = 1400;
+function SemanticInspector(props) {
+  const [toast, setToast] = react.useState(null);
+  const timer = react.useRef(void 0);
+  const flash = (msg) => {
+    setToast(msg);
+    clearTimeout(timer.current);
+    timer.current = setTimeout(() => {
+      setToast(null);
+    }, TOAST_MS);
+  };
+  const { active, target } = useInspector({
+    hotkey: props.hotkey,
+    formatText: props.formatText,
+    onCopy: (kind, payload) => {
+      flash(kind === "text" ? `\u2713 ${payload}` : "\u2713 screenshot copied");
+      props.onCopy?.(kind, payload);
+    },
+    onError: (kind, err) => {
+      flash(`\u2717 ${kind} failed`);
+      props.onError?.(kind, err);
+    }
+  });
+  if (!active && !toast) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx(Overlay, { target: active ? target : null, toast });
+}
+
+exports.SemanticInspector = SemanticInspector;
+exports.copyElementShot = copyElementShot;
+exports.copyText = copyText;
+exports.resolveTarget = resolveTarget;
+exports.useInspector = useInspector;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Overlay.tsx","../src/clipboard.ts","../src/resolveTarget.ts","../src/useInspector.ts","../src/SemanticInspector.tsx"],"names":["jsxs","Fragment","jsx","domToBlob","useState","useRef","useEffect"],"mappings":"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","file":"index.cjs","sourcesContent":["import type { CSSProperties } from 'react';\nimport type { InspectTarget } from './types';\n\nconst Z = 2147483600;\n\nconst badge: CSSProperties = {\n  position: 'fixed',\n  bottom: 12,\n  left: 12,\n  zIndex: Z + 2,\n  padding: '6px 10px',\n  borderRadius: 6,\n  font: '12px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace',\n  background: 'rgba(17,17,17,0.92)',\n  color: '#fff',\n  pointerEvents: 'none',\n  boxShadow: '0 2px 8px rgba(0,0,0,0.3)'\n};\n\nconst toastStyle: CSSProperties = {\n  position: 'fixed',\n  bottom: 12,\n  right: 12,\n  zIndex: Z + 2,\n  padding: '6px 10px',\n  borderRadius: 6,\n  font: '12px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace',\n  background: 'rgba(22,101,52,0.95)',\n  color: '#fff',\n  pointerEvents: 'none',\n  maxWidth: '60vw',\n  whiteSpace: 'nowrap',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis'\n};\n\nfunction boxStyle(r: DOMRect): CSSProperties {\n  return {\n    position: 'fixed',\n    left: r.left,\n    top: r.top,\n    width: r.width,\n    height: r.height,\n    zIndex: Z,\n    outline: '2px solid #6366f1',\n    background: 'rgba(99,102,241,0.12)',\n    pointerEvents: 'none',\n    transition: 'all 60ms ease-out'\n  };\n}\n\nfunction tipStyle(r: DOMRect): CSSProperties {\n  const top = r.top > 26 ? r.top - 24 : r.bottom + 4;\n  return {\n    position: 'fixed',\n    left: r.left,\n    top,\n    zIndex: Z + 1,\n    padding: '2px 6px',\n    borderRadius: 4,\n    font: '11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace',\n    background: '#6366f1',\n    color: '#fff',\n    pointerEvents: 'none',\n    whiteSpace: 'nowrap'\n  };\n}\n\nexport function Overlay({ target, toast }: { target: InspectTarget | null; toast: string | null }) {\n  return (\n    <>\n      <div style={badge}>⌖ inspect · click=name · ⇧click=shot · Esc=exit</div>\n      {target && (\n        <>\n          <div style={boxStyle(target.rect)} />\n          <div style={tipStyle(target.rect)}>\n            {target.comp}\n            <span style={{ opacity: 0.75 }}> · {target.loc ?? 'no source'}</span>\n          </div>\n        </>\n      )}\n      {toast && <div style={toastStyle}>{toast}</div>}\n    </>\n  );\n}\n","import { domToBlob } from 'modern-screenshot';\n\n/** Текст в буфер. */\nexport async function copyText(text: string): Promise<void> {\n  await navigator.clipboard.writeText(text);\n}\n\n/**\n * PNG-скриншот ТОЛЬКО переданного элемента в буфер (image/png).\n * Должен вызываться из user-gesture (клик), иначе браузер блокит image-копию.\n */\nexport async function copyElementShot(el: Element): Promise<void> {\n  const blob = await domToBlob(el as HTMLElement);\n  if (!blob) throw new Error('screenshot produced empty blob');\n  await navigator.clipboard.write([new ClipboardItem({ 'image/png': blob })]);\n}\n","import type { InspectTarget } from './types';\n\nconst LOC_ATTR = 'data-loc';\nconst COMP_ATTR = 'data-comp';\n\n/**\n * DOM-элемент под курсором → цель инспекции.\n * Идём к ближайшему предку с data-loc (заштампован babel-плагином). Если его нет\n * (prod-билд без штампов / сторонний узел) — best-effort: имя из React fiber,\n * затем имя файла из data-loc, затем имя тега.\n */\nexport function resolveTarget(el: Element | null): InspectTarget | null {\n  if (!el) return null;\n  const target = el.closest(`[${LOC_ATTR}]`) ?? el;\n  const loc = target.getAttribute(LOC_ATTR);\n  const comp = target.getAttribute(COMP_ATTR) ?? fiberName(target) ?? fallbackName(target, loc);\n  return { comp, loc, el: target, rect: target.getBoundingClientRect() };\n}\n\nfunction fallbackName(el: Element, loc: string | null): string {\n  if (loc) {\n    const base = loc\n      .split(':')[0]\n      .split('/')\n      .pop()\n      ?.replace(/\\.[jt]sx?$/, '');\n    if (base) return base;\n  }\n  return el.tagName.toLowerCase();\n}\n\n// React-internals fallback. _debugSource убран в React 19, но имя компонента из\n// fiber.type всё ещё доступно (в dev-билде не минифицировано).\ninterface FiberLike {\n  type: { displayName?: string; name?: string } | string | null | undefined;\n  return: FiberLike | null;\n}\n\nfunction fiberName(el: Element): string | null {\n  const key = Object.keys(el).find((k) => k.startsWith('__reactFiber$') || k.startsWith('__reactInternalInstance$'));\n  if (!key) return null;\n  let fiber = (el as unknown as Record<string, FiberLike | undefined>)[key] ?? null;\n  while (fiber) {\n    const t = fiber.type;\n    const name = t && typeof t !== 'string' ? (t.displayName ?? t.name) : undefined;\n    if (name && /^[A-Z]/.test(name)) return name;\n    fiber = fiber.return;\n  }\n  return null;\n}\n","import { useEffect, useRef, useState } from 'react';\nimport { copyElementShot, copyText } from './clipboard';\nimport { resolveTarget } from './resolveTarget';\nimport type { CopyKind, InspectTarget, SemanticInspectorProps } from './types';\n\nconst DEFAULT_HOTKEY = 'Alt+Shift+S';\n\nfunction defaultFormat(t: { comp: string; loc: string | null }): string {\n  return t.loc ? `${t.comp} — ${t.loc}` : t.comp;\n}\n\n/** 'Alt+Shift+S' → совпадает ли событие keydown. Последний токен — клавиша. */\nfunction matchHotkey(e: KeyboardEvent, hotkey: string): boolean {\n  const parts = hotkey.split('+').map((p) => p.trim().toLowerCase());\n  const key = parts[parts.length - 1];\n  const want = (m: string, alt?: string) => parts.includes(m) || (alt ? parts.includes(alt) : false);\n  if (e.altKey !== want('alt')) return false;\n  if (e.shiftKey !== want('shift')) return false;\n  if (e.ctrlKey !== want('ctrl', 'control')) return false;\n  if (e.metaKey !== want('meta', 'cmd')) return false;\n  return e.key.toLowerCase() === key || e.code.toLowerCase() === `key${key}`;\n}\n\n/**\n * Состояние режима инспекции + слушатели.\n * - keydown: хоткей переключает active, Esc выключает.\n * - active: mousemove обновляет target; click (capture, preventDefault) копирует\n *   текст, Shift+click — скриншот элемента.\n */\nexport function useInspector(opts: SemanticInspectorProps = {}) {\n  const { hotkey = DEFAULT_HOTKEY } = opts;\n  const [active, setActive] = useState(false);\n  const [target, setTarget] = useState<InspectTarget | null>(null);\n\n  // Свежие колбэки без переподписки слушателей.\n  const cbRef = useRef<SemanticInspectorProps>(opts);\n  cbRef.current = opts;\n\n  useEffect(() => {\n    function onKey(e: KeyboardEvent) {\n      if (matchHotkey(e, hotkey)) {\n        e.preventDefault();\n        setActive((a) => !a);\n      } else if (e.key === 'Escape') {\n        setActive(false);\n      }\n    }\n    window.addEventListener('keydown', onKey);\n    return () => {\n      window.removeEventListener('keydown', onKey);\n    };\n  }, [hotkey]);\n\n  useEffect(() => {\n    if (!active) {\n      setTarget(null);\n      return;\n    }\n\n    function onMove(e: MouseEvent) {\n      setTarget(resolveTarget(document.elementFromPoint(e.clientX, e.clientY)));\n    }\n\n    function onClick(e: MouseEvent) {\n      const t = resolveTarget(document.elementFromPoint(e.clientX, e.clientY));\n      if (!t) return;\n      e.preventDefault();\n      e.stopPropagation();\n      const { formatText = defaultFormat, onCopy, onError } = cbRef.current;\n      const done = (kind: CopyKind, payload: string) => {\n        onCopy?.(kind, payload);\n      };\n      const fail = (kind: CopyKind, err: unknown) => {\n        onError?.(kind, err);\n      };\n      if (e.shiftKey) {\n        copyElementShot(t.el).then(\n          () => {\n            done('screenshot', t.comp);\n          },\n          (err: unknown) => {\n            fail('screenshot', err);\n          }\n        );\n      } else {\n        const text = formatText({ comp: t.comp, loc: t.loc });\n        copyText(text).then(\n          () => {\n            done('text', text);\n          },\n          (err: unknown) => {\n            fail('text', err);\n          }\n        );\n      }\n    }\n\n    window.addEventListener('mousemove', onMove, true);\n    window.addEventListener('click', onClick, true);\n    const prevCursor = document.body.style.cursor;\n    document.body.style.cursor = 'crosshair';\n    return () => {\n      window.removeEventListener('mousemove', onMove, true);\n      window.removeEventListener('click', onClick, true);\n      document.body.style.cursor = prevCursor;\n    };\n  }, [active]);\n\n  return { active, target };\n}\n","import { useRef, useState } from 'react';\nimport { Overlay } from './Overlay';\nimport type { CopyKind, SemanticInspectorProps } from './types';\nimport { useInspector } from './useInspector';\n\nconst TOAST_MS = 1400;\n\n/**\n * Семантический инспектор. Сам по себе ничего не показывает, пока не включён\n * хоткеем. Гейтинг (где монтировать) — забота консьюмера: монтируй под своим\n * dev-флагом и желательно через React.lazy, чтобы не тянуть в prod-бандл.\n */\nexport function SemanticInspector(props: SemanticInspectorProps) {\n  const [toast, setToast] = useState<string | null>(null);\n  const timer = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n  const flash = (msg: string) => {\n    setToast(msg);\n    clearTimeout(timer.current);\n    timer.current = setTimeout(() => {\n      setToast(null);\n    }, TOAST_MS);\n  };\n\n  const { active, target } = useInspector({\n    hotkey: props.hotkey,\n    formatText: props.formatText,\n    onCopy: (kind: CopyKind, payload: string) => {\n      flash(kind === 'text' ? `✓ ${payload}` : '✓ screenshot copied');\n      props.onCopy?.(kind, payload);\n    },\n    onError: (kind: CopyKind, err: unknown) => {\n      flash(`✗ ${kind} failed`);\n      props.onError?.(kind, err);\n    }\n  });\n\n  if (!active && !toast) return null;\n  return <Overlay target={active ? target : null} toast={toast} />;\n}\n"]}