qr-generator-styled 2.0.0 → 2.0.1
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 +115 -1
- package/package.json +6 -2
package/README.md
CHANGED
|
@@ -21,7 +21,121 @@ A professional Node.js/TypeScript library for generating QR codes with advanced
|
|
|
21
21
|
- 🎯 **Full TypeScript Support**: Complete type definitions included
|
|
22
22
|
- 🔧 **Modular Architecture**: Clean, maintainable code
|
|
23
23
|
|
|
24
|
-
##
|
|
24
|
+
## �️ Visual Examples
|
|
25
|
+
### Advanced Features
|
|
26
|
+
<table>
|
|
27
|
+
<tr>
|
|
28
|
+
<td align="center" valign="top">
|
|
29
|
+
<img src="docs/images/vcard-contact.png" width="180" alt="vCard Contact QR"/>
|
|
30
|
+
<br/>
|
|
31
|
+
<b>vCard Contact</b>
|
|
32
|
+
<br/>
|
|
33
|
+
<sub>Purple gradient with custom eyes</sub>
|
|
34
|
+
</td>
|
|
35
|
+
<td align="center" valign="top">
|
|
36
|
+
<img src="docs/images/wifi-network.png" width="180" alt="WiFi Network QR"/>
|
|
37
|
+
<br/>
|
|
38
|
+
<b>WiFi Network</b>
|
|
39
|
+
<br/>
|
|
40
|
+
<sub>Green gradient with rounded modules</sub>
|
|
41
|
+
</td>
|
|
42
|
+
<td align="center" valign="top">
|
|
43
|
+
<img src="docs/images/email-contact.png" width="180" alt="Email Contact QR"/>
|
|
44
|
+
<br/>
|
|
45
|
+
<b>Email Contact</b>
|
|
46
|
+
<br/>
|
|
47
|
+
<sub>Pink gradient with eye customization</sub>
|
|
48
|
+
</td>
|
|
49
|
+
<td align="center" valign="top">
|
|
50
|
+
<img src="docs/images/custom-eyes.png" width="180" alt="Custom Eyes QR"/>
|
|
51
|
+
<br/>
|
|
52
|
+
<b>Custom Eyes</b>
|
|
53
|
+
<br/>
|
|
54
|
+
<sub>Red eye accents (square modules)</sub>
|
|
55
|
+
</td>
|
|
56
|
+
</tr>
|
|
57
|
+
</table>
|
|
58
|
+
|
|
59
|
+
### Basic Styles
|
|
60
|
+
|
|
61
|
+
<table>
|
|
62
|
+
<tr>
|
|
63
|
+
<td align="center" valign="top">
|
|
64
|
+
<img src="docs/images/basic-classic.png" width="150" alt="Classic Black & White QR"/>
|
|
65
|
+
<br/>
|
|
66
|
+
<b>Classic</b>
|
|
67
|
+
<br/>
|
|
68
|
+
<sub>Traditional black & white</sub>
|
|
69
|
+
</td>
|
|
70
|
+
<td align="center" valign="top">
|
|
71
|
+
<img src="docs/images/basic-blue.png" width="150" alt="Professional Blue QR"/>
|
|
72
|
+
<br/>
|
|
73
|
+
<b>Professional</b>
|
|
74
|
+
<br/>
|
|
75
|
+
<sub>Blue rounded design</sub>
|
|
76
|
+
</td>
|
|
77
|
+
<td align="center" valign="top">
|
|
78
|
+
<img src="docs/images/basic-green.png" width="150" alt="Eco Green QR"/>
|
|
79
|
+
<br/>
|
|
80
|
+
<b>Eco</b>
|
|
81
|
+
<br/>
|
|
82
|
+
<sub>Green with custom eyes</sub>
|
|
83
|
+
</td>
|
|
84
|
+
<td align="center" valign="top">
|
|
85
|
+
<img src="docs/images/basic-red.png" width="150" alt="Alert Red QR"/>
|
|
86
|
+
<br/>
|
|
87
|
+
<b>Alert</b>
|
|
88
|
+
<br/>
|
|
89
|
+
<sub>Red attention-grabbing</sub>
|
|
90
|
+
</td>
|
|
91
|
+
<td align="center" valign="top">
|
|
92
|
+
<img src="docs/images/basic-purple.png" width="150" alt="Creative Purple QR"/>
|
|
93
|
+
<br/>
|
|
94
|
+
<b>Creative</b>
|
|
95
|
+
<br/>
|
|
96
|
+
<sub>Purple artistic</sub>
|
|
97
|
+
</td>
|
|
98
|
+
</tr>
|
|
99
|
+
</table>
|
|
100
|
+
|
|
101
|
+
### With Logos
|
|
102
|
+
|
|
103
|
+
<table>
|
|
104
|
+
<tr>
|
|
105
|
+
<td align="center" valign="top">
|
|
106
|
+
<img src="docs/images/logo-corporate.png" width="160" alt="Corporate QR with Logo"/>
|
|
107
|
+
<br/>
|
|
108
|
+
<b>Corporate</b>
|
|
109
|
+
<br/>
|
|
110
|
+
<sub>Circle logo, professional blue</sub>
|
|
111
|
+
</td>
|
|
112
|
+
<td align="center" valign="top">
|
|
113
|
+
<img src="docs/images/logo-eco.png" width="160" alt="Eco Brand QR with Logo"/>
|
|
114
|
+
<br/>
|
|
115
|
+
<b>Eco Brand</b>
|
|
116
|
+
<br/>
|
|
117
|
+
<sub>Square logo, green gradient</sub>
|
|
118
|
+
</td>
|
|
119
|
+
<td align="center" valign="top">
|
|
120
|
+
<img src="docs/images/logo-tech.png" width="160" alt="Tech Startup QR with Logo"/>
|
|
121
|
+
<br/>
|
|
122
|
+
<b>Tech Startup</b>
|
|
123
|
+
<br/>
|
|
124
|
+
<sub>Circle logo, purple gradient</sub>
|
|
125
|
+
</td>
|
|
126
|
+
<td align="center" valign="top">
|
|
127
|
+
<img src="docs/images/logo-restaurant.png" width="160" alt="Restaurant QR with Logo"/>
|
|
128
|
+
<br/>
|
|
129
|
+
<b>Restaurant</b>
|
|
130
|
+
<br/>
|
|
131
|
+
<sub>Square logo, red gradient</sub>
|
|
132
|
+
</td>
|
|
133
|
+
</tr>
|
|
134
|
+
</table>
|
|
135
|
+
|
|
136
|
+
> 💡 **Tip**: All examples shown above were generated with this library! Check the [`examples/`](examples/) directory for source code.
|
|
137
|
+
|
|
138
|
+
## �📦 Installation
|
|
25
139
|
|
|
26
140
|
```bash
|
|
27
141
|
npm install qr-generator-styled
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "qr-generator-styled",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.1",
|
|
4
4
|
"description": "A professional QR code generator library with advanced styling options including gradients, rounded modules, logo support, specialized QR types (vCard, WiFi, Email, SMS, Geo), SVG export, and eye customization",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"type": "module",
|
|
@@ -26,7 +26,11 @@
|
|
|
26
26
|
"test:coverage": "vitest run --coverage",
|
|
27
27
|
"example:basic": "tsx examples/basic.ts",
|
|
28
28
|
"example:programmatic": "tsx examples/programmatic.ts",
|
|
29
|
-
"example:advanced": "tsx examples/advanced.ts"
|
|
29
|
+
"example:advanced": "tsx examples/advanced.ts",
|
|
30
|
+
"example:basic-styles": "tsx examples/basic-examples.ts",
|
|
31
|
+
"example:create-logos": "tsx examples/create-logos.ts",
|
|
32
|
+
"example:with-logos": "tsx examples/logo-examples.ts",
|
|
33
|
+
"example:all": "npm run example:advanced && npm run example:basic-styles && npm run example:create-logos && npm run example:with-logos"
|
|
30
34
|
},
|
|
31
35
|
"keywords": [
|
|
32
36
|
"qr",
|