export-svg-typescript 0.1.4 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -7,6 +7,7 @@ import path from "path";
7
7
  * Script to process SVG files from input folder and generates JS export index,
8
8
  * Barrel Roll for the icons js files, enabling tree shaking to only the icons the
9
9
  * user imports, enables customizing colors and size, and shows tooltip preview.
10
+ * usage: node convert-svg-to-js.js -i ./src/icons-svg -o ./dist/icons
10
11
  * @param {string} inputFolder - Path to folder containing SVG files
11
12
  * @param {string} outputFolder - Path to folder where JS files will be generated
12
13
  */
@@ -19,7 +20,7 @@ export function convertSVGFolderToExportIndex(inputFolder, indexPath) {
19
20
 
20
21
  // Generate index file
21
22
 
22
- let indexContent = `// Do a Barrel Roll index (auto-generated) of SVG icons as JS exports, tree shaking to only the icons used.\n\n`;
23
+ let indexContent = `// Do a Barrel Roll (auto-generated) index of SVG icons as JS exports, tree shaking to only the icons used.\n\n`;
23
24
  const exportData = [];
24
25
 
25
26
  svgFiles.forEach((svgFile) => {
@@ -40,24 +41,22 @@ export function convertSVGFolderToExportIndex(inputFolder, indexPath) {
40
41
  unescape(encodeURIComponent(svgContent))
41
42
  )}`;
42
43
 
43
- const jsContent = `/**
44
- * Returns a customizable SVG string for icon ${baseName.replace(
45
- /loading-/g,
46
- ""
47
- )}
44
+ const jsContent = `
45
+ /**
46
+ * Returns a customized SVG string for loading icon ${baseName.replace(/loading-/g, "" )}
47
+ *
48
48
  * ![${baseName}](${svgBase64})
49
+ * @param {Object} options - Configuration options
49
50
  * @param {string[]} [options.colors] - Array of hex colors to replace existing colors
50
51
  * @param {number} [options.width] - Width of the SVG (default: ${defaultWidth})
51
52
  * @param {number} [options.height] - Height of the SVG (default: ${defaultHeight})
52
53
  * @param {number} [options.size] - Size for both width and height
53
54
  * @example ${toCamelCase(
54
- baseName
55
- )}({ colors: ['#0099e5', '#ff4c4c'], size: 100 });
55
+ baseName
56
+ )}({ colors: ['#0099e5', '#ff4c4c'], size: 100 });
56
57
  * @returns {string} SVG string with applied customizations
57
58
  */
58
- export const ${toCamelCase(
59
- baseName
60
- )} = (options: LoadingOptions = {}) => customSVG(options,
59
+ export const ${toCamelCase(baseName)} = (options: LoadingOptions = {}) => customSVG(options,
61
60
  \`${svgContent
62
61
  .replace(/`/g, "\\`")
63
62
  .replace(' xmlns:xlink="http://www.w3.org/1999/xlink"', "")
@@ -139,6 +138,9 @@ interface LoadingOptions {
139
138
 
140
139
  fs.writeFileSync(indexPath, indexContent);
141
140
 
141
+
142
+
143
+
142
144
  console.log(
143
145
  `✨ Converted ${svgFiles.length} SVG files to customizable JS export files`
144
146
  );
@@ -163,9 +165,13 @@ function toCamelCase(str) {
163
165
  .join("");
164
166
  }
165
167
 
166
- // Get folder path from command line args
167
- const inputFolder = process.argv[2] || "./svg";
168
- const outputPath = process.argv[3] || `${inputFolder}/index.ts`;
168
+ // Get input/output folders from command line args
169
+ const args = process.argv.slice(2);
170
+ const inputIndex = args.indexOf("-i");
171
+ const outputIndex = args.indexOf("-o");
172
+
173
+ const inputFolder = inputIndex >= 0 ? args[inputIndex + 1] : "./svg"; // Folder containing SVG files
174
+ const outputPath = outputIndex >= 0 ? args[outputIndex + 1] : "./index.ts"; // Folder for generated JS files
169
175
 
170
176
  // Run the converter
171
177
  convertSVGFolderToExportIndex(inputFolder, outputPath);
package/package.json CHANGED
@@ -1,11 +1,11 @@
1
1
  {
2
2
  "name": "export-svg-typescript",
3
- "description": "Export SVG icons to TypeScript index with tooltips and customizations",
3
+ "module": "export-svg-typescript.js",
4
4
  "author": "vtempest",
5
5
  "license": "MIT",
6
- "version": "0.1.4",
6
+ "version": "0.1.5",
7
+ "description": "Export SVG to TypeScript",
7
8
  "type": "module",
8
- "module": "export-svg-typescript.js",
9
9
  "scripts": {
10
10
  "demo": "node export-svg-typescript.js -i ./demo -o ./demo/index.ts"
11
11
  },
package/readme.md CHANGED
@@ -13,22 +13,12 @@ Global install:
13
13
  npm install -g export-svg-typescript
14
14
  Or add to package.json:
15
15
  ```
16
- <<<<<<< HEAD
17
16
  "icons": "npx export-svg-typescript -i ./src/icons",
18
17
  ```
19
18
  Or use npx without installing globally with index output file set
20
19
  ```
21
- npx export-svg-typescript -i ./src/icons -o ./src/icons/index.ts
22
- =======
23
20
  "icons": "npx export-svg-typescript ./src/icons",
24
21
  ```
25
- Or use npx without installing globally with index output file set
26
- >>>>>>> c0be8d9515fa79c37c249ff6f2a0139d15d2f374
27
- ```
28
- npx export-svg-typescript ./src/icons ./src/icons/index.ts
29
- ```
30
-
31
-
32
22
 
33
23
  ### Example
34
24