Fix database-backup/improve metadata/add database-zap (cache) icon (#1400)

* Fix `database-backup` icon

* Improve `database` icons metadata

* Add `database-zap` icon

* Update icons/database-zap.svg

Co-authored-by: Karsa <contact@karsa.org>

* Update icons/database-backup.svg

Co-authored-by: Karsa <contact@karsa.org>

* Revert "Update icons/database-backup.svg"

This reverts commit ef1cfd2065.

* Update icons/database-backup.svg

Co-authored-by: Karsa <contact@karsa.org>

---------

Co-authored-by: Karsa <contact@karsa.org>

.github/workflows/lucide-angular.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-angular/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-font.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - icons/**
+      - tools/build-font/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-preact.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-preact/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-react-native.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-react-native/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-react.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-react/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-solid.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-solid/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-static.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-static/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-svelte.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-svelte/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-vue-next.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-vue-next/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-vue.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-vue/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

icons/database-backup.json

@@ -9,6 +9,8 @@
   "tags": [
     "storage",
     "memory",
+    "bytes",
+    "servers",
     "backup",
     "timemachine",
     "rotate",
@@ -19,6 +21,7 @@
     "devices",
     "arrows",
     "design",
+    "development",
     "photography"
   ]
 }

icons/database-backup.svg

@@ -10,9 +10,9 @@
   stroke-linejoin="round"
 >
   <ellipse cx="12" cy="5" rx="9" ry="3" />
-  <path d="M3 5v14c0 1.4 3 2.7 7 3" />
+  <path d="M3 12a9 3 0 0 0 5 2.69" />
-  <path d="M3 12c0 1.2 2 2.5 5 3" />
+  <path d="M21 9.3V5" />
-  <path d="M21 5v4" />
+  <path d="M3 5v14a9 3 0 0 0 6.47 2.88" />
-  <path d="M13 20a5 5 0 0 0 9-3 4.5 4.5 0 0 0-4.5-4.5c-1.33 0-2.54.54-3.41 1.41L12 16" />
   <path d="M12 12v4h4" />
+  <path d="M13 20a5 5 0 0 0 9-3 4.5 4.5 0 0 0-4.5-4.5c-1.33 0-2.54.54-3.41 1.41L12 16" />
 </svg>

icons/database-zap.json

@@ -0,0 +1,19 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "cache busting",
+    "storage",
+    "memory",
+    "bytes",
+    "servers",
+    "power",
+    "crash"
+  ],
+  "categories": [
+    "devices",
+    "development"
+  ]
+}

icons/database-zap.svg

@@ -0,0 +1,17 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <ellipse cx="12" cy="5" rx="9" ry="3" />
+  <path d="M3 5V19A9 3 0 0 0 15 21.84" />
+  <path d="M21 5V8" />
+  <path d="M21 12L18 17H22L19 22" />
+  <path d="M3 12A9 3 0 0 0 14.59 14.87" />
+</svg>

icons/database.json

@@ -6,9 +6,12 @@
   ],
   "tags": [
     "storage",
-    "memory"
+    "memory",
+    "bytes",
+    "servers"
   ],
   "categories": [
-    "devices"
+    "devices",
+    "development"
   ]
 }

packages/lucide-react/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-react",
   "description": "A Lucide icon library package for React applications",
-  "version": "0.263.2-beta.0",
+  "version": "0.0.1",
   "license": "ISC",
   "homepage": "https://lucide.dev",
   "bugs": "https://github.com/lucide-icons/lucide/issues",
@@ -28,7 +28,7 @@
     "build": "pnpm clean && pnpm copy:license && pnpm build:icons && pnpm typecheck && pnpm build:bundles",
     "copy:license": "cp ../../LICENSE ./LICENSE",
     "clean": "rm -rf dist && rm -rf stats && rm -rf ./src/icons/*.ts && rm -f dynamicIconImports.*",
-    "build:icons": "build-icons --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey --withAliases --withDynamicImports --aliasesFileExtension=.ts --iconFileExtension=.ts --exportFileName=index.ts",
+    "build:icons": "build-icons --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey --withAliases --withDynamicImports --separateAliasesFile --aliasesFileExtension=.ts --iconFileExtension=.ts --exportFileName=index.ts",
     "build:types": "node ./scripts/buildTypes.mjs",
     "build:bundles": "rollup -c ./rollup.config.mjs",
     "typecheck": "tsc",

packages/lucide-react/rollup.config.mjs

@@ -1,6 +1,9 @@
 import plugins, { replace } from '@lucide/rollup-plugins';
 import pkg from './package.json' assert { type: 'json' };
 import dts from "rollup-plugin-dts";
+import getAliasesEntryNames from './scripts/getAliasesEntryNames.mjs';
+
+const aliasesEntries = await getAliasesEntryNames()
 
 const packageName = 'LucideReact';
 const outputFileName = 'lucide-react';
@@ -26,7 +29,10 @@ const bundles = [
   },
   {
     format: 'esm',
-    inputs,
+    inputs: [
+      ...inputs,
+      ...aliasesEntries
+    ],
     outputDir,
     preserveModules: true,
     aliasesSupport: true,

packages/lucide-react/scripts/getAliasesEntryNames.mjs

@@ -0,0 +1,15 @@
+import path from 'path';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import getAliases from '@lucide/build-icons/utils/getAliases.mjs';
+
+const ICONS_DIR = path.resolve(process.cwd(), '../../icons');
+
+export default async function getAliasesEntryNames() {
+  const metaJsonFiles = await getAliases(ICONS_DIR);
+
+  const iconWithAliases = Object.values(metaJsonFiles).filter(({ aliases }) => aliases != null);
+
+  const aliases = iconWithAliases.flatMap(({ aliases }) => aliases);
+
+  return aliases.map((alias) => path.join('src/icons', `${alias}.ts`));
+}

tools/build-icons/building/generateAliasesFile.mjs

@@ -1,17 +1,21 @@
 import path from 'path';
+import fs from 'fs';
 import { toPascalCase, resetFile, appendFile } from '../../../scripts/helpers.mjs';
 
 const getImportString = (componentName, iconName, aliasImportFileExtension = '') =>
   `export { default as ${componentName} } from './icons/${iconName}${aliasImportFileExtension}';\n`;
 
-export default function generateAliasesFile({
+export default async function generateAliasesFile({
   iconNodes,
   outputDirectory,
   fileExtension,
+  iconFileExtension = '.js',
   aliases,
   aliasImportFileExtension,
+  separateAliasesFile = false,
   showLog = true,
 }) {
+  const iconsDistDirectory = path.join(outputDirectory, `icons`);
   const fileName = path.basename(`aliases${fileExtension}`);
   const icons = Object.keys(iconNodes);
 
@@ -19,7 +23,8 @@ export default function generateAliasesFile({
   resetFile(fileName, outputDirectory);
 
   // Generate Import for Icon VNodes
-  icons.forEach((iconName) => {
+  await Promise.all(
+    icons.map(async (iconName) => {
       const componentName = toPascalCase(iconName);
       const iconAliases = aliases[iconName]?.aliases;
 
@@ -29,18 +34,44 @@ export default function generateAliasesFile({
       importString += getImportString(`Lucide${componentName}`, iconName, aliasImportFileExtension);
 
       if (iconAliases != null && Array.isArray(iconAliases)) {
-      iconAliases.forEach((alias) => {
+        await Promise.all(
+          iconAliases.map(async (alias) => {
             const componentNameAlias = toPascalCase(alias);
-        importString += getImportString(componentNameAlias, iconName, aliasImportFileExtension);
+
-        importString += getImportString(`${componentNameAlias}Icon`, iconName, aliasImportFileExtension);
+            if (separateAliasesFile) {
-        importString += getImportString(`Lucide${componentNameAlias}`, iconName, aliasImportFileExtension);
+              const output = `export { default } from "./${iconName}"`;
-      });
+              const location = path.join(iconsDistDirectory, `${alias}${iconFileExtension}`);
+
+              await fs.promises.writeFile(location, output, 'utf-8');
+            }
+
+            const exportFileIcon = separateAliasesFile ? alias : iconName;
+
+            importString += getImportString(
+              componentNameAlias,
+              exportFileIcon,
+              aliasImportFileExtension,
+            );
+            importString += getImportString(
+              `${componentNameAlias}Icon`,
+              exportFileIcon,
+              aliasImportFileExtension,
+            );
+
+            importString += getImportString(
+              `Lucide${componentNameAlias}`,
+              exportFileIcon,
+              aliasImportFileExtension,
+            );
+          }),
+        );
       }
 
       importString += '\n';
 
       appendFile(importString, fileName, outputDirectory);
-  });
+    }),
+  );
 
   appendFile('\n', fileName, outputDirectory);
 

tools/build-icons/main.mjs

@@ -32,6 +32,7 @@ const {
   exportFileName = 'index.js',
   withAliases = false,
   withDynamicImports = false,
+  separateAliasesFile = false,
   aliasesFileExtension = '.js',
   aliasImportFileExtension = '',
   pretty = true,
@@ -62,12 +63,14 @@ async function buildIcons() {
   if (withAliases) {
     const aliases = await getAliases(ICONS_DIR);
 
-    generateAliasesFile({
+    await generateAliasesFile({
       iconNodes: icons,
       aliases,
+      iconFileExtension,
       outputDirectory: OUTPUT_DIR,
       fileExtension: aliasesFileExtension,
       aliasImportFileExtension,
+      separateAliasesFile,
       showLog: !silent,
     });
   }