Keep the icon order consistent with JSON data file (#223)

simple-icons · Jan 4, 2025 · 57b286e · 57b286e
1 parent 887b6f4
commit 57b286e
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 4 deletions.
diff --git a/preview/html/testpage.pug b/preview/html/testpage.pug
@@ -18,7 +18,7 @@ body
 
   p.grid
     each icon in icons
-      i.si.si--color(class='si-' + icon.slug, title=icon.name)
+      i.si.si--color(class='si-' + icon.slug, title=icon.title)
 
   p.paragraph
     | An icon like #[i.si.si--color.si-github(title='Github')] inside a paragraph.

diff --git a/scripts/build-testpage.js b/scripts/build-testpage.js
@@ -7,7 +7,7 @@
 import fs from 'node:fs';
 import path from 'node:path';
 import pug from 'pug';
-import * as icons from 'simple-icons/icons';
+import { getIconsData, titleToSlug } from 'simple-icons/sdk';
 import { fileURLToPath } from 'node:url';
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
@@ -16,6 +16,12 @@ const ROOT_DIR = path.resolve(__dirname, '..');
 const INPUT_FILE = path.join(ROOT_DIR, 'preview', 'html', 'testpage.pug');
 const OUTPUT_FILE = path.join(ROOT_DIR, 'preview', 'testpage.html');
 
+const iconsData = await getIconsData();
+const icons = iconsData.map((icon) => ({
+  title: icon.title,
+  slug: icon.slug || titleToSlug(icon.title),
+}));
+
 pug.renderFile(INPUT_FILE, { icons }, (renderError, html) => {
   if (renderError) {
     throw renderError;

diff --git a/scripts/build.js b/scripts/build.js
@@ -10,6 +10,7 @@ import fsSync, { promises as fs } from 'node:fs';
 import path from 'node:path';
 import punycode from 'punycode/punycode.js';
 import * as simpleIcons from 'simple-icons/icons';
+import { getIconsData, titleToSlug } from 'simple-icons/sdk';
 import svg2ttf from 'svg2ttf';
 import SVGPath from 'svgpath';
 import ttf2eot from 'ttf2eot';
@@ -46,13 +47,19 @@ const cssDecodeUnicode = (value) => {
   return value.replace('&#x', '\\').replace(';', '').toLowerCase();
 };
 
+const icons = await getIconsData();
+const iconKeys = icons.map((icon) => {
+  const slug = icon.slug || titleToSlug(icon.title);
+  return 'si' + slug.at(0).toUpperCase() + slug.slice(1);
+});
+
 const buildSimpleIconsSvgFontFile = async () => {
   const usedUnicodes = [];
   const unicodeHexBySlug = [];
   let startUnicode = 0xea01;
   let glyphsContent = '';
 
-  for (const si in simpleIcons) {
+  for (const key of iconKeys) {
     const nextUnicode = punycode.ucs2.decode(
       String.fromCodePoint(startUnicode++),
     );
@@ -63,7 +70,7 @@ const buildSimpleIconsSvgFontFile = async () => {
       throw Error(`Unicodes must be unique. Found '${unicodeString}' repeated`);
     }
 
-    const icon = simpleIcons[si];
+    const icon = simpleIcons[key];
     const verticalTransformedPath = SVGPath(icon.path)
       .translate(0, -24)
       .scale(50, -50)