mirror of
https://github.com/wavetermdev/waveterm.git
synced 2025-01-02 18:39:05 +01:00
a9eeb55021
The windowdrag right spacer was acting erratic. It's also not necessary, since we can just use margins to let the banner buttons fill empty space so they float to the right side of the tab bar. Without it, though, I had to add more padding for the add tab button so it has more room.
31 lines
1.1 KiB
TypeScript
31 lines
1.1 KiB
TypeScript
// Copyright 2023, Command Line Inc.
|
|
// SPDX-License-Identifier: Apache-2.0
|
|
|
|
import { useLongClick } from "@/app/hook/useLongClick";
|
|
import { makeIconClass } from "@/util/util";
|
|
import clsx from "clsx";
|
|
import { forwardRef, memo, useRef } from "react";
|
|
import "./iconbutton.scss";
|
|
|
|
type IconButtonProps = { decl: IconButtonDecl; className?: string };
|
|
export const IconButton = memo(
|
|
forwardRef<HTMLButtonElement, IconButtonProps>(({ decl, className }, ref) => {
|
|
ref = ref ?? useRef<HTMLButtonElement>(null);
|
|
const spin = decl.iconSpin ?? false;
|
|
useLongClick(ref, decl.click, decl.longClick, decl.disabled);
|
|
return (
|
|
<button
|
|
ref={ref}
|
|
className={clsx("iconbutton", className, decl.className, {
|
|
disabled: decl.disabled,
|
|
"no-action": decl.noAction,
|
|
})}
|
|
title={decl.title}
|
|
style={{ color: decl.iconColor ?? "inherit" }}
|
|
>
|
|
{typeof decl.icon === "string" ? <i className={makeIconClass(decl.icon, true, { spin })} /> : decl.icon}
|
|
</button>
|
|
);
|
|
})
|
|
);
|