Mirrors/lucide
1
0
Fork 0
mirror of https://github.com/lucide-icons/lucide.git synced 2025-12-16 11:17:43 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(packages): consistent icon name class (#2878)

Browse Source 
* fix: consistent icon name class

* merge classes

* fix vue-next

* update test snapshots

* fix vue-next

* fix test

* fix solid

* proper deduplication

* update snapshots

* preact

* refactor

* deprecated

* refactor tests

---------

Co-authored-by: Eric Fennis <eric.fennis@gmail.com>
This commit is contained in:
Dante Issaias
2025-03-21 10:35:54 +00:00
committed by GitHub
parent 6d6aa4c4cc
commit 4835ae67a9
16 changed files with 190 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/lucide-vue-next/scripts/exportTemplate.mjs
View File

@@ -26,7 +26,7 @@ import createLucideIcon from '../createLucideIcon';
* @returns {FunctionalComponent} Vue component
* ${deprecated ? `@deprecated ${deprecationReason}` : ''}
*/
const ${componentName} = createLucideIcon('${componentName}Icon', ${JSON.stringify(children)});
const ${componentName} = createLucideIcon('${iconName}', ${JSON.stringify(children)});
export default ${componentName};
`;

9
packages/lucide-vue-next/src/Icon.ts
View File

@@ -1,5 +1,5 @@
import { type FunctionalComponent, h } from 'vue';
import { toKebabCase } from '@lucide/shared';
import { mergeClasses, toKebabCase, toPascalCase } from '@lucide/shared';
import defaultAttributes from './defaultAttributes';
import { IconNode, LucideProps } from './types';
@@ -20,7 +20,12 @@ const Icon: FunctionalComponent<LucideProps & IconProps> = (
height: size || defaultAttributes.height,
stroke: color || defaultAttributes.stroke,
'stroke-width': absoluteStrokeWidth ? (Number(strokeWidth) * 24) / Number(size) : strokeWidth,
class: ['lucide', `lucide-${toKebabCase(name ?? 'icon')}`],
class: mergeClasses(
'lucide',
...(name
? [`lucide-${toKebabCase(toPascalCase(name))}-icon`, `lucide-${toKebabCase(name)}`]
: ['lucide-icon']),
),
...props,
},
[...iconNode.map((child) => h(...child)), ...(slots.default ? [slots.default()] : [])],

10
packages/lucide-vue-next/tests/__snapshots__/lucide-vue-next.spec.ts.snap
View File

@@ -3,7 +3,7 @@
exports[`Using lucide icon components > should add a class to the element 1`] = `
<div>
<svg
class="lucide lucide-smile-icon my-icon"
class="lucide lucide-smile-icon lucide-smile my-icon"
fill="none"
height="24"
stroke="currentColor"
@@ -41,7 +41,7 @@ exports[`Using lucide icon components > should add a class to the element 1`] =
exports[`Using lucide icon components > should add a style attribute to the element 1`] = `
<div>
<svg
class="lucide lucide-smile-icon"
class="lucide lucide-smile-icon lucide-smile"
fill="none"
height="24"
stroke="currentColor"
@@ -80,7 +80,7 @@ exports[`Using lucide icon components > should add a style attribute to the elem
exports[`Using lucide icon components > should adjust the size, stroke color and stroke width 1`] = `
<div>
<svg
class="lucide lucide-smile-icon"
class="lucide lucide-smile-icon lucide-smile"
fill="none"
height="48"
stroke="red"
@@ -118,7 +118,7 @@ exports[`Using lucide icon components > should adjust the size, stroke color and
exports[`Using lucide icon components > should pass children to the icon slot 1`] = `
<div>
<svg
class="lucide lucide-smile-icon"
class="lucide lucide-smile-icon lucide-smile"
fill="none"
height="24"
stroke="currentColor"
@@ -161,7 +161,7 @@ exports[`Using lucide icon components > should pass children to the icon slot 1`
exports[`Using lucide icon components > should render an component 1`] = `
<div>
<svg
class="lucide lucide-smile-icon"
class="lucide lucide-smile-icon lucide-smile"
fill="none"
height="24"
stroke="currentColor"