Mirrors/lucide
1
0
Fork 0
mirror of https://github.com/lucide-icons/lucide.git synced 2026-08-29 11:28:24 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/lucide-icons/lucide into remove-nextjs-aliases

Browse Source
This commit is contained in:
Eric Fennis
2026-07-23 13:42:36 +02:00
parent 2f531012f5 75b6ac1969
commit 28adf2e0b9
29 changed files with 403 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
brand-stopwords.json
View File

@@ -56,7 +56,6 @@
"kubernetes": "Kubernetes",
"leetcode": "LeetCode",
"leet-code": "LeetCode",
"line": "LINE",
"linkedin": "LinkedIn",
"lua": "Lua",
"mariadb": "MariaDB",
@@ -69,7 +68,7 @@
"nestjs": "NestJS",
"netflix": "Netflix",
"netlify": "Netlify",
"next": "Next.js",
"nextjs": "Next.js",
"nodejs": "Node.js",
"notion": "Notion",
"nostr": "Nostr",
@@ -105,7 +104,8 @@
"shopify": "Shopify",
"skype": "Skype",
"slack": "Slack",
"solid": "SolidJS",
"snapchat": "Snapchat",
"solidjs": "SolidJS",
"soundcloud": "SoundCloud",
"spotify": "Spotify",
"sqlite": "SQLite",
@@ -144,6 +144,5 @@
"xbox": "Xbox",
"yarn": "Yarn",
"youtube": "YouTube",
"zig": "Zig",
"zoom": "Zoom"
"zig": "Zig"
}

4
docs/guide/angular/advanced/with-lucide-lab.md
View File

@@ -12,6 +12,10 @@ import Sandpack from '~/.vitepress/theme/components/editors/SandpackAngular.vue'
While they aren't provided as standalone components, they can be still be passed to the `LucideIcon` component the same way as official icons:
::: info Limitation
Only custom icons that follow Lucide's [code conventions](../../../contribute/icon-design-guide.md#code-conventions) are supported.
:::
### Directly as LucideIconData
::: sandpack {template=angular showTabs=false editorHeight=400 editorWidthPercentage=60 dependencies="@lucide/angular,@lucide/lab"}

8
docs/package.json
View File

@@ -8,7 +8,7 @@
"docs:dev": "pnpm run /^prebuild:.*/ && vitepress dev",
"docs:build": "pnpm run /^prebuild:.*/ && vitepress build",
"docs:preview": "vitepress preview",
"build:docs": "vitepress build",
"build:docs": "NODE_OPTIONS=--max-old-space-size=8192 vitepress build",
"prebuild:iconNodes": "node ./scripts/writeIconNodes.mts",
"prebuild:metaJson": "node ./scripts/writeIconMetaIndex.mts",
"prebuild:releaseJson": "node ./scripts/writeReleaseMetadata.mts",
@@ -18,9 +18,9 @@
"prebuild:iconPopularity": "node ./scripts/writeiconPopularity.mts",
"prebuild:brandStopwords": "node ./scripts/writeBrandStopwords.mts",
"postbuild:vercelJson": "node ./scripts/writeVercelOutput.mts",
"dev": "npx nitropack dev",
"prebuild:api": "npx nitropack prepare",
"build:api": "npx nitropack build",
"dev": "nitropack dev",
"prebuild:api": "nitropack prepare",
"build:api": "NODE_OPTIONS=--max-old-space-size=8192 nitropack build",
"build": "pnpm run /^prebuild:.*/ && pnpm run build:api && pnpm run build:docs && pnpm postbuild:vercelJson",
"preview": "node .output/server/index.mjs"
},

14
docs/scripts/writeIconDetails.mts
View File

@@ -23,12 +23,12 @@ const writeIconFiles = icons.map(async (iconFileName) => {
const location = path.resolve(iconDetailsDirectory, `${iconName}.ts`);
const contents = `\
import iconNode from '../iconNodes/${iconName}.node.json'
import metaData from '../../../../icons/${iconName}.json'
import releaseData from '../releaseMetadata/${iconName}.json'
import popularity from '../iconPopularity/${iconName}.json'
import iconNode from '../iconNodes/${iconName}.node.json' with { type: 'json' };
import metaData from '../../../../icons/${iconName}.json' with { type: 'json' };
import releaseData from '../releaseMetadata/${iconName}.json' with { type: 'json' };
import popularity from '../iconPopularity/${iconName}.json' with { type: 'json' };
const { tags, categories, contributors, aliases, deprecated, deprecationReason, toBeRemovedInVersion } = metaData
const { tags, categories, contributors, aliases, deprecated, deprecationReason, toBeRemovedInVersion } = metaData;
const iconDetails = {
name: '${iconName}',
@@ -42,9 +42,9 @@ const iconDetails = {
deprecationReason,
toBeRemovedInVersion,
...releaseData,
}
};
export default iconDetails
export default iconDetails;
`;
await fs.promises.writeFile(location, contents, 'utf-8');

7
icons/ad.json
View File

@@ -21,10 +21,15 @@
"paid",
"partner",
"promo",
"sponsor"
"sponsor",
"audio description",
"video description",
"described video",
"visual description"
],
"categories": [
"multimedia",
"accessibility",
"notifications"
]
}

4
icons/book-open-check.svg
View File

@@ -9,7 +9,7 @@
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M12 21V7" />
<path d="M12 5v16" />
<path d="m16 12 2 2 4-4" />
<path d="M22 6V4a1 1 0 0 0-1-1h-5a4 4 0 0 0-4 4 4 4 0 0 0-4-4H3a1 1 0 0 0-1 1v13a1 1 0 0 0 1 1h6a3 3 0 0 1 3 3 3 3 0 0 1 3-3h6a1 1 0 0 0 1-1v-1.3" />
<path d="M22 6V5a2 2 0 00-1.999-2L16 3.002A5 5 0 0012 5a5 5 0 00-4-2H4a2 2 0 00-2 2v12a2 2 0 001.999 2H8a5 5 0 014 2 5 5 0 014-2h4.001A2 2 0 0022 17v-1.344" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 414 B

After

Width:  |  Height:  |  Size: 424 B

3
icons/book-open-text.json
View File

@@ -1,7 +1,8 @@
{
"$schema": "../icon.schema.json",
"contributors": [
"danielbayley"
"danielbayley",
"karsa-mistmere"
],
"use-cases": [],
"tags": [

12
icons/book-open-text.svg
View File

@@ -9,10 +9,10 @@
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M12 7v14" />
<path d="M16 12h2" />
<path d="M16 8h2" />
<path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z" />
<path d="M6 12h2" />
<path d="M6 8h2" />
<path d="M12 5v16" />
<path d="M16 13h2" />
<path d="M16 9h2" />
<path d="M20.001 19A2 2 0 0022 17V5a2 2 0 00-1.999-2L16 3.002A5 5 0 0012 5a5 5 0 00-4-2H4a2 2 0 00-2 2v12a2 2 0 001.999 2H8a5 5 0 014 2 5 5 0 014-2z" />
<path d="M6 13h2" />
<path d="M6 9h2" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 470 B

After

Width:  |  Height:  |  Size: 479 B

3
icons/book-open.json
View File

@@ -3,7 +3,8 @@
"contributors": [
"colebemis",
"csandman",
"ericfennis"
"ericfennis",
"karsa-mistmere"
],
"use-cases": [],
"tags": [

4
icons/book-open.svg
View File

@@ -9,6 +9,6 @@
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M12 7v14" />
<path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z" />
<path d="M12 5v16" />
<path d="M20.001 19A2 2 0 0022 17V5a2 2 0 00-1.999-2L16 3.002A5 5 0 0012 5a5 5 0 00-4-2H4a2 2 0 00-2 2v12a2 2 0 001.999 2H8a5 5 0 014 2 5 5 0 014-2z" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 378 B

After

Width:  |  Height:  |  Size: 387 B

15
icons/cast.json
View File

@@ -7,9 +7,18 @@
],
"use-cases": [],
"tags": [
"chromecast",
"airplay",
"screen"
"stream",
"streaming",
"screen",
"display",
"wireless",
"broadcast",
"transmit",
"media",
"receiver",
"remote display",
"screen sharing",
"media streaming"
],
"categories": [
"devices",

4
icons/circle-fading-plus.json
View File

@@ -8,10 +8,6 @@
"tags": [
"stories",
"social media",
"instagram",
"facebook",
"meta",
"snapchat",
"sharing",
"content"
],

3
icons/columns-3-cog.json
View File

@@ -3,7 +3,8 @@
"contributors": [
"irvineacosta",
"danielbayley",
"karsa-mistmere"
"karsa-mistmere",
"kamilasw"
],
"use-cases": [],
"tags": [

22
icons/columns-3-cog.svg
View File

@@ -9,16 +9,16 @@
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M10.5 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v5.5" />
<path d="m14.3 19.6 1-.4" />
<path d="M15 3v7.5" />
<path d="m15.2 16.9-.9-.3" />
<path d="m16.6 21.7.3-.9" />
<path d="m16.8 15.3-.4-1" />
<path d="m19.1 15.2.3-.9" />
<path d="m19.6 21.7-.4-1" />
<path d="m20.7 16.8 1-.4" />
<path d="m21.7 19.4-.9-.3" />
<path d="M10.6 21H5a2 2 0 01-2-2V5a2 2 0 012-2h14a2 2 0 012 2v5.6" />
<path d="m14.305 19.53.923-.382" />
<path d="M15 3v7.6" />
<path d="m15.229 16.852-.924-.383" />
<path d="m16.852 15.228-.383-.923" />
<path d="m16.852 20.772-.383.924" />
<path d="m19.148 15.228.383-.923" />
<path d="m19.53 21.696-.382-.924" />
<path d="m20.773 16.852.922-.383" />
<path d="m20.773 19.148.922.383" />
<path d="M9 3v18" />
<circle cx="18" cy="18" r="3" />
</svg>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 617 B

After

Width:  |  Height:  |  Size: 675 B

1
icons/compass.json
View File

@@ -11,7 +11,6 @@
"east",
"south",
"west",
"safari",
"browser"
],
"categories": [

3
icons/computer.json
View File

@@ -7,8 +7,7 @@
"tags": [
"pc",
"chassis",
"codespaces",
"github"
"codespaces"
],
"categories": [
"devices",

1
icons/container.json
View File

@@ -9,7 +9,6 @@
"shipping",
"freight",
"supply chain",
"docker",
"environment",
"devops",
"code",

26
icons/history.json
View File

@@ -1,26 +0,0 @@
{
"$schema": "../icon.schema.json",
"contributors": [
"ericfennis",
"danielbayley",
"jguddas",
"karsa-mistmere"
],
"use-cases": [],
"tags": [
"time",
"redo",
"undo",
"rewind",
"timeline",
"version",
"time machine",
"backup",
"rotate",
"ccw"
],
"categories": [
"arrows",
"time"
]
}

38
icons/rotate-ccw-clock.json Normal file
View File

@@ -0,0 +1,38 @@
{
"$schema": "../icon.schema.json",
"contributors": [
"ericfennis",
"danielbayley",
"jguddas",
"karsa-mistmere"
],
"use-cases": [
"To view the activity history of an account or document.",
"To browse past events in a log or audit trail.",
"To show recent actions, such as recently visited pages.",
"To restore an earlier version of a file."
],
"tags": [
"history",
"time",
"redo",
"undo",
"rewind",
"timeline",
"version",
"time machine",
"backup",
"ccw"
],
"categories": [
"arrows",
"time"
],
"aliases": [
{
"name": "history",
"deprecated": true,
"deprecationReason": "alias.name"
}
]
}

0
icons/history.svg → icons/rotate-ccw-clock.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 324 B

After

Width:  |  Height:  |  Size: 324 B

24
icons/rotate-cw-fading-clock.json Normal file
View File

@@ -0,0 +1,24 @@
{
"$schema": "../icon.schema.json",
"contributors": [
"NielsLazaroms"
],
"use-cases": [
"To indicate when you need to process items.",
"To indicate that a process is happening"
],
"tags": [
"clock",
"waiting",
"schedule",
"hourglass",
"loading",
"pause",
"pending",
"time",
"watch"
],
"categories": [
"time"
]
}

22
icons/rotate-cw-fading-clock.svg Normal file
View File

@@ -0,0 +1,22 @@
<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 3a9.75 9.75 0 0 1 6.74 2.74" />
<path d="M18.74 5.74 21 8" />
<path d="M21 8V3" />
<path d="M7.5 19.794c-6-3.464-6-12.124 0-15.588" />
<path d="M7.5 4.206A9 9 0 0 1 12 3" />
<path d="M12 7v5l4 2" />
<path d="M14 20.775A9 9 0 0 1 12 21" />
<path d="M19 17.656a9 9 0 0 1-1.5 1.456" />
<path d="M21 12a9 9 0 0 1-.228 2" />
<path d="M21 8h-5" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 583 B

54
icons/shield-keyhole.json Normal file
View File

@@ -0,0 +1,54 @@
{
"$schema": "../icon.schema.json",
"contributors": [
"karsa-mistmere"
],
"use-cases": [
"Indicating that a resource or area is protected and requires authorized access",
"Representing access control and permission management settings",
"Showing security options for accounts, applications, or protected systems",
"Indicating content or functionality restricted to authenticated users",
"Representing authentication and secure sign-in features",
"Showing protected credentials, secrets, or other sensitive information",
"Representing identity and account protection features",
"Indicating security policies or authorization requirements"
],
"tags": [
"cybersecurity",
"secure",
"safety",
"protection",
"defense",
"defence",
"defender",
"block",
"threat",
"prevention",
"antivirus",
"vigilance",
"vigilant",
"detection",
"scan",
"find",
"strength",
"strong",
"tough",
"invincible",
"invincibility",
"invulnerable",
"undamaged",
"audit",
"admin",
"verification",
"crest",
"bravery",
"trooper",
"pawn"
],
"categories": [
"account",
"security",
"development",
"files"
]
}

15
icons/shield-keyhole.svg Normal file
View 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="M12 13v3" />
<path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 01-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 011-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 011.52 0C14.51 3.81 17 5 19 5a1 1 0 011 1z" />
<circle cx="12" cy="11" r="2" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 438 B

20
icons/square-bottom-dashed-scissors.svg
View File

@@ -9,18 +9,12 @@
stroke-linecap="round"
stroke-linejoin="round"
>
<line x1="5" y1="3" x2="19" y2="3" />
<line x1="3" y1="5" x2="3" y2="19" />
<line x1="21" y1="5" x2="21" y2="19" />
<line x1="9" y1="21" x2="10" y2="21" />
<line x1="14" y1="21" x2="15" y2="21" />
<path d="M 3 5 A2 2 0 0 1 5 3" />
<path d="M 19 3 A2 2 0 0 1 21 5" />
<path d="M 5 21 A2 2 0 0 1 3 19" />
<path d="M 21 19 A2 2 0 0 1 19 21" />
<circle cx="8.5" cy="8.5" r="1.5" />
<line x1="9.56066" y1="9.56066" x2="12" y2="12" />
<line x1="17" y1="17" x2="14.82" y2="14.82" />
<path d="M14 21h1" />
<path d="m17 17-2.18-2.18" />
<path d="M5 21a2 2 0 01-2-2V5a2 2 0 012-2h14a2 2 0 012 2v14a2 2 0 01-2 2" />
<path d="M9 21h1" />
<path d="M9.56 14.44 17 7" />
<path d="M9.56 9.56 12 12" />
<circle cx="8.5" cy="15.5" r="1.5" />
<line x1="9.56066" y1="14.43934" x2="17" y2="7" />
<circle cx="8.5" cy="8.5" r="1.5" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 801 B

After

Width:  |  Height:  |  Size: 509 B

10
icons/square-scissors.svg
View File

@@ -9,10 +9,10 @@
stroke-linecap="round"
stroke-linejoin="round"
>
<rect width="18" height="18" x="3" y="3" rx="2" />
<circle cx="8.5" cy="8.5" r="1.5" />
<line x1="9.56066" y1="9.56066" x2="12" y2="12" />
<line x1="17" y1="17" x2="14.82" y2="14.82" />
<path d="m17 17-2.18-2.18" />
<path d="M9.56 14.44 17 7" />
<path d="M9.56 9.56 12 12" />
<circle cx="8.5" cy="15.5" r="1.5" />
<line x1="9.56066" y1="14.43934" x2="17" y2="7" />
<circle cx="8.5" cy="8.5" r="1.5" />
<rect x="3" y="3" width="18" height="18" rx="2" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 495 B

After

Width:  |  Height:  |  Size: 436 B

2
package.json
View File

@@ -80,5 +80,5 @@
"engines": {
"node": ">=24.11.1"
},
"packageManager": "pnpm@11.6.0+sha512.9a36518224080c6fe5165afdcfe79bfa118c29be703f3f462b1e32efe1e98e47e8750b148e08286250aad4113cc7993ca413c4e2cd447752708c2ee5751bc95f"
"packageManager": "pnpm@11.16.0+sha512.b767e9a98fc87aec0f42daefcd0e84941c2cdb45d73c4e1e68860fb2bdfdbe032ab592105479e5e05c237f740c8a5ffdbbb52385797ddc2296745a1bbb883e8d"
}

139
packages/angular/src/lucide-dynamic-icon.spec.ts
View File

@@ -43,13 +43,124 @@ describe('LucideDynamicIcon', () => {
const supportedShapesIcon: LucideIconData = {
name: 'supported-shapes',
node: [
['path', { d: 'm1 1 2 2', fill: 'currentColor', key: 'path-key' }],
['line', { x1: 1, x2: 2, y1: 3, y2: 4, key: 'line-key' }],
['polygon', { points: '1 1 2 2 3 1', key: 'polygon-key' }],
['polyline', { points: '1 1 2 2 3 1', key: 'polyline-key' }],
['circle', { cx: 12, cy: 12, r: 8, fill: 'currentColor', key: 'circle-key' }],
['ellipse', { cx: 12, cy: 12, rx: 8, ry: 4, key: 'ellipse-key' }],
['rect', { x: 1, y: 2, width: 3, height: 4, rx: 5, ry: 6, key: 'rect-key' }],
[
'path',
{
class: 'path-class',
d: 'm1 1 2 2',
id: 'path-id',
opacity: '0.7',
stroke: 'red',
'stroke-opacity': '0.5',
fill: 'blue',
'fill-opacity': '0.3',
'vector-effect': 'non-scaling-stroke',
key: 'path-key',
},
],
[
'line',
{
class: 'line-class',
id: 'line-id',
opacity: '0.7',
stroke: 'red',
'stroke-opacity': '0.5',
fill: 'blue',
'fill-opacity': '0.3',
x1: 1,
x2: 2,
y1: 3,
y2: 4,
'vector-effect': 'non-scaling-stroke',
key: 'line-key',
},
],
[
'polygon',
{
class: 'polygon-class',
id: 'polygon-id',
opacity: '0.7',
stroke: 'red',
'stroke-opacity': '0.5',
fill: 'blue',
'fill-opacity': '0.3',
points: '1 1 2 2 3 1',
'vector-effect': 'non-scaling-stroke',
key: 'polygon-key',
},
],
[
'polyline',
{
class: 'polyline-class',
id: 'polyline-id',
opacity: '0.7',
stroke: 'red',
'stroke-opacity': '0.5',
fill: 'blue',
'fill-opacity': '0.3',
points: '1 1 2 2 3 1',
'vector-effect': 'non-scaling-stroke',
key: 'polyline-key',
},
],
[
'circle',
{
class: 'circle-class',
cx: 12,
cy: 12,
id: 'circle-id',
opacity: '0.7',
r: 8,
stroke: 'red',
'stroke-opacity': '0.5',
fill: 'blue',
'fill-opacity': '0.3',
'vector-effect': 'non-scaling-stroke',
key: 'circle-key',
},
],
[
'ellipse',
{
class: 'ellipse-class',
cx: 12,
cy: 12,
id: 'ellipse-id',
opacity: '0.7',
rx: 8,
ry: 4,
stroke: 'red',
'stroke-opacity': '0.5',
fill: 'blue',
'fill-opacity': '0.3',
'vector-effect': 'non-scaling-stroke',
key: 'ellipse-key',
},
],
[
'rect',
{
class: 'rect-class',
x: 1,
y: 2,
id: 'rect-id',
opacity: '0.7',
width: 3,
height: 4,
rx: 5,
ry: 6,
stroke: 'red',
'stroke-opacity': '0.5',
fill: 'blue',
'fill-opacity': '0.3',
'vector-effect': 'non-scaling-stroke',
key: 'rect-key',
},
],
],
};
function createComponent() {
@@ -88,13 +199,13 @@ describe('LucideDynamicIcon', () => {
fixture.detectChanges();
const children = getRenderedChildren();
expect(children.map((child) => child.outerHTML)).toEqual([
'<path d="m1 1 2 2" fill="currentColor"></path>',
'<line x1="1" x2="2" y1="3" y2="4"></line>',
'<polygon points="1 1 2 2 3 1"></polygon>',
'<polyline points="1 1 2 2 3 1"></polyline>',
'<circle cx="12" cy="12" r="8" fill="currentColor"></circle>',
'<ellipse cx="12" cy="12" rx="8" ry="4"></ellipse>',
'<rect x="1" y="2" width="3" height="4" rx="5" ry="6"></rect>',
'<path class="path-class" d="m1 1 2 2" id="path-id" opacity="0.7" stroke="red" stroke-opacity="0.5" fill="blue" fill-opacity="0.3" vector-effect="non-scaling-stroke"></path>',
'<line class="line-class" id="line-id" opacity="0.7" stroke="red" stroke-opacity="0.5" fill="blue" fill-opacity="0.3" x1="1" x2="2" y1="3" y2="4" vector-effect="non-scaling-stroke"></line>',
'<polygon class="polygon-class" id="polygon-id" opacity="0.7" stroke="red" stroke-opacity="0.5" fill="blue" fill-opacity="0.3" points="1 1 2 2 3 1" vector-effect="non-scaling-stroke"></polygon>',
'<polyline class="polyline-class" id="polyline-id" opacity="0.7" stroke="red" stroke-opacity="0.5" fill="blue" fill-opacity="0.3" points="1 1 2 2 3 1" vector-effect="non-scaling-stroke"></polyline>',
'<circle class="circle-class" cx="12" cy="12" id="circle-id" opacity="0.7" r="8" stroke="red" stroke-opacity="0.5" fill="blue" fill-opacity="0.3" vector-effect="non-scaling-stroke"></circle>',
'<ellipse class="ellipse-class" cx="12" cy="12" id="ellipse-id" opacity="0.7" rx="8" ry="4" stroke="red" stroke-opacity="0.5" fill="blue" fill-opacity="0.3" vector-effect="non-scaling-stroke"></ellipse>',
'<rect class="rect-class" x="1" y="2" id="rect-id" opacity="0.7" width="3" height="4" rx="5" ry="6" stroke="red" stroke-opacity="0.5" fill="blue" fill-opacity="0.3" vector-effect="non-scaling-stroke"></rect>',
]);
});

47
packages/angular/src/lucide-icon-template.ts
View File

@@ -11,13 +11,26 @@ export const lucideIconTemplate = `@if (title(); as titleValue) {
@switch (child[0]) {
@case ('path') {
<svg:path
[attr.class]="attrs['class']"
[attr.d]="attrs['d']"
[attr.id]="attrs['id']"
[attr.opacity]="attrs['opacity']"
[attr.stroke]="attrs['stroke']"
[attr.stroke-opacity]="attrs['stroke-opacity']"
[attr.fill]="attrs['fill']"
[attr.fill-opacity]="attrs['fill-opacity']"
[attr.vector-effect]="attrs['vector-effect']"
/>
}
@case ('line') {
<svg:line
[attr.class]="attrs['class']"
[attr.id]="attrs['id']"
[attr.opacity]="attrs['opacity']"
[attr.stroke]="attrs['stroke']"
[attr.stroke-opacity]="attrs['stroke-opacity']"
[attr.fill]="attrs['fill']"
[attr.fill-opacity]="attrs['fill-opacity']"
[attr.x1]="attrs['x1']"
[attr.x2]="attrs['x2']"
[attr.y1]="attrs['y1']"
@@ -27,42 +40,76 @@ export const lucideIconTemplate = `@if (title(); as titleValue) {
}
@case ('polygon') {
<svg:polygon
[attr.class]="attrs['class']"
[attr.id]="attrs['id']"
[attr.opacity]="attrs['opacity']"
[attr.stroke]="attrs['stroke']"
[attr.stroke-opacity]="attrs['stroke-opacity']"
[attr.fill]="attrs['fill']"
[attr.fill-opacity]="attrs['fill-opacity']"
[attr.points]="attrs['points']"
[attr.vector-effect]="attrs['vector-effect']"
/>
}
@case ('polyline') {
<svg:polyline
[attr.class]="attrs['class']"
[attr.id]="attrs['id']"
[attr.opacity]="attrs['opacity']"
[attr.stroke]="attrs['stroke']"
[attr.stroke-opacity]="attrs['stroke-opacity']"
[attr.fill]="attrs['fill']"
[attr.fill-opacity]="attrs['fill-opacity']"
[attr.points]="attrs['points']"
[attr.vector-effect]="attrs['vector-effect']"
/>
}
@case ('circle') {
<svg:circle
[attr.class]="attrs['class']"
[attr.cx]="attrs['cx']"
[attr.cy]="attrs['cy']"
[attr.id]="attrs['id']"
[attr.opacity]="attrs['opacity']"
[attr.r]="attrs['r']"
[attr.stroke]="attrs['stroke']"
[attr.stroke-opacity]="attrs['stroke-opacity']"
[attr.fill]="attrs['fill']"
[attr.fill-opacity]="attrs['fill-opacity']"
[attr.vector-effect]="attrs['vector-effect']"
/>
}
@case ('ellipse') {
<svg:ellipse
[attr.class]="attrs['class']"
[attr.cx]="attrs['cx']"
[attr.cy]="attrs['cy']"
[attr.id]="attrs['id']"
[attr.opacity]="attrs['opacity']"
[attr.rx]="attrs['rx']"
[attr.ry]="attrs['ry']"
[attr.stroke]="attrs['stroke']"
[attr.stroke-opacity]="attrs['stroke-opacity']"
[attr.fill]="attrs['fill']"
[attr.fill-opacity]="attrs['fill-opacity']"
[attr.vector-effect]="attrs['vector-effect']"
/>
}
@case ('rect') {
<svg:rect
[attr.class]="attrs['class']"
[attr.x]="attrs['x']"
[attr.y]="attrs['y']"
[attr.id]="attrs['id']"
[attr.opacity]="attrs['opacity']"
[attr.width]="attrs['width']"
[attr.height]="attrs['height']"
[attr.rx]="attrs['rx']"
[attr.ry]="attrs['ry']"
[attr.stroke]="attrs['stroke']"
[attr.stroke-opacity]="attrs['stroke-opacity']"
[attr.fill]="attrs['fill']"
[attr.fill-opacity]="attrs['fill-opacity']"
[attr.vector-effect]="attrs['vector-effect']"
/>
}