Added SOL, GRT, STX, AAVE, CRV, SUSHI, NKN, SNX, ANKR, KSM

Author: man15h

manifest.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-cryptoicon",
-  "version": "0.17.1",
+  "version": "0.17.2",
   "description": "Beautiful pixel perfect 400+ cryptocurrency and 10+ Fiat currency icon",
   "main": "lib/vue-cryptoicon.common.js",
   "author": "man15h",
@@ -46,7 +46,7 @@
     "prod": "cross-env NODE_ENV=production vue-cli-service build",
     "test:unit": "vue-cli-service test:unit",
     "test": "npm run test:unit",
-    "update": "node -r esm scripts/updateManifest.js && node scripts/fetchDetails.js",
+    "update": "node -r esm scripts/build.js  && node -r esm scripts/updateManifest.js && node scripts/fetchDetails.js",
     "new": "node -r esm scripts/newIcons.js",
     "update:manifest": "node -r esm scripts/updateManifest.js"
   },
@@ -68,7 +68,7 @@
     "babel-eslint": "^10.0.1",
     "babel-jest": "^23.6.0",
     "cross-env": "^5.2.0",
-    "cryptocurrency-icons": "^0.10.1",
+    "cryptocurrency-icons": "^0.17.2",
     "eslint": "^5.15.1",
     "eslint-config-prettier": "^3.1.0",
     "eslint-loader": "^2.1.2",

package.json

@@ -0,0 +1,56 @@
+const fs = require('fs');
+const glob = require('glob');
+const path = require('path');
+const { capitalize, removeSvg, fixName } = require('./helpers');
+
+const rootDir = path.join(__dirname, '..');
+
+const indexFile = path.join(rootDir, 'src', 'icons', 'index.js');
+const allIcons = [];
+glob(
+  `${rootDir}/node_modules/cryptocurrency-icons/svg/color/*.svg`,
+  (_, icons) => {
+    fs.writeFileSync(indexFile, '', 'utf-8');
+
+    icons.forEach(icon => {
+      const colorSvg = fs.readFileSync(icon, 'utf-8');
+      const blackSvg = fs.readFileSync(icon.replace('color', 'black'), 'utf-8');
+
+      const [name] = path.basename(icon).split('.');
+      const capitalizedName = capitalize(fixName(name));
+      const colorSvgContent = removeSvg(colorSvg);
+      const blackSvgContent = removeSvg(blackSvg);
+      const template =
+        `const ${capitalizedName} = {
+        symbol: '${fixName(name)}',
+        color: '#000', \ncolorIcon() { return ` +
+        '`' +
+        colorSvgContent +
+        '`' +
+        ` }, \nplainIcon: c => {
+            return` +
+        '`' +
+        blackSvgContent.replace(
+          '<path',
+          '<path fill-rule="evenodd" fill="${c ? c : this.color}"'
+        ) +
+        '`\n' +
+        `} }\n export default ${capitalizedName}; `;
+      //   console.log(prettier.format(template, { semi: false, parser: 'babel' }));
+      fs.writeFileSync(
+        `${rootDir}/src/icons/${fixName(name).toLowerCase()}.js`,
+        template,
+        'utf-8'
+      );
+      const importString = `import ${fixName(
+        capitalizedName
+      )} from './${fixName(name).toLowerCase()}';\r\n`;
+      fs.appendFileSync(indexFile, importString, 'utf-8');
+      allIcons.push(capitalizedName);
+    });
+    const exportString = `export {${fixName(
+      allIcons.join(', ')
+    )}} \r\nexport default [${allIcons.join(', ')}]`;
+    fs.appendFileSync(indexFile, exportString, 'utf-8');
+  }
+);

scripts/build.js

@@ -0,0 +1,48 @@
+exports.capitalize = string => string.charAt(0).toUpperCase() + string.slice(1);
+exports.fixName = name => {
+  switch (name) {
+    case '0xbtc':
+      return 'ZeroxBtc';
+    case '2give':
+      return 'TwoGive';
+    default:
+      return name;
+  }
+};
+
+exports.removeSvg = svg => {
+  return svg
+    .replace(
+      '<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">',
+      ''
+    )
+    .replace(
+      '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">',
+      ''
+    )
+    .replace(
+      '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">',
+      ''
+    )
+    .replace(
+      '<svg height="32" viewBox="0 0 32 32" width="32" xmlns="http://www.w3.org/2000/svg">',
+      ''
+    )
+    .replace(
+      '<svg height="32" width="32" xmlns="http://www.w3.org/2000/svg">',
+      ''
+    )
+    .replace(
+      '<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">',
+      ''
+    )
+    .replace(
+      '<svg width="32" height="32" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">',
+      ''
+    )
+    .replace(
+      '<svg height="32" viewBox="0 0 32 32" width="32" xmlns="http://www.w3.org/2000/svg">',
+      ''
+    )
+    .replace(`</svg>`, '');
+};

scripts/helpers.js

@@ -1,8 +1,14 @@
-const updatedCurrencies = require('./../src/cryptoicons/manifest.json');
+const path = require('path');
+const { fixName } = require('./helpers');
+
+const rootDir = path.join(__dirname, '..');
+const updatedCurrencies = require(`${rootDir}/node_modules/cryptocurrency-icons/manifest.json`);
 const currencies = require('./../src/icons').default;
 const newCurrencies = updatedCurrencies.filter(
   o =>
-    !currencies.find(o2 => o.symbol.toLowerCase() === o2.symbol.toLowerCase())
+    !currencies.find(
+      o2 => fixName(o.symbol.toLowerCase()) == o2.symbol.toLowerCase()
+    )
 );
 
 console.log(newCurrencies);

scripts/newIcons.js

@@ -1,5 +1,8 @@
 const fs = require('fs');
-const updatedCurrencies = require('./../src/cryptoicons/manifest.json');
+const path = require('path');
+
+const rootDir = path.join(__dirname, '..');
+const updatedCurrencies = require(`${rootDir}/node_modules/cryptocurrency-icons/manifest.json`);
 const currencies = require('./../src/icons').default;
 const newCurrencies = updatedCurrencies.filter(o =>
   currencies.find(o2 => o.symbol.toLowerCase() === o2.symbol.toLowerCase())

scripts/updateManifest.js

@@ -0,0 +1,13 @@
+const Aave = {
+  symbol: 'aave',
+  color: '#000',
+  colorIcon() {
+    return `<g fill="none"><circle fill="#2EBAC6" cx="16" cy="16" r="16"/><path d="M22.934 21.574l-5.35-13.532C17.28 7.342 16.834 7 16.243 7h-.473c-.592 0-1.039.343-1.341 1.042l-2.327 5.896h-1.761c-.528.002-.956.448-.96 1v.014c.004.553.432.999.96 1.001h.946l-2.221 5.621a1.235 1.235 0 00-.066.384c0 .315.092.562.263.754.17.192.407.288.71.288a.933.933 0 00.552-.192c.17-.123.289-.302.38-.507l2.446-6.348h1.696c.527-.002.955-.449.96-1.001v-.027c-.005-.553-.433-1-.96-1.001h-.907l1.866-4.867L21.093 22.3c.092.205.21.384.381.507.161.122.354.19.553.192.302 0 .539-.096.71-.288.17-.192.262-.439.262-.754a.944.944 0 00-.065-.384z" fill="#FFF"/></g>`;
+  },
+  plainIcon: c => {
+    return `<path fill-rule="evenodd" fill="${
+      c ? c : this.color
+    }" d="M16 0c8.837 0 16 7.163 16 16s-7.163 16-16 16S0 24.837 0 16 7.163 0 16 0zm.243 7h-.473c-.592 0-1.039.343-1.341 1.042l-2.327 5.896h-1.761c-.528.002-.956.448-.96 1v.014c.004.553.432.999.96 1.001h.946l-2.221 5.621a1.235 1.235 0 00-.066.384c0 .315.092.562.263.754.17.192.407.288.71.288a.933.933 0 00.552-.192c.17-.123.289-.302.38-.507l2.446-6.348h1.696c.527-.002.955-.449.96-1.001v-.027c-.005-.553-.433-1-.96-1.001h-.907l1.866-4.867L21.093 22.3c.092.205.21.384.381.507.161.122.354.19.553.192.302 0 .539-.096.71-.288.17-.192.262-.439.262-.754a.944.944 0 00-.065-.384l-5.35-13.532C17.28 7.342 16.834 7 16.243 7z"/>`;
+  }
+};
+export default Aave;