42 lines
1.2 KiB
Go
42 lines
1.2 KiB
Go
package webui
|
|
|
|
import "kjol/vdom"
|
|
|
|
// Port of web/kit/Alerts.tsx. The TSX exports one component per color
|
|
// (AlertWhite, AlertBlue, …); here that's Alert(color, header, children).
|
|
|
|
const (
|
|
AlertWhite = "white"
|
|
AlertGray = "gray"
|
|
AlertBlue = "blue"
|
|
AlertGreen = "green"
|
|
AlertRed = "red"
|
|
AlertYellow = "yellow"
|
|
)
|
|
|
|
const alertBase = "p-4 rounded-default shadow-xs border"
|
|
|
|
var alertColors = map[string]string{
|
|
"white": "bg-white border-neutral-100",
|
|
"gray": "bg-neutral-50 border-neutral-200",
|
|
"blue": "bg-sky-50 border-sky-200",
|
|
"green": "bg-green-50 border-green-200",
|
|
"red": "bg-red-50 border-red-200",
|
|
"yellow": "bg-yellow-50 border-yellow-200",
|
|
}
|
|
|
|
// Alert renders a colored callout. header is optional (rendered as a bold title
|
|
// above the body); children form the body.
|
|
func Alert(color, header string, children ...*vdom.VNode) *vdom.VNode {
|
|
cc := alertColors[color]
|
|
if cc == "" {
|
|
cc = alertColors["white"]
|
|
}
|
|
mods := []vdom.Mod{vdom.Attr("class", cx(alertBase, cc))}
|
|
if header != "" {
|
|
mods = append(mods, vdom.El("h3", vdom.Attr("class", "font-semibold mb-2"), vdom.Text(header)))
|
|
}
|
|
mods = append(mods, vdom.El("p", kids([]vdom.Mod{vdom.Attr("class", "text-sm")}, children)...))
|
|
return vdom.El("div", mods...)
|
|
}
|