DeveloperandClaude Opus 4.6
3347a256b2
- Node.js backend server - Frontend application - Backup script - Project specification Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
123 lines
5.9 KiB
JavaScript
123 lines
5.9 KiB
JavaScript
import { createElement } from 'react';
|
|
|
|
const icons = {
|
|
home: (
|
|
<path d="M3 10.5 12 3l9 7.5V20a1 1 0 0 1-1 1h-5.5v-6h-5v6H4a1 1 0 0 1-1-1v-9.5Z" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
),
|
|
chart: (
|
|
<>
|
|
<path d="M4 20h16" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="M7 16v-4" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="M12 16V8" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="M17 16v-7" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
repeat: (
|
|
<>
|
|
<path d="M17 3l4 4-4 4" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M3 7h18" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="M7 21l-4-4 4-4" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M21 17H3" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
tags: (
|
|
<>
|
|
<path d="M11 4H5a2 2 0 0 0-2 2v6l8.5 8.5a2.1 2.1 0 0 0 3 0l6-6a2.1 2.1 0 0 0 0-3L12 4Z" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinejoin="round" />
|
|
<circle cx="7.5" cy="8.5" r="1.2" fill="currentColor" />
|
|
</>
|
|
),
|
|
settings: (
|
|
<>
|
|
<path d="M12 8.5A3.5 3.5 0 1 0 12 15.5A3.5 3.5 0 1 0 12 8.5Z" fill="none" stroke="currentColor" strokeWidth="1.8" />
|
|
<path d="M19.4 15a1 1 0 0 0 .2 1.1l.1.1a2 2 0 0 1-2.8 2.8l-.1-.1a1 1 0 0 0-1.1-.2 1 1 0 0 0-.6.9V20a2 2 0 0 1-4 0v-.2a1 1 0 0 0-.6-.9 1 1 0 0 0-1.1.2l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1 1 0 0 0 .2-1.1 1 1 0 0 0-.9-.6H4a2 2 0 0 1 0-4h.2a1 1 0 0 0 .9-.6 1 1 0 0 0-.2-1.1l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1 1 0 0 0 1.1.2 1 1 0 0 0 .6-.9V4a2 2 0 0 1 4 0v.2a1 1 0 0 0 .6.9 1 1 0 0 0 1.1-.2l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1 1 0 0 0-.2 1.1 1 1 0 0 0 .9.6H20a2 2 0 0 1 0 4h-.2a1 1 0 0 0-.4 1Z" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
|
|
</>
|
|
),
|
|
search: (
|
|
<>
|
|
<circle cx="11" cy="11" r="6.5" fill="none" stroke="currentColor" strokeWidth="1.8" />
|
|
<path d="m16 16 4.5 4.5" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
plus: (
|
|
<>
|
|
<path d="M12 5v14" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="M5 12h14" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
chevronLeft: (
|
|
<path d="m14.5 6-5 6 5 6" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
),
|
|
chevronRight: (
|
|
<path d="m9.5 6 5 6-5 6" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
),
|
|
close: (
|
|
<>
|
|
<path d="M6 6l12 12" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="M18 6 6 18" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
trash: (
|
|
<>
|
|
<path d="M4 7h16" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="M9 4h6" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="M7 7l1 12a1 1 0 0 0 1 .9h6a1 1 0 0 0 1-.9l1-12" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M10 11v5" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="M14 11v5" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
logout: (
|
|
<>
|
|
<path d="M10 5H6a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h4" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M14 8l5 4-5 4" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M19 12H9" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
download: (
|
|
<>
|
|
<path d="M12 4v10" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="m8 10 4 4 4-4" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M5 19h14" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
upload: (
|
|
<>
|
|
<path d="M12 20V10" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<path d="m8 14 4-4 4 4" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M5 5h14" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
check: (
|
|
<path d="m5 12 4.2 4.2L19 7" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
|
|
),
|
|
info: (
|
|
<>
|
|
<circle cx="12" cy="12" r="9" fill="none" stroke="currentColor" strokeWidth="1.8" />
|
|
<path d="M12 10v5" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
<circle cx="12" cy="7.25" r="1" fill="currentColor" />
|
|
</>
|
|
),
|
|
spinner: (
|
|
<>
|
|
<path d="M12 3a9 9 0 1 1-6.36 2.64" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" opacity="0.28" />
|
|
<path d="M5.64 5.64A9 9 0 0 1 12 3" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
|
|
</>
|
|
),
|
|
};
|
|
|
|
export function Icon({ name, size = 20, className = '', title }) {
|
|
return createElement(
|
|
'svg',
|
|
{
|
|
viewBox: '0 0 24 24',
|
|
width: size,
|
|
height: size,
|
|
className,
|
|
'aria-hidden': title ? undefined : 'true',
|
|
role: title ? 'img' : 'presentation',
|
|
fill: 'none',
|
|
},
|
|
title ? createElement('title', null, title) : null,
|
|
icons[name] || icons.info
|
|
);
|
|
}
|