From 6709020d041bd5ca76647ea887a67dcbe4a4aeda Mon Sep 17 00:00:00 2001
From: codecalm <codecalm@gmail.com>
Date: Wed, 22 Jan 2025 19:04:10 +0100
Subject: [PATCH] Enhance icon sprite generation: add support for multiple
 sprite files and improve SVG handling

---
 packages/icons-sprite/build.mjs | 24 +++++++++++++++++-------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/packages/icons-sprite/build.mjs b/packages/icons-sprite/build.mjs
index 3ecc4093a8..5d3450c6c8 100644
--- a/packages/icons-sprite/build.mjs
+++ b/packages/icons-sprite/build.mjs
@@ -3,26 +3,36 @@ import { getAllIcons } from '../../.build/helpers.mjs'
 
 const icons = getAllIcons(true)
 
+fs.mkdirSync('dist', { recursive: true })
+
 const buildSprite = () => {
-  let svgContent = ''
+
   Object.entries(icons).forEach(([type, iconsInCategory]) => {
+    let svgContent = ''
+    console.log(`Building ${type} sprite...`)
+
     iconsInCategory.forEach(icon => {
+
+      console.log(`Adding ${icon.name}...`)
       const svgFileContent = icon.content
         .replace(/<svg[^>]+>/g, '')
         .replace(/<\/svg>/g, '')
         .replace(/\n+/g, '')
         .replace(/>\s+</g, '><')
+        .replace('<path stroke="none" d="M0 0h24v24H0z" fill="none"/>', '')
         .trim()
 
-      svgContent += `<symbol id="tabler-${type == 'outline' ? '' : `${type}-`}${icon.name}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">${svgFileContent}</symbol>`
+      svgContent += `<symbol id="tabler-${type == 'outline' ? '' : `${type}-`}${icon.name}" viewBox="0 0 24 24" fill="${type == 'outline' ? 'none' : 'currentColor'}" stroke="${type == 'outline' ? 'currentColor' : 'none'}" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">${svgFileContent}</symbol>`
     })
-  })
 
-  let svg = `<svg xmlns="http://www.w3.org/2000/svg"><defs>${svgContent}</defs></svg>`
+    let svg = `<svg xmlns="http://www.w3.org/2000/svg" id="tabler-icons${type == 'outline' ? '' : `-${type}`}"><defs>${svgContent}</defs></svg>`
+
+    fs.writeFileSync(`dist/tabler-sprite${type == 'outline' ? '' : `-${type}`}.svg`, svg)
 
-  fs.mkdirSync('dist', { recursive: true })
-  fs.writeFileSync('dist/tabler-sprite.svg', svg)
-  fs.writeFileSync('dist/tabler-sprite-nostroke.svg', svg.replace(/stroke-width="2"\s/g, ''))
+    if (type == 'outline') {
+      fs.writeFileSync(`dist/tabler-sprite-nostroke.svg`, svg.replace(/stroke-width="2"\s/g, ''))
+    }
+  })
 }
 
 buildSprite()