svgfusion 1.38.1 → 1.40.0
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.
- package/README.md +14 -3
- package/dist/browser.js +14 -14
- package/dist/cli.cjs +3778 -3776
- package/dist/index.cjs +140 -140
- package/dist/index.d.cts +3 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.js +140 -140
- package/package.json +8 -7
package/README.md
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
|
|
4
4
|
# SVGFusion
|
|
5
5
|
|
|
6
|
-
**Convert SVG files into React
|
|
6
|
+
**Convert SVG files into React, Vue 3, and React Native components**
|
|
7
7
|
|
|
8
8
|
[](https://www.npmjs.com/package/svgfusion)
|
|
9
9
|
[](https://www.typescriptlang.org/)
|
|
@@ -21,7 +21,7 @@ This package includes everything you need for SVG to component conversion:
|
|
|
21
21
|
- **CLI Tool** - Convert SVG files from command line
|
|
22
22
|
- **Node.js API** - Programmatic conversion in Node.js
|
|
23
23
|
- **Module API** - Browser-compatible module for web apps
|
|
24
|
-
- **React
|
|
24
|
+
- **React, Vue, and React Native Support** - Generate components for all three frameworks
|
|
25
25
|
- **TypeScript Ready** - Full TypeScript support with proper types
|
|
26
26
|
|
|
27
27
|
## Installation
|
|
@@ -46,12 +46,17 @@ pnpm build
|
|
|
46
46
|
# Use the CLI
|
|
47
47
|
pnpm svgfusion icon.svg --framework react --output ./components
|
|
48
48
|
pnpm svgfusion ./icons --framework vue --typescript --output ./components
|
|
49
|
+
pnpm svgfusion ./icons --framework react-native --typescript --output ./components
|
|
49
50
|
```
|
|
50
51
|
|
|
51
52
|
### Module Usage (Browser/Web Apps)
|
|
52
53
|
|
|
53
54
|
```javascript
|
|
54
|
-
import {
|
|
55
|
+
import {
|
|
56
|
+
convertToReact,
|
|
57
|
+
convertToVue,
|
|
58
|
+
convertToReactNative,
|
|
59
|
+
} from 'svgfusion/browser';
|
|
55
60
|
|
|
56
61
|
const svgCode = `<svg viewBox="0 0 24 24"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>`;
|
|
57
62
|
|
|
@@ -68,6 +73,12 @@ const vueResult = await convertToVue(svgCode, {
|
|
|
68
73
|
typescript: true,
|
|
69
74
|
splitColors: true,
|
|
70
75
|
});
|
|
76
|
+
|
|
77
|
+
// React Native component (requires react-native-svg in the consuming app)
|
|
78
|
+
const rnResult = await convertToReactNative(svgCode, {
|
|
79
|
+
componentName: 'StarIcon',
|
|
80
|
+
typescript: true,
|
|
81
|
+
});
|
|
71
82
|
```
|
|
72
83
|
|
|
73
84
|
### Node.js API
|