| 1 | import * as React from 'react';
|
| 2 | import { preferences } from './Preferences';
|
| 3 | import camelCase from 'camelcase';
|
| 4 |
|
| 5 | const svgAttrs = () =>
|
| 6 | Object.entries(preferences.attributes).reduce((a, [prop, val]) => {
|
| 7 | const p = prop.includes('-') ? camelCase(prop) : prop;
|
| 8 | a[p] = val;
|
| 9 | return a;
|
| 10 | }, {} as Record<string, string | number>);
|
| 11 |
|
| 12 | interface Props extends React.SVGProps<SVGSVGElement> {
|
| 13 | name: string;
|
| 14 | }
|
| 15 |
|
| 16 | export default function Icon({ name, className, ...props }: Props) {
|
| 17 | return (
|
| 18 | <svg
|
| 19 | className={className ? `icon ${className}` : 'icon'}
|
| 20 | {...svgAttrs()}
|
| 21 | {...props}
|
| 22 | dangerouslySetInnerHTML={{ __html: preferences.icons[name].content }}
|
| 23 | />
|
| 24 | );
|
| 25 | }
|