MapComplete/src/UI/Base/SubtleButton.ts

43 lines
1.3 KiB
TypeScript

import BaseUIElement from "../BaseUIElement"
import { UIElement } from "../UIElement"
import Translations from "../i18n/Translations"
import Combine from "./Combine"
import Img from "./Img"
/**
* @deprecated
*/
export class SubtleButton extends UIElement {
private readonly imageUrl: string | BaseUIElement
private readonly message: string | BaseUIElement
constructor(
imageUrl: string | BaseUIElement,
message: string | BaseUIElement
) {
super()
this.imageUrl = imageUrl
this.message = message
}
protected InnerRender(): string | BaseUIElement {
const classes = "button"
const message = Translations.W(this.message)?.SetClass(
"block overflow-ellipsis no-images flex-shrink"
)
let img
const imgClasses =
"block justify-center flex-none mr-4 h-11 w-11"
if ((this.imageUrl ?? "") === "") {
img = undefined
} else if (typeof this.imageUrl === "string") {
img = new Img(this.imageUrl)?.SetClass(imgClasses)
} else {
img = this.imageUrl?.SetClass(imgClasses)
}
const button = new Combine([img, message]).SetClass("flex items-center group w-full")
this.SetClass(classes)
return button
}
}