46 lines
1.4 KiB
TypeScript
46 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import { forwardRef, type ComponentPropsWithoutRef, type ReactNode } from "react";
|
|
import Link, { type LinkProps } from "next/link";
|
|
|
|
const miniClasses = [
|
|
"relative z-10 rounded-lg border border-lightline bg-lightbg p-2 shadow-md dark:border-darkline dark:bg-darkbg",
|
|
"text-lighttext dark:text-darktext text-sm",
|
|
"hover:border-lightline-hover hover:text-trptkblue dark:hover:border-darkline-hover dark:hover:text-white",
|
|
"transition-all duration-200 ease-in-out",
|
|
"disabled:pointer-events-none disabled:opacity-50",
|
|
];
|
|
|
|
export const iconButtonMiniClass = miniClasses.join(" ");
|
|
|
|
type IconButtonMiniProps = ComponentPropsWithoutRef<"button"> & {
|
|
children: ReactNode;
|
|
};
|
|
|
|
export const IconButtonMini = forwardRef<HTMLButtonElement, IconButtonMiniProps>(
|
|
function IconButtonMini({ children, className, ...props }, ref) {
|
|
return (
|
|
<button
|
|
ref={ref}
|
|
type="button"
|
|
className={[...miniClasses, className].filter(Boolean).join(" ")}
|
|
{...props}
|
|
>
|
|
{children}
|
|
</button>
|
|
);
|
|
},
|
|
);
|
|
|
|
type IconButtonMiniLinkProps = Omit<ComponentPropsWithoutRef<"a">, keyof LinkProps> &
|
|
LinkProps & {
|
|
children: ReactNode;
|
|
};
|
|
|
|
export function IconButtonMiniLink({ children, className, ...props }: IconButtonMiniLinkProps) {
|
|
return (
|
|
<Link className={[...miniClasses, className].filter(Boolean).join(" ")} {...props}>
|
|
{children}
|
|
</Link>
|
|
);
|
|
}
|