Allow children in React and Preact icons (#485)

* Allow children in React and Preact icons

* Reverse children order

* Revert "Reverse children order"

This reverts commit bf7489dd29.
This commit is contained in:
Thijs-Jan
2022-01-27 20:56:05 +01:00
committed by GitHub
parent aed55c543b
commit 8c34f2d19d
2 changed files with 5 additions and 5 deletions
@@ -1,4 +1,4 @@
import { h } from 'preact';
import { h, toChildArray } from 'preact';
import defaultAttributes from './defaultAttributes';
/**
@@ -12,7 +12,7 @@ import defaultAttributes from './defaultAttributes';
export const toKebabCase = string => string.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
export default (iconName, iconNode) => {
const Component = ({ color = 'currentColor', size = 24, strokeWidth = 2, ...rest }) =>
const Component = ({ color = 'currentColor', size = 24, strokeWidth = 2, children, ...rest }) =>
h(
'svg',
{
@@ -24,7 +24,7 @@ export default (iconName, iconNode) => {
class: `lucide lucide-${toKebabCase(iconName)}`,
...rest,
},
iconNode.map(([tag, attrs]) => h(tag, attrs)),
[...iconNode.map(([tag, attrs]) => h(tag, attrs)), ...toChildArray(children)],
);
Component.displayName = `${iconName}`;
@@ -14,7 +14,7 @@ export const toKebabCase = string => string.replace(/([a-z0-9])([A-Z])/g, '$1-$2
export default (iconName, iconNode) => {
const Component = forwardRef(
({ color = 'currentColor', size = 24, strokeWidth = 2, ...rest }, ref) =>
({ color = 'currentColor', size = 24, strokeWidth = 2, children, ...rest }, ref) =>
createElement(
'svg',
{
@@ -27,7 +27,7 @@ export default (iconName, iconNode) => {
className: `lucide lucide-${toKebabCase(iconName)}`,
...rest,
},
iconNode.map(([tag, attrs]) => createElement(tag, attrs)),
[...iconNode.map(([tag, attrs]) => createElement(tag, attrs)), ...(children || [])],
),
);