html-component-engine 0.1.1 → 0.1.3

package/src/engine/utils.js

@@ -1,74 +1,74 @@
-// Utility functions for the HTML Component Engine
-
-/**
- * Parse a self-closing Component tag to extract attributes
- * @param {string} tag - The full component tag, e.g., <Component src="Button" text="Click" />
- * @returns {object|null} - Object with attribute key-value pairs, or null if invalid
- */
-export function parseSelfClosingComponentTag(tag) {
-  const regex = /<Component\s+([^>]+)\s*\/>/;
-  const match = tag.match(regex);
-  if (!match) return null;
-
-  const attrs = {};
-  // Support hyphenated attributes like data-test, aria-label
-  const attrRegex = /([\w-]+)="([^"]*)"/g;
-  let attrMatch;
-  while ((attrMatch = attrRegex.exec(match[1])) !== null) {
-    attrs[attrMatch[1]] = attrMatch[2];
-  }
-  return attrs;
-}
-
-/**
- * Parse a Component tag to extract attributes (legacy alias)
- * @param {string} tag - The full component tag
- * @returns {object|null} - Object with attribute key-value pairs, or null if invalid
- */
-export function parseComponentTag(tag) {
-  return parseSelfClosingComponentTag(tag);
-}
-
-/**
- * Parse variants from component HTML
- * Looks for <!-- variants: primary=class1 class2, secondary=class3 -->
- * @param {string} html - The component HTML
- * @returns {object} - Map of variant name to classes
- */
-export function parseVariants(html) {
-  const variants = {};
-  // Match HTML comment with variants - use non-greedy match
-  const regex = /<!--\s*variants:\s*(.+?)\s*-->/;
-  const match = html.match(regex);
-  if (match) {
-    const variantsStr = match[1];
-    const variantPairs = variantsStr.split(',');
-    for (const pair of variantPairs) {
-      const [name, ...classParts] = pair.split('=');
-      const classes = classParts.join('='); // Handle = in class names (unlikely but safe)
-      if (name && classes) {
-        variants[name.trim()] = classes.trim();
-      }
-    }
-  }
-  return variants;
-}
-
-/**
- * Clean unused placeholders from compiled HTML
- * @param {string} html - The compiled HTML
- * @returns {string} - Cleaned HTML
- */
-export function cleanUnusedPlaceholders(html) {
-  // Remove any remaining {{ ... }} placeholders
-  return html.replace(/\{\{\s*\w+\s*\}\}/g, '');
-}
-
-/**
- * Normalize path separators to forward slashes
- * @param {string} p - Path to normalize
- * @returns {string} - Normalized path
- */
-export function normalizePath(p) {
-  return p.replace(/\\/g, '/');
-}
+// Utility functions for the HTML Component Engine
+
+/**
+ * Parse a self-closing Component tag to extract attributes
+ * @param {string} tag - The full component tag, e.g., <Component src="Button" text="Click" />
+ * @returns {object|null} - Object with attribute key-value pairs, or null if invalid
+ */
+export function parseSelfClosingComponentTag(tag) {
+  const regex = /<Component\s+([^>]+)\s*\/>/;
+  const match = tag.match(regex);
+  if (!match) return null;
+
+  const attrs = {};
+  // Support hyphenated attributes like data-test, aria-label
+  const attrRegex = /([\w-]+)="([^"]*)"/g;
+  let attrMatch;
+  while ((attrMatch = attrRegex.exec(match[1])) !== null) {
+    attrs[attrMatch[1]] = attrMatch[2];
+  }
+  return attrs;
+}
+
+/**
+ * Parse a Component tag to extract attributes (legacy alias)
+ * @param {string} tag - The full component tag
+ * @returns {object|null} - Object with attribute key-value pairs, or null if invalid
+ */
+export function parseComponentTag(tag) {
+  return parseSelfClosingComponentTag(tag);
+}
+
+/**
+ * Parse variants from component HTML
+ * Looks for <!-- variants: primary=class1 class2, secondary=class3 -->
+ * @param {string} html - The component HTML
+ * @returns {object} - Map of variant name to classes
+ */
+export function parseVariants(html) {
+  const variants = {};
+  // Match HTML comment with variants - use non-greedy match
+  const regex = /<!--\s*variants:\s*(.+?)\s*-->/;
+  const match = html.match(regex);
+  if (match) {
+    const variantsStr = match[1];
+    const variantPairs = variantsStr.split(',');
+    for (const pair of variantPairs) {
+      const [name, ...classParts] = pair.split('=');
+      const classes = classParts.join('='); // Handle = in class names (unlikely but safe)
+      if (name && classes) {
+        variants[name.trim()] = classes.trim();
+      }
+    }
+  }
+  return variants;
+}
+
+/**
+ * Clean unused placeholders from compiled HTML
+ * @param {string} html - The compiled HTML
+ * @returns {string} - Cleaned HTML
+ */
+export function cleanUnusedPlaceholders(html) {
+  // Remove any remaining {{ ... }} placeholders
+  return html.replace(/\{\{\s*\w+\s*\}\}/g, '');
+}
+
+/**
+ * Normalize path separators to forward slashes
+ * @param {string} p - Path to normalize
+ * @returns {string} - Normalized path
+ */
+export function normalizePath(p) {
+  return p.replace(/\\/g, '/');
+}

package/src/index.js

@@ -198,8 +198,8 @@ export default function htmlComponentEngine(options = {}) {
         console.log(`   ✓ Compiled: ${htmlFile} → ${outputFileName}`);
       }
 
-      // Copy ALL assets to dist/assets
-      await copyAllAssets(assetsRoot, this);
+      // Copy ALL non-HTML files from src/ to dist/ (excluding components/)
+      await copyAllNonComponentFiles(srcRoot, componentsDir, this);
     },
 
     /**
@@ -247,33 +247,62 @@ async function getHtmlFiles(dir, base = '', componentsDir = 'components') {
 }
 
 /**
- * Copy ALL assets to dist/assets/ directory
- * @param {string} assetsPath - Assets directory path
+ * Copy ALL non-HTML files under src/ to dist/ preserving paths
+ * Excludes any directory named componentsDir (defaults to "components").
+ * @param {string} srcPath - src directory path
+ * @param {string} componentsDir - directory name to exclude
  * @param {object} context - Rollup plugin context
  */
-async function copyAllAssets(assetsPath, context) {
-  try {
-    await fs.access(assetsPath);
-  } catch {
-    console.log('   No assets directory found, skipping asset copy');
-    return;
-  }
+async function copyAllNonComponentFiles(srcPath, componentsDir = 'components', context) {
+  const allFiles = await getAllFilesExcludingDir(srcPath, componentsDir);
 
-  const assetFiles = await getAllFiles(assetsPath);
+  let copiedCount = 0;
+  for (const file of allFiles) {
+    const relativePath = path.relative(srcPath, file).replace(/\\/g, '/');
 
-  console.log(`   Copying ${assetFiles.length} asset file(s) to assets/`);
+    // HTML is handled separately (compiled + emitted)
+    if (relativePath.toLowerCase().endsWith('.html')) continue;
 
-  for (const file of assetFiles) {
-    const relativePath = path.relative(assetsPath, file);
     const content = await fs.readFile(file);
-
-    // Copy to dist/assets/ subdirectory
     context.emitFile({
       type: 'asset',
-      fileName: `assets/${relativePath.replace(/\\/g, '/')}`,
+      fileName: relativePath,
       source: content,
     });
+    copiedCount++;
   }
+
+  console.log(`   Copied ${copiedCount} non-HTML file(s)`);
+}
+
+/**
+ * Get all files recursively from a directory, excluding a directory name.
+ * @param {string} dir - Directory to search
+ * @param {string} excludedDirName - Directory name to exclude (e.g., "components")
+ * @returns {Promise<string[]>} - Array of absolute file paths
+ */
+async function getAllFilesExcludingDir(dir, excludedDirName) {
+  const files = [];
+
+  try {
+    const entries = await fs.readdir(dir, { withFileTypes: true });
+
+    for (const entry of entries) {
+      const fullPath = path.join(dir, entry.name);
+
+      if (entry.isDirectory()) {
+        if (entry.name === excludedDirName) continue;
+        const subFiles = await getAllFilesExcludingDir(fullPath, excludedDirName);
+        files.push(...subFiles);
+      } else {
+        files.push(fullPath);
+      }
+    }
+  } catch (error) {
+    console.warn(`Could not read directory ${dir}: ${error.message}`);
+  }
+
+  return files;
 }
 
 /**