via-icons/scripts/generateIcons.js

import fs from "fs";
import path from "path";
import { fileURLToPath } from "url";

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

function toPascalCase(str) {
  return str.replace(/(^\w|-\w)/g, (match) =>
    match.replace(/-/, "").toUpperCase()
  );
}

function parseAttributes(attributeString) {
  const attributes = {};
  attributeString.replace(/(\w+)=["']([^"']*)["']/g, (match, name, value) => {
    const newName = name.replace(/-([a-z])/g, (g) => g[1].toUpperCase());
    if (newName !== "xmlns" && newName !== "hidden" && newName !== "slot") {
      attributes[newName] = value;
    }
    return match;
  });
  return attributes;
}

function parseSvgContent(svgContent) {
  const svgMatch = svgContent.match(/<svg\s+([^>]+)>([\s\S]*?)<\/svg>/);
  if (!svgMatch) return null;

  const [_, svgAttributes, svgInner] = svgMatch;
  const svgData = {
    tag: "svg",
    attr: parseAttributes(svgAttributes),
    child: parseChildren(svgInner),
  };

  return svgData;
}

function parseChildren(innerContent) {
  const children = [];
  innerContent.replace(
    /<(\w+)\s+([^>]+)>([\s\S]*?)<\/\1>/g,
    (match, tag, attributes, inner) => {
      const child = {
        tag,
        attr: parseAttributes(attributes),
        child: parseChildren(inner),
      };
      children.push(child);
      return match;
    }
  );

  innerContent.replace(/<(\w+)\s+([^>]+)\/>/g, (match, tag, attributes) => {
    const child = {
      tag,
      attr: parseAttributes(attributes),
      child: [],
    };
    children.push(child);
    return match;
  });

  return children;
}

function generateIconComponents(prefix, folderPath, outputPath) {
  const files = fs.readdirSync(folderPath);
  let outputContent = `// THIS FILE IS AUTO GENERATED\nimport { GenIcon, IconBaseProps } from '../lib';\n\n`;

  files.forEach((file) => {
    if (path.extname(file) === ".svg") {
      const iconName = path.basename(file, ".svg");
      const svgContent = fs.readFileSync(path.join(folderPath, file), "utf8");
      const svgData = parseSvgContent(svgContent);
      if (svgData) {
        const componentName = `${prefix}${toPascalCase(iconName)}`;
        outputContent += `export const ${componentName} = (props: IconBaseProps) => GenIcon(${JSON.stringify(
          svgData
        )})(props);\n\n`;
      }
    }
  });

  fs.mkdirSync(path.dirname(outputPath), { recursive: true });
  fs.writeFileSync(outputPath, outputContent);
}

generateIconComponents(
  "Fa",
  path.join(__dirname, "..", "src", "svgs", "fa"),
  path.join(__dirname, "..", "src", "fa", "index.ts")
);

generateIconComponents(
  "Fc",
  path.join(__dirname, "..", "src", "svgs", "fc"),
  path.join(__dirname, "..", "src", "fc", "index.ts")
);

generateIconComponents(
  "Rx",
  path.join(__dirname, "..", "src", "svgs", "rx"),
  path.join(__dirname, "..", "src", "rx", "index.ts")
);

generateIconComponents(
  "Tfi",
  path.join(__dirname, "..", "src", "svgs", "tfi"),
  path.join(__dirname, "..", "src", "tfi", "index.ts")
);