feat(icons): added circle-fading-check icon (#4089)

* Added icons/circle-fading-check.svg

* Added icons/circle-fading-check.json

* Refactor SVG paths in circle-fading-check.svg

* Add empty use-cases array to circle-fading-check.json

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

* Update metadata

---------

Co-authored-by: Eric Fennis <eric.fennis@gmail.com>
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

.github/instructions/metadata.instructions.md

@@ -56,7 +56,7 @@ When checking or adding a `$group:` marker:
 
 - A marker must be exactly `"$group:"` followed by the name of an existing file in `groups/`, without the `.json` extension, in lowercase kebab-case.
 - `$group:` is allowed **only** inside `tags`. It is not valid in `categories` or `contributors`.
-- Groups are named after the variant suffix: `file-plus` uses `$group:plus`, `file-question-mark` uses `$group:question-mark`. Suffixes with the same meaning share a group: `mail-warning` uses `$group:exclamation-mark`, and every currency suffix uses `$group:currency`.
+- Groups are named after the variant suffix: `file-plus` uses `$group:plus`, `file-question-mark` uses `$group:question-mark`. Suffixes with the same meaning share a group: `mail-exclamation-point` uses `$group:exclamation-mark`, and every currency suffix uses `$group:currency`.
 - The same suffix can mean different things in different contexts — `-off` means "disabled" on `wifi-off` but "allergy free" on `wheat-off` — so only use the group when the icon carries the group's meaning, and keep context-specific tags as literals.
 - Do not repeat a tag a group already provides, and do not use the same group twice in one array.
 - Conventional order: the `$extends:` base icon first, then `$group:` markers, then the icon's own literal tags.

categories/notifications.json

@@ -2,5 +2,5 @@
   "$schema": "../category.schema.json",
   "title": "Notifications",
   "description": "Icons for alerts, status updates, reminders, approvals, and attention states.",
-  "icon": "triangle-alert"
+  "icon": "triangle-exclamation-point"
 }

docs/.vitepress/theme/components/icons/IconShowcase.vue

@@ -6,7 +6,7 @@ import Calendar from '../../../data/iconDetails/calendar.ts';
 import Clock from '../../../data/iconDetails/clock.ts';
 import Bug from '../../../data/iconDetails/bug.ts';
 import Rocket from '../../../data/iconDetails/rocket.ts';
-import TriangleAlert from '../../../data/iconDetails/triangle-alert.ts';
+import TriangleExclamationPoint from '../../../data/iconDetails/triangle-exclamation-point.ts';
 import PartyPopper from '../../../data/iconDetails/party-popper.ts';
 import Scissors from '../../../data/iconDetails/scissors.ts';
 import Copy from '../../../data/iconDetails/copy.ts';
@@ -41,7 +41,7 @@ const CalendarIcon = createLucideIcon('calendar', Calendar.iconNode);
 const ClockIcon = createLucideIcon('clock', Clock.iconNode);
 const BugIcon = createLucideIcon('bug', Bug.iconNode);
 const RocketIcon = createLucideIcon('rocket', Rocket.iconNode);
-const AlertTriangleIcon = createLucideIcon('alert-triangle', TriangleAlert.iconNode);
+const TriangleExclamationPointIcon = createLucideIcon('triangle-exclamation-point', TriangleExclamationPoint.iconNode);
 const ScissorsIcon = createLucideIcon('scissors', Scissors.iconNode);
 const CopyIcon = createLucideIcon('copy', Copy.iconNode);
 const SaveIcon = createLucideIcon('save', Save.iconNode);
@@ -128,7 +128,7 @@ const prettyName = props.name
         >
           <div class="placeholder"></div>
           <div class="badge badge-red">
-            <AlertTriangleIcon :size="20" />
+            <TriangleExclamationPointIcon :size="20" />
             Alert
           </div>
         </div>

docs/.vitepress/theme/components/sponsor/SponsorTiers.vue

@@ -117,8 +117,6 @@ function scrollTrack(direction: 1 | -1) {
 .tiers {
   padding-top: 96px;
   padding-bottom: 48px;
-  /* The track bleeds to the right edge of the viewport. */
-  overflow-x: clip;
 }
 
 .tiers-header {
@@ -165,7 +163,6 @@ function scrollTrack(direction: 1 | -1) {
 
 .track-wrapper {
   position: relative;
-  margin-right: min(-24px, calc((1152px - 100vw) / 2));
 }
 
 .track {
@@ -178,12 +175,16 @@ function scrollTrack(direction: 1 | -1) {
   padding-bottom: 12px;
   padding-right: 24px;
   scroll-padding-right: 24px;
-  scrollbar-width: thin;
+  scrollbar-width: none;
   scroll-snap-align: center;
   scroll-padding-left: 24px;
   scroll-padding-right: 24px;
 }
 
+.track::-webkit-scrollbar {
+  display: none;
+}
+
 .track:focus-visible {
   outline: 2px solid var(--vp-c-brand-1);
   outline-offset: 4px;

docs/contribute/icons/metadata-conventions/use-case-guide.md

@@ -3,7 +3,7 @@ description: Learn the best practices for writing use cases for Lucide icons.
 ---
 
 <script setup>
-import { batteryLow, creditCard, crop, handshake, heading2, microchip, search, squareLetterP, triangleAlert, wifiOff } from '~/.vitepress/data/iconNodes';
+import { batteryLow, creditCard, crop, handshake, heading2, microchip, search, squareLetterP, triangleExclamationPoint, wifiOff } from '~/.vitepress/data/iconNodes';
 import LucideIcon from '~/.vitepress/theme/components/base/LucideIcon.vue';
 </script>
 
@@ -120,10 +120,10 @@ The period adds **unnecessary punctuation** and makes entries inconsistent.
 Use plain text only. Formatting belongs in documentation, not metadata values.
 
 :::: example
-::: do <LucideIcon name="triangle-alert" :iconNode="triangleAlert" /> Warning users about a destructive action
+::: do <LucideIcon name="triangle-exclamation-point" :iconNode="triangleExclamationPoint" /> Warning users about a destructive action
 This works in search, generated pages, and other places that use metadata.
 :::
-::: dont <LucideIcon name="triangle-alert" :iconNode="triangleAlert" /> <span>**Warning** users about a destructive action ⚠️</span>
+::: dont <LucideIcon name="triangle-exclamation-point" :iconNode="triangleExclamationPoint" /> <span>**Warning** users about a destructive action ⚠️</span>
 Markdown and emoji can **show up in generated UI** and make metadata **harder to reuse**.
 :::
 ::::

docs/guide/angular/advanced/icon-provider.md

@@ -31,7 +31,7 @@ You can then reference the registered icons by name:
 
 ```html [app.html]
 <svg lucideIcon="square-check"></svg>
-<svg lucideIcon="circle-alert"></svg>
+<svg lucideIcon="circle-exclamation-point"></svg>
 ```
 
 ## How names are resolved

icons/badge-exclamation-point.json

@@ -15,5 +15,10 @@
   "categories": [
     "account",
     "social"
+  ],
+  "aliases": [
+    {
+      "name": "badge-alert"
+    }
   ]
 }

icons/battery-exclamation-point.json

@@ -12,5 +12,10 @@
   ],
   "categories": [
     "$extends:battery"
+  ],
+  "aliases": [
+    {
+      "name": "battery-warning"
+    }
   ]
 }

icons/book-exclamation-point.json

@@ -15,5 +15,10 @@
   ],
   "categories": [
     "$extends:book"
+  ],
+  "aliases": [
+    {
+      "name": "book-alert"
+    }
   ]
 }

icons/circle-exclamation-point.json

@@ -16,6 +16,9 @@
       "name": "alert-circle",
       "deprecationReason": "alias.name",
       "deprecated": true
+    },
+    {
+      "name": "circle-alert"
     }
   ]
 }

icons/circle-fading-check.json

@@ -0,0 +1,23 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "n2duc"
+  ],
+  "use-cases": [
+    "Indicating a submission or payment that is still being verified",
+    "Showing a deployment, upload, or backup that is finishing up",
+    "Marking a task as partially completed or awaiting final approval",
+    "Displaying a step in a progress tracker that is in progress"
+  ],
+  "tags": [
+    "$group:check",
+    "pending",
+    "progress",
+    "processing",
+    "verifying",
+    "loading"
+  ],
+  "categories": [
+    "notifications"
+  ]
+}

icons/circle-fading-check.svg

@@ -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 017.38 16.75" />
+  <path d="m16 9-5.5 5.5L8 12" />
+  <path d="M2.5 8.875a10 10 0 00-.5 3" />
+  <path d="M2.83 16a10 10 0 002.43 3.4" />
+  <path d="M4.636 5.235a10 10 0 01.891-.857" />
+  <path d="M8.644 21.42a10 10 0 007.631-.38" />
+</svg>

icons/clock-exclamation-point.json

@@ -13,5 +13,10 @@
   ],
   "categories": [
     "$extends:clock"
+  ],
+  "aliases": [
+    {
+      "name": "clock-alert"
+    }
   ]
 }

icons/cloud-exclamation-point.json

@@ -19,5 +19,10 @@
     "development",
     "notifications",
     "weather"
+  ],
+  "aliases": [
+    {
+      "name": "cloud-alert"
+    }
   ]
 }

icons/mail-exclamation-point.json

@@ -13,5 +13,13 @@
   "categories": [
     "mail",
     "notifications"
+  ],
+  "aliases": [
+    {
+      "name": "mail-warning"
+    },
+    {
+      "name": "mail-alert"
+    }
   ]
 }

icons/mango.json

@@ -0,0 +1,30 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "Prsenapati09",
+    "rrod497"
+  ],
+  "use-cases": [
+    "Representing tropical fruit in food and grocery apps",
+    "Indicating produce sections in shopping interfaces",
+    "Labeling tropical fruit filters in recipe and nutrition apps",
+    "Highlighting seasonal fruit in marketplaces"
+  ],
+  "tags": [
+    "fruit",
+    "food",
+    "tropical",
+    "summer",
+    "exotic",
+    "healthy",
+    "ripe",
+    "yellow",
+    "juice",
+    "smoothie",
+    "snack",
+    "produce"
+  ],
+  "categories": [
+    "food-beverage"
+  ]
+}

icons/mango.svg

@@ -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"
+>
+  <path d="m17 6 3-3" />
+  <path d="M7 22a4 4 0 01-2.62-7.023A2 2 0 005 13.383V10a8 8 0 1116 0A12 12 0 019 22z" />
+</svg>

icons/message-circle-exclamation-point.json

@@ -17,5 +17,13 @@
   "categories": [
     "$extends:message-circle",
     "notifications"
+  ],
+  "aliases": [
+    {
+      "name": "message-circle-warning"
+    },
+    {
+      "name": "message-circle-alert"
+    }
   ]
 }

icons/message-square-exclamation-point.json

@@ -16,5 +16,13 @@
   "categories": [
     "$extends:message-square",
     "notifications"
+  ],
+  "aliases": [
+    {
+      "name": "message-square-warning"
+    },
+    {
+      "name": "message-square-alert"
+    }
   ]
 }

icons/octagon-exclamation-point.json

@@ -18,6 +18,9 @@
       "name": "alert-octagon",
       "deprecationReason": "alias.name",
       "deprecated": true
+    },
+    {
+      "name": "octagon-alert"
     }
   ]
 }

icons/opacity.json

@@ -0,0 +1,32 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "ilyavred",
+    "jamiemlaw"
+  ],
+  "use-cases": [
+    "Setting the opacity of layers or objects in graphic editors",
+    "Adjusting the opacity of fills, strokes, or other object attributes",
+    "Adjusting the alpha channel in color pickers",
+    "Indicating that a layer or element is semi-transparent"
+  ],
+  "tags": [
+    "opacity",
+    "opaque",
+    "transparency",
+    "visibility",
+    "fade",
+    "lens",
+    "glass",
+    "blur",
+    "filter",
+    "clear",
+    "mask",
+    "cover",
+    "gradient"
+  ],
+  "categories": [
+    "design",
+    "photography"
+  ]
+}

icons/opacity.svg

@@ -0,0 +1,25 @@
+<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 3h.01" />
+  <path d="M12 9h.01" />
+  <path d="M15 6h.01" />
+  <path d="M18 3h.01" />
+  <path d="M21 6v13a2 2 0 0 1-2 2H6" />
+  <path d="M3 12h.01" />
+  <path d="M3 18h.01" />
+  <path d="M3 6h.01" />
+  <path d="M6 15h.01" />
+  <path d="M6 3h.01" />
+  <path d="M6 9h.01" />
+  <path d="M9 12h.01" />
+  <path d="M9 6h.01" />
+</svg>

icons/package-pen.json

@@ -0,0 +1,19 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "$extends:package"
+  ],
+  "use-cases": [
+    "Editing recipient addresses or package contents in shipping systems",
+    "Modifying customer orders before shipment",
+    "Updating product listings in inventory or e-commerce platforms",
+    "Editing software package manifests or metadata"
+  ],
+  "tags": [
+    "$extends:package",
+    "$group:pen"
+  ],
+  "categories": [
+    "$extends:package"
+  ]
+}

icons/package-pen.svg

@@ -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 14.34V12l8.71-5" />
+  <path d="M16.511 21.141a2 2 0 0 0 .854-.506l4.013-4.009a1 1 0 1 0-3.004-3.004l-4.01 4.012a2 2 0 0 0-.506.854l-.837 2.87a.5.5 0 0 0 .599.626z" />
+  <path d="M21 9.114V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l5.087 2.907" />
+  <path d="M3.29 7 12 12" />
+  <path d="m7.5 4.27 9 5.15" />
+</svg>

icons/package-question-mark.json

@@ -0,0 +1,24 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "$extends:package"
+  ],
+  "use-cases": [
+    "Marking an unknown or unrecognized package in a package registry",
+    "Indicating a dependency that is still being resolved in a package manager",
+    "Indicating a lost or missing delivery package",
+    "Showing a shipment with an unknown delivery status"
+  ],
+  "tags": [
+    "$extends:package",
+    "$group:question-mark",
+    "unresolved",
+    "placeholder",
+    "pending",
+    "lost",
+    "dependency"
+  ],
+  "categories": [
+    "$extends:package"
+  ]
+}

icons/package-question-mark.svg

@@ -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 22V12l8.71-5" />
+  <path d="M17 15.27c.2-.4.5-.8.9-1a2.1 2.1 0 0 1 2.6.4c.3.4.5.8.5 1.3 0 1.3-2 2-2 2" />
+  <path d="M19 21.99h.01" />
+  <path d="M21 10.342V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l2.33-1.332" />
+  <path d="M3.29 7 12 12" />
+  <path d="m7.5 4.27 9 5.15" />
+</svg>

icons/package.json

@@ -21,7 +21,14 @@
     "packed",
     "archive",
     "zip",
-    "module"
+    "module",
+    "shipping",
+    "recipient",
+    "inventory",
+    "logistics",
+    "tracking",
+    "order",
+    "product"
   ],
   "categories": [
     "files",

icons/search-exclamation-point.json

@@ -15,5 +15,10 @@
   ],
   "categories": [
     "$extends:search"
+  ],
+  "aliases": [
+    {
+      "name": "search-alert"
+    }
   ]
 }

icons/shield-exclamation-point.json

@@ -59,5 +59,10 @@
     "development",
     "notifications",
     "gaming"
+  ],
+  "aliases": [
+    {
+      "name": "shield-alert"
+    }
   ]
 }

icons/triangle-exclamation-point.json

@@ -21,6 +21,9 @@
       "name": "alert-triangle",
       "deprecationReason": "alias.name",
       "deprecated": true
+    },
+    {
+      "name": "triangle-alert"
     }
   ]
 }

packages/angular/src/lucide-hydration.spec.ts

@@ -3,20 +3,20 @@ import { bootstrapApplication, provideClientHydration } from '@angular/platform-
 import { provideServerRendering, renderApplication } from '@angular/platform-server';
 import { LucideDynamicIcon } from './lucide-dynamic-icon';
 import { provideLucideIcons } from './lucide-icons';
-import { LucideBadgeAlert } from './icons/badge-alert';
+import { LucideBadgeExclamationPoint } from './icons/badge-exclamation-point';
 
 @Component({
   // eslint-disable-next-line @angular-eslint/component-selector
   selector: 'lucide-static-hydration-root',
-  template: `<svg lucideBadgeAlert [nonScalingStroke]="true"></svg>`,
-  imports: [LucideBadgeAlert],
+  template: `<svg lucideBadgeExclamationPoint [nonScalingStroke]="true"></svg>`,
+  imports: [LucideBadgeExclamationPoint],
 })
 class StaticHydrationRootComponent {}
 
 @Component({
   // eslint-disable-next-line @angular-eslint/component-selector
   selector: 'lucide-dynamic-hydration-root',
-  template: `<svg [lucideIcon]="'badge-alert'"></svg>`,
+  template: `<svg [lucideIcon]="'badge-exclamation-point'"></svg>`,
   imports: [LucideDynamicIcon],
 })
 class DynamicHydrationRootComponent {}
@@ -60,7 +60,7 @@ describe('Lucide hydration', () => {
     );
     (globalThis as { ngServerMode?: boolean }).ngServerMode = false;
     const serverDocument = new DOMParser().parseFromString(html, 'text/html');
-    expectBadgeAlertShapeNodes(serverDocument.querySelector('svg') as SVGSVGElement);
+    expectBadgeExclamationPointShapeNodes(serverDocument.querySelector('svg') as SVGSVGElement);
     document.head.innerHTML = serverDocument.head.innerHTML;
     document.body.innerHTML = serverDocument.body.innerHTML;
 
@@ -75,7 +75,7 @@ describe('Lucide hydration', () => {
     return document.querySelector('svg') as SVGSVGElement;
   }
 
-  function expectBadgeAlertShapeNodes(svg: SVGSVGElement) {
+  function expectBadgeExclamationPointShapeNodes(svg: SVGSVGElement) {
     expect(Array.from(svg.children).map((child) => child.tagName.toLowerCase())).toEqual([
       'path',
       'line',
@@ -89,7 +89,7 @@ describe('Lucide hydration', () => {
       'lucide-static-hydration-root',
     );
 
-    expectBadgeAlertShapeNodes(svg);
+    expectBadgeExclamationPointShapeNodes(svg);
     for (const child of Array.from(svg.children)) {
       expect(child.getAttribute('vector-effect')).toBe('non-scaling-stroke');
     }
@@ -99,9 +99,9 @@ describe('Lucide hydration', () => {
     const svg = await renderAndHydrate(
       DynamicHydrationRootComponent,
       'lucide-dynamic-hydration-root',
-      [provideLucideIcons(LucideBadgeAlert)],
+      [provideLucideIcons(LucideBadgeExclamationPoint)],
     );
 
-    expectBadgeAlertShapeNodes(svg);
+    expectBadgeExclamationPointShapeNodes(svg);
   });
 });

scripts/rename/renameIcon.function.mts

@@ -1,7 +1,7 @@
 import path from 'path';
 import fs from 'fs';
 import { promisify } from 'util';
-import simpleGit from 'simple-git';
+import { simpleGit } from 'simple-git';
 import { type IconMetadata } from '../../tools/build-icons/types.ts';
 
 /**