hanzoai/icons
2
0
Fork 0
mirror of https://github.com/hanzoai/icons.git synced 2026-09-24 16:59:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

πŸ› fix: Fix svg id

Browse Source
This commit is contained in:
canisminor1990
2026-04-08 20:14:21 +08:00
parent 19902babd2
commit 84c15e9579
2 changed files with 14 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react-native/src/hooks/useFillId.ts
+7 -6
View File
@@ -1,8 +1,9 @@
import { kebabCase } from 'es-toolkit';
import { useMemo } from 'react';
import { useId, useMemo } from 'react';
export const useFillId = (namespace: string) => {
const id = `lobe-icons-${kebabCase(namespace)}-fill`;
const uniqueId = useId();
const id = `lobe-icons-${kebabCase(namespace)}-fill-${uniqueId}`;
return useMemo(
() => ({
fill: `url(#${id})`,
@@ -13,14 +14,14 @@ export const useFillId = (namespace: string) => {
};
export const useFillIds = (namespace: string, length: number) => {
const uniqueId = useId();
return useMemo(() => {
const ids = Array.from({ length }, (_, i) => {
const id = `lobe-icons-${kebabCase(namespace)}-fill-${i}`;
return Array.from({ length }, () => {
const id = `lobe-icons-${kebabCase(namespace)}-fill-${uniqueId}`;
return {
fill: `url(#${id})`,
id,
};
});
return ids;
}, [namespace, length]);
}, [namespace, length, uniqueId]);
};
src/hooks/useFillId.ts
+7 -6
View File
@@ -1,8 +1,9 @@
import { kebabCase } from 'es-toolkit';
import { useMemo } from 'react';
import { useId, useMemo } from 'react';
export const useFillId = (namespace: string) => {
const id = `lobe-icons-${kebabCase(namespace)}-fill`;
const uniqueId = useId();
const id = `lobe-icons-${kebabCase(namespace)}-fill-${uniqueId}`;
return useMemo(
() => ({
fill: `url(#${id})`,
@@ -13,14 +14,14 @@ export const useFillId = (namespace: string) => {
};
export const useFillIds = (namespace: string, length: number) => {
const uniqueId = useId();
return useMemo(() => {
const ids = Array.from({ length }, (_, i) => {
const id = `lobe-icons-${kebabCase(namespace)}-fill-${i}`;
return Array.from({ length }, () => {
const id = `lobe-icons-${kebabCase(namespace)}-fill-${uniqueId}`;
return {
fill: `url(#${id})`,
id,
};
});
return ids;
}, [namespace, length]);
}, [namespace, length, uniqueId]);
};