import {
JSX,
ParentComponent,
Show,
Suspense,
createResource,
createSignal
} from "solid-js";
import Linkify from "./Linkify";
import { Button, ButtonLink } from "./Button";
import { Checkbox as KCheckbox, Separator } from "@kobalte/core";
import { useMegaStore } from "~/state/megaStore";
import check from "~/assets/icons/check.svg";
import { MutinyTagItem } from "~/utils/tags";
import { generateGradient } from "~/utils/gradientHash";
import close from "~/assets/icons/close.svg";
import { A } from "solid-start";
export { Button, ButtonLink, Linkify };
export const SmallHeader: ParentComponent<{ class?: string }> = (props) => {
return (
);
};
export const Card: ParentComponent<{
title?: string;
titleElement?: JSX.Element;
}> = (props) => {
return (
{props.title && {props.title}}
{props.titleElement && props.titleElement}
{props.children}
);
};
export const InnerCard: ParentComponent<{ title?: string }> = (props) => {
return (
{props.title && {props.title}}
{props.children}
);
};
export const FancyCard: ParentComponent<{
title?: string;
subtitle?: string;
tag?: JSX.Element;
}> = (props) => {
return (
{props.children}
);
};
export const SafeArea: ParentComponent = (props) => {
return (
{/*
*/}
{props.children}
{/*
*/}
);
};
export const DefaultMain: ParentComponent = (props) => {
return (
{props.children}
{/* CSS is hard sometimes */}
);
};
export const FullscreenLoader = () => {
const [waitedTooLong, setWaitedTooLong] = createSignal(false);
setTimeout(() => {
setWaitedTooLong(true);
}, 10000);
return (
Stuck on this screen? Try reloading. If that doesn't work,
check out the{" "}
emergency kit.
);
};
export const MutinyWalletGuard: ParentComponent = (props) => {
const [state, _] = useMegaStore();
return (
}>
{props.children}
);
};
export const LoadingSpinner = (props: { big?: boolean; wide?: boolean }) => {
return (
);
};
export const Hr = () => ;
export const LargeHeader: ParentComponent<{ action?: JSX.Element }> = (
props
) => {
return (
{props.children}
{props.action}
);
};
export const VStack: ParentComponent<{
biggap?: boolean;
smallgap?: boolean;
}> = (props) => {
return (
{props.children}
);
};
export const HStack: ParentComponent<{ biggap?: boolean }> = (props) => {
return (
{props.children}
);
};
export const SmallAmount: ParentComponent<{
amount: number | bigint;
sign?: string;
}> = (props) => {
return (
{props.sign ? `${props.sign} ` : ""}
{props.amount.toLocaleString()} SATS
);
};
export const NiceP: ParentComponent = (props) => {
return {props.children}
;
};
export const TinyText: ParentComponent = (props) => {
return {props.children}
;
};
export const TinyButton: ParentComponent<{
onClick: () => void;
tag?: MutinyTagItem;
}> = (props) => {
// TODO: don't need to run this if it's not a contact
const [gradient] = createResource(async () => {
return generateGradient(props.tag?.name || "?");
});
const bg = () =>
props.tag?.name && props.tag?.kind === "Contact"
? gradient()
: "rgb(255 255 255 / 0.1)";
return (
);
};
export const Indicator: ParentComponent = (props) => {
return (
{props.children}
);
};
export function Checkbox(props: {
label: string;
checked: boolean;
onChange: (checked: boolean) => void;
}) {
return (
{props.label}
);
}
export function ModalCloseButton() {
return (
);
}