Mirrors/lucide
1
0
Fork 0
mirror of https://github.com/lucide-icons/lucide.git synced 2026-05-18 10:24:49 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/lucide-icons/lucide

Browse Source
This commit is contained in:
Eric Fennis
2026-03-06 09:15:50 +01:00
parent e8e800f98d 5e460ce606
commit ed6ba4bf0c
28 changed files with 1216 additions and 1327 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
.github/workflows/lucide-font.yml vendored
View File

@@ -20,9 +20,6 @@ jobs:
- name: Install dependencies
run: pnpm install --frozen-lockfile
- name: Outline svg Icons
run: pnpm build:outline-icons
- name: Create font in ./lucide-font
run: pnpm build:font

1
docs/.vitepress/api/categories/index.get.ts
View File

@@ -1,3 +1,4 @@
import { eventHandler, setResponseHeader } from 'h3';
import iconMetaData from '../../data/iconMetaData';
export default eventHandler((event) => {

1
docs/.vitepress/api/figma/data.ts
View File

@@ -1,3 +1,4 @@
import { eventHandler, setResponseHeader } from 'h3';
import iconNodes from '../../data/iconNodes/index.ts';
import { IconNodeWithKeys } from '../../theme/types';
import iconMetaData from '../../data/iconMetaData';

41
docs/.vitepress/api/gh-icon/[...data].get.ts → docs/.vitepress/api/gh-icon/[...data].get.tsx
View File

@@ -1,6 +1,6 @@
import { eventHandler, setResponseHeader, defaultContentType } from 'h3';
import { renderToString, renderToStaticMarkup } from 'react-dom/server';
import { createElement } from 'react';
import React from 'react';
import SvgPreview from '../../lib/SvgPreview/index.tsx';
import iconNodes from '../../data/iconNodes';
import createLucideIcon from 'lucide-react/src/createLucideIcon';
@@ -34,36 +34,29 @@ export default eventHandler((event) => {
const iconNode = iconNodes[backdropName];
const LucideIcon = createLucideIcon(backdropName, iconNode);
const svg = renderToStaticMarkup(createElement(LucideIcon));
const svg = renderToStaticMarkup(<LucideIcon />);
const backdropString = svg.replaceAll('\n', '').replace(/<svg[^>]*>|<\/svg>/g, '');
children.push(
createElement(Backdrop, {
backdropString,
src: src.replace(/<svg[^>]*>|<\/svg>/g, ''),
color: '#777',
}),
<Backdrop
backdropString={backdropString}
src={src.replace(/<svg[^>]*>|<\/svg>/g, '')}
color="#777"
/>,
);
}
const svg = Buffer.from(
// We can't use jsx here, is not supported here by nitro.
renderToString(
createElement(
SvgPreview,
{
src: src.replace(/<svg[^>]*>|<\/svg>/g, ''),
height,
width,
showGrid: true,
},
children,
),
),
).toString('utf8');
defaultContentType(event, 'image/svg+xml');
setResponseHeader(event, 'Cache-Control', 'public,max-age=31536000');
return svg;
return renderToString(
<SvgPreview
src={src.replace(/<svg[^>]*>|<\/svg>/g, '')}
showGrid
height={height}
width={width}
>
{children}
</SvgPreview>,
);
});

25
docs/.vitepress/api/gh-icon/diff/[...data].get.ts → docs/.vitepress/api/gh-icon/diff/[...data].get.tsx
View File

@@ -1,6 +1,6 @@
import { eventHandler, setResponseHeader, defaultContentType } from 'h3';
import { renderToString, renderToStaticMarkup } from 'react-dom/server';
import { createElement } from 'react';
import React from 'react';
import Diff from '../../../lib/SvgPreview/Diff.tsx';
import iconNodes from '../../../data/iconNodes';
import createLucideIcon from 'lucide-react/src/createLucideIcon';
@@ -26,21 +26,26 @@ export default eventHandler((event) => {
const children = [];
const Icon = createLucideIcon(name, iconNodes[name]);
const oldSrc = iconNodes[name]
? renderToStaticMarkup(createElement(createLucideIcon(name, iconNodes[name])))
? renderToStaticMarkup(<Icon />)
.replaceAll('\n', '')
.replace(/<svg[^>]*>|<\/svg>/g, '')
: '';
const svg = Buffer.from(
// We can't use jsx here, is not supported here by nitro.
renderToString(
createElement(Diff, { oldSrc, newSrc, showGrid: true, height, width }, children),
),
).toString('utf8');
defaultContentType(event, 'image/svg+xml');
setResponseHeader(event, 'Cache-Control', 'public,max-age=31536000');
return svg;
return renderToString(
<Diff
oldSrc={oldSrc}
newSrc={newSrc}
showGrid
height={height}
width={width}
>
{children}
</Diff>,
);
});

13
docs/.vitepress/api/gh-icon/dpi/[...data].get.ts
View File

@@ -1,17 +1,12 @@
import { eventHandler, setResponseHeader, defaultContentType } from 'h3';
import { Resvg, initWasm } from '@resvg/resvg-wasm';
import iconNodes from '../../../data/iconNodes';
import wasm from './loadWasm';
import { createElement } from 'react';
import { renderToStaticMarkup } from 'react-dom/server';
import createLucideIcon from 'lucide-react/src/createLucideIcon';
var initializedResvg = initWasm(wasm);
import sharp from 'sharp';
export default eventHandler(async (event) => {
const { params = {} } = event.context;
await initializedResvg;
const imageSize = 96;
const name = params.data.split('/').at(-3);
const iconSizeString = params.data.split('/').at(-2);
@@ -45,9 +40,7 @@ export default eventHandler(async (event) => {
)
.replace(/<\/svg>/, '</g></svg>');
const resvg = new Resvg(svg, { background: '#000' });
const pngData = resvg.render();
const pngBuffer = Buffer.from(pngData.asPng());
const pngBuffer = await sharp(Buffer.from(svg)).png().toBuffer();
defaultContentType(event, 'image/svg+xml');
setResponseHeader(event, 'Cache-Control', 'public,max-age=31536000');
@@ -67,7 +60,7 @@ export default eventHandler(async (event) => {
<image
width="${imageSize}"
height="${prevSvg ? imageSize * 2 : imageSize}"
href="data:image/png;base64,${pngBuffer.toString('base64')}"
href="data:image/png;base64,${pngBuffer.toString('base64')}"
image-rendering="pixelated"
/>
</mask>

16
docs/.vitepress/api/gh-icon/dpi/loadWasm.ts
View File

@@ -1,16 +0,0 @@
import fs from 'fs';
import module from 'node:module';
/* WASM_IMPORT */
let wasm;
if (process.env.NODE_ENV === 'development') {
const require = module.createRequire(import.meta.url);
wasm = fs.readFileSync(require.resolve('@resvg/resvg-wasm/index_bg.wasm'));
} else {
// @ts-ignore
wasm = resvg_wasm;
}
export default wasm;

44
docs/.vitepress/api/gh-icon/stroke-width/[...data].get.ts
View File

@@ -1,44 +0,0 @@
import { eventHandler, setResponseHeader, defaultContentType } from 'h3';
import { renderToString } from 'react-dom/server';
import { createElement } from 'react';
import SvgPreview from '../../../lib/SvgPreview/index.tsx';
import createLucideIcon, { IconNode } from 'lucide-react/src/createLucideIcon';
import { parseSync } from 'svgson';
export default eventHandler((event) => {
const { params } = event.context;
const [strokeWidth, svgData] = params.data.split('/');
const data = svgData.slice(0, -4);
const src = Buffer.from(data, 'base64').toString('utf8');
const Icon = createLucideIcon(
'icon',
parseSync(src.includes('<svg') ? src : `<svg>${src}</svg>`).children.map(
({ name, attributes }) => [name, attributes],
) as IconNode,
);
const svg = Buffer.from(
// We can't use jsx here, is not supported here by nitro.
renderToString(createElement(Icon, { strokeWidth }))
.replace(/fill\="none"/, 'fill="#fff"')
.replace(
/>/,
`><style>
@media screen and (prefers-color-scheme: light) {
svg { fill: transparent !important; }
}
@media screen and (prefers-color-scheme: dark) {
svg { stroke: #fff; fill: transparent !important; }
}
</style>`,
),
).toString('utf8');
defaultContentType(event, 'image/svg+xml');
setResponseHeader(event, 'Cache-Control', 'public,max-age=31536000');
return svg;
});

37
docs/.vitepress/api/gh-icon/stroke-width/[...data].get.tsx Normal file
View File

@@ -0,0 +1,37 @@
import { eventHandler, setResponseHeader, defaultContentType } from 'h3';
import { renderToString } from 'react-dom/server';
import React from 'react';
import Icon from 'lucide-react/src/Icon';
import type { IconNode } from 'lucide-react/src/types';
import { parseSync } from 'svgson';
export default eventHandler((event) => {
const { params } = event.context;
const [strokeWidth, svgData] = params.data.split('/');
const data = svgData.slice(0, -4);
const src = Buffer.from(data, 'base64').toString('utf8');
const iconNode = parseSync(src.includes('<svg') ? src : `<svg>${src}</svg>`).children.map(
({ name, attributes }) => [name, attributes],
) as IconNode;
defaultContentType(event, 'image/svg+xml');
setResponseHeader(event, 'Cache-Control', 'public,max-age=31536000');
return renderToString(
<Icon
iconNode={iconNode}
strokeWidth={strokeWidth}
>
<style>
{`@media screen and (prefers-color-scheme: light) {
svg { fill: transparent !important; }
}
@media screen and (prefers-color-scheme: dark) {
svg { stroke: #fff; fill: transparent !important; }
}`}
</style>
</Icon>,
);
});

21
docs/.vitepress/api/gh-icon/symmetry/[...data].get.ts → docs/.vitepress/api/gh-icon/symmetry/[...data].get.tsx
View File

@@ -1,6 +1,6 @@
import { eventHandler, setResponseHeader, defaultContentType } from 'h3';
import { renderToString } from 'react-dom/server';
import { createElement } from 'react';
import React from 'react';
import Diff from '../../../lib/SvgPreview/Diff.tsx';
export default eventHandler((event) => {
@@ -41,15 +41,18 @@ export default eventHandler((event) => {
return '';
}
const svg = Buffer.from(
// We can't use jsx here, is not supported here by nitro.
renderToString(
createElement(Diff, { oldSrc, newSrc, showGrid: true, height, width }, children),
),
).toString('utf8');
defaultContentType(event, 'image/svg+xml');
setResponseHeader(event, 'Cache-Control', 'public,max-age=31536000');
return svg;
return renderToString(
<Diff
oldSrc={oldSrc}
newSrc={newSrc}
showGrid
height={height}
width={width}
>
{children}
</Diff>,
);
});

1
docs/.vitepress/api/tags/index.get.ts
View File

@@ -1,3 +1,4 @@
import { eventHandler, setResponseHeader } from 'h3';
import iconMetaData from '../../data/iconMetaData';
export default eventHandler((event) => {

3
docs/.vitepress/api/test.ts
View File

@@ -1,3 +0,0 @@
export default eventHandler(() => {
return { nitro: 'Is Awesome! asda' };
});

2
docs/.vitepress/lib/SvgPreview/Backdrop.tsx
View File

@@ -1,4 +1,4 @@
import React from 'react';
import React, { Fragment } from 'react';
interface BackdropProps {
src: string;

25
docs/.vitepress/lib/SvgPreview/index.tsx
View File

@@ -1,4 +1,4 @@
import React from 'react';
import React, { Fragment } from 'react';
import { PathProps, Path } from './types';
import getPaths, { assert } from './utils';
import { GapViolationHighlight } from './GapViolationHighlight.tsx';
@@ -389,15 +389,18 @@ const Handles = ({
</g>
);
const SvgPreview = React.forwardRef<
SVGSVGElement,
{
height?: number;
width?: number;
src: string | ReturnType<typeof getPaths>;
showGrid?: boolean;
} & React.SVGProps<SVGSVGElement>
>(({ src, children, height = 24, width = 24, showGrid = false, ...props }, ref) => {
interface SvgPreviewProps extends React.SVGProps<SVGSVGElement> {
height?: number;
width?: number;
src: string | ReturnType<typeof getPaths>;
showGrid?: boolean;
children?: React.ReactNode;
}
const SvgPreview = (
{ src, children, height = 24, width = 24, showGrid = false, ...props }: SvgPreviewProps,
ref,
) => {
const subGridSize =
Math.max(height, width) % 3 === 0
? Math.max(height, width) > 24
@@ -494,7 +497,7 @@ const SvgPreview = React.forwardRef<
{children}
</svg>
);
});
};
SvgPreview.displayName = 'SvgPreview';

2
docs/.vitepress/lib/SvgPreview/path-to-points.ts
View File

@@ -1,4 +1,4 @@
import memoize from 'lodash/memoize';
import { memoize } from 'lodash-es';
import SVGPathCommander from 'svg-path-commander';
import { Path } from './types';

2
docs/.vitepress/lib/SvgPreview/types.ts
View File

@@ -8,7 +8,7 @@ export type Path = {
prev: Point;
next: Point;
isStart: boolean;
circle?: { x: number; y: number; r: number };
circle?: { x: number; y: number; r: number; tangentIntersection?: Point };
cp1?: Point;
cp2?: Point;
c: ReturnType<typeof getCommands>[number];

4
docs/.vitepress/lib/SvgPreview/utils.ts
View File

@@ -1,10 +1,8 @@
import { INode, parseSync } from 'svgson';
// @ts-ignore
import toPath from 'element-to-path';
// @ts-ignore
import { SVGPathData, encodeSVGPath } from 'svg-pathdata';
import { Path, Point } from './types';
import memoize from 'lodash/memoize';
import { memoize } from 'lodash-es';
function assertNever(x: never): never {
throw new Error('Unknown type: ' + x['type']);

12
docs/.vitepress/lib/codeExamples/createCodeExamples.ts
View File

@@ -113,16 +113,16 @@ import { LucideAngularModule, $PascalCase } from 'lucide-angular';
];
};
const highlighter = await createHighlighter({
themes: ['github-light', 'github-dark'],
langs: Object.keys(bundledLanguages),
});
export type ThemeOptions =
| ThemeRegistration
| { light: ThemeRegistration; dark: ThemeRegistration };
const highLightCode = async (code: string, lang: string, active?: boolean) => {
const highlighter = await createHighlighter({
themes: ['github-light', 'github-dark'],
langs: Object.keys(bundledLanguages),
});
export const highLightCode = async (code: string, lang: string, active?: boolean) => {
const highlightedCode = highlighter
.codeToHtml(code, {
lang,

35
docs/.vitepress/lib/codeExamples/createLabCodeExamples.ts
View File

@@ -1,5 +1,4 @@
import { bundledLanguages, type ThemeRegistration } from 'shiki';
import { createHighlighter } from 'shiki';
import { highLightCode } from './createCodeExamples';
type CodeExampleType = {
title: string;
@@ -105,45 +104,17 @@ import { $CamelCase } from '@lucide/lab';
@NgModule({
imports: [
LucideAngularModule.pick({ $CamelCase })
LucideAngularModule.pick({ $PascalCase: $CamelCase })
],
})
// app.component.html
<lucide-icon name="$CamelCase"></lucide-icon>
<lucide-icon name="$PascalCase"></lucide-icon>
`,
},
];
};
export type ThemeOptions =
| ThemeRegistration
| { light: ThemeRegistration; dark: ThemeRegistration };
const highLightCode = async (code: string, lang: string, active?: boolean) => {
const highlighter = await createHighlighter({
themes: ['github-light', 'github-dark'],
langs: Object.keys(bundledLanguages),
});
const highlightedCode = highlighter
.codeToHtml(code, {
lang,
themes: {
light: 'github-light',
dark: 'github-dark',
},
defaultColor: false,
})
.replace('shiki-themes', 'shiki-themes vp-code');
return `<div class="language-${lang} ${active ? 'active' : ''}">
<button title="Copy Code" class="copy"></button>
<span class="lang">${lang}</span>
${highlightedCode}
</div>`;
};
export default async function createCodeExamples() {
const codes = getIconCodes();

26
docs/nitro.config.ts
View File

@@ -1,32 +1,10 @@
import copy from 'rollup-plugin-copy';
import replace from '@rollup/plugin-replace';
export default defineNitroConfig({
compatibilityDate: '2025-07-30',
preset: 'vercel_edge',
compatibilityDate: '2026-02-26',
preset: 'vercel',
srcDir: '.vitepress',
routeRules: {
'/api/**': { cors: false },
},
rollupConfig: {
external: ['@resvg/resvg-wasm/index_bg.wasm', './index_bg.wasm?module'],
plugins: [
copy({
targets: [
{
src: './node_modules/@resvg/resvg-wasm/index_bg.wasm',
dest: './.vercel/output/functions/__nitro.func',
},
],
}),
replace({
include: ['./**/*.ts'],
'/* WASM_IMPORT */': 'import resvg_wasm from "./index_bg.wasm?module";',
delimiters: ['', ''],
preventAssignment: false,
}),
],
},
esbuild: {
options: {
jsxFactory: 'React.createElement',

12
docs/package.json
View File

@@ -20,7 +20,7 @@
"dev": "npx nitropack dev",
"prebuild:api": "npx nitropack prepare",
"build:api": "npx nitropack build",
"build": "pnpm run /^prebuild:.*/ && pnpm run /^build:.*/ && pnpm postbuild:vercelJson",
"build": "pnpm run /^prebuild:.*/ && pnpm run build:api && pnpm run build:docs && pnpm postbuild:vercelJson",
"preview": "node .output/server/index.mjs"
},
"author": "Eric Fennis",
@@ -31,7 +31,8 @@
"@lucide/shared": "workspace:*",
"@rollup/plugin-replace": "^6.0.3",
"@types/semver": "^7.7.1",
"nitropack": "2.8.1",
"h3": "^1.15.4",
"nitropack": "^2.12.4",
"rollup-plugin-copy": "^3.5.0",
"svg-path-commander": "^2.1.11",
"vitepress": "^1.6.4"
@@ -39,20 +40,19 @@
"dependencies": {
"@floating-ui/vue": "^1.1.9",
"@headlessui/vue": "^1.7.23",
"@resvg/resvg-wasm": "^2.6.2",
"@vueuse/components": "^14.0.0",
"@vueuse/core": "^14.0.0",
"element-to-path": "^1.2.1",
"fuse.js": "^7.1.0",
"jszip": "^3.10.1",
"lodash": "^4.17.23",
"lodash-es": "^4.17.23",
"lucide-react": "workspace:*",
"lucide-vue-next": "workspace:*",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react": "18.2.0",
"react-dom": "18.2.0",
"sandpack-vue3": "3.1.11",
"semver": "^7.7.3",
"sharp": "^0.34.5",
"shiki": "^3.15.0",
"simple-git": "^3.30.0",
"sitemap": "^7.1.2",

40
docs/scripts/writeVercelOutput.mjs
View File

@@ -22,24 +22,30 @@ const iconAliasesRedirectRoutes = Object.entries(iconMetaData)
};
});
const vercelRouteConfig = {
version: 3,
overrides: {},
cleanUrls: true,
routes: [
{
handle: 'filesystem',
},
{
src: '(?<url>/api/.*)',
dest: '/__nitro?url=$url',
},
...iconAliasesRedirectRoutes,
],
};
const vercelOutputJSON = path.resolve(currentDir, '.vercel/output/config.json');
const vercelConfig = await fs.promises.readFile(vercelOutputJSON, 'utf-8');
const vercelRouteConfig = JSON.parse(vercelConfig);
vercelRouteConfig.routes = [...iconAliasesRedirectRoutes, ...vercelRouteConfig.routes];
// Adjust the existing catch-all route to only catch API routes, so that we can add a new catch-all route for 404s
const allCatchRoute = '/(.*)';
const fallBackIndex = vercelRouteConfig.routes.findIndex((route) => route.src === allCatchRoute);
if (fallBackIndex === -1) {
throw new Error(
`Could not find the expected catch-all route with src "${allCatchRoute}" in the existing Vercel config. Please make sure that the existing config has a catch-all route and that its src is "${allCatchRoute}".`,
);
}
vercelRouteConfig.routes[fallBackIndex].src = '/api/(.*)';
vercelRouteConfig.routes.push({
src: allCatchRoute,
dest: '/404.html',
});
const output = JSON.stringify(vercelRouteConfig, null, 2);
const vercelOutputJSON = path.resolve(currentDir, '.vercel/output/config.json');
await fs.promises.writeFile(vercelOutputJSON, output, 'utf-8');

2
docs/tsconfig.json
View File

@@ -2,6 +2,8 @@
"extends": "./.nitro/types/tsconfig.json",
"compilerOptions": {
"jsx": "react",
"jsxFactory": "React.createElement",
"jsxFragmentFactory": "React.Fragment",
"allowImportingTsExtensions": true,
"allowSyntheticDefaultImports": true,
"noEmit": true,

2
docs/vercel.json
View File

@@ -1,4 +1,6 @@
{
"$schema": "https://openapi.vercel.sh/vercel.json",
"fluid": true,
"cleanUrls": true,
"github": {
"silent": true

9
icons/bitcoin.json
View File

@@ -5,6 +5,15 @@
"mittalyashu"
],
"tags": [
"cryptocurrency",
"digital",
"blockchain",
"finance",
"coin",
"market",
"decentralized",
"investment",
"crypto",
"currency",
"money",
"payment"

2154
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

4
tools/build-font/src/allocateCodepoints.ts
View File

@@ -1,5 +1,4 @@
import { type IconAliases } from '@lucide/helpers';
import path from 'path';
import { promises as fs } from 'fs';
import { cwd } from 'process';
import { put } from '@vercel/blob';
@@ -50,11 +49,10 @@ export async function allocateCodePoints({
if (saveCodePoints) {
const content = JSON.stringify(baseCodePoints, null, 2);
await fs.writeFile(path.join(cwd(), 'codepoints.json'), content, 'utf-8');
await put(VERCEL_BLOB_CODEPOINTS_PATH, content, { access: 'public', allowOverwrite: true });
console.log('Code points saved to codepoints.json and uploaded to Vercel Blob Storage.');
console.log('Code points uploaded to Vercel Blob Storage.');
}
return baseCodePoints;

6
tools/build-font/src/main.ts
View File

@@ -52,7 +52,5 @@ await buildFont({
startUnicode,
});
await fs.copyFile(
path.join(process.cwd(), 'codepoints.json'),
path.join(targetDir, 'codepoints.json'),
);
const codepointsContent = JSON.stringify(codePoints, null, 2);
await fs.writeFile(path.join(targetDir, 'codepoints.json'), codepointsContent, 'utf-8');