Files
homarr/packages/ui/src/icons/create.ts

28 lines
833 B
TypeScript

import type { IconNode } from "@tabler/icons-react";
import { createReactComponent } from "@tabler/icons-react";
import { parseSync } from "svgson";
import { capitalize } from "@homarr/common";
interface CustomIconOptions {
name: string;
svgContent: string;
type: "outline" | "filled";
}
export const createCustomIcon = ({ svgContent, type, name }: CustomIconOptions) => {
const icon = parseSync(svgContent);
const children = icon.children.map(({ name, attributes }, i) => {
attributes.key = `svg-${i}`;
attributes.strokeWidth = attributes["stroke-width"] ?? "2";
delete attributes["stroke-width"];
return [name, attributes] satisfies IconNode[number];
});
const pascalCaseName = `Icon${capitalize(name.replace("-", ""))}`;
return createReactComponent(type, name, pascalCaseName, children);
};