initial draft for SVG sprite generation

.gitignore

@@ -11,3 +11,8 @@ stats
 *.log
 packages/**/src/icons/*.js
 packages/**/src/icons/*.ts
+.pnp.js
+.yarn
+.yarn*
+*.lock
+package-lock.json

packages/lucide-angular/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-angular",
   "description": "Lucide Angular package, Lucide is a community-run fork of Feather Icons, open for anyone to contribute icons.",
-  "version": "0.15.25",
+  "version": "0.15.26",
   "author": "SMAH1",
   "license": "ISC",
   "homepage": "https://lucide.dev",

packages/lucide-preact/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-preact",
   "description": "Lucide Preact package, Lucide is a community-run fork of Feather Icons, open for anyone to contribute icons.",
-  "version": "0.15.25",
+  "version": "0.15.26",
   "license": "ISC",
   "homepage": "https://lucide.dev",
   "bugs": "https://github.com/lucide-icons/lucide/issues",

packages/lucide-react/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-react",
   "description": "Lucide React package, Lucide is a community-run fork of Feather Icons, open for anyone to contribute icons.",
-  "version": "0.15.25",
+  "version": "0.15.26",
   "license": "ISC",
   "homepage": "https://lucide.dev",
   "bugs": "https://github.com/lucide-icons/lucide/issues",

packages/lucide-vue-next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lucide-vue-next",
-  "version": "0.15.25",
+  "version": "0.15.26",
   "author": "Eric Fennis",
   "description": "Lucide Vue 3 Package",
   "license": "ISC",

packages/lucide-vue/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lucide-vue",
-  "version": "0.15.25",
+  "version": "0.15.26",
   "author": "Eric Fennis",
   "description": "Lucide Vue Package",
   "license": "ISC",

packages/lucide/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide",
   "description": "Lucide is a community-run fork of Feather Icons, open for anyone to contribute icons.",
-  "version": "0.15.25",
+  "version": "0.15.26",
   "license": "ISC",
   "homepage": "https://lucide.dev",
   "bugs": "https://github.com/lucide-icons/lucide/issues",

scripts/buildSprite.js

@@ -0,0 +1,36 @@
+import fs from 'fs';
+import path from 'path';
+import getArgumentOptions from 'minimist'; // eslint-disable-line import/no-extraneous-dependencies
+
+import transformsIconToSymbols from './render/transformsIconToSymbols';
+import generateSpriteFile from './build/generateSpriteFile';
+
+import { readSvgDirectory } from './helpers';
+
+const cliArguments = getArgumentOptions(process.argv.slice(2));
+
+const ICONS_DIR = path.resolve(__dirname, '../icons');
+const OUTPUT_DIR = path.resolve(__dirname, cliArguments.output || '../build');
+
+if (!fs.existsSync(OUTPUT_DIR)) {
+  fs.mkdirSync(OUTPUT_DIR);
+}
+
+const {
+  renderUniqueKey = false,
+  templateSrc = './templates/defaultIconFileTemplate',
+  silent = false,
+  iconFileExtention = '.js',
+  exportFileName = 'lucide.svg',
+} = cliArguments;
+
+const svgFiles = readSvgDirectory(ICONS_DIR);
+
+const icons = transformsIconToSymbols(svgFiles, ICONS_DIR);
+
+// Generates entry files for the compiler filled with icons exports
+generateSpriteFile(
+  path.join(OUTPUT_DIR, 'sprite', exportFileName),
+  path.join(OUTPUT_DIR, 'sprite'),
+  icons
+);

scripts/render/transformsIconToSymbols.js

@@ -0,0 +1,36 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import { basename } from 'path';
+import { parseSync, stringify } from 'svgson';
+import { generateHashedKey, readSvg, hasDuplicatedChildren } from '../helpers';
+
+/**
+ * Build an object in the format: `{ <name>: <contents> }`.
+ * @param {string[]} svgFiles - A list of filenames.
+ * @param {Function} getSvg - A function that returns the contents of an SVG file given a filename.
+ * @returns {Object}
+ */
+export default (svgFiles, iconsDirectory) =>
+  svgFiles
+    .map(svgFile => {
+      const name = basename(svgFile, '.svg');
+      const svg = readSvg(svgFile, iconsDirectory);
+      const contents = parseSync(svg);
+
+      if (!(contents.children && contents.children.length)) {
+        throw new Error(`${name}.svg has no children!`);
+      }
+
+      if (hasDuplicatedChildren(contents.children)) {
+        throw new Error(`Duplicated children in ${name}.svg`);
+      }
+
+      return stringify({
+        name: 'symbol',
+        type: 'element',
+        attributes: {
+          id: name,
+          viewBox: contents.attributes.viewBox
+        },
+        children: contents.children
+      });
+    });