Compare commits
42 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
304a801e98 | ||
|
|
034ec2cc92 | ||
|
|
843a394b85 | ||
|
|
a331ce31a2 | ||
|
|
00a62dc066 | ||
|
|
1deb4350f3 | ||
|
|
0d0e3181cf | ||
|
|
cfd7d8a871 | ||
|
|
9c0718a5ae | ||
|
|
47a3c62ff0 | ||
|
|
66d699dbe9 | ||
|
|
e7c4542aaf | ||
|
|
7ca40f417a | ||
|
|
e2444337a0 | ||
|
|
f68aefeeb2 | ||
|
|
4c4f3f4eef | ||
|
|
5ccadc68f4 | ||
|
|
15a927847b | ||
|
|
ed619f0dff | ||
|
|
2502207a1e | ||
|
|
a17c37e389 | ||
|
|
c98bc38356 | ||
|
|
49835d7157 | ||
|
|
a01a435290 | ||
|
|
45e1196a63 | ||
|
|
3716104876 | ||
|
|
4c40e5871e | ||
|
|
78421d1440 | ||
|
|
98b28c0075 | ||
|
|
ac78fa2444 | ||
|
|
e80a155816 | ||
|
|
13499f1418 | ||
|
|
598b778be2 | ||
|
|
fe09c4f503 | ||
|
|
1eb36f4f54 | ||
|
|
ef39cbb199 | ||
|
|
43a35e9249 | ||
|
|
1cd90dd680 | ||
|
|
90f59986ee | ||
|
|
97e68022bc | ||
|
|
874b91ef6d | ||
|
|
7cc0446351 |
7
.vscode/settings.json
vendored
@@ -1,7 +0,0 @@
|
||||
{
|
||||
"cSpell.words": [
|
||||
"devs",
|
||||
"preact",
|
||||
"Preact"
|
||||
]
|
||||
}
|
||||
@@ -15,7 +15,7 @@ With help of the community, contributors are providing the library of new icons.
|
||||
|
||||
When designing new icons, the community is working with a set of design rules. This is to keep icons: recognizable, consistency in style, and readable on all sizes. The community likes to have creativity in new icons but conventional design is important to have recognizable icons.
|
||||
|
||||
Beside design, code is also important. Assets like icons in for example web projects can increase the transferred bytes significantly. With the growing internet, lucide has the responsibility to keep their assets small as possible. To achieve this, lucide uses SVG compression and specific code architecture for three-shaking abilities. With three-shaking used you will only ship the icons you used, helps you to keep the software small as possible when distributed.
|
||||
Beside design, code is also important. Assets like icons in for example web projects can increase the transferred bytes significantly. With the growing internet, lucide has the responsibility to keep their assets small as possible. To achieve this, lucide uses SVG compression and specific code architecture for tree-shaking abilities. With tree-shaking used you will only ship the icons you used, helps you to keep the software small as possible when distributed.
|
||||
|
||||
Lucide provides several official packages for: [Web (Vanilla)](https://lucide.dev/docs/lucide), [React](https://lucide.dev/docs/lucide-react), [Vue](https://lucide.dev/docs/lucide-vue), [Vue 3](https://lucide.dev/docs/lucide-vue-next), [Svelte](https://lucide.dev/docs/lucide-svelte),[Preact](https://lucide.dev/docs/lucide-preact), [Angular](https://lucide.dev/docs/lucide-angular), [NodeJS](https://lucide.dev/docs/lucide-static#nodejs) and [Flutter](https://lucide.dev/docs/lucide-flutter).
|
||||
|
||||
|
||||
@@ -11,7 +11,7 @@ This package include the following lucide implementations:
|
||||
|
||||
This package is suitable for very specific use cases for example if you want to use icon fonts, svg sprites, normal svgs or Common.js Svg strings in your javascript project.
|
||||
|
||||
> ⚠️ It is not recommended to use this package for svg sprites or icon fonts for web pages/applications, for prototyping it is ok. We recommend to bundlers for web applications to make sure you only bundle the used icons from this icon library (Threeshaking). Otherwise it will load all the icons, making you webpage loading slower. Threeshaking is only available in the packages: [lucide](lucide), [lucide-react](lucide-react), [lucide-vue](lucide-vue), [lucide-vue-next](lucide-vue-next), [lucide-angular](lucide-angular), [lucide-preact](lucide-preact)
|
||||
> ⚠️ It is not recommended to use this package for svg sprites or icon fonts for web pages/applications, for prototyping it is ok. We recommend to bundlers for web applications to make sure you only bundle the used icons from this icon library (Treeshaking). Otherwise it will load all the icons, making you webpage loading slower. Threeshaking is only available in the packages: [lucide](lucide), [lucide-react](lucide-react), [lucide-vue](lucide-vue), [lucide-vue-next](lucide-vue-next), [lucide-angular](lucide-angular), [lucide-preact](lucide-preact)
|
||||
|
||||
## Installation
|
||||
|
||||
|
||||
17
icons/align-center-horizontal.svg
Normal file
@@ -0,0 +1,17 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M2 12h20" />
|
||||
<path d="M10 16v4a2 2 0 01-2 2H6a2 2 0 01-2-2v-4" />
|
||||
<path d="M10 8V4a2 2 0 00-2-2H6a2 2 0 00-2 2v4" />
|
||||
<path d="M20 16v1a2 2 0 01-2 2h-2a2 2 0 01-2-2v-1" />
|
||||
<path d="M14 8V7c0-1.1.9-2 2-2h2a2 2 0 012 2v1" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 449 B |
17
icons/align-center-vertical.svg
Normal file
@@ -0,0 +1,17 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M12 2v20" />
|
||||
<path d="M8 10H4a2 2 0 01-2-2V6c0-1.1.9-2 2-2h4" />
|
||||
<path d="M16 10h4a2 2 0 002-2V6a2 2 0 00-2-2h-4" />
|
||||
<path d="M8 20H7a2 2 0 01-2-2v-2c0-1.1.9-2 2-2h1" />
|
||||
<path d="M16 14h1a2 2 0 012 2v2a2 2 0 01-2 2h-1" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 449 B |
15
icons/align-end-horizontal.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="4" y="2" width="6" height="16" rx="2" />
|
||||
<rect x="14" y="9" width="6" height="9" rx="2" />
|
||||
<path d="M22 22H2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 336 B |
15
icons/align-end-vertical.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="2" y="4" width="16" height="6" rx="2" />
|
||||
<rect x="9" y="14" width="9" height="6" rx="2" />
|
||||
<path d="M22 22V2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 336 B |
18
icons/align-horizontal-distribute-center.svg
Normal file
@@ -0,0 +1,18 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="4" y="5" width="6" height="14" rx="2" />
|
||||
<rect x="14" y="7" width="6" height="10" rx="2" />
|
||||
<path d="M17 22v-5" />
|
||||
<path d="M17 7V2" />
|
||||
<path d="M7 22v-3" />
|
||||
<path d="M7 5V2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 407 B |
16
icons/align-horizontal-distribute-end.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="4" y="5" width="6" height="14" rx="2" />
|
||||
<rect x="14" y="7" width="6" height="10" rx="2" />
|
||||
<path d="M10 2v20" />
|
||||
<path d="M20 2v20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 361 B |
16
icons/align-horizontal-distribute-start.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="4" y="5" width="6" height="14" rx="2" />
|
||||
<rect x="14" y="7" width="6" height="10" rx="2" />
|
||||
<path d="M4 2v20" />
|
||||
<path d="M14 2v20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 360 B |
15
icons/align-horizontal-justify-center.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="2" y="5" width="6" height="14" rx="2" />
|
||||
<rect x="16" y="7" width="6" height="10" rx="2" />
|
||||
<path d="M12 2v20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 337 B |
15
icons/align-horizontal-justify-end.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="2" y="5" width="6" height="14" rx="2" />
|
||||
<rect x="12" y="7" width="6" height="10" rx="2" />
|
||||
<path d="M22 2v20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 337 B |
15
icons/align-horizontal-justify-start.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="6" y="5" width="6" height="14" rx="2" />
|
||||
<rect x="16" y="7" width="6" height="10" rx="2" />
|
||||
<path d="M2 2v20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 336 B |
15
icons/align-horizontal-space-around.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="9" y="7" width="6" height="10" rx="2" />
|
||||
<path d="M4 22V2" />
|
||||
<path d="M20 22V2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 307 B |
16
icons/align-horizontal-space-between.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="3" y="5" width="6" height="14" rx="2" />
|
||||
<rect x="15" y="7" width="6" height="10" rx="2" />
|
||||
<path d="M3 2v20" />
|
||||
<path d="M21 2v20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 360 B |
15
icons/align-start-horizontal.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="4" y="6" width="6" height="16" rx="2" />
|
||||
<rect x="14" y="6" width="6" height="9" rx="2" />
|
||||
<path d="M22 2H2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 335 B |
15
icons/align-start-vertical.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="6" y="14" width="9" height="6" rx="2" />
|
||||
<rect x="6" y="4" width="16" height="6" rx="2" />
|
||||
<path d="M2 2v20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 335 B |
18
icons/align-vertical-distribute-center.svg
Normal file
@@ -0,0 +1,18 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="5" y="14" width="14" height="6" rx="2" />
|
||||
<rect x="7" y="4" width="10" height="6" rx="2" />
|
||||
<path d="M22 7h-5" />
|
||||
<path d="M7 7H1" />
|
||||
<path d="M22 17h-3" />
|
||||
<path d="M5 17H2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 407 B |
16
icons/align-vertical-distribute-end.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="5" y="14" width="14" height="6" rx="2" />
|
||||
<rect x="7" y="4" width="10" height="6" rx="2" />
|
||||
<path d="M2 20h20" />
|
||||
<path d="M2 10h20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 361 B |
16
icons/align-vertical-distribute-start.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="5" y="14" width="14" height="6" rx="2" />
|
||||
<rect x="7" y="4" width="10" height="6" rx="2" />
|
||||
<path d="M2 14h20" />
|
||||
<path d="M2 4h20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 360 B |
15
icons/align-vertical-justify-center.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="5" y="16" width="14" height="6" rx="2" />
|
||||
<rect x="7" y="2" width="10" height="6" rx="2" />
|
||||
<path d="M2 12h20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 337 B |
15
icons/align-vertical-justify-end.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="5" y="12" width="14" height="6" rx="2" />
|
||||
<rect x="7" y="2" width="10" height="6" rx="2" />
|
||||
<path d="M2 22h20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 337 B |
15
icons/align-vertical-justify-start.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="5" y="16" width="14" height="6" rx="2" />
|
||||
<rect x="7" y="6" width="10" height="6" rx="2" />
|
||||
<path d="M2 2h20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 336 B |
15
icons/align-vertical-space-around.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="7" y="9" width="10" height="6" rx="2" />
|
||||
<path d="M22 20H2" />
|
||||
<path d="M22 4H2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 307 B |
16
icons/align-vertical-space-between.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="5" y="15" width="14" height="6" rx="2" />
|
||||
<rect x="7" y="3" width="10" height="6" rx="2" />
|
||||
<path d="M2 21h20" />
|
||||
<path d="M2 3h20" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 360 B |
15
icons/baseline.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M4 20h16" />
|
||||
<path d="M6 16l6-12 6 12" />
|
||||
<path d="M8 12h8" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 286 B |
18
icons/cookie.svg
Normal file
@@ -0,0 +1,18 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M12 2a10 10 0 1010 10 4 4 0 01-5-5 4 4 0 01-5-5" />
|
||||
<path d="M8.5 8.5v.01" />
|
||||
<path d="M16 15.5v.01" />
|
||||
<path d="M12 12v.01" />
|
||||
<path d="M11 17v.01" />
|
||||
<path d="M7 14v.01" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 404 B |
14
icons/dice-1.svg
Normal file
@@ -0,0 +1,14 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
|
||||
<path d="M12 12h.01" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 294 B |
15
icons/dice-2.svg
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
|
||||
<path d="M15 9h.01" />
|
||||
<path d="M9 15h.01" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 318 B |
16
icons/dice-3.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
|
||||
<path d="M16 8h.01" />
|
||||
<path d="M12 12h.01" />
|
||||
<path d="M8 16h.01" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 344 B |
17
icons/dice-4.svg
Normal file
@@ -0,0 +1,17 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
|
||||
<path d="M16 8h.01" />
|
||||
<path d="M8 8h.01" />
|
||||
<path d="M8 16h.01" />
|
||||
<path d="M16 16h.01" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 368 B |
18
icons/dice-5.svg
Normal file
@@ -0,0 +1,18 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
|
||||
<path d="M16 8h.01" />
|
||||
<path d="M8 8h.01" />
|
||||
<path d="M8 16h.01" />
|
||||
<path d="M16 16h.01" />
|
||||
<path d="M12 12h.01" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 394 B |
19
icons/dice-6.svg
Normal file
@@ -0,0 +1,19 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
|
||||
<path d="M16 8h.01" />
|
||||
<path d="M16 12h.01" />
|
||||
<path d="M16 16h.01" />
|
||||
<path d="M8 8h.01" />
|
||||
<path d="M8 12h.01" />
|
||||
<path d="M8 16h.01" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 419 B |
17
icons/git-fork.svg
Normal file
@@ -0,0 +1,17 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<circle cx="12" cy="18" r="3" />
|
||||
<circle cx="6" cy="6" r="3" />
|
||||
<circle cx="18" cy="6" r="3" />
|
||||
<path d="M18 9v1a2 2 0 01-2 2H8a2 2 0 01-2-2V9" />
|
||||
<path d="M12 12v3" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 387 B |
21
icons/keyboard.svg
Normal file
@@ -0,0 +1,21 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="2" y="4" width="20" height="16" rx="2" ry="2" />
|
||||
<path d="M6 8h.001" />
|
||||
<path d="M10 8h.001" />
|
||||
<path d="M14 8h.001" />
|
||||
<path d="M18 8h.001" />
|
||||
<path d="M8 12h.001" />
|
||||
<path d="M12 12h.001" />
|
||||
<path d="M16 12h.001" />
|
||||
<path d="M7 16h10" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 475 B |
19
icons/locate-off.svg
Normal file
@@ -0,0 +1,19 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<line x1="2" x2="5" y1="12" y2="12" />
|
||||
<line x1="19" x2="22" y1="12" y2="12" />
|
||||
<line x1="12" x2="12" y1="2" y2="5" />
|
||||
<line x1="12" x2="12" y1="19" y2="22" />
|
||||
<path d="M7.11 7.11C5.83 8.39 5 10.1 5 12c0 3.87 3.13 7 7 7 1.9 0 3.61-.83 4.89-2.11" />
|
||||
<path d="M18.71 13.96c.19-.63.29-1.29.29-1.96 0-3.87-3.13-7-7-7-.67 0-1.33.1-1.96.29" />
|
||||
<line x1="2" x2="22" y1="2" y2="22" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 599 B |
16
icons/package-check.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M16 16l2 2 4-4" />
|
||||
<path d="M21 10V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l2-1.14" />
|
||||
<path d="M16.5 9.4L7.55 4.24" />
|
||||
<path d="M3.29 7L12 12m0 0l8.71-5M12 12v10" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 437 B |
16
icons/package-minus.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M16 16h6" />
|
||||
<path d="M21 10V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l2-1.14" />
|
||||
<path d="M16.5 9.4L7.55 4.24" />
|
||||
<path d="M3.29 7L12 12m0 0l8.71-5M12 12v10" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 431 B |
17
icons/package-plus.svg
Normal file
@@ -0,0 +1,17 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M16 16h6" />
|
||||
<path d="M19 13v6" />
|
||||
<path d="M21 10V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l2-1.14" />
|
||||
<path d="M16.5 9.4L7.55 4.24" />
|
||||
<path d="M3.29 7L12 12m0 0l8.71-5M12 12v10" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 455 B |
17
icons/package-search.svg
Normal file
@@ -0,0 +1,17 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M21 10V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l2-1.14" />
|
||||
<path d="M16.5 9.4L7.55 4.24" />
|
||||
<path d="M12 12v10M3.29 7L12 12 3.29 7zM12 12l8.71-5L12 12z" />
|
||||
<circle cx="18.5" cy="15.5" r="2.5" />
|
||||
<path d="M20.27 17.27L22 19" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 499 B |
16
icons/package-x.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M21 10V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l2-1.14" />
|
||||
<path d="M16.5 9.4L7.55 4.24" />
|
||||
<path d="M3.29 7L12 12m0 0l8.71-5M12 12v10" />
|
||||
<path d="M17 13l5 5m-5 0l5-5" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 442 B |
16
icons/palmtree.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M13 8c0-2.76-2.46-5-5.5-5S2 5.24 2 8h2l1-1 1 1h4" />
|
||||
<path d="M13 7.14A5.82 5.82 0 0116.5 6c3.04 0 5.5 2.24 5.5 5h-3l-1-1-1 1h-3" />
|
||||
<path d="M5.89 9.71c-2.15 2.15-2.3 5.47-.35 7.43l4.24-4.25.7-.7.71-.71 2.12-2.12c-1.95-1.96-5.27-1.8-7.42.35z" />
|
||||
<path d="M11 15.5c.5 2.5-.17 4.5-1 6.5h4c2-5.5-.5-12-1-14" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 534 B |
16
icons/rocket.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 00-2.91-.09z" />
|
||||
<path d="M12 15l-3-3a22 22 0 012-3.95A12.88 12.88 0 0122 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 01-4 2z" />
|
||||
<path d="M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0" />
|
||||
<path d="M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 528 B |
14
icons/stretch-horizontal.svg
Normal file
@@ -0,0 +1,14 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="2" y="4" width="20" height="6" rx="2" />
|
||||
<rect x="2" y="14" width="20" height="6" rx="2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 313 B |
14
icons/stretch-vertical.svg
Normal file
@@ -0,0 +1,14 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="4" y="2" width="6" height="20" rx="2" />
|
||||
<rect x="14" y="2" width="6" height="20" rx="2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 313 B |
@@ -9,6 +9,6 @@
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z" />
|
||||
<line x1="7" y1="7" x2="7.01" y2="7" />
|
||||
<path d="M2 12V2h10l9.44 9.44a2 2 0 0 1 0 2.82l-7.18 7.18a2 2 0 0 1-2.82 0L2 12Z" />
|
||||
<path d="M7 7h.01" />
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 341 B After Width: | Height: | Size: 319 B |
18
icons/waves.svg
Normal file
@@ -0,0 +1,18 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M2 6c.6.5 1.2 1 2.5 1C7 7 7 5 9.5 5c1.3 0 1.9.5 2.5 1" />
|
||||
<path d="M2 18c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
|
||||
<path d="M2 12c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
|
||||
<path d="M12 6c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
|
||||
<path d="M12 18c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
|
||||
<path d="M12 12c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 639 B |
@@ -61,7 +61,7 @@
|
||||
"husky": "^4.3.6",
|
||||
"jest": "^26.4.2",
|
||||
"lint-staged": "^10.5.3",
|
||||
"minimist": "^1.2.5",
|
||||
"minimist": "^1.2.6",
|
||||
"node-fetch": "^2.6.7",
|
||||
"prettier": "1.17.1",
|
||||
"rollup": "^2.7.3",
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "lucide-angular",
|
||||
"description": "A Lucide icon library package for Angular applications",
|
||||
"version": "0.16.29",
|
||||
"version": "0.17.15",
|
||||
"author": "SMAH1",
|
||||
"license": "ISC",
|
||||
"homepage": "https://lucide.dev",
|
||||
|
||||
@@ -9,9 +9,18 @@
|
||||
"worker": "dist/src/worker/worker.html"
|
||||
},
|
||||
"parameterOnly": false,
|
||||
"parameters": [{
|
||||
"name": "Icon",
|
||||
"key": "icon-name",
|
||||
"description": "Enter the name of the icon you want to insert."
|
||||
}]
|
||||
"parameters": [
|
||||
{
|
||||
"name": "Icon",
|
||||
"key": "icon-name",
|
||||
"description": "Enter the name of the icon you want to insert."
|
||||
},
|
||||
{
|
||||
"name": "Size",
|
||||
"key": "size",
|
||||
"description": "Enter the size of the icon.",
|
||||
"allowFreeform": true,
|
||||
"optional": true
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@emotion/core": "^10.0.14",
|
||||
"minimist": "^1.2.5",
|
||||
"minimist": "^1.2.6",
|
||||
"react": "^17.0.0",
|
||||
"react-dom": "^17.0.0"
|
||||
},
|
||||
|
||||
5
packages/lucide-figma/src/components/EditBar/EditBar.tsx
Normal file
@@ -0,0 +1,5 @@
|
||||
const EditBar = () => {
|
||||
|
||||
}
|
||||
|
||||
export default EditBar
|
||||
30
packages/lucide-figma/src/components/Menu/Menu.scss
Normal file
@@ -0,0 +1,30 @@
|
||||
.menu {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-shrink: 0;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
border-bottom: 1px solid var(--color-border, #e5e5e5);
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
font-weight: 500;
|
||||
font-size: 11px;
|
||||
color: var(--color-text-tertiary, #b3b3b3);
|
||||
padding: 0 8px;
|
||||
text-transform: capitalize;
|
||||
cursor: pointer;
|
||||
|
||||
&.active {
|
||||
color: var(--color-text, #333333);
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-right: 16px;
|
||||
}
|
||||
}
|
||||
23
packages/lucide-figma/src/components/Menu/Menu.tsx
Normal file
@@ -0,0 +1,23 @@
|
||||
import { useState } from 'react'
|
||||
import './Menu.scss'
|
||||
|
||||
interface MenuProps {
|
||||
page: string
|
||||
setPage: (page:string) => void
|
||||
}
|
||||
|
||||
const menuItems = ['icons', 'info']
|
||||
|
||||
const Menu = ({page, setPage = (page) => {}}: MenuProps) => {
|
||||
return (
|
||||
<nav className="menu">
|
||||
{ menuItems.map((menuItem) => (
|
||||
<div className={`menu-item ${page === menuItem ? 'active' : null }`} onClick={() => setPage(menuItem)}>
|
||||
{menuItem}
|
||||
</div>
|
||||
)) }
|
||||
</nav>
|
||||
)
|
||||
}
|
||||
|
||||
export default Menu
|
||||
1
packages/lucide-figma/src/components/Menu/index.ts
Normal file
@@ -0,0 +1 @@
|
||||
export { default } from './Menu'
|
||||
@@ -1,9 +1,11 @@
|
||||
.search-input {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.icon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 4px;
|
||||
left: 16px;
|
||||
}
|
||||
input {
|
||||
width: 100%;
|
||||
|
||||
@@ -1,24 +1,22 @@
|
||||
import { createElement, forwardRef } from 'react'
|
||||
|
||||
const SearchIcon = forwardRef((props: any, ref) => createElement(
|
||||
'svg',
|
||||
{
|
||||
xmlns: "http://www.w3.org/2000/svg",
|
||||
width: 32,
|
||||
height: 32,
|
||||
clipRule: 'evenodd',
|
||||
fillRule: 'evenodd',
|
||||
ref,
|
||||
...props,
|
||||
},
|
||||
[
|
||||
createElement(
|
||||
'path', {
|
||||
d: 'm20 15c0 2.7614-2.2386 5-5 5s-5-2.2386-5-5 2.2386-5 5-5 5 2.2386 5 5zm-1.1256 4.5815c-1.0453.8849-2.3975 1.4185-3.8744 1.4185-3.3137 0-6-2.6863-6-6s2.6863-6 6-6 6 2.6863 6 6c0 1.4769-.5336 2.8291-1.4185 3.8744l4.2721 4.272-.7072.7072z',
|
||||
key: 'path'
|
||||
}
|
||||
)
|
||||
]
|
||||
))
|
||||
|
||||
const SearchIcon = (props: any) => (
|
||||
<svg
|
||||
width="11"
|
||||
height="11"
|
||||
viewBox="0 0 11 11"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<path
|
||||
d="M6.453 7.16C5.776 7.687 4.924 8 4 8 1.79 8 0 6.21 0 4c0-2.21 1.79-4 4-4 2.21 0 4 1.79 4 4 0 .924-.314 1.776-.84 2.453l3.194 3.193-.708.707L6.453 7.16zM7 4c0 1.657-1.343 3-3 3-1.657 0-3-1.343-3-3 0-1.657 1.343-3 3-3 1.657 0 3 1.343 3 3z"
|
||||
fillRule="evenodd"
|
||||
fillOpacity="1"
|
||||
stroke="none"
|
||||
/>
|
||||
</svg>
|
||||
)
|
||||
|
||||
export default SearchIcon
|
||||
|
||||
@@ -9,6 +9,17 @@
|
||||
format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Inter;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: url('https://rsms.me/inter/font-files/Inter-Medium.woff2?v=3.9')
|
||||
format('woff2'),
|
||||
url('https://rsms.me/inter/font-files/Inter-Medium.woff?v=3.9')
|
||||
format('woff');
|
||||
}
|
||||
|
||||
:root {
|
||||
--color-blue: #18a0fb;
|
||||
--color-black: #333;
|
||||
@@ -47,3 +58,48 @@ footer {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.floating {
|
||||
position: absolute;
|
||||
bottom: -10px;
|
||||
left: 0;
|
||||
padding: 10px;
|
||||
background: blue;
|
||||
}
|
||||
|
||||
.info-page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.lucide-logo {
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
.version {
|
||||
margin-top: 8px;
|
||||
padding: 8px;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.link-list {
|
||||
width: 160px;
|
||||
margin: 0 auto;
|
||||
padding-top: 24px;
|
||||
}
|
||||
|
||||
.info-link {
|
||||
color: var(--color-blue);
|
||||
display: block;
|
||||
padding: 2px 0;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,15 +1,17 @@
|
||||
import { useEffect, useMemo, useState } from 'react'
|
||||
import { createReactComponent } from 'lucide-react'
|
||||
import ReactDOM from 'react-dom'
|
||||
import * as views from '../views'
|
||||
|
||||
type Views = typeof views
|
||||
|
||||
import IconButton from '../components/IconButton'
|
||||
import SearchInput from '../components/SearchInput'
|
||||
import useSearch, { Icon } from '../hooks/useSearch'
|
||||
|
||||
import { getIcons } from '../api/fetchIcons'
|
||||
import './interface.scss'
|
||||
import Menu from '../components/Menu'
|
||||
|
||||
function App() {
|
||||
const [page, setPage] = useState('icons')
|
||||
const [query, setQuery] = useState('')
|
||||
const [icons, setIcons] = useState<Icon[]>([])
|
||||
const [tags, setTags] = useState({})
|
||||
@@ -33,33 +35,20 @@ function App() {
|
||||
return null
|
||||
}
|
||||
|
||||
const View = views?.[page as keyof Views] ?? views.icons
|
||||
|
||||
return (
|
||||
<div>
|
||||
<SearchInput
|
||||
value={query}
|
||||
iconCount={icons.length}
|
||||
onChange={(event) => setQuery(event.target.value)}
|
||||
<Menu page={page} setPage={setPage}/>
|
||||
<View
|
||||
{...{
|
||||
query,
|
||||
setQuery,
|
||||
searchResults,
|
||||
icons,
|
||||
version
|
||||
}}
|
||||
/>
|
||||
<main>
|
||||
<div className='icon-grid'>
|
||||
{searchResults.map(([name, iconNode] :any) => (
|
||||
<IconButton
|
||||
name={name}
|
||||
key={name}
|
||||
component={createReactComponent(name, iconNode)}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<footer>
|
||||
<a
|
||||
href="https://lucide.dev"
|
||||
target="_blank"
|
||||
className='footer-link'
|
||||
>
|
||||
Lucide v{version}
|
||||
</a>
|
||||
</footer>
|
||||
</main>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -5,6 +5,12 @@ figma.showUI(__uiFiles__.worker, { visible: false })
|
||||
|
||||
let cachedIcons: LucideIcons
|
||||
|
||||
type InsertableNodes = FrameNode | GroupNode
|
||||
|
||||
function isInsertableNode (node: SceneNode): node is InsertableNodes {
|
||||
return ['FRAME', 'GROUP'].includes(node.type)
|
||||
}
|
||||
|
||||
const setResults = ({result, query, lucideIcons} : { result: SuggestionResults, query: string, lucideIcons: LucideIcons }) => {
|
||||
const icons = Object.entries(lucideIcons.iconNodes);
|
||||
|
||||
@@ -16,33 +22,65 @@ const setResults = ({result, query, lucideIcons} : { result: SuggestionResults,
|
||||
result.setSuggestions(suggestions)
|
||||
}
|
||||
|
||||
// const styles = figma.getLocalPaintStyles();
|
||||
// const styleNames = styles.map((style) => style.name);
|
||||
// console.log(styleNames);
|
||||
|
||||
figma.parameters.on('input', async ({ parameters, key, query, result }) => {
|
||||
if (key === 'icon-name') {
|
||||
console.log('typ tpy', query);
|
||||
cachedIcons = await figma.clientStorage.getAsync(`lucide-icons`)
|
||||
console.log('cachedIcons', cachedIcons);
|
||||
|
||||
if(cachedIcons && cachedIcons.iconNodes && cachedIcons.tags) {
|
||||
setResults({result, query, lucideIcons: cachedIcons})
|
||||
}
|
||||
}
|
||||
if(key === 'size') {
|
||||
const iconSizes = [24,36,48,72]
|
||||
result.setSuggestions(iconSizes.map((size)=>({
|
||||
name: size.toString(),
|
||||
data: size
|
||||
})))
|
||||
}
|
||||
})
|
||||
|
||||
const drawIcon = ({icon: {name, svg}}: any) => {
|
||||
const drawIcon = ({icon: {name, svg, size }}: any) => {
|
||||
const min = 0
|
||||
const max = 100
|
||||
const randomPosition = () => Math.floor(Math.random() * (max - min + 1) + min)
|
||||
|
||||
const icon = figma.createNodeFromSvg(svg)
|
||||
icon.setPluginData('isLucideIcon', 'true')
|
||||
icon.setPluginData('iconName', name)
|
||||
|
||||
const pluginData = icon.getPluginData('isLucideIcon')
|
||||
|
||||
icon.name = name
|
||||
icon.x = Math.round(figma.viewport.center.x + randomPosition())
|
||||
icon.y = Math.round(figma.viewport.center.y + randomPosition())
|
||||
|
||||
if(figma.currentPage.selection.length) {
|
||||
let currentSelection = figma.currentPage.selection[0]
|
||||
const isLucideIcon = currentSelection.getPluginData('isLucideIcon')
|
||||
|
||||
// if(isLucideIcon && currentSelection?.parent) {
|
||||
// return
|
||||
// // currentSelection = currentSelection.parent as SceneNode
|
||||
// }
|
||||
|
||||
if(!isLucideIcon && isInsertableNode(currentSelection)) {
|
||||
icon.x = currentSelection.type === 'GROUP' ? currentSelection.x : 0
|
||||
icon.y = currentSelection.type === 'GROUP' ? currentSelection.y : 0
|
||||
|
||||
currentSelection.appendChild(icon)
|
||||
}
|
||||
}
|
||||
|
||||
figma.currentPage.selection = [icon]
|
||||
|
||||
// lock children
|
||||
icon.children.forEach((vectorNode, key) => {
|
||||
icon.children[key].locked = true
|
||||
});
|
||||
// icon.children.forEach((vectorNode, key) => {
|
||||
// icon.children[key].locked = true
|
||||
// });
|
||||
}
|
||||
|
||||
const setCachedIcons = async (pluginMessage: any) => {
|
||||
@@ -66,7 +104,6 @@ const getCachedIcons = async () => {
|
||||
getCachedIcons()
|
||||
|
||||
figma.ui.onmessage = (event) => {
|
||||
console.log(event, 'main');
|
||||
switch (event.type) {
|
||||
case "drawIcon":
|
||||
drawIcon(event)
|
||||
@@ -90,7 +127,12 @@ figma.ui.onmessage = (event) => {
|
||||
|
||||
figma.on('run', event => {
|
||||
if(event.parameters) {
|
||||
figma.ui.postMessage({ type: 'getSvg', iconName: event.parameters['icon-name'], cachedIcons })
|
||||
figma.ui.postMessage({
|
||||
type: 'getSvg',
|
||||
iconName: event.parameters['icon-name'],
|
||||
size: event.parameters['size'],
|
||||
cachedIcons
|
||||
})
|
||||
} else {
|
||||
figma.showUI(__uiFiles__.interface, { width: 300, height: 400 })
|
||||
}
|
||||
|
||||
53
packages/lucide-figma/src/views/Icons.tsx
Normal file
@@ -0,0 +1,53 @@
|
||||
import { createReactComponent } from 'lucide-react'
|
||||
|
||||
import IconButton from '../components/IconButton'
|
||||
import SearchInput from '../components/SearchInput'
|
||||
import { Icon } from '../hooks/useSearch'
|
||||
|
||||
interface PageProps {
|
||||
query: string
|
||||
setQuery: (query:string) => void
|
||||
searchResults: Icon[]
|
||||
icons: Icon[]
|
||||
version: string
|
||||
}
|
||||
|
||||
const Icons = ({
|
||||
query,
|
||||
setQuery,
|
||||
searchResults,
|
||||
icons,
|
||||
version
|
||||
}: PageProps) => {
|
||||
return (
|
||||
<>
|
||||
<SearchInput
|
||||
value={query}
|
||||
iconCount={icons.length}
|
||||
onChange={(event) => setQuery(event.target.value)}
|
||||
/>
|
||||
<main>
|
||||
<div className='icon-grid'>
|
||||
{searchResults.map(([name, iconNode] :any) => (
|
||||
<IconButton
|
||||
name={name}
|
||||
key={name}
|
||||
component={createReactComponent(name, iconNode)}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<footer>
|
||||
<a
|
||||
href="https://lucide.dev"
|
||||
target="_blank"
|
||||
className='footer-link'
|
||||
>
|
||||
Lucide v{version}
|
||||
</a>
|
||||
</footer>
|
||||
</main>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Icons
|
||||
64
packages/lucide-figma/src/views/Info.tsx
Normal file
@@ -0,0 +1,64 @@
|
||||
import { SyntheticEvent } from "react"
|
||||
|
||||
interface PageProps {
|
||||
version: string
|
||||
}
|
||||
|
||||
const Info = ({ version }: PageProps) => {
|
||||
const menuItems = [
|
||||
{
|
||||
name: 'Report a bug',
|
||||
url: 'https://github.com/lucide-icons/lucide/issues'
|
||||
},
|
||||
{
|
||||
name: 'Contribute an icon',
|
||||
url: 'https://github.com/lucide-icons/lucide/blob/master/CONTRIBUTING.md'
|
||||
},
|
||||
{
|
||||
name: 'Website',
|
||||
url: 'https://lucide.dev'
|
||||
},
|
||||
{
|
||||
name: 'Repository',
|
||||
url: 'https://github.com/lucide-icons/lucide'
|
||||
},
|
||||
{
|
||||
name: 'License',
|
||||
url: 'https://lucide.dev/license'
|
||||
},
|
||||
{
|
||||
name: 'Community Page',
|
||||
url: 'https://www.figma.com/community/plugin/939567362549682242/Lucide-Icons'
|
||||
},
|
||||
{
|
||||
name: 'Supported Frameworks',
|
||||
url: 'https://lucide.dev/packages'
|
||||
}
|
||||
]
|
||||
|
||||
const onClick = (url: string) => (event: SyntheticEvent) => {
|
||||
event.preventDefault()
|
||||
|
||||
window.open(url,'_blank')
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="info-page">
|
||||
<img src="https://lucide.dev/logo-text.svg" alt="Lucide Logo" className="lucide-logo"/>
|
||||
<p className='version'>
|
||||
v{version}
|
||||
</p>
|
||||
<section className="link-list">
|
||||
{
|
||||
menuItems.map(({ name, url }) => (
|
||||
<a href={url} key={name} aria-label={name} className="info-link" onClick={onClick(url)}>
|
||||
{name}
|
||||
</a>
|
||||
))
|
||||
}
|
||||
</section>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Info
|
||||
2
packages/lucide-figma/src/views/index.ts
Normal file
@@ -0,0 +1,2 @@
|
||||
export { default as icons } from './Icons'
|
||||
export { default as info } from './Info'
|
||||
@@ -14,20 +14,26 @@ const getLatestIcons = async ({ cachedIcons }: any) => {
|
||||
}, "*")
|
||||
}
|
||||
|
||||
const getSvg = async ({ cachedIcons, iconName }: { cachedIcons: LucideIcons, iconName: string }) => {
|
||||
const getSvg = async ({ cachedIcons, iconName, size = 24 }: { cachedIcons: LucideIcons, iconName: string, size: number }) => {
|
||||
if (!cachedIcons) {
|
||||
return;
|
||||
}
|
||||
|
||||
console.log( iconName, size)
|
||||
|
||||
const iconNode = cachedIcons.iconNodes[iconName];
|
||||
|
||||
if (iconNode) {
|
||||
const IconComponent = createReactComponent(iconName, iconNode)
|
||||
const svg = renderToString(createElement(IconComponent));
|
||||
const svg = renderToString(createElement(IconComponent, { size }));
|
||||
|
||||
parent.postMessage({ pluginMessage: {
|
||||
type: 'drawIcon',
|
||||
icon: { name, svg }
|
||||
icon: {
|
||||
name: iconName,
|
||||
svg,
|
||||
size
|
||||
}
|
||||
}}, '*')
|
||||
|
||||
parent.postMessage({ pluginMessage: {
|
||||
@@ -56,5 +62,3 @@ window.onmessage = async (event) => {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
console.log('Hello world!')
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
name: lucide_icons
|
||||
description: A Lucide icon library package for Flutter applications. Fork of Feather Icons, open for anyone to contribute icons.
|
||||
version: 0.16.29
|
||||
version: 0.17.15
|
||||
homepage: https://lucide.dev
|
||||
repository: https://github.com/lucide-icons/lucide
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "lucide-preact",
|
||||
"description": "A Lucide icon library package for Preact applications",
|
||||
"version": "0.16.29",
|
||||
"version": "0.17.15",
|
||||
"license": "ISC",
|
||||
"homepage": "https://lucide.dev",
|
||||
"bugs": "https://github.com/lucide-icons/lucide/issues",
|
||||
|
||||
@@ -16,7 +16,7 @@ npm install lucide-react
|
||||
|
||||
## How to use
|
||||
|
||||
It's build with ESmodules so it's completely threeshakable.
|
||||
It's built with ES modules so it's completely threeshakable.
|
||||
Each icon can be imported as a react component.
|
||||
|
||||
### Example
|
||||
@@ -25,9 +25,7 @@ You can pass additional props to adjust the icon.
|
||||
|
||||
``` js
|
||||
import { Camera } from 'lucide-react';
|
||||
// Returns ReactComponent
|
||||
|
||||
// Usage
|
||||
const App = () => {
|
||||
return <Camera color="red" size={48}/>
|
||||
};
|
||||
@@ -48,19 +46,16 @@ export default App;
|
||||
You can also pass custom props that will be added in the svg as attributes.
|
||||
|
||||
``` js
|
||||
// Usage
|
||||
const App = () => {
|
||||
return <Camera fill="red"/>
|
||||
};
|
||||
```
|
||||
|
||||
### One generic icon component
|
||||
### Generic icon component
|
||||
|
||||
It is possible to create one generic icon component to load icons.
|
||||
It is possible to create a generic icon component to load icons.
|
||||
|
||||
> :warning: Example below importing all EsModules, caution using this example, not recommended when you using bundlers, your application build size will grow strongly.
|
||||
|
||||
#### Icon Component Example
|
||||
> :warning: The example below is importing all ES modules. This is **not** recommended when you using a bundler since your application build size will grow substantially.
|
||||
|
||||
``` js
|
||||
import * as icons from 'lucide-react';
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "lucide-react",
|
||||
"description": "A Lucide icon library package for React applications",
|
||||
"version": "0.16.29",
|
||||
"version": "0.17.15",
|
||||
"license": "ISC",
|
||||
"homepage": "https://lucide.dev",
|
||||
"bugs": "https://github.com/lucide-icons/lucide/issues",
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "lucide-svelte",
|
||||
"description": "A Lucide icon library package for Svelte applications",
|
||||
"version": "0.16.26-beta.0",
|
||||
"version": "0.17.15",
|
||||
"license": "ISC",
|
||||
"homepage": "https://lucide.dev",
|
||||
"bugs": "https://github.com/lucide-icons/lucide/issues",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "lucide-vue-next",
|
||||
"version": "0.16.29",
|
||||
"version": "0.17.15",
|
||||
"author": "Eric Fennis",
|
||||
"description": "A Lucide icon library package for Vue 3 applications",
|
||||
"license": "ISC",
|
||||
@@ -30,14 +30,14 @@
|
||||
"test:watch": "jest --watchAll"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@testing-library/vue": "^6.4.2",
|
||||
"@vue/compiler-sfc": "3.0.1",
|
||||
"@vue/test-utils": "2.0.0-rc.18",
|
||||
"jest-serializer-vue": "^2.0.2",
|
||||
"@testing-library/vue": "^6.4.2",
|
||||
"vue": "3.0.6",
|
||||
"vue-jest": "^5.0.0-alpha.10"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": "3.0.1"
|
||||
"vue": ">=3.0.1"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "lucide-vue",
|
||||
"version": "0.16.29",
|
||||
"version": "0.17.15",
|
||||
"author": "Eric Fennis",
|
||||
"description": "A Lucide icon library package for Vue 2 applications",
|
||||
"license": "ISC",
|
||||
@@ -28,13 +28,13 @@
|
||||
"test:watch": "jest --watchAll"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@testing-library/jest-dom": "^5.16.2",
|
||||
"@testing-library/vue": "^5.8.2",
|
||||
"@vue/test-utils": "^1.1.2",
|
||||
"jest-serializer-vue": "^2.0.2",
|
||||
"vue": "^2.6.12",
|
||||
"vue-jest": "^3.0.7",
|
||||
"vue-template-compiler": "^2.6.12",
|
||||
"@testing-library/jest-dom": "^5.16.2",
|
||||
"@testing-library/vue": "^5.8.2"
|
||||
"vue-template-compiler": "^2.6.12"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": "^2.6.12"
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "lucide",
|
||||
"description": "A Lucide icon library package for web and javascript applications.",
|
||||
"version": "0.16.29",
|
||||
"version": "0.17.15",
|
||||
"license": "ISC",
|
||||
"homepage": "https://lucide.dev",
|
||||
"bugs": "https://github.com/lucide-icons/lucide/issues",
|
||||
|
||||
@@ -1,3 +0,0 @@
|
||||
module.exports = {
|
||||
presets: ['next/babel'],
|
||||
};
|
||||
1
site/next-env.d.ts
vendored
@@ -1,5 +1,4 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/types/global" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
|
||||
@@ -1,19 +1,13 @@
|
||||
/* eslint-disable no-undef */
|
||||
module.exports = {
|
||||
webpack: (config, options) => {
|
||||
webpack(config) {
|
||||
config.module.rules.push({
|
||||
test: /\.svg$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'babel-loader',
|
||||
},
|
||||
{
|
||||
loader: 'react-svg-loader',
|
||||
options: {
|
||||
jsx: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
issuer: {
|
||||
and: [/\.(js|ts)x?$/],
|
||||
},
|
||||
|
||||
use: ['@svgr/webpack'],
|
||||
});
|
||||
|
||||
return config;
|
||||
|
||||
@@ -19,6 +19,7 @@
|
||||
"@mdx-js/loader": "^1.6.22",
|
||||
"@mdx-js/react": "^1.6.22",
|
||||
"@next/mdx": "^11.0.0",
|
||||
"@svgr/webpack": "^6.2.1",
|
||||
"downloadjs": "^1.4.7",
|
||||
"framer-motion": "^4",
|
||||
"fuse.js": "^6.5.3",
|
||||
@@ -27,12 +28,12 @@
|
||||
"jszip": "^3.7.0",
|
||||
"lodash": "^4.17.20",
|
||||
"lucide-react": "0.14.0",
|
||||
"next": "^11.1.3",
|
||||
"next": "12",
|
||||
"next-mdx-remote": "^3.0.2",
|
||||
"prism-react-renderer": "^1.2.1",
|
||||
"react": "^17.0.1",
|
||||
"react": "^17.0.2",
|
||||
"react-color": "^2.19.3",
|
||||
"react-dom": "^17.0.1",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-svg-loader": "^3.0.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
3
site/public/framework-logos/laravel.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="34.6" height="36" viewBox="0 0 50 52" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M49.626 11.564a.809.809 0 0 1 .028.209v10.972a.8.8 0 0 1-.402.694l-9.209 5.302V39.25c0 .286-.152.55-.4.694L20.42 51.01c-.044.025-.092.041-.14.058-.018.006-.035.017-.054.022a.805.805 0 0 1-.41 0c-.022-.006-.042-.018-.063-.026-.044-.016-.09-.03-.132-.054L.402 39.944A.801.801 0 0 1 0 39.25V6.334c0-.072.01-.142.028-.21.006-.023.02-.044.028-.067.015-.042.029-.085.051-.124.015-.026.037-.047.055-.071.023-.032.044-.065.071-.093.023-.023.053-.04.079-.06.029-.024.055-.05.088-.069h.001l9.61-5.533a.802.802 0 0 1 .8 0l9.61 5.533h.002c.032.02.059.045.088.068.026.02.055.038.078.06.028.029.048.062.072.094.017.024.04.045.054.071.023.04.036.082.052.124.008.023.022.044.028.068a.809.809 0 0 1 .028.209v20.559l8.008-4.611v-10.51c0-.07.01-.141.028-.208.007-.024.02-.045.028-.068.016-.042.03-.085.052-.124.015-.026.037-.047.054-.071.024-.032.044-.065.072-.093.023-.023.052-.04.078-.06.03-.024.056-.05.088-.069h.001l9.611-5.533a.801.801 0 0 1 .8 0l9.61 5.533c.034.02.06.045.09.068.025.02.054.038.077.06.028.029.048.062.072.094.018.024.04.045.054.071.023.039.036.082.052.124.009.023.022.044.028.068zm-1.574 10.718v-9.124l-3.363 1.936-4.646 2.675v9.124l8.01-4.611zm-9.61 16.505v-9.13l-4.57 2.61-13.05 7.448v9.216l17.62-10.144zM1.602 7.719v31.068L19.22 48.93v-9.214l-9.204-5.209-.003-.002-.004-.002c-.031-.018-.057-.044-.086-.066-.025-.02-.054-.036-.076-.058l-.002-.003c-.026-.025-.044-.056-.066-.084-.02-.027-.044-.05-.06-.078l-.001-.003c-.018-.03-.029-.066-.042-.1-.013-.03-.03-.058-.038-.09v-.001c-.01-.038-.012-.078-.016-.117-.004-.03-.012-.06-.012-.09v-.002-21.481L4.965 9.654 1.602 7.72zm8.81-5.994L2.405 6.334l8.005 4.609 8.006-4.61-8.006-4.608zm4.164 28.764l4.645-2.674V7.719l-3.363 1.936-4.646 2.675v20.096l3.364-1.937zM39.243 7.164l-8.006 4.609 8.006 4.609 8.005-4.61-8.005-4.608zm-.801 10.605l-4.646-2.675-3.363-1.936v9.124l4.645 2.674 3.364 1.937v-9.124zM20.02 38.33l11.743-6.704 5.87-3.35-8-4.606-9.211 5.303-8.395 4.833 7.993 4.524z" fill="#FF2D20" fill-rule="evenodd"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
@@ -11,6 +11,8 @@ import Vue3Logo from '../../public/framework-logos/vue-next.svg';
|
||||
import PreactLogo from '../../public/framework-logos/preact.svg';
|
||||
import AngularLogo from '../../public/framework-logos/angular.svg';
|
||||
import FlutterLogo from '../../public/framework-logos/flutter.svg';
|
||||
import SvelteLogo from '../../public/framework-logos/svelte.svg';
|
||||
import LaravelLogo from '../../public/framework-logos/laravel.svg';
|
||||
|
||||
function generateZip(icons) {
|
||||
const zip = new JSZip();
|
||||
@@ -50,6 +52,11 @@ const Header = ({ data }) => {
|
||||
Logo: Vue3Logo,
|
||||
href: '/docs/lucide-vue-next',
|
||||
},
|
||||
{
|
||||
name: 'lucide-svelte',
|
||||
Logo: SvelteLogo,
|
||||
href: '/docs/lucide-svelte',
|
||||
},
|
||||
{
|
||||
name: 'lucide-preact',
|
||||
Logo: PreactLogo,
|
||||
@@ -65,6 +72,11 @@ const Header = ({ data }) => {
|
||||
Logo: FlutterLogo,
|
||||
href: '/docs/lucide-flutter',
|
||||
},
|
||||
{
|
||||
name: 'lucide-laravel',
|
||||
Logo: LaravelLogo,
|
||||
href: 'https://github.com/mallardduck/blade-lucide-icons',
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
|
||||
@@ -14,7 +14,7 @@ const IconList = memo(({ icons }: IconListProps) => {
|
||||
|
||||
return (
|
||||
<Grid templateColumns={`repeat(auto-fill, minmax(150px, 1fr))`} gap={5} marginBottom="320px">
|
||||
{icons.map((icon) => {
|
||||
{icons.map(icon => {
|
||||
return (
|
||||
<Link
|
||||
key={icon.name}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Button, ButtonProps, Flex, Text, useToast } from '@chakra-ui/react';
|
||||
import { Box, Button, ButtonProps, Flex, Text, useToast } from '@chakra-ui/react';
|
||||
import download from 'downloadjs';
|
||||
import copy from 'copy-to-clipboard';
|
||||
import { memo, useContext } from 'react';
|
||||
@@ -22,8 +22,10 @@ const IconListItem = ({ name, content, src, onClick }: IconListItemProps) => {
|
||||
variant="ghost"
|
||||
borderWidth="1px"
|
||||
rounded="lg"
|
||||
padding={16}
|
||||
padding={2}
|
||||
height={32}
|
||||
position="relative"
|
||||
whiteSpace="normal"
|
||||
onClick={event => {
|
||||
if (event.shiftKey) {
|
||||
copy(src);
|
||||
@@ -44,15 +46,21 @@ const IconListItem = ({ name, content, src, onClick }: IconListItemProps) => {
|
||||
key={name}
|
||||
alignItems="center"
|
||||
>
|
||||
<Flex direction="column" align="center" justify="center">
|
||||
<IconWrapper
|
||||
content={content}
|
||||
stroke={color}
|
||||
strokeWidth={strokeWidth}
|
||||
height={size}
|
||||
width={size}
|
||||
/>
|
||||
<Text marginTop={5}>{name}</Text>
|
||||
<Flex direction="column" align="center" justify="stretch" width="100%" gap={4}>
|
||||
<Flex flex={2} flexBasis="100%" minHeight={10} align="flex-end">
|
||||
<IconWrapper
|
||||
content={content}
|
||||
stroke={color}
|
||||
strokeWidth={strokeWidth}
|
||||
height={size}
|
||||
width={size}
|
||||
/>
|
||||
</Flex>
|
||||
<Flex flex={1} minHeight={10} align="center">
|
||||
<Text wordBreak="break-word" maxWidth="100%">
|
||||
{name}
|
||||
</Text>
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Button>
|
||||
);
|
||||
|
||||
@@ -1,7 +1,11 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ESNext",
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"lib": [
|
||||
"dom",
|
||||
"dom.iterable",
|
||||
"esnext"
|
||||
],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"strict": false,
|
||||
@@ -12,8 +16,17 @@
|
||||
"moduleResolution": "node",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"jsx": "preserve"
|
||||
"jsx": "preserve",
|
||||
"incremental": true
|
||||
},
|
||||
"exclude": ["node_modules", "use-popper.d.ts", "*.md"],
|
||||
"include": ["next-env.d.ts", "src/**/*.ts", "src/**/*.tsx"]
|
||||
"exclude": [
|
||||
"node_modules",
|
||||
"use-popper.d.ts",
|
||||
"*.md"
|
||||
],
|
||||
"include": [
|
||||
"next-env.d.ts",
|
||||
"src/**/*.ts",
|
||||
"src/**/*.tsx"
|
||||
]
|
||||
}
|
||||
|
||||
4230
site/yarn.lock
287
tags.json
@@ -46,21 +46,172 @@
|
||||
"danger"
|
||||
],
|
||||
"align-center": [
|
||||
"text alignment",
|
||||
"text",
|
||||
"alignment",
|
||||
"center"
|
||||
],
|
||||
"align-center-horizontal": [
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-center-vertical": [
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-end-horizontal": [
|
||||
"items",
|
||||
"bottom",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-end-vertical": [
|
||||
"items",
|
||||
"right",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-horizontal-distribute-center": [
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"space",
|
||||
"evenly",
|
||||
"around"
|
||||
],
|
||||
"align-horizontal-distribute-end": [
|
||||
"right",
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-horizontal-distribute-start": [
|
||||
"left",
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-horizontal-justify-center": [
|
||||
"center",
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-horizontal-justify-end": [
|
||||
"right",
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-horizontal-justify-start": [
|
||||
"left",
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-horizontal-space-around": [
|
||||
"center",
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"distribute",
|
||||
"between"
|
||||
],
|
||||
"align-horizontal-space-between": [
|
||||
"around",
|
||||
"items",
|
||||
"bottom",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-justify": [
|
||||
"text alignment",
|
||||
"text",
|
||||
"alignment",
|
||||
"justified"
|
||||
],
|
||||
"align-left": [
|
||||
"text alignment",
|
||||
"text",
|
||||
"alignment",
|
||||
"left"
|
||||
],
|
||||
"align-right": [
|
||||
"text alignment",
|
||||
"text",
|
||||
"alignment",
|
||||
"right"
|
||||
],
|
||||
"align-start-horizontal": [
|
||||
"top",
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-start-vertical": [
|
||||
"left",
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-vertical-distribute-center": [
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"space",
|
||||
"evenly",
|
||||
"around"
|
||||
],
|
||||
"align-vertical-distribute-end": [
|
||||
"bottom",
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-vertical-distribute-start": [
|
||||
"top",
|
||||
"items",
|
||||
"flex",
|
||||
"justify"
|
||||
],
|
||||
"align-vertical-justify-center": [
|
||||
"center",
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"distribute",
|
||||
"between"
|
||||
],
|
||||
"align-vertical-justify-end": [
|
||||
"bottom",
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"distribute",
|
||||
"between"
|
||||
],
|
||||
"align-vertical-justify-start": [
|
||||
"top",
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"distribute",
|
||||
"between"
|
||||
],
|
||||
"align-vertical-space-around": [
|
||||
"center",
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"distribute",
|
||||
"between"
|
||||
],
|
||||
"align-vertical-space-between": [
|
||||
"center",
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"distribute",
|
||||
"between"
|
||||
],
|
||||
"anchor": [
|
||||
"ship"
|
||||
],
|
||||
@@ -160,6 +311,11 @@
|
||||
"diagram",
|
||||
"graph"
|
||||
],
|
||||
"baseline": [
|
||||
"text",
|
||||
"format",
|
||||
"color"
|
||||
],
|
||||
"battery": [
|
||||
"power",
|
||||
"electricity"
|
||||
@@ -249,7 +405,8 @@
|
||||
],
|
||||
"bold": [
|
||||
"text",
|
||||
"strong"
|
||||
"strong",
|
||||
"format"
|
||||
],
|
||||
"book": [
|
||||
"read",
|
||||
@@ -607,6 +764,12 @@
|
||||
"user"
|
||||
],
|
||||
"contrast": [],
|
||||
"cookie": [
|
||||
"biscuit",
|
||||
"privacy",
|
||||
"legal",
|
||||
"food"
|
||||
],
|
||||
"copy": [
|
||||
"clone",
|
||||
"duplicate"
|
||||
@@ -682,6 +845,42 @@
|
||||
"delete": [
|
||||
"remove"
|
||||
],
|
||||
"dice-1": [
|
||||
"dice",
|
||||
"random",
|
||||
"tabletop",
|
||||
"1"
|
||||
],
|
||||
"dice-2": [
|
||||
"dice",
|
||||
"random",
|
||||
"tabletop",
|
||||
"2"
|
||||
],
|
||||
"dice-3": [
|
||||
"dice",
|
||||
"random",
|
||||
"tabletop",
|
||||
"3"
|
||||
],
|
||||
"dice-4": [
|
||||
"dice",
|
||||
"random",
|
||||
"tabletop",
|
||||
"4"
|
||||
],
|
||||
"dice-5": [
|
||||
"dice",
|
||||
"random",
|
||||
"tabletop",
|
||||
"5"
|
||||
],
|
||||
"dice-6": [
|
||||
"dice",
|
||||
"random",
|
||||
"tabletop",
|
||||
"6"
|
||||
],
|
||||
"disc": [
|
||||
"album",
|
||||
"cd",
|
||||
@@ -971,6 +1170,10 @@
|
||||
"code",
|
||||
"version control"
|
||||
],
|
||||
"git-fork": [
|
||||
"code",
|
||||
"version control"
|
||||
],
|
||||
"git-merge": [
|
||||
"code",
|
||||
"version control"
|
||||
@@ -1143,7 +1346,8 @@
|
||||
],
|
||||
"italic": [
|
||||
"oblique",
|
||||
"text"
|
||||
"text",
|
||||
"format"
|
||||
],
|
||||
"japanese-yen": [
|
||||
"currency",
|
||||
@@ -1156,6 +1360,12 @@
|
||||
"authentication",
|
||||
"secure"
|
||||
],
|
||||
"keyboard": [
|
||||
"layout",
|
||||
"spell",
|
||||
"settings",
|
||||
"mouse"
|
||||
],
|
||||
"landmark": [
|
||||
"bank",
|
||||
"building",
|
||||
@@ -1289,6 +1499,12 @@
|
||||
"location",
|
||||
"cross"
|
||||
],
|
||||
"locate-off": [
|
||||
"map",
|
||||
"gps",
|
||||
"location",
|
||||
"cross"
|
||||
],
|
||||
"lock": [
|
||||
"security",
|
||||
"password",
|
||||
@@ -1496,10 +1712,36 @@
|
||||
"box",
|
||||
"container"
|
||||
],
|
||||
"package-check": [
|
||||
"confirm",
|
||||
"verified"
|
||||
],
|
||||
"package-minus": [
|
||||
"delete",
|
||||
"remove"
|
||||
],
|
||||
"package-plus": [
|
||||
"new",
|
||||
"add",
|
||||
"create"
|
||||
],
|
||||
"package-search": [
|
||||
"find",
|
||||
"product process"
|
||||
],
|
||||
"package-x": [
|
||||
"delete",
|
||||
"remove"
|
||||
],
|
||||
"palette": [
|
||||
"color",
|
||||
"theme"
|
||||
],
|
||||
"palmtree": [
|
||||
"vacation",
|
||||
"leisure",
|
||||
"island"
|
||||
],
|
||||
"paperclip": [
|
||||
"attachment",
|
||||
"file"
|
||||
@@ -1684,6 +1926,13 @@
|
||||
"rewind": [
|
||||
"music"
|
||||
],
|
||||
"rocket": [
|
||||
"release",
|
||||
"boost",
|
||||
"launch",
|
||||
"space",
|
||||
"version"
|
||||
],
|
||||
"rocking-chair": [
|
||||
"chair",
|
||||
"furniture",
|
||||
@@ -2015,10 +2264,23 @@
|
||||
"media",
|
||||
"music"
|
||||
],
|
||||
"stretch-horizontal": [
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"distribute"
|
||||
],
|
||||
"stretch-vertical": [
|
||||
"items",
|
||||
"flex",
|
||||
"justify",
|
||||
"distribute"
|
||||
],
|
||||
"strikethrough": [
|
||||
"cross out",
|
||||
"delete",
|
||||
"remove"
|
||||
"remove",
|
||||
"format"
|
||||
],
|
||||
"subscript": [
|
||||
"text"
|
||||
@@ -2216,7 +2478,8 @@
|
||||
"weather"
|
||||
],
|
||||
"underline": [
|
||||
"text"
|
||||
"text",
|
||||
"format"
|
||||
],
|
||||
"undo": [
|
||||
"redo",
|
||||
@@ -2331,6 +2594,14 @@
|
||||
"clock",
|
||||
"time"
|
||||
],
|
||||
"waves": [
|
||||
"water",
|
||||
"sea",
|
||||
"sound",
|
||||
"hertz",
|
||||
"wavelength",
|
||||
"vibrate"
|
||||
],
|
||||
"webcam": [
|
||||
"camera",
|
||||
"security"
|
||||
|
||||
14
yarn.lock
@@ -10016,10 +10016,10 @@ minimatch@3.0.4, minimatch@^3.0.2, minimatch@^3.0.4, minimatch@~3.0.4:
|
||||
dependencies:
|
||||
brace-expansion "^1.1.7"
|
||||
|
||||
minimist@1.x, minimist@^1.1.1, minimist@^1.2.0, minimist@^1.2.3, minimist@^1.2.5:
|
||||
version "1.2.5"
|
||||
resolved "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz"
|
||||
integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==
|
||||
minimist@1.x, minimist@^1.1.1, minimist@^1.2.0, minimist@^1.2.3, minimist@^1.2.5, minimist@^1.2.6:
|
||||
version "1.2.6"
|
||||
resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.6.tgz#8637a5b759ea0d6e98702cfb3a9283323c93af44"
|
||||
integrity sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==
|
||||
|
||||
minipass-collect@^1.0.2:
|
||||
version "1.0.2"
|
||||
@@ -14667,9 +14667,9 @@ urix@^0.1.0:
|
||||
integrity sha1-2pN/emLiH+wf0Y1Js1wpNQZ6bHI=
|
||||
|
||||
url-parse@^1.4.3, url-parse@^1.5.3:
|
||||
version "1.5.7"
|
||||
resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.5.7.tgz#00780f60dbdae90181f51ed85fb24109422c932a"
|
||||
integrity sha512-HxWkieX+STA38EDk7CE9MEryFeHCKzgagxlGvsdS7WBImq9Mk+PGwiT56w82WI3aicwJA8REp42Cxo98c8FZMA==
|
||||
version "1.5.10"
|
||||
resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.5.10.tgz#9d3c2f736c1d75dd3bd2be507dcc111f1e2ea9c1"
|
||||
integrity sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==
|
||||
dependencies:
|
||||
querystringify "^2.1.1"
|
||||
requires-port "^1.0.0"
|
||||
|
||||