mirror of
https://github.com/bitburner-official/bitburner-src.git
synced 2025-04-15 23:01:29 +02:00
54 lines
1.4 KiB
TypeScript
54 lines
1.4 KiB
TypeScript
/**
|
|
* Basic stateless button
|
|
* Uses the 'std-button' css class
|
|
*/
|
|
import * as React from "react";
|
|
|
|
interface IStdButtonProps {
|
|
addClasses?: string;
|
|
autoFocus?: boolean;
|
|
disabled?: boolean;
|
|
id?: string;
|
|
onClick?: (e: React.MouseEvent<HTMLElement>) => any;
|
|
onKeyUp?: (e: React.KeyboardEvent<HTMLElement>) => any;
|
|
style?: any;
|
|
text: string | JSX.Element;
|
|
tooltip?: string | JSX.Element;
|
|
}
|
|
|
|
type IInnerHTMLMarkup = {
|
|
__html: string;
|
|
};
|
|
|
|
export function StdButton(props: IStdButtonProps): React.ReactElement {
|
|
const hasTooltip = props.tooltip != null && props.tooltip !== "";
|
|
let className = props.disabled ? "std-button-disabled" : "std-button";
|
|
if (hasTooltip) {
|
|
className += " tooltip";
|
|
}
|
|
|
|
if (typeof props.addClasses === "string") {
|
|
className += ` ${props.addClasses}`;
|
|
}
|
|
|
|
// Tooltip will be set using inner HTML
|
|
let tooltip;
|
|
if (hasTooltip) {
|
|
if (typeof props.tooltip === "string") {
|
|
const tooltipMarkup: IInnerHTMLMarkup = {
|
|
__html: props.tooltip,
|
|
};
|
|
tooltip = <span className={"tooltiptext"} dangerouslySetInnerHTML={tooltipMarkup}></span>;
|
|
} else {
|
|
tooltip = <span className={"tooltiptext"}>{props.tooltip}</span>;
|
|
}
|
|
}
|
|
|
|
return (
|
|
<button className={className} id={props.id} onClick={props.onClick} onKeyUp={props.onKeyUp} style={props.style} autoFocus={props.autoFocus}>
|
|
{props.text}
|
|
{hasTooltip && tooltip}
|
|
</button>
|
|
);
|
|
}
|