@lego-build/plugins 0.0.3 → 0.0.10

package/dist/react.d.ts

@@ -0,0 +1,7 @@
+/**
+ * React component that initializes the iframe bridge.
+ * Use this in Next.js App Router layouts.
+ */
+declare function IframeBridge(): null;
+
+export { IframeBridge, IframeBridge as default };

package/dist/react.js

@@ -0,0 +1,18 @@
+"use client";
+import {
+  initIframeBridge
+} from "./chunk-FJKEG5SO.js";
+
+// src/react.tsx
+import { useEffect } from "react";
+function IframeBridge() {
+  useEffect(() => {
+    initIframeBridge();
+  }, []);
+  return null;
+}
+var react_default = IframeBridge;
+export {
+  IframeBridge,
+  react_default as default
+};

package/dist/vite-plugin.d.ts

@@ -0,0 +1,16 @@
+import { Plugin } from 'vite';
+
+interface SourceLocatorOptions {
+    /**
+     * Patterns to exclude from source location injection
+     * @default ['node_modules', 'dist', 'build']
+     */
+    exclude?: string[];
+}
+/**
+ * Vite plugin that adds data-locator-path and data-locator-line attributes
+ * to JSX elements for inline editing support.
+ */
+declare function sourceLocator(options?: SourceLocatorOptions): Plugin;
+
+export { type SourceLocatorOptions, sourceLocator as default, sourceLocator };

package/dist/vite-plugin.js

@@ -0,0 +1,103 @@
+// src/vite-plugin.ts
+import MagicString from "magic-string";
+import path from "path";
+function sourceLocator(options = {}) {
+  const { exclude = ["node_modules", "dist", "build"] } = options;
+  let root = "";
+  return {
+    name: "lego-source-locator",
+    enforce: "pre",
+    configResolved(config) {
+      root = config.root;
+    },
+    transform(code, id) {
+      if (!id.match(/\.[tj]sx$/)) {
+        return null;
+      }
+      for (const pattern of exclude) {
+        if (id.includes(pattern)) {
+          return null;
+        }
+      }
+      const relativePath = path.relative(root, id);
+      const s = new MagicString(code);
+      let hasChanges = false;
+      const jsxOpeningTagRegex = /<([A-Z][a-zA-Z0-9]*|[a-z][a-z0-9-]*)\s*(?=[^>]*>)/g;
+      const lines = code.split("\n");
+      const lineStarts = [0];
+      for (let i = 0; i < lines.length - 1; i++) {
+        lineStarts.push(lineStarts[i] + lines[i].length + 1);
+      }
+      const getLineNumber = (index) => {
+        for (let i = lineStarts.length - 1; i >= 0; i--) {
+          if (lineStarts[i] <= index) {
+            return i + 1;
+          }
+        }
+        return 1;
+      };
+      let match;
+      while ((match = jsxOpeningTagRegex.exec(code)) !== null) {
+        const tagStart = match.index;
+        const tagName = match[1];
+        if (!tagName || tagName === "Fragment") {
+          continue;
+        }
+        let depth = 1;
+        let i = tagStart + match[0].length;
+        let inString = null;
+        let inExpression = 0;
+        while (i < code.length && depth > 0) {
+          const char = code[i];
+          if (inString) {
+            if (char === inString && code[i - 1] !== "\\") {
+              inString = null;
+            }
+          } else if (inExpression > 0) {
+            if (char === "{") {
+              inExpression++;
+            } else if (char === "}") {
+              inExpression--;
+            } else if (char === '"' || char === "'" || char === "`") {
+              inString = char;
+            }
+          } else {
+            if (char === "{") {
+              inExpression++;
+            } else if (char === '"' || char === "'" || char === "`") {
+              inString = char;
+            } else if (char === ">") {
+              depth = 0;
+            } else if (char === "/" && code[i + 1] === ">") {
+              depth = 0;
+            }
+          }
+          i++;
+        }
+        if (depth === 0) {
+          const insertPos = code[i - 2] === "/" ? i - 2 : i - 1;
+          const lineNum = getLineNumber(tagStart);
+          const tagContent = code.slice(tagStart, i);
+          if (tagContent.includes("data-locator-path")) {
+            continue;
+          }
+          const attrs = ` data-locator-path="${relativePath}" data-locator-line="${lineNum}"`;
+          s.appendLeft(insertPos, attrs);
+          hasChanges = true;
+        }
+      }
+      if (!hasChanges) {
+        return null;
+      }
+      return {
+        code: s.toString(),
+        map: s.generateMap({ hires: true })
+      };
+    }
+  };
+}
+var vite_plugin_default = sourceLocator;
+export {
+  vite_plugin_default as default,
+  sourceLocator
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lego-build/plugins",
-  "version": "0.0.3",
+  "version": "0.0.10",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -9,47 +9,48 @@
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js"
     },
-    "./webpack-loader": {
-      "import": "./dist/webpack-loader.js"
+    "./auto": {
+      "import": "./dist/auto.js"
     },
-    "./next": {
-      "import": "./dist/webpack-loader.js"
+    "./react": {
+      "types": "./dist/react.d.ts",
+      "import": "./dist/react.js"
+    },
+    "./vite-plugin": {
+      "types": "./dist/vite-plugin.d.ts",
+      "import": "./dist/vite-plugin.js"
+    },
+    "./babel-plugin": {
+      "types": "./dist/babel-plugin.d.ts",
+      "import": "./dist/babel-plugin.js"
     }
   },
-  "files": [
-    "dist"
-  ],
-  "scripts": {
-    "build": "tsup src/index.ts src/webpack-loader.ts --format esm --dts",
-    "dev": "tsup src/index.ts src/webpack-loader.ts --format esm --dts --watch"
-  },
   "dependencies": {
-    "@babel/generator": "^7.27.0",
-    "@babel/parser": "^7.27.0",
-    "@babel/traverse": "^7.27.0",
-    "@babel/types": "^7.27.0",
-    "micromatch": "^4.0.5"
-  },
-  "devDependencies": {
-    "@types/babel__generator": "^7.27.0",
-    "@types/babel__traverse": "^7.20.7",
-    "@types/micromatch": "^4.0.9",
-    "@types/node": "^22",
-    "@types/webpack": "^5.28.5",
-    "tsup": "^8.0.0",
-    "typescript": "^5.0.0",
-    "webpack": "^5.98.0"
+    "magic-string": "^0.30.0"
   },
   "peerDependencies": {
-    "vite": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0",
-    "webpack": "^5.0.0"
+    "react": ">=18"
   },
   "peerDependenciesMeta": {
-    "vite": {
-      "optional": true
-    },
-    "webpack": {
+    "react": {
       "optional": true
     }
+  },
+  "devDependencies": {
+    "@babel/core": "^7.24.0",
+    "@types/babel__core": "^7.20.0",
+    "@types/react": "^18",
+    "react": "^18",
+    "tsup": "^8.0.0",
+    "typescript": "^5.0.0",
+    "vite": "^5.0.0"
+  },
+  "scripts": {
+    "build": "tsup src/index.ts src/auto.ts src/react.tsx src/vite-plugin.ts src/babel-plugin.ts --format esm --dts --external react",
+    "dev": "tsup src/index.ts src/auto.ts src/react.tsx src/vite-plugin.ts src/babel-plugin.ts --format esm --dts --external react --watch",
+    "publish:patch": "./scripts/publish.sh patch",
+    "publish:minor": "./scripts/publish.sh minor",
+    "publish:major": "./scripts/publish.sh major",
+    "publish:only": "./scripts/publish.sh none"
   }
-}
+}

package/dist/webpack-loader.d.ts

@@ -1,25 +0,0 @@
-interface SourceLocatorLoaderOptions {
-    /** Prefix for data attributes (default: 'locator') */
-    prefix?: string;
-    /** Custom filter for tags */
-    filterTag?: string[] | ((tag: string) => boolean);
-}
-/**
- * Webpack loader for adding source locator attributes to JSX elements.
- * Use in next.config.js with webpack config.
- */
-declare function sourceLocatorLoader(this: any, source: string): string;
-/**
- * Helper to add source locator loader to Next.js webpack config.
- *
- * @example
- * // next.config.mjs
- * import { withSourceLocator } from '@lego-build/plugins/next';
- *
- * export default withSourceLocator({
- *   // your next config
- * });
- */
-declare function withSourceLocator(nextConfig?: any, loaderOptions?: SourceLocatorLoaderOptions): any;
-
-export { type SourceLocatorLoaderOptions, sourceLocatorLoader as default, withSourceLocator };

package/dist/webpack-loader.js

@@ -1,198 +0,0 @@
-// src/webpack-loader.ts
-import path from "path";
-import { createRequire } from "module";
-import * as parser from "@babel/parser";
-import traverse from "@babel/traverse";
-import generate from "@babel/generator";
-import * as t from "@babel/types";
-var require2 = createRequire(import.meta.url);
-var HTML_TAGS = [
-  "div",
-  "span",
-  "p",
-  "h1",
-  "h2",
-  "h3",
-  "h4",
-  "h5",
-  "h6",
-  "button",
-  "a",
-  "img",
-  "input",
-  "textarea",
-  "select",
-  "form",
-  "ul",
-  "ol",
-  "li",
-  "table",
-  "thead",
-  "tbody",
-  "tr",
-  "td",
-  "th",
-  "header",
-  "footer",
-  "nav",
-  "main",
-  "section",
-  "article",
-  "aside",
-  "label",
-  "strong",
-  "em",
-  "code",
-  "pre",
-  "blockquote"
-];
-var TEXT_TAGS = ["label", "span", "button", "p", "div", "h1", "h2", "h3", "h4", "h5", "h6"];
-function getWorkspaceRoot(filePath) {
-  let dir = path.resolve(filePath);
-  const { root } = path.parse(dir);
-  while (dir !== root) {
-    if (path.basename(dir) === "workspace") return dir;
-    dir = path.dirname(dir);
-  }
-  return path.resolve(process.cwd(), "..");
-}
-function shouldProcessTag(tagName, options) {
-  if (options.filterTag) {
-    if (Array.isArray(options.filterTag)) {
-      return options.filterTag.includes(tagName);
-    }
-    return options.filterTag(tagName);
-  }
-  return HTML_TAGS.includes(tagName.toLowerCase());
-}
-function getElementTextContent(nodePath) {
-  const parent = nodePath.parent;
-  if (!t.isJSXElement(parent)) return "";
-  let text = "";
-  let hasExpression = false;
-  for (const child of parent.children) {
-    if (t.isJSXText(child)) {
-      text += child.value;
-    } else if (t.isJSXExpressionContainer(child)) {
-      hasExpression = true;
-    }
-  }
-  return hasExpression ? "" : text.trim();
-}
-function transformJSX(code, filePath, prefix, options) {
-  const ast = parser.parse(code, {
-    sourceType: "module",
-    plugins: ["jsx", "typescript", "classProperties", "decorators-legacy"]
-  });
-  const workspaceRoot = getWorkspaceRoot(filePath);
-  const relativePath = path.relative(workspaceRoot, filePath);
-  let hasChanges = false;
-  traverse(ast, {
-    JSXOpeningElement(nodePath) {
-      const node = nodePath.node;
-      const hasLocatorAttr = node.attributes.some(
-        (attr) => t.isJSXAttribute(attr) && t.isJSXIdentifier(attr.name) && attr.name.name.startsWith(`data-${prefix}`)
-      );
-      if (hasLocatorAttr) return;
-      if (t.isJSXIdentifier(node.name) && node.name.name === "Fragment") return;
-      if (t.isJSXMemberExpression(node.name) && t.isJSXIdentifier(node.name.object) && node.name.object.name === "React" && t.isJSXIdentifier(node.name.property) && node.name.property.name === "Fragment")
-        return;
-      let tagName = "";
-      if (t.isJSXIdentifier(node.name)) {
-        tagName = node.name.name;
-      }
-      if (!shouldProcessTag(tagName, options)) return;
-      const line = node.loc?.start.line;
-      const column = node.loc?.start.column;
-      if (!line || column === void 0) return;
-      const textContent = TEXT_TAGS.includes(tagName.toLowerCase()) ? getElementTextContent(nodePath) : "";
-      const attributes = [
-        t.jsxAttribute(t.jsxIdentifier(`data-${prefix}-path`), t.stringLiteral(relativePath)),
-        t.jsxAttribute(t.jsxIdentifier(`data-${prefix}-line`), t.stringLiteral(String(line))),
-        t.jsxAttribute(t.jsxIdentifier(`data-${prefix}-column`), t.stringLiteral(String(column))),
-        t.jsxAttribute(t.jsxIdentifier(`data-${prefix}-tag`), t.stringLiteral(tagName))
-      ];
-      if (textContent) {
-        attributes.push(
-          t.jsxAttribute(
-            t.jsxIdentifier(`data-${prefix}-text`),
-            t.stringLiteral(textContent)
-          )
-        );
-      }
-      const spreadIndex = node.attributes.findIndex((attr) => t.isJSXSpreadAttribute(attr));
-      if (spreadIndex === -1) {
-        node.attributes.push(...attributes);
-      } else {
-        node.attributes.splice(spreadIndex, 0, ...attributes);
-      }
-      hasChanges = true;
-    }
-  });
-  if (!hasChanges) return null;
-  const result = generate(ast, {}, code);
-  return result.code;
-}
-function sourceLocatorLoader(source) {
-  const options = this.getOptions() || {};
-  const { prefix = "locator" } = options;
-  if (process.env.NODE_ENV !== "development") {
-    return source;
-  }
-  const ext = path.extname(this.resourcePath);
-  if (![".jsx", ".tsx", ".js", ".ts"].includes(ext)) {
-    return source;
-  }
-  if (this.resourcePath.includes("node_modules")) {
-    return source;
-  }
-  try {
-    const result = transformJSX(source, this.resourcePath, prefix, options);
-    return result || source;
-  } catch (error) {
-    console.error(`[source-locator] Error transforming ${this.resourcePath}:`, error);
-    return source;
-  }
-}
-function withSourceLocator(nextConfig = {}, loaderOptions = {}) {
-  return {
-    ...nextConfig,
-    webpack(config, options) {
-      if (options.dev) {
-        config.module.rules.push({
-          test: /\.(jsx|tsx|js|ts)$/,
-          exclude: /node_modules/,
-          use: [
-            {
-              loader: require2.resolve("@lego-build/plugins/webpack-loader"),
-              options: loaderOptions
-            }
-          ]
-        });
-        if (!options.isServer) {
-          const originalEntry = config.entry;
-          config.entry = async () => {
-            const entries = await (typeof originalEntry === "function" ? originalEntry() : originalEntry);
-            for (const entryName of Object.keys(entries)) {
-              if (Array.isArray(entries[entryName])) {
-                const bridgePath = require2.resolve("@lego-build/plugins");
-                if (!entries[entryName].includes(bridgePath)) {
-                  entries[entryName].unshift(bridgePath);
-                }
-              }
-            }
-            return entries;
-          };
-        }
-      }
-      if (typeof nextConfig.webpack === "function") {
-        return nextConfig.webpack(config, options);
-      }
-      return config;
-    }
-  };
-}
-export {
-  sourceLocatorLoader as default,
-  withSourceLocator
-};