42 lines
1.5 KiB
TypeScript
42 lines
1.5 KiB
TypeScript
import { cn } from "@lume/utils";
|
|
import { HTMLProps, useContext } from "react";
|
|
import { WindowButton } from "../components/button";
|
|
import { WindowIcons } from "../components/icons";
|
|
import { AppWindowContext } from "../context";
|
|
|
|
export function Windows({ className, ...props }: HTMLProps<HTMLDivElement>) {
|
|
const { isWindowMaximized, minimizeWindow, maximizeWindow, closeWindow } =
|
|
useContext(AppWindowContext);
|
|
|
|
return (
|
|
<div className={cn("h-8", className)} {...props}>
|
|
<WindowButton
|
|
onClick={minimizeWindow}
|
|
className="max-h-8 w-[46px] cursor-default rounded-none bg-transparent text-black/90 hover:bg-black/[.05] active:bg-black/[.03] dark:text-white dark:hover:bg-white/[.06] dark:active:bg-white/[.04]"
|
|
>
|
|
<WindowIcons.minimizeWin />
|
|
</WindowButton>
|
|
<WindowButton
|
|
onClick={maximizeWindow}
|
|
className={cn(
|
|
"max-h-8 w-[46px] cursor-default rounded-none bg-transparent",
|
|
"text-black/90 hover:bg-black/[.05] active:bg-black/[.03] dark:text-white dark:hover:bg-white/[.06] dark:active:bg-white/[.04]",
|
|
// !isMaximizable && "text-white/[.36]",
|
|
)}
|
|
>
|
|
{!isWindowMaximized ? (
|
|
<WindowIcons.maximizeWin />
|
|
) : (
|
|
<WindowIcons.maximizeRestoreWin />
|
|
)}
|
|
</WindowButton>
|
|
<WindowButton
|
|
onClick={closeWindow}
|
|
className="max-h-8 w-[46px] cursor-default rounded-none bg-transparent text-black/90 hover:bg-[#c42b1c] hover:text-white active:bg-[#c42b1c]/90 dark:text-white"
|
|
>
|
|
<WindowIcons.closeWin />
|
|
</WindowButton>
|
|
</div>
|
|
);
|
|
}
|