this repo has no description
notnite.com
1import React from "@moonlight-mod/wp/react";
2import spacepack from "@moonlight-mod/wp/spacepack_spacepack";
3import Flex from "@moonlight-mod/wp/discord/uikit/Flex";
4import { Text } from "@moonlight-mod/wp/discord/components/common/index";
5
6const Margins = spacepack.require("discord/styles/shared/Margins.css");
7const HelpMessageClasses = spacepack.findByExports("positive", "iconDiv")[0].exports;
8
9// reimpl of HelpMessage but with a custom icon
10export default function HelpMessage({
11 className,
12 text,
13 icon,
14 children,
15 type = "info"
16}: {
17 className?: string;
18 text: string;
19 icon: React.ComponentType<any>;
20 type?: "warning" | "positive" | "error" | "info";
21 children?: React.ReactNode;
22}) {
23 return (
24 <div
25 className={`${Margins.marginBottom20} ${HelpMessageClasses[type]} ${HelpMessageClasses.container} moonbase-help-message ${className}`}
26 >
27 <Flex direction={Flex.Direction.HORIZONTAL}>
28 <div
29 className={HelpMessageClasses.iconDiv}
30 style={{
31 alignItems: "center"
32 }}
33 >
34 {React.createElement(icon, {
35 size: "sm",
36 color: "currentColor",
37 className: HelpMessageClasses.icon
38 })}
39 </div>
40
41 <Text variant="text-sm/medium" color="currentColor" className={HelpMessageClasses.text}>
42 {text}
43 </Text>
44
45 {children}
46 </Flex>
47 </div>
48 );
49}