@keak/sdk 1.0.9 → 2.0.0

package/src/plugins/webpack-loader-babel/index.js

@@ -1,6 +1,7 @@
 /**
  * Webpack loader that uses Babel to inject Keak source attributes into JSX
- * This runs BEFORE SWC compilation to add data-keak-src, data-keak-component, and data-keak-idx attributes
+ * Simplified version - runs BEFORE SWC compilation
+ * Only runs in development mode
  */
 
 const path = require('path');
@@ -9,38 +10,23 @@ const babelTraverse = require('@babel/traverse').default;
 const babelGenerator = require('@babel/generator').default;
 const t = require('@babel/types');
 
-let elementIndexMap = new Map(); // Track element index per file
-
 module.exports = function keakLoaderBabel(source) {
-  // Make loader cacheable for better performance
   this.cacheable(true);
 
   const resourcePath = this.resourcePath;
   const options = this.getOptions() || {};
-  const { projectRoot = process.cwd(), includeElementIndex = true, devWarnings = false } = options;
 
-  // Skip if not a JSX/TSX file
-  if (!/\.(jsx|tsx|js|ts)$/.test(resourcePath)) {
+  // Skip in production
+  if (process.env.NODE_ENV === 'production' && !options.forceProduction) {
     return source;
   }
 
-  // Skip files based on skip patterns
-  const skipPatterns = options.skipPatterns || [];
-  if (skipPatterns.some(pattern => {
-    const regex = typeof pattern === 'string' ? new RegExp(pattern) : pattern;
-    return regex.test(resourcePath);
-  })) {
+  // Skip if not a JSX/TSX file
+  if (!/\.(jsx|tsx|js|ts)$/.test(resourcePath)) {
     return source;
   }
 
   try {
-    console.log(`[keak-loader-pre] Processing ${path.relative(projectRoot || process.cwd(), resourcePath)} with Babel AST`);
-
-    // Reset element index for this file
-    if (includeElementIndex) {
-      elementIndexMap.set(resourcePath, 0);
-    }
-
     // Parse the source code
     const ast = babelParser.parse(source, {
       sourceType: 'module',
@@ -50,20 +36,15 @@ module.exports = function keakLoaderBabel(source) {
         'decorators-legacy',
         'classProperties',
         'objectRestSpread',
-        'functionBind',
-        'exportDefaultFrom',
-        'exportNamespaceFrom',
         'dynamicImport',
         'nullishCoalescingOperator',
-        'optionalChaining',
-        'topLevelAwait'
+        'optionalChaining'
       ]
     });
 
-    let elementCount = 0;
     let skipFile = false;
 
-    // First pass: Check for next/font imports (Babel/SWC conflict)
+    // Check for next/font imports (Babel/SWC conflict)
     babelTraverse(ast, {
       ImportDeclaration(importPath) {
         const source = importPath.node.source.value;
@@ -75,125 +56,70 @@ module.exports = function keakLoaderBabel(source) {
     });
 
     if (skipFile) {
-      if (devWarnings) {
-        console.log(`[keak-loader-pre] ⚠️ Skipping ${path.relative(projectRoot || process.cwd(), resourcePath)} (contains next/font)`);
-      }
       return source;
     }
 
-    // Second pass: Transform JSX elements
+    // Transform JSX elements
     babelTraverse(ast, {
       JSXOpeningElement(nodePath) {
         const node = nodePath.node;
 
-        // Skip if element already has keak source attribute
-        const hasKeakSrc = node.attributes.some(attr =>
+        // Skip if already has keak attributes
+        const hasKeakAttr = node.attributes.some(attr =>
           t.isJSXAttribute(attr) &&
           t.isJSXIdentifier(attr.name) &&
-          attr.name.name === 'data-keak-src'
+          (attr.name.name === 'data-keak-file' || attr.name.name === 'data-keak-src')
         );
 
-        if (hasKeakSrc) {
+        if (hasKeakAttr || !node.loc) {
           return;
         }
 
-        // Get source location
-        const loc = node.loc;
-        if (!loc) return;
-
-        // Create relative path from project root
-        const relativePath = path.relative(projectRoot || process.cwd(), resourcePath).replace(/\\/g, '/');
-        
-        // Create source location string: "file:line:column"
-        const sourceLocation = `${relativePath}:${loc.start.line}:${loc.start.column}`;
-        
-        // Get element name
-        let tagName = '';
-        let componentName = '';
-
-        if (t.isJSXIdentifier(node.name)) {
-          tagName = node.name.name;
-          // Try to find component name from parent scope
-          const parentFunction = nodePath.getFunctionParent();
-          if (parentFunction && parentFunction.isFunctionDeclaration()) {
-            componentName = parentFunction.node.id?.name || '';
-          } else if (parentFunction && parentFunction.isArrowFunctionExpression()) {
-            const parentVar = parentFunction.getFunctionParent();
-            if (parentVar && parentVar.isVariableDeclarator() && t.isIdentifier(parentVar.node.id)) {
-              componentName = parentVar.node.id.name;
+        // Smart relative path detection
+        let sourceFile;
+        const srcParts = resourcePath.split('/src/');
+        if (srcParts.length > 1) {
+          sourceFile = 'src/' + srcParts[srcParts.length - 1];
+        } else {
+          const appParts = resourcePath.split('/app/');
+          if (appParts.length > 1) {
+            sourceFile = 'app/' + appParts[appParts.length - 1];
+          } else {
+            const compParts = resourcePath.split('/components/');
+            if (compParts.length > 1) {
+              sourceFile = 'components/' + compParts[compParts.length - 1];
+            } else {
+              sourceFile = path.relative(process.cwd(), resourcePath);
             }
           }
-        } else if (t.isJSXMemberExpression(node.name)) {
-          tagName = node.name.property.name;
-        }
-
-        // Only instrument DOM elements (lowercase) or all elements if configured
-        const isDOMElement = /^[a-z]/.test(tagName);
-        
-        if (!isDOMElement && !options.instrumentComponents) {
-          return;
         }
 
-        // Get element index if enabled
-        let elementIdx = null;
-        if (includeElementIndex) {
-          const currentIndex = elementIndexMap.get(resourcePath) || 0;
-          elementIdx = currentIndex;
-          elementIndexMap.set(resourcePath, currentIndex + 1);
-        }
+        const { line } = node.loc.start;
 
-        // Create attributes to inject
-        const attributesToAdd = [
+        // Add data-keak-file and data-keak-line attributes
+        node.attributes.push(
+          t.jsxAttribute(
+            t.jsxIdentifier('data-keak-file'),
+            t.stringLiteral(sourceFile)
+          ),
           t.jsxAttribute(
-            t.jsxIdentifier('data-keak-src'),
-            t.stringLiteral(sourceLocation)
+            t.jsxIdentifier('data-keak-line'),
+            t.stringLiteral(String(line))
           )
-        ];
-
-        // Add component name if available
-        if (componentName) {
-          attributesToAdd.push(
-            t.jsxAttribute(
-              t.jsxIdentifier('data-keak-component'),
-              t.stringLiteral(componentName)
-            )
-          );
-        }
-
-        // Add element index if enabled
-        if (elementIdx !== null) {
-          attributesToAdd.push(
-            t.jsxAttribute(
-              t.jsxIdentifier('data-keak-idx'),
-              t.stringLiteral(String(elementIdx))
-            )
-          );
-        }
-
-        // Add attributes to the node
-        node.attributes.push(...attributesToAdd);
-        elementCount++;
+        );
       }
     });
 
-    // Generate the transformed code
+    // Generate transformed code
     const output = babelGenerator(ast, {
       retainLines: false,
-      compact: false,
-      sourceMaps: false
+      compact: false
     }, source);
 
-    if (elementCount > 0) {
-      console.log(`[keak-loader-pre] ✓ Injected attributes into ${elementCount} elements in ${path.relative(projectRoot || process.cwd(), resourcePath)}`);
-    }
-
     return output.code;
   } catch (error) {
-    // If transformation fails, return original source
-    console.error(`[keak-loader-pre] ❌ Error processing ${resourcePath}:`, error.message);
-    if (devWarnings) {
-      console.error('[keak-loader-pre] Stack:', error.stack);
-    }
+    // Return original source on error
+    console.error(`[keak-loader] Error processing ${resourcePath}:`, error.message);
     return source;
   }
-};
+};