@moamfar/icon-pack 1.0.3 → 1.0.4

package/readme.js

@@ -1,13 +1,15 @@
 const fs = require("fs");
 const path = require("path");
 
-// --- CONFIGURATION ---
+/* ---------------- CONFIG ---------------- */
+
 const packageJsonPath = path.join(__dirname, "package.json");
 const generatedIndexPath = path.join(__dirname, "src", "generated", "index.ts");
 const readmeOutputPath = path.join(__dirname, "README.md");
+const rawDir = path.join(__dirname, "src", "raw");
 
-// Define all weight directories
 const WEIGHTS = ["bold", "boldduotone", "broken", "lineduotone", "linear", "outline"];
+
 const weightConfigs = {
   bold: { dir: "bold", label: "Bold" },
   boldduotone: { dir: "boldduotone", label: "Bold Duotone" },
@@ -17,453 +19,202 @@ const weightConfigs = {
   outline: { dir: "outline", label: "Outline" },
 };
 
-// UPDATE THESE VALUES FOR YOUR REPOSITORY
-const GITHUB_USERNAME = "moamfar"; // Replace with your GitHub username
-const GITHUB_REPO_NAME = "icon-pack"; // Replace with your repository name
-const GITHUB_BRANCH = "main"; // Or "master" depending on your default branch
+const GITHUB_USERNAME = "moamfar";
+const GITHUB_REPO_NAME = "icon-pack";
+const GITHUB_BRANCH = "main";
 
-// --- UTILITIES ---
+/* ---------------- UTILITIES ---------------- */
 
-// 1. Parse index.ts to get component names
+// Parse generated index.ts exports
 function getExportedComponents(indexPath) {
-  if (!fs.existsSync(indexPath)) {
-    console.warn("⚠️ Generated index.ts not found. Run your build script first.");
-    return [];
-  }
+  if (!fs.existsSync(indexPath)) return [];
+
   const content = fs.readFileSync(indexPath, "utf-8");
   const regex = /export\s+{\s*(\w+)\s*}\s+from\s+["'].+["'];/g;
+
   const components = [];
   let match;
-  while ((match = regex.exec(content)) !== null) {
+  while ((match = regex.exec(content))) {
     components.push(match[1]);
   }
+
   return components.sort();
 }
 
-// 2. Get base component name (without weight suffix)
-function getBaseComponentName(componentName) {
-  // Remove weight suffixes if they exist
-  for (const weight of WEIGHTS) {
-    const suffix = weight.charAt(0).toUpperCase() + weight.slice(1);
-    if (componentName.endsWith(suffix)) {
-      return componentName.slice(0, -suffix.length);
-    }
-  }
-  return componentName;
+// Normalize names (remove spaces, lowercase)
+function normalizeName(str) {
+  return str.replace(/\s+/g, "").toLowerCase();
 }
 
-// 3. Find SVG file for a component and weight
-function findSvgFile(baseName, weight) {
-  const weightDir = path.join(__dirname, "src", "raw", weightConfigs[weight].dir);
+// Find icon and return GitHub RAW url
+function getGithubIconUrl(componentName, weight) {
+  const weightDir = path.join(rawDir, weightConfigs[weight].label);
+  if (!fs.existsSync(weightDir)) return null;
 
-  if (!fs.existsSync(weightDir)) {
-    return null;
-  }
+  const normalizedComponent = normalizeName(componentName);
 
-  // Common naming patterns
-  const candidates = [
-    `${baseName}.svg`,
-    `${baseName.toLowerCase()}.svg`,
-    `${baseName.charAt(0).toLowerCase() + baseName.slice(1)}.svg`,
-    `${baseName.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase()}.svg`,
-  ];
-
-  for (const filename of candidates) {
-    const fullPath = path.join(weightDir, filename);
-    if (fs.existsSync(fullPath)) {
-      return { weight, filename, path: fullPath };
-    }
-  }
+  const categories = fs.readdirSync(weightDir).filter((f) => fs.statSync(path.join(weightDir, f)).isDirectory());
 
-  return null;
-}
+  for (const category of categories) {
+    const categoryPath = path.join(weightDir, category);
+    const files = fs.readdirSync(categoryPath).filter((f) => f.toLowerCase().endsWith(".svg"));
 
-// 4. Get GitHub URL for an SVG
-function getSvgGitHubUrl(baseName, weight) {
-  const svgFile = findSvgFile(baseName, weight);
-  if (!svgFile) {
-    return null;
-  }
+    for (const file of files) {
+      const normalizedFile = normalizeName(file.replace(".svg", ""));
 
-  return `https://raw.githubusercontent.com/${GITHUB_USERNAME}/${GITHUB_REPO_NAME}/${GITHUB_BRANCH}/src/raw/${weightConfigs[weight].dir}/${svgFile.filename}`;
-}
-
-// 5. Generate icon preview with all weights
-function generateIconPreview(baseName) {
-  let previewHTML = `<div style="display: flex; gap: 8px; flex-wrap: wrap; justify-content: center;">`;
-
-  WEIGHTS.forEach((weight) => {
-    const svgUrl = getSvgGitHubUrl(baseName, weight);
-    if (svgUrl) {
-      previewHTML += `
-        <div style="text-align: center; min-width: 40px;">
-          <img src="${svgUrl}" width="24" height="24" alt="${baseName} ${weight}" />
-          <div style="font-size: 10px; margin-top: 4px; color: #666;">${weightConfigs[weight].label}</div>
-        </div>`;
+      if (normalizedFile === normalizedComponent) {
+        return `https://raw.githubusercontent.com/${GITHUB_USERNAME}/${GITHUB_REPO_NAME}/${GITHUB_BRANCH}/src/raw/${weightConfigs[weight].label}/${category}/${file}`;
+      }
     }
-  });
+  }
 
-  previewHTML += `</div>`;
-  return previewHTML;
+  return null;
 }
 
-// 6. Group components by base name
-function groupComponentsByBaseName(components) {
-  const grouped = {};
-
-  components.forEach((componentName) => {
-    const baseName = getBaseComponentName(componentName);
-    if (!grouped[baseName]) {
-      grouped[baseName] = [];
-    }
-    grouped[baseName].push(componentName);
-  });
-
-  // Convert to array and sort
-  return Object.keys(grouped)
-    .sort()
-    .map((baseName) => ({
-      baseName,
-      components: grouped[baseName].sort(),
-    }));
-}
+/* ---------------- README SECTIONS ---------------- */
 
-// 7. Generate Markdown Table with all weights
 function generateIconList(components) {
-  if (components.length === 0) return "**No icons found.**";
-
-  const groupedIcons = groupComponentsByBaseName(components);
-
-  let markdown = "| Preview (All Weights) | Icon Name | Component Names |\n";
-  markdown += "|:---:|:---|:---|\n";
-
-  groupedIcons.forEach(({ baseName, components: iconComponents }) => {
-    const preview = generateIconPreview(baseName);
-    const weightBadges = WEIGHTS.map((weight) => {
-      const weightName = weight.charAt(0).toUpperCase() + weight.slice(1);
-      const hasWeight = iconComponents.some((comp) => comp.endsWith(weightName));
-      return hasWeight
-        ? `<span style="background: #e9ecef; padding: 2px 6px; border-radius: 4px; font-size: 11px; margin: 2px; display: inline-block;">${weightConfigs[weight].label}</span>`
-        : `<span style="background: #f8f9fa; color: #adb5bd; padding: 2px 6px; border-radius: 4px; font-size: 11px; margin: 2px; display: inline-block;">${weightConfigs[weight].label}</span>`;
-    }).join(" ");
-
-    markdown += `| ${preview} | \`${baseName}\` | <div style="max-width: 200px;">${weightBadges}</div> |\n`;
-  });
-
-  return markdown;
-}
-
-// Alternative: Grid layout with 2 icons per row
-function generateIconListGrid(components) {
-  if (components.length === 0) return "**No icons found.**";
-
-  const groupedIcons = groupComponentsByBaseName(components);
-
-  let markdown = "| Preview | Icon Name & Weights | Preview | Icon Name & Weights |\n";
-  markdown += "|:---:|:---|:---:|:---|\n";
-
-  for (let i = 0; i < groupedIcons.length; i += 2) {
-    const icon1 = groupedIcons[i];
-    const icon2 = groupedIcons[i + 1];
-
-    const preview1 = generateIconPreview(icon1.baseName);
-    const preview2 = icon2 ? generateIconPreview(icon2.baseName) : "";
+  if (!components.length) return "No icons found.";
+
+  let html = `
+<table style="border-collapse: collapse; width: 100%; min-width: 700px;">
+  <thead>
+    <tr style="background:#f8f9fa;border-bottom:2px solid #ddd;">
+      <th style="text-align:left;padding:12px;width:35%;">Icon</th>
+      <th style="text-align:center;padding:12px;">Weights Preview</th>
+    </tr>
+  </thead>
+  <tbody>
+`;
 
-    const weightsList1 = WEIGHTS.map((weight) => {
-      const weightName = weight.charAt(0).toUpperCase() + weight.slice(1);
-      const hasWeight = icon1.components.some((comp) => comp.endsWith(weightName));
-      return hasWeight
-        ? `<span style="background: #4f46e5; color: white; padding: 2px 6px; border-radius: 4px; font-size: 10px; margin: 1px; display: inline-block;">${weight.charAt(0).toUpperCase()}</span>`
-        : `<span style="background: #f1f5f9; color: #64748b; padding: 2px 6px; border-radius: 4px; font-size: 10px; margin: 1px; display: inline-block;">${weight.charAt(0).toUpperCase()}</span>`;
+  components.forEach((name) => {
+    const badges = WEIGHTS.map((w) => {
+      const has = getGithubIconUrl(name, w);
+      const cfg = weightConfigs[w];
+      return `<span style="
+        display:inline-block;
+        margin:2px;
+        padding:2px 8px;
+        border-radius:12px;
+        font-size:10px;
+        border:1px solid ${has ? "#c7d2fe" : "#e5e7eb"};
+        background:${has ? "#e0e7ff" : "#f3f4f6"};
+        color:${has ? "#4338ca" : "#9ca3af"};
+      ">${cfg.label}</span>`;
     }).join("");
 
-    const name1 = `<div><strong>${icon1.baseName}</strong><br/><div style="margin-top: 4px;">${weightsList1}</div></div>`;
-
-    let name2 = "";
-    if (icon2) {
-      const weightsList2 = WEIGHTS.map((weight) => {
-        const weightName = weight.charAt(0).toUpperCase() + weight.slice(1);
-        const hasWeight = icon2.components.some((comp) => comp.endsWith(weightName));
-        return hasWeight
-          ? `<span style="background: #4f46e5; color: white; padding: 2px 6px; border-radius: 4px; font-size: 10px; margin: 1px; display: inline-block;">${weight.charAt(0).toUpperCase()}</span>`
-          : `<span style="background: #f1f5f9; color: #64748b; padding: 2px 6px; border-radius: 4px; font-size: 10px; margin: 1px; display: inline-block;">${weight.charAt(0).toUpperCase()}</span>`;
-      }).join("");
+    const previews = WEIGHTS.map((w) => {
+      const src = getGithubIconUrl(name, w);
+      const label = weightConfigs[w].label.slice(0, 3);
+      return src
+        ? `<div style="display:flex;flex-direction:column;align-items:center;">
+             <img src="${src}" width="20" height="20" />
+             <span style="font-size:8px;color:#999;">${label}</span>
+           </div>`
+        : `<div style="width:20px;height:20px;background:#eee;border-radius:3px;"></div>`;
+    }).join("");
 
-      name2 = `<div><strong>${icon2.baseName}</strong><br/><div style="margin-top: 4px;">${weightsList2}</div></div>`;
-    }
+    html += `
+<tr style="border-bottom:1px solid #eee;">
+  <td style="padding:12px;">
+    <code>${name}</code>
+    <div style="margin-top:6px;">${badges}</div>
+  </td>
+  <td style="padding:12px;">
+    <div style="display:flex;gap:8px;justify-content:center;
+      background:#fafafa;padding:8px;border-radius:8px;border:1px solid #eee;">
+      ${previews}
+    </div>
+  </td>
+</tr>
+`;
+  });
 
-    markdown += `| ${preview1} | ${name1} | ${preview2} | ${name2} |\n`;
-  }
+  html += `
+  </tbody>
+</table>
+`;
 
-  return markdown;
+  return html;
 }
 
-// 8. Generate Weight Legend
 function generateWeightLegend() {
-  let legend = "\n### Weight Legend\n\n";
-  legend += "| Symbol | Weight | Description |\n";
-  legend += "|:---:|:---|:---|\n";
-
-  WEIGHTS.forEach((weight) => {
-    const config = weightConfigs[weight];
-    legend += `| <span style="background: #4f46e5; color: white; padding: 2px 6px; border-radius: 4px; font-size: 10px;">${weight.charAt(0).toUpperCase()}</span> | **${config.label}** | ${weight} style icons |\n`;
-  });
-
-  return legend;
+  return `
+### Weight Legend
+
+<div style="display:flex;flex-wrap:wrap;gap:8px;">
+${WEIGHTS.map(
+  (w) => `<div style="padding:6px 10px;border:1px solid #e5e7eb;
+    border-radius:6px;background:#f9fafb;">
+    <strong>${weightConfigs[w].label}</strong>
+    <span style="font-size:12px;color:#666;">( "${w}" )</span>
+  </div>`,
+).join("")}
+</div>
+`;
 }
 
-// 9. Generate Props Table (updated for weights)
 function generatePropsTable() {
   return `
 ## Component Props
 
 | Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| \`size\` | \`number\` | \`24\` | Sets the width and height of the icon |
-| \`color\` | \`string\` | \`"currentColor"\` | Sets the fill color |
-| \`weight\` | \`"bold" \| "boldduotone" \| "broken" \| "lineduotone" \| "linear" \| "outline"\` | \`"outline"\` | Choose between different icon styles |
-| \`...props\` | \`SVGAttributes\` | \`-\` | Standard SVG props like \`className\`, \`id\`, etc. |
-`;
-}
-
-// 10. Generate Installation Section
-function generateInstallationSection(pkgName) {
-  return `
-## Installation
-
-\`\`\`bash
-npm install ${pkgName}
-\`\`\`
-
-or
-
-\`\`\`bash
-yarn add ${pkgName}
-\`\`\`
-
-or
-
-\`\`\`bash
-pnpm add ${pkgName}
-\`\`\`
+|-----|-----|--------|-------------|
+| size | number | 24 | Icon size |
+| color | string | currentColor | Icon color |
+| weight | string | outline | Icon style |
+| ...props | SVGAttributes | – | Standard SVG props |
 `;
 }
 
-// 11. Generate Usage Examples with different weights
-function generateUsageExamples(pkgName, components) {
-  const groupedIcons = groupComponentsByBaseName(components);
-
-  if (groupedIcons.length === 0) {
-    return `
-## Usage
-
-Import the icons you need and use them as React components:
-
-\`\`\`tsx
-import { IconName } from "${pkgName}";
-
-function App() {
-  return (
-    <div>
-      <IconName size={32} color="#333" weight="outline" />
-    </div>
-  );
-}
-\`\`\`
-`;
-  }
-
-  const exampleIcon = groupedIcons[0];
-  const exampleName = exampleIcon.baseName;
-
-  // Find available weights for this icon
-  const availableWeights = WEIGHTS.filter((weight) => {
-    const weightName = weight.charAt(0).toUpperCase() + weight.slice(1);
-    return exampleIcon.components.some((comp) => comp.endsWith(weightName));
-  });
-
+function generateUsage(pkgName, example) {
   return `
 ## Usage
 
-Import icons by name and specify the weight:
-
 \`\`\`tsx
-import { ${exampleName} } from "${pkgName}";
-
-function App() {
-  return (
-    <div style={{ display: "flex", gap: "16px", alignItems: "center" }}>
-      ${availableWeights
-        .map((weight) => `<${exampleName} size={32} color="#4f46e5" weight="${weight}" />`)
-        .join("\n      ")}
-    </div>
-  );
-}
-\`\`\`
+import { ${example} } from "${pkgName}";
 
-### Importing specific weights:
-
-\`\`\`tsx
-// You can also import specific weight variants directly
-import { ${exampleName}Bold, ${exampleName}Linear, ${exampleName}Outline } from "${pkgName}";
-
-function App() {
-  return (
-    <div>
-      <${exampleName}Bold size={32} color="red" />
-      <${exampleName}Linear size={32} color="blue" />
-      <${exampleName}Outline size={32} color="green" />
-    </div>
-  );
-}
+<${example} size={32} weight="bold" color="#4f46e5" />
 \`\`\`
-
-For TypeScript users, types are included out of the box.
 `;
 }
 
-// --- MAIN LOGIC ---
+/* ---------------- MAIN ---------------- */
 
 try {
-  console.log("📦 Starting README generation...");
-
-  // 1. Load Package Metadata
-  let pkgName = "my-icon-pack";
-  let pkgDesc = "A collection of beautiful SVG icons in 6 different weights.";
-  let pkgVersion = "1.0.0";
-  let pkgLicense = "MIT";
-
-  if (fs.existsSync(packageJsonPath)) {
-    const pkg = JSON.parse(fs.readFileSync(packageJsonPath, "utf-8"));
-    pkgName = pkg.name || pkgName;
-    pkgDesc = pkg.description || pkgDesc;
-    pkgVersion = pkg.version || pkgVersion;
-    pkgLicense = pkg.license || pkgLicense;
-  } else {
-    console.warn("⚠️ package.json not found. Using default values.");
-  }
-
-  // 2. Get Component List
-  console.log("📋 Getting component list...");
+  const pkg = JSON.parse(fs.readFileSync(packageJsonPath, "utf-8"));
   const components = getExportedComponents(generatedIndexPath);
 
-  if (components.length === 0) {
-    console.warn("⚠️ No components found. The index.ts file might be empty or the build hasn't been run.");
-  } else {
-    console.log(`✅ Found ${components.length} components`);
-    const groupedIcons = groupComponentsByBaseName(components);
-    console.log(`📊 Grouped into ${groupedIcons.length} unique icons`);
-
-    // Log weight distribution
-    const weightCount = {};
-    WEIGHTS.forEach((weight) => {
-      const weightName = weight.charAt(0).toUpperCase() + weight.slice(1);
-      const count = components.filter((comp) => comp.endsWith(weightName)).length;
-      weightCount[weight] = count;
-    });
-
-    console.log("🎨 Weight distribution:");
-    WEIGHTS.forEach((weight) => {
-      console.log(`  ${weightConfigs[weight].label}: ${weightCount[weight]}`);
-    });
-  }
-
-  // 3. Generate Sections
-  console.log("🛠️ Generating README sections...");
-  const iconListSection = generateIconListGrid(components);
-  const weightLegend = generateWeightLegend();
-  const propsTableSection = generatePropsTable();
-  const installationSection = generateInstallationSection(pkgName);
-  const usageSection = generateUsageExamples(pkgName, components);
-
-  // 4. Construct README Content
-  console.log("📝 Assembling README...");
-  const readmeContent = `# ${pkgName}
-
-![npm downloads](https://img.shields.io/npm/dm/${pkgName}.svg)
-![bundle size](https://img.shields.io/bundlephobia/minzip/${pkgName})
-![license](https://img.shields.io/npm/l/${pkgName}.svg)
-![TypeScript](https://img.shields.io/badge/TypeScript-✓-blue)
-![Weights](https://img.shields.io/badge/Weights-6-blueviolet)
-
-${pkgDesc}
-
-## Features
-
-- **🎨 6 Different Weights:** Bold, Bold Duotone, Broken, Line Duotone, Linear, and Outline styles
-- **🌳 Tree-shakable:** Only import the icons you use
-- **🎨 Customizable:** Control size, color, and weight
-- **✨ TypeScript:** Built with full type safety support
-- **🛠 Framework Agnostic:** Works with React, Next.js, Vite, and CRA
-- **⚡ Zero Dependencies:** Lightweight footprint
-- **🎯 Perfect for Design Systems:** Consistent across all weights
+  const readme = `
+# ${pkg.name}
 
-${weightLegend}
+${pkg.description}
 
-${installationSection}
+${generateWeightLegend()}
 
-${usageSection}
-
-${propsTableSection}
-
-## Available Icons
-
-There are currently **${groupComponentsByBaseName(components).length}** unique icons, each available in up to 6 different weights:
-
-${iconListSection}
-
-## Contributing
-
-We welcome contributions! If you'd like to add new icons or improve existing ones:
-
-1. Fork the repository
-2. Create a new branch
-3. Add your SVG icons to the appropriate weight directory in \`src/raw/\`
-4. Run the build script to generate components
-5. Submit a pull request
-
-## Development
-
-To build the project locally:
+## Installation
 
 \`\`\`bash
-# Clone the repository
-git clone https://github.com/${GITHUB_USERNAME}/${GITHUB_REPO_NAME}.git
-
-# Install dependencies
-npm install
+npm install ${pkg.name}
+\`\`\`
 
-# Build the project
-npm run build
+${components.length ? generateUsage(pkg.name, components[0]) : ""}
 
-# Generate the README (this file)
-npm run readme
-\`\`\`
+${generatePropsTable()}
 
-## License
+## Available Icons (${components.length})
 
-${pkgLicense} © ${new Date().getFullYear()} ${GITHUB_USERNAME}. See the [LICENSE](./LICENSE) file for details.
+${generateIconList(components)}
 
 ---
 
-<div align="center">
-  Made with ❤️ by <a href="https://github.com/${GITHUB_USERNAME}">${GITHUB_USERNAME}</a>
-</div>
+Made with ❤️ by **${GITHUB_USERNAME}**
 `;
 
-  // 5. Write to file
-  fs.writeFileSync(readmeOutputPath, readmeContent);
-  console.log(`✅ README.md generated successfully at: ${readmeOutputPath}`);
-  console.log(`📊 Unique icons documented: ${groupComponentsByBaseName(components).length}`);
-  console.log(`🔗 GitHub URL: https://github.com/${GITHUB_USERNAME}/${GITHUB_REPO_NAME}`);
-
-  // 6. Print next steps
-  console.log("\n📋 NEXT STEPS:");
-  console.log("1. Ensure all weight directories exist in src/raw/");
-  console.log("2. Commit and push your SVG files to GitHub");
-  console.log("3. Verify images work by checking the README on GitHub");
-} catch (error) {
-  console.error("❌ Error generating README:");
-  console.error(error);
+  fs.writeFileSync(readmeOutputPath, readme.trim());
+  console.log("✅ README.md generated successfully");
+} catch (err) {
+  console.error("❌ Failed to generate README");
+  console.error(err);
   process.exit(1);
 }

package/src/generated/4K.tsx

@@ -1,53 +0,0 @@
-import * as React from "react";
-import { IconProps } from "./types";
-
-// Weights available: bold, boldduotone, broken, lineduotone, linear, outline
-const svgs = {
-     "bold": `
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2 12C2 7.28595 2 4.92893 3.46447 3.46447C4.92893 2 7.28595 2 12 2C16.714 2 19.0711 2 20.5355 3.46447C22 4.92893 22 7.28595 22 12C22 16.714 22 19.0711 20.5355 20.5355C19.0711 22 16.714 22 12 22C7.28595 22 4.92893 22 3.46447 20.5355C2 19.0711 2 16.714 2 12ZM6.25 8C6.25 7.58579 5.91421 7.25 5.5 7.25C5.08579 7.25 4.75 7.58579 4.75 8V10C4.75 11.5188 5.98122 12.75 7.5 12.75H9.75V16C9.75 16.4142 10.0858 16.75 10.5 16.75C10.9142 16.75 11.25 16.4142 11.25 16V8C11.25 7.58579 10.9142 7.25 10.5 7.25C10.0858 7.25 9.75 7.58579 9.75 8V11.25H7.5C6.80964 11.25 6.25 10.6904 6.25 10V8ZM19.0198 7.45938C19.3184 7.74647 19.3277 8.22125 19.0406 8.51983L16.3738 11.2933L19.1314 15.5953C19.3549 15.944 19.2535 16.4079 18.9048 16.6314C18.556 16.8549 18.0921 16.7535 17.8686 16.4047L15.3047 12.4051L14.25 13.5021V16C14.25 16.4142 13.9142 16.75 13.5 16.75C13.0858 16.75 12.75 16.4142 12.75 16V8C12.75 7.58579 13.0858 7.25 13.5 7.25C13.9142 7.25 14.25 7.58579 14.25 8V11.3379L17.9594 7.48017C18.2465 7.18159 18.7213 7.17228 19.0198 7.45938Z"/>
-</svg>
-`,
-    "boldduotone": `
-<path opacity="0.5" d="M12 22C7.28595 22 4.92893 22 3.46447 20.5355C2 19.0711 2 16.714 2 12C2 7.28595 2 4.92893 3.46447 3.46447C4.92893 2 7.28595 2 12 2C16.714 2 19.0711 2 20.5355 3.46447C22 4.92893 22 7.28595 22 12C22 16.714 22 19.0711 20.5355 20.5355C19.0711 22 16.714 22 12 22Z"/>
-<path d="M19.0198 7.45938C19.3184 7.74647 19.3277 8.22125 19.0406 8.51983L16.3738 11.2934L19.1314 15.5953C19.3549 15.944 19.2535 16.4079 18.9048 16.6314C18.556 16.8549 18.0921 16.7535 17.8686 16.4048L15.3047 12.4051L14.25 13.5021V16C14.25 16.4142 13.9142 16.75 13.5 16.75C13.0858 16.75 12.75 16.4142 12.75 16V8C12.75 7.58579 13.0858 7.25 13.5 7.25C13.9142 7.25 14.25 7.58579 14.25 8V11.3379L17.9594 7.48017C18.2465 7.18159 18.7213 7.17228 19.0198 7.45938Z"/>
-<path d="M5.5 7.25C5.91421 7.25 6.25 7.58579 6.25 8V10C6.25 10.6904 6.80964 11.25 7.5 11.25H9.75V8C9.75 7.58579 10.0858 7.25 10.5 7.25C10.9142 7.25 11.25 7.58579 11.25 8V16C11.25 16.4142 10.9142 16.75 10.5 16.75C10.0858 16.75 9.75 16.4142 9.75 16V12.75H7.5C5.98122 12.75 4.75 11.5188 4.75 10V8C4.75 7.58579 5.08579 7.25 5.5 7.25Z"/>
-</svg>
-`,
-    "broken": `
-<path d="M5.5 8V10C5.5 11.1046 6.39543 12 7.5 12H10.5M10.5 8V12M10.5 12V16M13.5 8V13.2M13.5 13.2V16M13.5 13.2L15.4231 11.2M15.4231 11.2L18.5 8M15.4231 11.2L18.5 16" stroke-width="1.5" stroke-linecap="round"/>
-<path d="M22 12C22 16.714 22 19.0711 20.5355 20.5355C19.0711 22 16.714 22 12 22C7.28595 22 4.92893 22 3.46447 20.5355C2 19.0711 2 16.714 2 12C2 7.28595 2 4.92893 3.46447 3.46447C4.92893 2 7.28595 2 12 2C16.714 2 19.0711 2 20.5355 3.46447C21.5093 4.43821 21.8356 5.80655 21.9449 8" stroke-width="1.5" stroke-linecap="round"/>
-</svg>
-`,
-    "lineduotone": `
-<path opacity="0.5" d="M2 12C2 7.28595 2 4.92893 3.46447 3.46447C4.92893 2 7.28595 2 12 2C16.714 2 19.0711 2 20.5355 3.46447C22 4.92893 22 7.28595 22 12C22 16.714 22 19.0711 20.5355 20.5355C19.0711 22 16.714 22 12 22C7.28595 22 4.92893 22 3.46447 20.5355C2 19.0711 2 16.714 2 12Z" stroke-width="1.5"/>
-<path d="M5.5 8V10C5.5 11.1046 6.39543 12 7.5 12H10.5M10.5 8V12M10.5 12V16M13.5 8V13.2M13.5 13.2V16M13.5 13.2L15.4231 11.2M15.4231 11.2L18.5 8M15.4231 11.2L18.5 16" stroke-width="1.5" stroke-linecap="round"/>
-</svg>
-`,
-    "linear": `
-<path d="M2 12C2 7.28595 2 4.92893 3.46447 3.46447C4.92893 2 7.28595 2 12 2C16.714 2 19.0711 2 20.5355 3.46447C22 4.92893 22 7.28595 22 12C22 16.714 22 19.0711 20.5355 20.5355C19.0711 22 16.714 22 12 22C7.28595 22 4.92893 22 3.46447 20.5355C2 19.0711 2 16.714 2 12Z" stroke-width="1.5"/>
-<path d="M5.5 8V10C5.5 11.1046 6.39543 12 7.5 12H10.5M10.5 8V12M10.5 12V16M13.5 8V13.2M13.5 13.2V16M13.5 13.2L15.4231 11.2M15.4231 11.2L18.5 8M15.4231 11.2L18.5 16" stroke-width="1.5" stroke-linecap="round"/>
-</svg>
-`,
-    "outline": `
-<path fill-rule="evenodd" clip-rule="evenodd" d="M11.9426 1.25H12.0574C14.3658 1.24999 16.1748 1.24998 17.5863 1.43975C19.031 1.63399 20.1711 2.03933 21.0659 2.93414C21.9607 3.82895 22.366 4.96897 22.5603 6.41371C22.75 7.82519 22.75 9.63423 22.75 11.9426V12.0574C22.75 14.3658 22.75 16.1748 22.5603 17.5863C22.366 19.031 21.9607 20.1711 21.0659 21.0659C20.1711 21.9607 19.031 22.366 17.5863 22.5603C16.1748 22.75 14.3658 22.75 12.0574 22.75H11.9426C9.63423 22.75 7.82519 22.75 6.41371 22.5603C4.96897 22.366 3.82895 21.9607 2.93414 21.0659C2.03933 20.1711 1.63399 19.031 1.43975 17.5863C1.24998 16.1748 1.24999 14.3658 1.25 12.0574V11.9426C1.24999 9.63423 1.24998 7.82519 1.43975 6.41371C1.63399 4.96897 2.03933 3.82895 2.93414 2.93414C3.82895 2.03933 4.96897 1.63399 6.41371 1.43975C7.82519 1.24998 9.63423 1.24999 11.9426 1.25ZM6.61358 2.92637C5.33517 3.09825 4.56445 3.42514 3.9948 3.9948C3.42514 4.56445 3.09825 5.33517 2.92637 6.61358C2.75159 7.91356 2.75 9.62177 2.75 12C2.75 14.3782 2.75159 16.0864 2.92637 17.3864C3.09825 18.6648 3.42514 19.4355 3.9948 20.0052C4.56445 20.5749 5.33517 20.9018 6.61358 21.0736C7.91356 21.2484 9.62177 21.25 12 21.25C14.3782 21.25 16.0864 21.2484 17.3864 21.0736C18.6648 20.9018 19.4355 20.5749 20.0052 20.0052C20.5749 19.4355 20.9018 18.6648 21.0736 17.3864C21.2484 16.0864 21.25 14.3782 21.25 12C21.25 9.62177 21.2484 7.91356 21.0736 6.61358C20.9018 5.33517 20.5749 4.56445 20.0052 3.9948C19.4355 3.42514 18.6648 3.09825 17.3864 2.92637C16.0864 2.75159 14.3782 2.75 12 2.75C9.62177 2.75 7.91356 2.75159 6.61358 2.92637Z"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M19.0198 7.45938C19.3184 7.74647 19.3277 8.22125 19.0406 8.51983L16.3738 11.2934L19.1314 15.5953C19.3549 15.944 19.2535 16.4079 18.9047 16.6314C18.556 16.8549 18.0921 16.7535 17.8686 16.4048L15.3047 12.4051L14.25 13.5021V16C14.25 16.4142 13.9142 16.75 13.5 16.75C13.0858 16.75 12.75 16.4142 12.75 16V8C12.75 7.58579 13.0858 7.25 13.5 7.25C13.9142 7.25 14.25 7.58579 14.25 8V11.3379L17.9594 7.48017C18.2465 7.18159 18.7213 7.17228 19.0198 7.45938ZM5.5 7.25C5.91421 7.25 6.25 7.58579 6.25 8V10C6.25 10.6904 6.80964 11.25 7.5 11.25H9.75V8C9.75 7.58579 10.0858 7.25 10.5 7.25C10.9142 7.25 11.25 7.58579 11.25 8V16C11.25 16.4142 10.9142 16.75 10.5 16.75C10.0858 16.75 9.75 16.4142 9.75 16V12.75H7.5C5.98122 12.75 4.75 11.5188 4.75 10V8C4.75 7.58579 5.08579 7.25 5.5 7.25Z"/>
-</svg>
-`,
-};
-
-export const 4K: React.FC<IconProps> = ({ size = 24, color = "currentColor", weight, ...props }) => {
-  // If weight is passed and exists, use it. Otherwise default to the first available weight.
-  const activeWeight = Object.keys(svgs).includes(weight) ? weight : Object.keys(svgs)[0];
-
-  return (
-    <svg
-      viewBox="0 0 24 24"
-      width={size}
-      height={size}
-      fill={color}
-      {...props}
-    >
-      <g dangerouslySetInnerHTML={{ __html: svgs[activeWeight] }} />
-    </svg>
-  );
-};