export let widget_c4_system = (b) => {
let w = attr_or(b, "width", 160)
let h = attr_or(b, "height", 90)
let name = attr_or(b, "label", "System")
let desc = attr_or(b, "description", "")
let color = attr_or(b, "color", "var(--color-link)")
let ext = attr_or(b, "external", "false") == "true"
let bg_fill = attr_or(b, "background_fill", color)
let label_fill = attr_or(b, "label_fill", "#fff")
let muted_fill = attr_or(b, "muted_fill", label_fill)
let border_stroke = attr_or(b, "border_stroke", bg_fill)
let tag = ext ? "[External System]" : "[System]"
let dash = ext ? "5,3" : ""
let base = [
{ kind = "rect", x = 0, y = 0, width = w, height = h, rx = 8,
fill = bg_fill, stroke = border_stroke, stroke_dasharray = dash },
{ kind = "text", x = 0, y = 8, width = w, height = 22,
content = name, font_size = 15, fill = label_fill },
{ kind = "text", x = 0, y = 28, width = w, height = 14,
content = tag, font_size = 10, fill = muted_fill, opacity = 0.7 }
]
let desc_part = desc != "" ? [{ kind = "text", x = 6, y = 46,
width = w - 12, height = 16, content = desc, font_size = 10,
fill = muted_fill, opacity = 0.85 }] : []
concat(base, desc_part)
}