From a5bf5487f6ea5c38f4faeaa2b1ac528fe279c96e Mon Sep 17 00:00:00 2001
From: kanno <812137533@qq.com>
Date: Sun, 8 Jan 2023 23:37:03 +0800
Subject: [PATCH 1/5] chore: update deps
---
.source | 63 +-----
package.json | 7 +-
src/generate.ts | 193 +++++++++++-------
src/plugin.ts | 40 ++++
yarn.lock | 533 +++++++++++++++++-------------------------------
5 files changed, 353 insertions(+), 483 deletions(-)
create mode 100644 src/plugin.ts
diff --git a/.source b/.source
index 1bf5b21..fb559fd 100644
--- a/.source
+++ b/.source
@@ -1,52 +1,11 @@
-
Icons - Vercel DesignIcons
A collection of icons used across Vercel products, extended from the beautiful Feather Icons.
Click on an icon to copy the SVG.
\ No newline at end of file
+Icons - Vercel DesignSkip to content
\ No newline at end of file
diff --git a/package.json b/package.json
index b01f721..6b9486a 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,7 @@
"prettier": "@geist-ui/prettier-config",
"scripts": {
"start": "yarn build",
- "update-icons": "ts-node scripts/update.ts",
+ "update-icons": "ts-node src/update.ts",
"prettier": "prettier --write .",
"build": "ts-node src/generate.ts && node scripts/pre-release.js",
"test": "ava",
@@ -31,18 +31,17 @@
"@geist-ui/prettier-config": "^1.0.0",
"@types/babel__core": "^7.1.7",
"@types/fs-extra": "^8.1.0",
- "@types/jsdom": "^16.2.1",
"@types/node": "^13.13.2",
"@types/node-fetch": "^2.5.7",
"ava": "^3.7.1",
"browser-env": "^3.3.0",
"fs-extra": "^9.0.0",
- "jsdom": "^16.2.2",
+ "happy-dom": "^8.1.3",
"node-fetch": "^2.6.0",
"prettier": "^2.1.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
- "svgo": "^1.3.2",
+ "svgo": "^3.0.2",
"ts-node": "^8.9.0",
"typescript": "^3.8.3"
},
diff --git a/src/generate.ts b/src/generate.ts
index 4dbed59..cbcdc8d 100644
--- a/src/generate.ts
+++ b/src/generate.ts
@@ -1,10 +1,10 @@
-import fetch from 'node-fetch'
-import { JSDOM } from 'jsdom'
-import fs from 'fs-extra'
import path from 'path'
-import SVGO from 'svgo/lib/svgo'
-import svgoConfigs from './svgo.config'
+import fs from 'fs-extra'
+import { Window } from 'happy-dom'
+import { optimize } from 'svgo'
+// import SVGO, { optimize } from 'svgo/lib/svgo'
import { transform } from '@babel/core'
+import { svgoOptions } from './plugin'
import {
moduleBabelConfig,
allModulesBabelConfig,
@@ -14,83 +14,118 @@ import {
makeBasicDefinition,
} from './utils'
-const outputDir = path.join(__dirname, '../', 'dist')
-const sourceFile = path.join(__dirname, '../', '.source')
-
-export default (async () => {
- await fs.remove(outputDir)
- const html = await fs.readFile(sourceFile, 'utf8')
- const document = new JSDOM(html).window.document
-
- let exports = ''
- let definition = makeBasicDefinition()
-
- const icons = document.querySelectorAll('.geist-list .icon')
- const svgo = new SVGO(svgoConfigs)
- const promises = Array.from(icons).map(async (icon: Element) => {
- const name: string = icon.querySelector('.geist-text').textContent
- const componentName = toComponentName(name)
- const fileName = toHumpName(name)
-
- const svg = icon.querySelector('svg')
- const { data: optimizedSvgString } = await svgo.optimize(svg.outerHTML)
- const styles = parseStyles(svg.getAttribute('style'))
-
- const component = `import React from 'react';
-const ${componentName} = ({ color = 'currentColor', size = 24, style, ...props }) => {
- return ${parseSvg(optimizedSvgString, styles)};
-}
-export default ${componentName};`
-
- exports += `export { default as ${componentName} } from './${fileName}';\n`
- definition += `export const ${componentName}: Icon;\n`
-
- const componentDefinition = `${makeBasicDefinition()}declare const ${componentName}: Icon;
-export default ${componentName}\n`
- const componentCode = transform(component, moduleBabelConfig).code
- await fs.outputFile(path.join(outputDir, `${fileName}.d.ts`), componentDefinition)
- await fs.outputFile(path.join(outputDir, `${fileName}.js`), componentCode)
- })
-
- await Promise.all(promises)
- const allModulesCode = transform(exports, allModulesBabelConfig).code
- await fs.outputFile(path.join(outputDir, 'index.d.ts'), definition)
- await fs.outputFile(path.join(outputDir, 'index.js'), allModulesCode)
-})()
-
-const parseSvg = (svg: string, styles: any) => {
- const getSpecifiedColorVar = (val: string | undefined, ident: string) => {
- if (!val) return '""'
- return val.includes(ident) ? '{color}' : '"var(--geist-icons-background)"'
- }
+import type { IElement as Element } from 'happy-dom'
- svg = svg.replace(/-([a-z])(?=[a-z\-]*[=\s/>])/g, g => g[1].toUpperCase())
- svg = svg.replace(/