Files
wr.do/components/shared/icons.tsx
T
2025-03-24 17:29:45 +08:00

219 lines
8.0 KiB
TypeScript

import {
AlertTriangle,
ArrowRight,
ArrowUpRight,
BadgeHelp,
BookOpen,
Bug,
Camera,
Check,
ChevronLeft,
ChevronRight,
CircleHelp,
CirclePlay,
Copy,
Download,
File,
FileText,
Flame,
Globe,
GlobeLock,
Heading1,
HelpCircle,
Home,
Image,
Laptop,
LayoutPanelLeft,
LineChart,
Link,
Loader2,
LucideIcon,
LucideProps,
Mail,
MessagesSquare,
Moon,
MoreVertical,
Package,
Paintbrush,
Plus,
QrCode,
Search,
Settings,
SunMedium,
Trash2,
User,
Users,
X,
} from "lucide-react";
import LogoIcon from "./logo";
export type Icon = LucideIcon;
export const Icons = {
add: Plus,
arrowRight: ArrowRight,
arrowUpRight: ArrowUpRight,
chevronLeft: ChevronLeft,
chevronRight: ChevronRight,
bookOpen: BookOpen,
check: Check,
close: X,
copy: Copy,
camera: Camera,
fileText: FileText,
dashboard: LayoutPanelLeft,
download: Download,
ellipsis: MoreVertical,
paintbrush: Paintbrush,
github: ({ ...props }: LucideProps) => (
<svg
aria-hidden="true"
focusable="false"
data-prefix="fab"
data-icon="github"
role="img"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 496 512"
{...props}
>
<path
fill="currentColor"
d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"
></path>
</svg>
),
google: ({ ...props }: LucideProps) => (
<svg
aria-hidden="true"
focusable="false"
data-prefix="fab"
data-icon="google"
role="img"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 488 512"
{...props}
>
<path
d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"
fill="currentColor"
/>
</svg>
),
help: HelpCircle,
home: Home,
heading1: Heading1,
qrcode: QrCode,
laptop: Laptop,
// lineChart: LineChart,
logo: LogoIcon,
media: Image,
messages: MessagesSquare,
moon: Moon,
page: File,
package: Package,
post: FileText,
search: Search,
settings: Settings,
spinner: Loader2,
sun: SunMedium,
trash: Trash2,
twitter: ({ ...props }: LucideProps) => (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
aria-hidden="true"
focusable="false"
data-prefix="fab"
data-icon="twitter"
role="img"
{...props}
>
<path
d="M14.258 10.152L23.176 0h-2.113l-7.747 8.813L7.133 0H0l9.352 13.328L0 23.973h2.113l8.176-9.309 6.531 9.309h7.133zm-2.895 3.293l-.949-1.328L2.875 1.56h3.246l6.086 8.523.945 1.328 7.91 11.078h-3.246zm0 0"
fill="currentColor"
/>
</svg>
),
user: User,
users: Users,
warning: AlertTriangle,
globeLock: GlobeLock,
globe: Globe,
link: Link,
mail: Mail,
bug: Bug,
CirclePlay: CirclePlay,
lineChart: ({ ...props }: LucideProps) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...props}
>
<path d="M3 3v16a2 2 0 0 0 2 2h16" />
<path d="m19 9-5 5-4-4-3 3" stroke="#0065ea" />
</svg>
),
// help: CircleHelp,
outLink: ({ ...props }: LucideProps) => (
<svg
width="100"
height="100"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
{...props}
>
<path
d="M20 13.5001C20 14.8946 20 15.5919 19.8618 16.1673C19.4229 17.9956 17.9955 19.423 16.1672 19.8619C15.5918 20.0001 14.8945 20.0001 13.5 20.0001H12C9.19974 20.0001 7.79961 20.0001 6.73005 19.4551C5.78924 18.9758 5.02433 18.2109 4.54497 17.2701C4 16.2005 4 14.8004 4 12.0001V11.5001C4 9.17035 4 8.0055 4.3806 7.08664C4.88807 5.8615 5.86144 4.88813 7.08658 4.38066C7.86344 4.05888 8.81614 4.00915 10.5 4.00146M19.7597 9.45455C20.0221 7.8217 20.0697 6.16984 19.9019 4.54138C19.8898 4.42328 19.838 4.31854 19.7597 4.24027M19.7597 4.24027C19.6815 4.16201 19.5767 4.11023 19.4586 4.09806C17.8302 3.93025 16.1783 3.97792 14.5455 4.24027M19.7597 4.24027L10 14"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
></path>
</svg>
),
discord: ({ ...props }: LucideProps) => (
<svg
xmlns="http://www.w3.org/2000/svg"
x="0px"
y="0px"
width="100"
height="100"
viewBox="0 0 48 48"
{...props}
>
<radialGradient
id="La9SoowKGoEUHOnYdJMSEa_2mIgusGquJFz_gr1"
cx="24"
cy="10.009"
r="32.252"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stopColor="#8c9eff"></stop>
<stop offset=".368" stopColor="#889af8"></stop>
<stop offset=".889" stopColor="#7e8fe6"></stop>
<stop offset="1" stopColor="#7b8ce1"></stop>
</radialGradient>
<path
fill="url(#La9SoowKGoEUHOnYdJMSEa_2mIgusGquJFz_gr1)"
d="M40.107,12.15c-0.065-0.102-0.139-0.182-0.236-0.255c-0.769-0.578-4.671-3.339-9.665-3.875 c-0.01-0.001-0.048-0.003-0.057-0.003c-0.098,0-0.183,0.057-0.224,0.14l-0.269,0.538c0,0-0.001,0-0.001,0 c-0.017,0.033-0.026,0.071-0.026,0.111c0,0.109,0.07,0.202,0.168,0.236c0.006,0.002,0.048,0.011,0.063,0.014 c4.267,1.028,6.863,2.89,9.149,4.945c-4.047-2.066-8.044-4.001-15.009-4.001s-10.961,1.936-15.009,4.001 c2.286-2.055,4.882-3.917,9.149-4.945c0.015-0.004,0.057-0.012,0.063-0.014c0.098-0.034,0.168-0.127,0.168-0.236 c0-0.04-0.009-0.078-0.026-0.111c0,0-0.001,0-0.001,0l-0.269-0.538c-0.041-0.083-0.125-0.14-0.224-0.14 c-0.009,0-0.048,0.002-0.057,0.003c-4.994,0.536-8.896,3.297-9.665,3.875c-0.097,0.073-0.17,0.153-0.236,0.255 c-0.708,1.107-5.049,8.388-5.892,21.632c-0.009,0.142,0.04,0.289,0.135,0.395c4.592,5.144,11.182,5.752,12.588,5.823 c0.167,0.008,0.327-0.065,0.427-0.199l1.282-1.709c0.1-0.134,0.046-0.322-0.111-0.379c-2.705-0.986-5.717-2.7-8.332-5.706 C11.231,34.457,16.12,37,24,37s12.769-2.543,16.009-4.993c-2.616,3.006-5.627,4.719-8.332,5.706 c-0.157,0.057-0.211,0.245-0.111,0.379l1.282,1.709c0.101,0.134,0.26,0.208,0.427,0.199c1.407-0.072,7.996-0.679,12.588-5.823 c0.095-0.106,0.144-0.253,0.135-0.395C45.156,20.538,40.815,13.257,40.107,12.15z"
></path>
<ellipse cx="30.5" cy="26" opacity=".05" rx="4.5" ry="5"></ellipse>
<ellipse cx="30.5" cy="26" opacity=".05" rx="4" ry="4.5"></ellipse>
<ellipse cx="30.5" cy="26" fill="#fff" rx="3.5" ry="4"></ellipse>
<ellipse cx="17.5" cy="26" opacity=".05" rx="4.5" ry="5"></ellipse>
<ellipse cx="17.5" cy="26" opacity=".05" rx="4" ry="4.5"></ellipse>
<ellipse cx="17.5" cy="26" fill="#fff" rx="3.5" ry="4"></ellipse>
</svg>
),
};