@stsgs1980/fab-inspector 3.4.1 → 3.5.0

package/{select-element-fab.tsx → dist/select-element-fab.js}

@@ -1,59 +1,22 @@
 'use client';
-
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { AnimatePresence } from 'framer-motion';
 import { useElementInspector } from './use-element-inspector';
 import { usePanelDrag } from './use-panel-drag';
 import { HighlightOverlay } from './highlight-overlay';
 import { InspectorPanel } from './inspector-panel';
 import { InspectorFab } from './inspector-fab';
-
 // Dev-only guard: FAB не должен попасть в production-bundle.
 // Это страховка на случай, если потребитель забыл поставить пакет
 // в devDependencies или не убрал импорт из layout для прод-сборки.
 // В проде next/build подставляет NODE_ENV=production и tree-shaking
 // вырезает весь модуль целиком (sideEffects: false в package.json).
 const IS_DEV = process.env.NODE_ENV === 'development';
-
 export function SelectElementFab() {
-  const {
-    active,
-    elementInfo,
-    panelPos,
-    setPanelPos,
-    highlightBox,
-    snippet,
-    snippetLoading,
-    toggleActive,
-    closePanel,
-  } = useElementInspector();
-
-  const { isDragging, handleDragStart } = usePanelDrag(panelPos, setPanelPos);
-
-  if (!IS_DEV) return null;
-
-  return (
-    <>
-      {active && highlightBox && <HighlightOverlay highlightBox={highlightBox} />}
-
-      <AnimatePresence>
-        {active && elementInfo && (
-          <InspectorPanel
-            elementInfo={elementInfo}
-            panelPos={panelPos}
-            isDragging={isDragging}
-            onDragStart={handleDragStart}
-            onClose={closePanel}
-            snippet={snippet}
-            snippetLoading={snippetLoading}
-          />
-        )}
-      </AnimatePresence>
-
-      <InspectorFab
-        active={active}
-        onToggle={toggleActive}
-        showTooltip={active && !elementInfo}
-      />
-    </>
-  );
-}
+    const { active, elementInfo, panelPos, setPanelPos, highlightBox, snippet, snippetLoading, toggleActive, closePanel, } = useElementInspector();
+    const { isDragging, handleDragStart } = usePanelDrag(panelPos, setPanelPos);
+    if (!IS_DEV)
+        return null;
+    return (_jsxs(_Fragment, { children: [active && highlightBox && _jsx(HighlightOverlay, { highlightBox: highlightBox }), _jsx(AnimatePresence, { children: active && elementInfo && (_jsx(InspectorPanel, { elementInfo: elementInfo, panelPos: panelPos, isDragging: isDragging, onDragStart: handleDragStart, onClose: closePanel, snippet: snippet, snippetLoading: snippetLoading })) }), _jsx(InspectorFab, { active: active, onToggle: toggleActive, showTooltip: active && !elementInfo })] }));
+}
+//# sourceMappingURL=select-element-fab.js.map

package/dist/select-element-fab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-element-fab.js","sourceRoot":"","sources":["../select-element-fab.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,6DAA6D;AAC7D,kEAAkE;AAClE,mEAAmE;AACnE,oEAAoE;AACpE,oEAAoE;AACpE,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,CAAC;AAEtD,MAAM,UAAU,gBAAgB;IAC9B,MAAM,EACJ,MAAM,EACN,WAAW,EACX,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,OAAO,EACP,cAAc,EACd,YAAY,EACZ,UAAU,GACX,GAAG,mBAAmB,EAAE,CAAC;IAE1B,MAAM,EAAE,UAAU,EAAE,eAAe,EAAE,GAAG,YAAY,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;IAE5E,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAEzB,OAAO,CACL,8BACG,MAAM,IAAI,YAAY,IAAI,KAAC,gBAAgB,IAAC,YAAY,EAAE,YAAY,GAAI,EAE3E,KAAC,eAAe,cACb,MAAM,IAAI,WAAW,IAAI,CACxB,KAAC,cAAc,IACb,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,eAAe,EAC5B,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,GAC9B,CACH,GACe,EAElB,KAAC,YAAY,IACX,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,YAAY,EACtB,WAAW,EAAE,MAAM,IAAI,CAAC,WAAW,GACnC,IACD,CACJ,CAAC;AACJ,CAAC"}

package/dist/types.d.ts

@@ -0,0 +1,43 @@
+export interface SourceInfo {
+    file: string;
+    line: number;
+}
+export interface BoxModel {
+    marginTop: string;
+    marginRight: string;
+    marginBottom: string;
+    marginLeft: string;
+    paddingTop: string;
+    paddingRight: string;
+    paddingBottom: string;
+    paddingLeft: string;
+    borderTop: string;
+    borderRight: string;
+    borderBottom: string;
+    borderLeft: string;
+    width: string;
+    height: string;
+}
+export interface ElementInfo {
+    tag: string;
+    id: string;
+    classes: string;
+    rect: DOMRect;
+    text: string;
+    outerHTML: string;
+    cssPath: string;
+    computedStyles: Record<string, string>;
+    boxModel: BoxModel | null;
+    source: SourceInfo | null;
+}
+export interface SnippetData {
+    file: string;
+    line: number;
+    totalLines: number;
+    snippet: {
+        startLine: number;
+        lines: string[];
+        highlightLine: number;
+    };
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,QAAQ;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,WAAW;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,OAAO,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACvC,QAAQ,EAAE,QAAQ,GAAG,IAAI,CAAC;IAC1B,MAAM,EAAE,UAAU,GAAG,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE;QACP,SAAS,EAAE,MAAM,CAAC;QAClB,KAAK,EAAE,MAAM,EAAE,CAAC;QAChB,aAAa,EAAE,MAAM,CAAC;KACvB,CAAC;CACH"}

package/dist/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

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

package/dist/use-element-inspector.d.ts

@@ -0,0 +1,19 @@
+import type { ElementInfo, SnippetData } from './types';
+export declare function useElementInspector(): {
+    active: boolean;
+    elementInfo: ElementInfo | null;
+    panelPos: {
+        x: number;
+        y: number;
+    };
+    setPanelPos: import("react").Dispatch<import("react").SetStateAction<{
+        x: number;
+        y: number;
+    }>>;
+    highlightBox: DOMRect | null;
+    snippet: SnippetData | null;
+    snippetLoading: boolean;
+    toggleActive: () => void;
+    closePanel: () => void;
+};
+//# sourceMappingURL=use-element-inspector.d.ts.map

package/dist/use-element-inspector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-element-inspector.d.ts","sourceRoot":"","sources":["../use-element-inspector.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAwB,MAAM,SAAS,CAAC;AA2I9E,wBAAgB,mBAAmB;;;;;;;;;;;;;;;;EA2HlC"}

package/dist/use-element-inspector.js

@@ -0,0 +1,239 @@
+import { useState, useCallback, useEffect } from 'react';
+function findSource(el) {
+    let current = el;
+    while (current) {
+        const src = current.getAttribute('data-src');
+        if (src) {
+            const lastColon = src.lastIndexOf(':');
+            if (lastColon > 0) {
+                return {
+                    file: src.slice(0, lastColon),
+                    line: parseInt(src.slice(lastColon + 1), 10) || 1,
+                };
+            }
+            return { file: src, line: 1 };
+        }
+        current = current.parentElement;
+    }
+    return null;
+}
+function getCssPath(el) {
+    const parts = [];
+    let current = el;
+    while (current && current !== document.body && current !== document.documentElement) {
+        let selector = current.tagName.toLowerCase();
+        if (current.id) {
+            selector += '#' + current.id;
+            parts.unshift(selector);
+            break;
+        }
+        const parent = current.parentElement;
+        if (parent) {
+            const siblings = Array.from(parent.children).filter((c) => c.tagName === current.tagName);
+            if (siblings.length > 1) {
+                const index = siblings.indexOf(current) + 1;
+                selector += `:nth-of-type(${index})`;
+            }
+        }
+        parts.unshift(selector);
+        current = parent;
+    }
+    return parts.join(' > ');
+}
+function getTextForInspector(el) {
+    const TEXT_TAGS = new Set([
+        'H1', 'H2', 'H3', 'H4', 'H5', 'H6',
+        'BUTTON', 'A', 'LABEL', 'P', 'SPAN', 'LI', 'TD', 'TH', 'DT', 'DD',
+    ]);
+    if (!TEXT_TAGS.has(el.tagName))
+        return '';
+    // Только прямые текстовые узлы — без содержимого дочерних элементов.
+    // Для <span><Icon /> Wiki Codex <em>v2</em></span> вернёт "Wiki Codex",
+    // а не "Wiki Codex v2" (как textContent).
+    let direct = '';
+    for (const node of Array.from(el.childNodes)) {
+        if (node.nodeType === Node.TEXT_NODE && node.textContent) {
+            direct += node.textContent;
+        }
+    }
+    const directTrim = direct.trim();
+    // Если прямого текста нет (всё во вложенных) — fallback на textContent,
+    // чтобы не потерять <button><Icon />Save</button> (там текст прямой,
+    // но иногда иконка съедает весь текст).
+    const fallback = (el.textContent || '').trim();
+    const result = directTrim || fallback;
+    return result.slice(0, 120);
+}
+function getElementInfo(el) {
+    const rect = el.getBoundingClientRect();
+    const cs = window.getComputedStyle(el);
+    if (el.closest('[data-se-fab]') ||
+        el.closest('[data-se-panel]') ||
+        el.closest('[data-se-highlight]')) {
+        return null;
+    }
+    let outerHTML = el.outerHTML;
+    if (outerHTML.length > 2000) {
+        outerHTML = outerHTML.slice(0, 2000) + '\n  ...';
+    }
+    return {
+        tag: el.tagName.toLowerCase(),
+        id: el.id || '',
+        classes: typeof el.className === 'string' ? el.className : '',
+        rect,
+        text: getTextForInspector(el),
+        outerHTML,
+        cssPath: getCssPath(el),
+        computedStyles: {
+            fontSize: cs.fontSize,
+            fontWeight: cs.fontWeight,
+            color: cs.color,
+            lineHeight: cs.lineHeight,
+            width: `${Math.round(rect.width)}px`,
+            height: `${Math.round(rect.height)}px`,
+        },
+        boxModel: {
+            marginTop: cs.marginTop,
+            marginRight: cs.marginRight,
+            marginBottom: cs.marginBottom,
+            marginLeft: cs.marginLeft,
+            paddingTop: cs.paddingTop,
+            paddingRight: cs.paddingRight,
+            paddingBottom: cs.paddingBottom,
+            paddingLeft: cs.paddingLeft,
+            borderTop: cs.borderTopWidth,
+            borderRight: cs.borderRightWidth,
+            borderBottom: cs.borderBottomWidth,
+            borderLeft: cs.borderLeftWidth,
+            width: cs.width,
+            height: cs.height,
+        },
+        source: findSource(el),
+    };
+}
+function computePanelPos(rect) {
+    const panelW = 380;
+    const panelH = 400;
+    let x = rect.right + 8;
+    let y = rect.top;
+    if (x + panelW > window.innerWidth - 16) {
+        x = rect.left - panelW - 8;
+    }
+    if (x < 8)
+        x = 8;
+    if (y + panelH > window.innerHeight - 16) {
+        y = window.innerHeight - panelH - 16;
+    }
+    if (y < 8)
+        y = 8;
+    return { x, y };
+}
+export function useElementInspector() {
+    const [active, setActive] = useState(false);
+    const [elementInfo, setElementInfo] = useState(null);
+    const [panelPos, setPanelPos] = useState({ x: 0, y: 0 });
+    const [highlightBox, setHighlightBox] = useState(null);
+    const [snippet, setSnippet] = useState(null);
+    const [snippetLoading, setSnippetLoading] = useState(false);
+    const fetchSnippet = useCallback(async (file, line) => {
+        setSnippetLoading(true);
+        setSnippet(null);
+        try {
+            const res = await fetch(`/api/source?file=${encodeURIComponent(file)}&line=${line}&ctx=10`);
+            if (res.ok) {
+                const data = await res.json();
+                setSnippet(data);
+            }
+        }
+        catch {
+            // ignore
+        }
+        setSnippetLoading(false);
+    }, []);
+    const handleMouseMove = useCallback((e) => {
+        const target = e.target;
+        if (target.closest('[data-se-fab]') ||
+            target.closest('[data-se-panel]') ||
+            target.closest('[data-se-highlight]')) {
+            setHighlightBox(null);
+            return;
+        }
+        setHighlightBox(target.getBoundingClientRect());
+    }, []);
+    const handleClick = useCallback((e) => {
+        const target = e.target;
+        if (target.closest('[data-se-fab]') ||
+            target.closest('[data-se-panel]') ||
+            target.closest('[data-se-highlight]')) {
+            return;
+        }
+        e.preventDefault();
+        e.stopPropagation();
+        const info = getElementInfo(target);
+        if (info) {
+            setElementInfo(info);
+            setSnippet(null);
+            setPanelPos(computePanelPos(info.rect));
+            if (info.source) {
+                fetchSnippet(info.source.file, info.source.line);
+            }
+        }
+    }, [fetchSnippet]);
+    const handleScroll = useCallback(() => {
+        setHighlightBox(null);
+    }, []);
+    useEffect(() => {
+        if (!active)
+            return;
+        document.addEventListener('mousemove', handleMouseMove, true);
+        document.addEventListener('click', handleClick, true);
+        document.addEventListener('scroll', handleScroll, true);
+        document.body.style.cursor = 'crosshair';
+        return () => {
+            document.removeEventListener('mousemove', handleMouseMove, true);
+            document.removeEventListener('click', handleClick, true);
+            document.removeEventListener('scroll', handleScroll, true);
+            document.body.style.cursor = '';
+        };
+    }, [active, handleMouseMove, handleClick, handleScroll]);
+    useEffect(() => {
+        if (!active)
+            return;
+        const handler = (e) => {
+            if (e.key === 'Escape') {
+                setActive(false);
+                setElementInfo(null);
+                setHighlightBox(null);
+                setSnippet(null);
+            }
+        };
+        window.addEventListener('keydown', handler);
+        return () => window.removeEventListener('keydown', handler);
+    }, [active]);
+    const toggleActive = useCallback(() => {
+        setActive((v) => {
+            const next = !v;
+            if (!next) {
+                setElementInfo(null);
+                setHighlightBox(null);
+                setSnippet(null);
+            }
+            return next;
+        });
+    }, []);
+    const closePanel = useCallback(() => {
+        setElementInfo(null);
+    }, []);
+    return {
+        active,
+        elementInfo,
+        panelPos,
+        setPanelPos,
+        highlightBox,
+        snippet,
+        snippetLoading,
+        toggleActive,
+        closePanel,
+    };
+}
+//# sourceMappingURL=use-element-inspector.js.map

package/dist/use-element-inspector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-element-inspector.js","sourceRoot":"","sources":["../use-element-inspector.ts"],"names":[],"mappings":"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"}

package/dist/use-panel-drag.d.ts

@@ -0,0 +1,11 @@
+export declare function usePanelDrag(panelPos: {
+    x: number;
+    y: number;
+}, setPanelPos: (pos: {
+    x: number;
+    y: number;
+}) => void): {
+    isDragging: boolean;
+    handleDragStart: (e: React.MouseEvent) => void;
+};
+//# sourceMappingURL=use-panel-drag.d.ts.map

package/dist/use-panel-drag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-panel-drag.d.ts","sourceRoot":"","sources":["../use-panel-drag.ts"],"names":[],"mappings":"AAEA,wBAAgB,YAAY,CAC1B,QAAQ,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,EAClC,WAAW,EAAE,CAAC,GAAG,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,KAAK,IAAI;;yBAW9C,KAAK,CAAC,UAAU;EA+BvB"}

package/dist/use-panel-drag.js

@@ -0,0 +1,35 @@
+import { useState, useCallback, useRef } from 'react';
+export function usePanelDrag(panelPos, setPanelPos) {
+    const [isDragging, setIsDragging] = useState(false);
+    const dragRef = useRef(null);
+    const handleDragStart = useCallback((e) => {
+        e.preventDefault();
+        setIsDragging(true);
+        dragRef.current = {
+            startX: e.clientX,
+            startY: e.clientY,
+            startLeft: panelPos.x,
+            startTop: panelPos.y,
+        };
+        const onMove = (ev) => {
+            if (!dragRef.current)
+                return;
+            const dx = ev.clientX - dragRef.current.startX;
+            const dy = ev.clientY - dragRef.current.startY;
+            setPanelPos({
+                x: Math.max(0, Math.min(window.innerWidth - 396, dragRef.current.startLeft + dx)),
+                y: Math.max(0, Math.min(window.innerHeight - 48, dragRef.current.startTop + dy)),
+            });
+        };
+        const onUp = () => {
+            setIsDragging(false);
+            dragRef.current = null;
+            document.removeEventListener('mousemove', onMove);
+            document.removeEventListener('mouseup', onUp);
+        };
+        document.addEventListener('mousemove', onMove);
+        document.addEventListener('mouseup', onUp);
+    }, [panelPos, setPanelPos]);
+    return { isDragging, handleDragStart };
+}
+//# sourceMappingURL=use-panel-drag.js.map

package/dist/use-panel-drag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-panel-drag.js","sourceRoot":"","sources":["../use-panel-drag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEtD,MAAM,UAAU,YAAY,CAC1B,QAAkC,EAClC,WAAoD;IAEpD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpD,MAAM,OAAO,GAAG,MAAM,CAKZ,IAAI,CAAC,CAAC;IAEhB,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,CAAmB,EAAE,EAAE;QACtB,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,aAAa,CAAC,IAAI,CAAC,CAAC;QACpB,OAAO,CAAC,OAAO,GAAG;YAChB,MAAM,EAAE,CAAC,CAAC,OAAO;YACjB,MAAM,EAAE,CAAC,CAAC,OAAO;YACjB,SAAS,EAAE,QAAQ,CAAC,CAAC;YACrB,QAAQ,EAAE,QAAQ,CAAC,CAAC;SACrB,CAAC;QACF,MAAM,MAAM,GAAG,CAAC,EAAc,EAAE,EAAE;YAChC,IAAI,CAAC,OAAO,CAAC,OAAO;gBAAE,OAAO;YAC7B,MAAM,EAAE,GAAG,EAAE,CAAC,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC;YAC/C,MAAM,EAAE,GAAG,EAAE,CAAC,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC;YAC/C,WAAW,CAAC;gBACV,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,UAAU,GAAG,GAAG,EAAE,OAAO,CAAC,OAAO,CAAC,SAAS,GAAG,EAAE,CAAC,CAAC;gBACjF,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,WAAW,GAAG,EAAE,EAAE,OAAO,CAAC,OAAO,CAAC,QAAQ,GAAG,EAAE,CAAC,CAAC;aACjF,CAAC,CAAC;QACL,CAAC,CAAC;QACF,MAAM,IAAI,GAAG,GAAG,EAAE;YAChB,aAAa,CAAC,KAAK,CAAC,CAAC;YACrB,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC;YACvB,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;YAClD,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;QAChD,CAAC,CAAC;QACF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;QAC/C,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;IAC7C,CAAC,EACD,CAAC,QAAQ,EAAE,WAAW,CAAC,CACxB,CAAC;IAEF,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,CAAC;AACzC,CAAC"}

package/package.json

@@ -1,9 +1,14 @@
 {
   "name": "@stsgs1980/fab-inspector",
-  "version": "3.4.1",
+  "version": "3.5.0",
   "description": "Visual element inspector for Next.js dev mode — GitHub Dark themed, with SyntaxHighlighter and Box-model visualization.",
   "license": "MIT",
   "author": "STS",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/stsgs1980/FabInspector.git"
@@ -25,6 +30,8 @@
     "react-syntax-highlighter": ">=15.0.0"
   },
   "scripts": {
+    "build": "tsc -p tsconfig.build.json",
+    "prepublishOnly": "npm run build",
     "install:inspector": "bash scripts/install.sh",
     "uninstall:inspector": "bash scripts/uninstall.sh",
     "update:inspector": "bash scripts/update.sh",
@@ -33,23 +40,32 @@
     "typecheck": "tsc --noEmit"
   },
   "exports": {
-    ".": "./index.ts",
-    "./types": "./types.ts",
-    "./api/source": "./api-source-route.ts",
-    "./plugins/data-src-plugin": "./plugins/data-src-plugin.ts",
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./types": {
+      "types": "./dist/types.d.ts",
+      "default": "./dist/types.js"
+    },
+    "./api/source": {
+      "types": "./dist/api-source-route.d.ts",
+      "default": "./dist/api-source-route.js"
+    },
+    "./plugins/data-src-plugin": {
+      "types": "./dist/plugins/data-src-plugin.d.ts",
+      "default": "./dist/plugins/data-src-plugin.js"
+    },
     "./package.json": "./package.json"
   },
   "bin": {
     "fab-inspector": "./cli/init.mjs"
   },
   "files": [
-    "*.ts",
-    "*.tsx",
-    "plugins/",
+    "dist/",
     "cli/",
     "README.md"
   ],
-  "sideEffects": false,
   "publishConfig": {
     "access": "public"
   }

package/api-source-route.ts

@@ -1,60 +0,0 @@
-// Шаблон API-роута для установки.
-// В проекте-потребителе создайте src/app/api/source/route.ts:
-//   export { GET } from '@stsgs1980/fab-inspector/api/source';
-// Либо, если модуль подключён как локальный путь:
-//   export { GET } from '@/components/inspector/api-source-route';
-
-import { NextRequest, NextResponse } from 'next/server';
-import { readFile } from 'fs/promises';
-import { resolve } from 'path';
-
-// process.cwd() в Next.js = корень проекта-потребителя.
-// Никаких '..' — иначе путь уходит за пределы проекта и isAllowed() всегда false.
-const PROJECT_ROOT = process.cwd();
-const ALLOWED_PREFIXES = [
-  resolve(PROJECT_ROOT, 'src/components/'),
-  resolve(PROJECT_ROOT, 'src/app/'),
-  resolve(PROJECT_ROOT, 'src/content/'),
-  resolve(PROJECT_ROOT, 'src/hooks/'),
-  resolve(PROJECT_ROOT, 'src/lib/'),
-];
-
-function isAllowed(filePath: string): boolean {
-  const resolved = resolve(PROJECT_ROOT, filePath);
-  return ALLOWED_PREFIXES.some((prefix) => resolved.startsWith(prefix));
-}
-
-export async function GET(request: NextRequest) {
-  const { searchParams } = new URL(request.url);
-  const file = searchParams.get('file');
-  const line = parseInt(searchParams.get('line') || '1', 10);
-  const ctx = parseInt(searchParams.get('ctx') || '8', 10);
-
-  if (!file || !isAllowed(file)) {
-    return NextResponse.json({ error: 'File not allowed' }, { status: 403 });
-  }
-
-  try {
-    const filePath = resolve(PROJECT_ROOT, file);
-    const content = await readFile(filePath, 'utf-8');
-    const lines = content.split('\n');
-
-    const start = Math.max(0, line - 1 - ctx);
-    const end = Math.min(lines.length, line - 1 + ctx + 1);
-    const snippet = lines.slice(start, end);
-    const startLine = start + 1;
-
-    return NextResponse.json({
-      file,
-      line,
-      totalLines: lines.length,
-      snippet: {
-        startLine,
-        lines: snippet,
-        highlightLine: line,
-      },
-    });
-  } catch {
-    return NextResponse.json({ error: 'File not found' }, { status: 404 });
-  }
-}