removed some constants

Reviewed-on: #16

gallery/notes.typ

@@ -21,10 +21,10 @@
   _par("a", display-name: "Alice")
   _par("b", display-name: "Bob")
 
-  _note("left", [This is displayed\ left of Alice.], pos: "a", color: rgb("#00FFFF"))
+  _note("left", [This is displayed\ left of Alice.], pos: "a", fill: rgb("#00FFFF"))
   _note("right", [This is displayed right of Alice.], pos: "a")
   _note("over", [This is displayed over Alice.], pos: "a")
-  _note("over", [This is displayed\ over Bob and Alice.], pos: ("a", "b"), color: rgb("#FFAAAA"))
+  _note("over", [This is displayed\ over Bob and Alice.], pos: ("a", "b"), fill: rgb("#FFAAAA"))
   _note("over", [This is yet another\ example of\ a long note.], pos: ("a", "b"))
 })
 

src/consts.typ

@@ -28,3 +28,9 @@
 #let COL-GRP-NAME = rgb("#EEEEEE")
 #let COL-SEP-NAME = rgb("#EEEEEE")
 #let COL-NOTE = rgb("#FEFFDD")
+
+#let default-style = (
+  y-space: 10pt,
+  fill: rgb("#EEEEEE"),
+  stroke: black + 1pt,
+)

src/core/draw/delay.typ

@@ -1,13 +1,30 @@
-#import "/src/cetz.typ": draw
+#import "/src/cetz.typ": draw, styles
 
-#import "/src/core/utils.typ": get-ctx, set-ctx
+#import "/src/core/utils.typ": get-ctx, normalize-units, set-ctx
+
+#let delay-default-style = (
+  stroke: (
+    dash: "loosely-dotted",
+    paint: gray.darken(40%),
+    thickness: .8pt
+  ),
+  size: 30pt
+)
 
 #let render(delay) = get-ctx(ctx => {
+  let style = styles.resolve(
+    ctx.style,
+    merge: delay.style,
+    root: "delay",
+    base: delay-default-style
+  )
+  let size = normalize-units(style.size)
+
   let y0 = ctx.y
-  let y1 = ctx.y - delay.size
+  let y1 = ctx.y - size
   for (i, line) in ctx.lifelines.enumerate() {
-    line.lines.push(("delay-start", y0))
-    line.lines.push(("delay-end", y1))
+    line.events.push((type: "delay-start", y: y0))
+    line.events.push((type: "delay-end", y: y1, style: style))
     ctx.lifelines.at(i) = line
   }
   if delay.name != none {
@@ -15,13 +32,13 @@
     let x1 = ctx.x-pos.last()
     draw.content(
       ((x0 + x1) / 2, (y0 + y1) / 2),
-      anchor: "center",
+      anchor: "mid",
       delay.name
     )
   }
-  ctx.y = y1
+  
   set-ctx(c => {
-    c.y = ctx.y
+    c.y = y1
     c.lifelines = ctx.lifelines
     return c
   })

src/core/draw/event.typ

@@ -1,28 +1,36 @@
+#import "/src/cetz.typ": styles
+
 #import "/src/consts.typ": *
 #import "/src/core/utils.typ": get-ctx, set-ctx
 
 #let render(evt) = get-ctx(ctx => {
+  let style = styles.resolve(
+    ctx.style,
+    merge: evt.style,
+    root: "event",
+    base: ()
+  )
+
   let par-name = evt.participant
   let i = ctx.pars-i.at(par-name)
   let par = ctx.participants.at(i)
   let line = ctx.lifelines.at(i)
-  let entry = (evt.event, ctx.y)
+  let entry = (type: evt.event, y: ctx.y, style: style)
 
   if evt.event == "disable" {
     line.level -= 1
   } else if evt.event == "enable" {
     line.level += 1
-    entry.push(evt.lifeline-style)
   } else if evt.event == "create" {
     ctx.y -= CREATE-OFFSET
-    entry.at(1) = ctx.y
+    entry.y = ctx.y
     (par.draw)(par, y: ctx.y)
   } else if evt.event == "destroy" {
   } else {
     panic("Unknown event '" + evt.event + "'")
   }
 
-  line.lines.push(entry)
+  line.events.push(entry)
   set-ctx(c => {
     c.lifelines.at(i) = line
     c.y = ctx.y

src/core/draw/group.typ

@@ -1,32 +1,68 @@
-#import "/src/cetz.typ": draw
+#import "/src/cetz.typ": draw, styles
 
 #import "/src/consts.typ": *
-#import "/src/core/utils.typ": get-ctx, set-ctx
+#import "/src/core/utils.typ": expand-parent-group, get-ctx, normalize-units, set-ctx
+
+#let group-default-style = (
+  name: (
+    inset: (
+      x: 5pt,
+      y: 3pt
+    ),
+    stroke: auto,
+    fill: auto
+  ),
+  desc: (
+    inset: 3pt
+  ),
+  divider: (dash: (2pt, 1pt), thickness: .5pt),
+  padding: 10pt,
+  stroke: auto
+)
 
 #let render-start(grp) = get-ctx(ctx => {
-  let grp = grp
-  ctx.y -= Y-SPACE
-  let m = measure(
-    box(
-      grp.name,
-      inset: (
-        left: 5pt,
-        right: 5pt,
-        top: 3pt,
-        bottom: 3pt
-      ),
-    )
+  let style = styles.resolve(
+    ctx.style,
+    merge: grp.style,
+    root: "group",
+    base: group-default-style
   )
+
+  let grp = grp
+  grp.insert("resolved-style", style)
+  ctx.y -= ctx.style.y-space
+
+  let name = box(
+    text(grp.name, weight: "bold"),
+    inset: style.name.inset
+  )
+  grp.insert("rendered-name", name)
+
+  let desc = box(
+    text([\[#grp.desc\]], weight: "bold", size: .8em),
+    inset: style.desc.inset
+  )
+  grp.insert("rendered-desc", desc)
+
+  let m = measure(name)
   ctx.groups = ctx.groups.map(g => {
-    if g.at(1).min-i == grp.min-i { g.at(2) += 1 }
-    if g.at(1).max-i == grp.max-i { g.at(3) += 1 }
+    if g.group.min-i == grp.min-i { g.start-lvl += 1 }
+    if g.group.max-i == grp.max-i { g.end-lvl += 1 }
     g
   })
   if grp.grp-type == "alt" {
     grp.insert("elses", ())
   }
-  ctx.groups.push((ctx.y, grp, 0, 0))
+  ctx.groups.push((
+    start-y: ctx.y,
+    group: grp,
+    start-lvl: 0,
+    end-lvl: 0,
+    min-x: ctx.x-pos.at(grp.min-i) - 10,
+    max-x: ctx.x-pos.at(grp.max-i) + 10
+  ))
   ctx.y -= m.height / 1pt
+  ctx.y += ctx.style.y-space / 2
 
   set-ctx(c => {
     c.y = ctx.y
@@ -37,61 +73,75 @@
 
 
 #let draw-group(x0, x1, y0, y1, group) = {
-  let name = text(group.name, weight: "bold")
-  let m = measure(box(name))
-  let w = m.width / 1pt + 15
-  let h = m.height / 1pt + 6
+  let style = group.resolved-style
+  let name = group.rendered-name
+  let desc = group.rendered-desc
+  let m = measure(name)
+  let w = m.width / 1pt
+  let h = m.height / 1pt
   draw.rect(
     (x0, y0),
-    (x1, y1)
+    (x1, y1),
+    stroke: style.stroke
   )
+
+  let x1 = x0 + w
+  let x2 = x1 + 5
   draw.line(
     (x0, y0),
-    (x0 + w, y0),
-    (x0 + w, y0 - h / 2),
-    (x0 + w - 5, y0 - h),
+    (x2, y0),
+    (x2, y0 - h / 2),
+    (x1, y0 - h),
     (x0, y0 - h),
-    fill: COL-GRP-NAME,
+    stroke: style.name.stroke,
+    fill: style.name.fill,
     close: true
   )
   draw.content(
     (x0, y0),
     name,
-    anchor: "north-west",
-    padding: (left: 5pt, right: 10pt, top: 3pt, bottom: 3pt)
+    anchor: "north-west"
   )
 
   if group.desc != none {
     draw.content(
-      (x0 + w, y0),
-      text([\[#group.desc\]], weight: "bold", size: .8em),
-      anchor: "north-west",
-      padding: 3pt
+      (x2, y0),
+      desc,
+      anchor: "north-west"
     )
   }
 }
 
 #let draw-else(x0, x1, y, elmt) = {
+  let style = elmt.resolved-style
   draw.line(
     (x0, y),
     (x1, y),
-    stroke: (dash: (2pt, 1pt), thickness: .5pt)
+    stroke: style.divider
   )
   draw.content(
     (x0, y),
-    text([\[#elmt.desc\]], weight: "bold", size: .8em),
-    anchor: "north-west",
-    padding: 3pt
+    elmt.rendered-desc,
+    anchor: "north-west"
   )
 }
 
 #let render-end(group) = get-ctx(ctx => {
-  ctx.y -= Y-SPACE
-  let (start-y, group, start-lvl, end-lvl) = ctx.groups.pop()
-  let x0 = ctx.x-pos.at(group.min-i) - start-lvl * 10 - 20
-  let x1 = ctx.x-pos.at(group.max-i) + end-lvl * 10 + 20
+  let y = ctx.y - ctx.style.y-space / 2
+  ctx.y -= ctx.style.y-space / 2
+  let (
+    start-y,
+    group,
+    start-lvl,
+    end-lvl,
+    min-x,
+    max-x
+  ) = ctx.groups.pop()
+  let padding = normalize-units(group.resolved-style.padding)
+  let x0 = min-x - padding
+  let x1 = max-x + padding
   
-  draw-group(x0, x1, start-y, ctx.y, group)
+  draw-group(x0, x1, start-y, y, group)
 
   if group.grp-type == "alt" {
     for (else-y, else-elmt) in group.elses {
@@ -104,14 +154,37 @@
     c.groups = ctx.groups
     return c
   })
+
+  expand-parent-group(x0, x1)
 })
 
-#let render-else(else_) = set-ctx(ctx => {
-  ctx.y -= Y-SPACE
-  let m = measure(text([\[#else_.desc\]], weight: "bold", size: .8em))
-  ctx.groups.last().at(1).elses.push((
+#let render-else(else_) = get-ctx(ctx => {
+  let group = ctx.groups.last().group
+  let style = styles.resolve(
+    ctx.style,
+    merge: group.style,
+    root: "group",
+    base: group-default-style
+  )
+  ctx.y -= ctx.style.y-space / 2
+
+  let desc = box(
+    text([\[#else_.desc\]], weight: "bold", size: .8em),
+    inset: style.desc.inset
+  )
+  let m = measure(desc)
+  let else_ = else_
+  else_.insert("resolved-style", style)
+  else_.insert("rendered-desc", desc)
+  ctx.groups.last().group.elses.push((
     ctx.y, else_
   ))
   ctx.y -= m.height / 1pt
-  return ctx
+  ctx.y += ctx.style.y-space / 2
+  
+  set-ctx(c => {
+    c.y = ctx.y
+    c.groups = ctx.groups
+    return c
+  })
 })

src/core/draw/note.typ

@@ -1,14 +1,51 @@
-#import "/src/cetz.typ": draw
+#import "/src/cetz.typ": draw, styles
 
 #import "/src/consts.typ": *
-#import "/src/core/utils.typ": get-ctx, set-ctx
+#import "/src/core/utils.typ": get-ctx, is-elmt, set-ctx, expand-parent-group, normalize-measure
+
+#let note-default-style = (
+  shape: "default",
+  fill: rgb("#FEFFDD"),
+  stroke: black + .5pt
+)
+
+#let resolve-style(ctx, note) = {
+  return styles.resolve(
+    ctx.style,
+    merge: note.style,
+    root: "note",
+    base: note-default-style
+  )
+}
+
+#let pre-resolve-styles() = get-ctx(ctx => {
+  let ctx = ctx
+  let notes = ctx.setup.notes
+
+  for (i, elmt) in ctx.setup.elements.enumerate() {
+    if type(elmt) == function {
+      ctx = elmt(ctx).ctx
+    } else if is-elmt(elmt) {
+      if elmt.type == "note" {
+        let style = resolve-style(ctx, elmt)
+        notes.at(elmt.id).insert("resolved-style", style)
+      }
+    }
+  }
+
+  set-ctx(c => {
+    c.setup.notes = notes
+    return c
+  })
+})
 
 #let get-size(note) = {
-  let PAD = if note.shape == "hex" {NOTE-HEX-PAD} else {NOTE-PAD}
-  let m = measure(box(note.content))
-  let w = m.width / 1pt + PAD.last() * 2
-  let h = m.height / 1pt + PAD.first() * 2
-  if note.shape == "default" {
+  let style = note.resolved-style
+  let PAD = if style.shape == "hex" {NOTE-HEX-PAD} else {NOTE-PAD}
+  let m = normalize-measure(box(note.content))
+  let w = m.width + PAD.last() * 2
+  let h = m.height + PAD.first() * 2
+  if style.shape == "default" {
     w += NOTE-CORNER-SIZE
   }
   return (
@@ -31,14 +68,15 @@
 }
 
 #let get-box(note) = {
-  let PAD = if note.shape == "hex" {NOTE-HEX-PAD} else {NOTE-PAD}
+  let style = note.resolved-style
+  let PAD = if style.shape == "hex" {NOTE-HEX-PAD} else {NOTE-PAD}
   let inset = (
     left: PAD.last() * 1pt,
     right: PAD.last() * 1pt,
     top: PAD.first() * 1pt,
     bottom: PAD.first() * 1pt,
   )
-  if note.shape == "default" {
+  if style.shape == "default" {
     inset.right += NOTE-CORNER-SIZE * 1pt
   }
   if note.side == "left" {
@@ -52,9 +90,11 @@
 #let render(note, y: auto, forced: false) = {
   if not note.linked {
     if not note.aligned {
-      set-ctx(c => {
-        c.y -= Y-SPACE
-        return c
+      get-ctx(ctx => {
+        set-ctx(c => {
+          c.y -= ctx.style.y-space
+          return c
+        })
       })
     }
   } else if not forced {
@@ -62,18 +102,21 @@
   }
 
   get-ctx(ctx => {
+    let note = ctx.notes.at(note.id)
     let y = y
     if y == auto {
       y = ctx.y
     }
 
+    let style = note.resolved-style
+    let shape = style.shape
     
-    let PAD = if note.shape == "hex" {NOTE-HEX-PAD} else {NOTE-PAD}
-    let m = measure(box(note.content))
-    let w = m.width / 1pt + PAD.last() * 2
-    let h = m.height / 1pt + PAD.first() * 2
+    let PAD = if shape == "hex" {NOTE-HEX-PAD} else {NOTE-PAD}
+    let m = normalize-measure(box(note.content))
+    let w = m.width + PAD.last() * 2
+    let h = m.height + PAD.first() * 2
     let total-w = w
-    if note.shape == "default" {
+    if shape == "default" {
       total-w += NOTE-CORNER-SIZE
     }
 
@@ -106,31 +149,31 @@
     }
     let y1 = y0 - h
 
-    if note.shape == "default" {
+    if shape == "default" {
       draw.line(
         (x0, y0),
         (x1, y0),
         (x2, y0 - NOTE-CORNER-SIZE),
         (x2, y1),
         (x0, y1),
-        stroke: black + .5pt,
-        fill: note.color,
+        stroke: style.stroke,
+        fill: style.fill,
         close: true
       )
       draw.line(
         (x1, y0),
         (x1, y0 - NOTE-CORNER-SIZE),
         (x2, y0 - NOTE-CORNER-SIZE),
-        stroke: black + .5pt
+        stroke: style.stroke
       )
-    } else if note.shape == "rect" {
+    } else if shape == "rect" {
       draw.rect(
         (x0, y0),
         (x2, y1),
-        stroke: black + .5pt,
-        fill: note.color
+        stroke: style.stroke,
+        fill: style.fill
       )
-    } else if note.shape == "hex" {
+    } else if shape == "hex" {
       let lx = x0 + PAD.last()
       let rx = x2 - PAD.last()
       let my = (y0 + y1) / 2
@@ -141,8 +184,8 @@
         (rx, y1),
         (lx, y1),
         (x0, my),
-        stroke: black + .5pt,
-        fill: note.color,
+        stroke: style.stroke,
+        fill: style.fill,
         close: true
       )
     }
@@ -159,5 +202,7 @@
         return c
       })
     }
+
+    expand-parent-group(x0, x2)
   })
 }

src/core/draw/participant.typ

@@ -1,316 +1,109 @@
-#import "/src/cetz.typ": draw
+#import "/src/cetz.typ": draw, styles
 
 #import "/src/consts.typ": *
-#import "/src/core/utils.typ": get-ctx, get-style, set-ctx
+#import "/src/core/utils.typ": get-ctx, get-style, is-elmt, set-ctx
+
+#let shapes = {
+  let from-module(path) = {
+    import path as mod
+    return (mod.name: (
+      get-size: mod.get-size,
+      render: mod.render,
+      default-style: mod.default-style
+    ))
+  }
+  from-module("participant/default.typ")
+  from-module("participant/actor.typ")
+  from-module("participant/boundary.typ")
+  from-module("participant/control.typ")
+  from-module("participant/entity.typ")
+  from-module("participant/database.typ")
+  from-module("participant/collections.typ")
+  from-module("participant/queue.typ")
+  from-module("participant/custom.typ")
+}
+
+#let participant-default-style = (
+  fill: rgb("#E2E2F0"),
+  stroke: black + .5pt,
+  from-start: true,
+  show-bottom: true,
+  show-top: true,
+  shape: "participant",
+  track: (
+    dash: "dashed",
+    paint: gray.darken(40%),
+    thickness: .5pt
+  )
+)
+
+#let resolve-style(ctx, par) = {
+  let style = styles.resolve(
+    ctx.style,
+    merge: par.style,
+    root: "participant",
+    base: participant-default-style
+  )
+  let shape-style = shapes.at(style.shape, default: (:))
+                          .at("default-style", default: (:))
+  style = styles.resolve(
+    ctx.style,
+    merge: style,
+    base: shape-style
+  )
+  return style
+}
+
+#let pre-resolve-styles() = get-ctx(ctx => {
+  let idx = (:)
+  let elements = ctx.setup.elements
+  let participants = ctx.setup.participants
+  for (i, par) in participants.enumerate() {
+    par.insert("resolved-style", resolve-style(ctx, par))
+    participants.at(i) = par
+    idx.insert(par.name, i)
+  }
+  for (i, elmt) in elements.enumerate() {
+    if type(elmt) == function {
+      ctx = elmt(ctx).ctx
+    } else if is-elmt(elmt) {
+      if elmt.type == "par" {
+        let style = resolve-style(ctx, elmt)
+        elements.at(i).insert("resolved-style", style)
+        let i = idx.at(elmt.name)
+        participants.at(i).resolved-style = style
+      }
+    }
+  }
+  
+  set-ctx(c => {
+    c.setup.elements = elements
+    c.setup.participants = participants
+    return c
+  })
+})
 
 #let get-size(par) = {
   if par.invisible {
-    return (width: 0pt, height: 0pt)
+    return (width: 0, height: 0)
   }
-  let m = measure(box(par.display-name))
-  let w = m.width
-  let h = m.height
-  let (shape-w, shape-h) = (
-    participant: (w + PAR-PAD.last() * 2, h + PAR-PAD.first() * 2),
-    actor: (ACTOR-WIDTH * 1pt, ACTOR-WIDTH * 2pt + SYM-GAP * 1pt + h),
-    boundary: (BOUNDARY-HEIGHT * 2pt, BOUNDARY-HEIGHT * 1pt + SYM-GAP * 1pt + h),
-    control: (CONTROL-HEIGHT * 1pt, CONTROL-HEIGHT * 1pt + SYM-GAP * 1pt + h),
-    entity: (ENTITY-HEIGHT * 1pt, ENTITY-HEIGHT * 1pt + 2pt + SYM-GAP * 1pt + h),
-    database: (DATABASE-WIDTH * 1pt, DATABASE-WIDTH * 4pt / 3 + SYM-GAP * 1pt + h),
-    collections: (
-      w + COLLECTIONS-PAD.last() * 2 + calc.abs(COLLECTIONS-DX) * 1pt,
-      h + COLLECTIONS-PAD.first() * 2 + calc.abs(COLLECTIONS-DY) * 1pt,
-    ),
-    queue: (
-      w + QUEUE-PAD.last() * 2 + 3 * (h + QUEUE-PAD.first() * 2) / 4,
-      h + QUEUE-PAD.first() * 2
-    ),
-    custom: (
-      measure(par.custom-image).width,
-      measure(par.custom-image).height + SYM-GAP * 1pt + h
-    )
-  ).at(par.shape)
-
-  return (
-    width: calc.max(w, shape-w),
-    height: calc.max(h, shape-h)
-  )
+  let style = par.resolved-style
+  let func = shapes.at(style.shape).get-size
+  return func(par)
 }
 
-#let _render-participant(x, y, p, m, bottom) = {
-  let w = m.width / 1pt
-  let h = m.height / 1pt
-  let x0 = x - w / 2 - PAR-PAD.last() / 1pt
-  let x1 = x + w / 2 + PAR-PAD.last() / 1pt
-  let y0 = y + h + PAR-PAD.first() / 1pt * 2
-  if bottom {
-    y0 = y
-  }
-  let y1 = y0 - h - PAR-PAD.first() / 1pt * 2
-
-  draw.rect(
-    (x0, y0),
-    (x1, y1),
-    radius: 2pt,
-    fill: p.color,
-    stroke: black + .5pt
-  )
-  draw.content(
-    ((x0 + x1) / 2, (y0 + y1) / 2),
-    p.display-name,
-    anchor: "center"
-  )
-}
-
-#let _render-actor(x, y, p, m, bottom) = {
-  let w2 = ACTOR-WIDTH / 2
-  let head-r = ACTOR-WIDTH / 4
-  let height = ACTOR-WIDTH * 2
-  let arms-y = height * 0.375
-
-  let y0 = if bottom {y - m.height / 1pt - SYM-GAP} else {y + m.height / 1pt + height + SYM-GAP}
-  draw.circle(
-    (x, y0 - head-r),
-    radius: head-r,
-    fill: p.color,
-    stroke: black + .5pt
-  )
-  draw.line((x, y0 - head-r * 2), (x, y0 - height + w2), stroke: black + .5pt)
-  draw.line((x - w2, y0 - arms-y), (x + w2, y0 - arms-y), stroke: black + .5pt)
-  draw.line((x - w2, y0 - height), (x, y0 - height + w2), (x + w2, y0 - height), stroke: black + .5pt)
-  draw.content(
-    (x, y),
-    p.display-name,
-    anchor: if bottom {"north"} else {"south"}
-  )
-}
-
-#let _render-boundary(x, y, p, m, bottom) = {
-  let circle-r = BOUNDARY-HEIGHT / 2
-  let y0 = if bottom {y - m.height / 1pt - SYM-GAP} else {y + m.height / 1pt + BOUNDARY-HEIGHT + SYM-GAP}
-  let x0 = x - BOUNDARY-HEIGHT
-  let y1 = y0 - circle-r
-  let y2 = y0 - BOUNDARY-HEIGHT
-
-  draw.circle(
-    (x + circle-r, y1),
-    radius: circle-r,
-    fill: p.color,
-    stroke: black + .5pt
-  )
-  draw.line(
-    (x0, y0), (x0, y2),
-    stroke: black + .5pt
-  )
-  draw.line(
-    (x0, y1), (x, y1),
-    stroke: black + .5pt
-  )
-  draw.content(
-    (x, y),
-    p.display-name,
-    anchor: if bottom {"north"} else {"south"}
-  )
-}
-
-#let _render-control(x, y, p, m, bottom) = {
-  let r = CONTROL-HEIGHT / 2
-  let y0 = if bottom {y - m.height / 1pt - SYM-GAP} else {y + m.height / 1pt + CONTROL-HEIGHT + SYM-GAP}
-
-  draw.circle(
-    (x, y0 - r),
-    radius: r,
-    fill: p.color,
-    stroke: black + .5pt
-  )
-  draw.mark((x, y0), (x - r / 2, y0), symbol: "stealth", fill: black)
-  draw.content(
-    (x, y),
-    p.display-name,
-    anchor: if bottom {"north"} else {"south"}
-  )
-}
-
-#let _render-entity(x, y, p, m, bottom) = {
-  let r = ENTITY-HEIGHT / 2
-  let y0 = if bottom {y - m.height / 1pt - SYM-GAP} else {y + m.height / 1pt + ENTITY-HEIGHT + SYM-GAP}
-  let y1 = y0 - ENTITY-HEIGHT - 1.5
-
-  draw.circle(
-    (x, y0 - r),
-    radius: r,
-    fill: p.color,
-    stroke: black + .5pt
-  )
-  draw.line(
-    (x - r, y1),
-    (x + r, y1),
-    stroke: black + .5pt
-  )
-  draw.content(
-    (x, y),
-    p.display-name,
-    anchor: if bottom {"north"} else {"south"}
-  )
-}
-
-#let _render-database(x, y, p, m, bottom) = {
-  let height = DATABASE-WIDTH * 4 / 3
-  let rx = DATABASE-WIDTH / 2
-  let ry = rx / 2
-  let y0 = if bottom {y - m.height / 1pt - SYM-GAP} else {y + m.height / 1pt + height + SYM-GAP}
-  let y1 = y0 - height
-
-  draw.merge-path(
-    close: true,
-    fill: p.color,
-    stroke: black + .5pt,
-    {
-      draw.bezier((x - rx, y0 - ry), (x, y0), (x - rx, y0 - ry/2), (x - rx/2, y0))
-      draw.bezier((), (x + rx, y0 - ry), (x + rx/2, y0), (x + rx, y0 - ry/2))
-      draw.line((), (x + rx, y1 + ry))
-      draw.bezier((), (x, y1), (x + rx, y1 + ry/2), (x + rx/2, y1))
-      draw.bezier((), (x - rx, y1 + ry), (x - rx/2, y1), (x - rx, y1 + ry/2))
-    }
-  )
-  draw.merge-path(
-    stroke: black + .5pt,
-    {
-      draw.bezier((x - rx, y0 - ry), (x, y0 - ry*2), (x - rx, y0 - 3*ry/2), (x - rx/2, y0 - ry*2))
-      draw.bezier((), (x + rx, y0 - ry), (x + rx/2, y0 - ry*2), (x + rx, y0 - 3*ry/2))
-    }
-  )
-  draw.content(
-    (x, y),
-    p.display-name,
-    anchor: if bottom {"north"} else {"south"}
-  )
-}
-
-#let _render-collections(x, y, p, m, bottom) = {
-  let w = m.width / 1pt
-  let h = m.height / 1pt
-  let dx = COLLECTIONS-DX
-  let dy = COLLECTIONS-DY
-  let total-w = w + PAR-PAD.last() * 2 / 1pt + calc.abs(dx)
-  let total-h = h + PAR-PAD.first() * 2 / 1pt + calc.abs(dy)
-
-  let x0 = x - total-w / 2
-  let x1 = x0 + calc.abs(dx)
-  let x3 = x0 + total-w
-  let x2 = x3 - calc.abs(dx)
-  
-  let y0 = if bottom {y} else {y + total-h}
-  let y1 = y0 - calc.abs(dy)
-  let y3 = y0 - total-h
-  let y2 = y3 + calc.abs(dy)
-
-  let r1 = (x1, y0, x3, y2)
-  let r2 = (x0, y1, x2, y3)
-
-  if dx < 0 {
-    r1.at(0) = x0
-    r1.at(2) = x2
-    r2.at(0) = x1
-    r2.at(2) = x3
-  }
-
-  if dy < 0 {
-    r1.at(1) = y1
-    r1.at(3) = y3
-    r2.at(1) = y0
-    r2.at(3) = y2
-  }
-  draw.rect(
-    (r1.at(0), r1.at(1)),
-    (r1.at(2), r1.at(3)),
-    fill: p.color,
-    stroke: black + .5pt
-  )
-  draw.rect(
-    (r2.at(0), r2.at(1)),
-    (r2.at(2), r2.at(3)),
-    fill: p.color,
-    stroke: black + .5pt
-  )
-  
-  draw.content(
-    ((r2.at(0) + r2.at(2)) / 2, (r2.at(1) + r2.at(3)) / 2),
-    p.display-name,
-    anchor: "center"
-  )
-}
-
-#let _render-queue(x, y, p, m, bottom) = {
-  let w = (m.width + QUEUE-PAD.last() * 2) / 1pt
-  let h = (m.height + QUEUE-PAD.first() * 2) / 1pt
-  let total-h = h
-  let ry = total-h / 2
-  let rx = ry / 2
-  let total-w = w + 3 + 3 * rx
-
-  let x0 = x - total-w / 2
-  let y0 = if bottom {y} else {y + total-h}
-  let y1 = y0 - total-h
-  let x-left = x0 + rx
-  let x-right = x-left + w + rx
-  draw.merge-path(
-    close: true,
-    fill: p.color,
-    stroke: black + .5pt,
-    {
-      draw.bezier((x-right, y0), (x-right + rx, y0 - ry), (x-right + rx/2, y0), (x-right + rx, y0 - ry/2))
-      draw.bezier((), (x-right, y1), (x-right + rx, y1 + ry/2), (x-right + rx/2, y1))
-      draw.line((), (x-left, y1))
-      draw.bezier((), (x-left - rx, y0 - ry), (x-left - rx/2, y1), (x-left - rx, y1 + ry/2))
-      draw.bezier((), (x-left, y0), (x-left - rx, y0 - ry/2), (x-left - rx/2, y0))
-    }
-  )
-  draw.merge-path(
-    stroke: black + .5pt,
-    {
-      draw.bezier((x-right, y0), (x-right - rx, y0 - ry), (x-right - rx/2, y0), (x-right - rx, y0 - ry/2))
-      draw.bezier((), (x-right, y1), (x-right - rx, y1 + ry/2), (x-right - rx/2, y1))
-    }
-  )
-  draw.content(
-    ((x-left + x-right - rx) / 2, y0 - ry),
-    p.display-name,
-    anchor: "center"
-  )
-}
-
-#let _render-custom(x, y, p, m, bottom) = {
-  let image-m = measure(p.custom-image)
-  let y0 = if bottom {y - m.height / 1pt - SYM-GAP} else {y + m.height / 1pt + image-m.height / 1pt + SYM-GAP}
-  draw.content((x - image-m.width / 2pt, y0), p.custom-image, anchor: "north-west")
-  draw.content(
-    (x, y),
-    p.display-name,
-    anchor: if bottom {"north"} else {"south"}
-  )
-}
-
-#let render(par, y: 0, bottom: false) = draw.group(cetz-ctx => {
-  let ctx = cetz-ctx.shared-state.chronos
-  let m = measure(box(par.display-name))
-  let func = (
-    participant: _render-participant,
-    actor: _render-actor,
-    boundary: _render-boundary,
-    control: _render-control,
-    entity: _render-entity,
-    database: _render-database,
-    collections: _render-collections,
-    queue: _render-queue,
-    custom: _render-custom,
-  ).at(par.shape)
-  func(ctx.x-pos.at(par.i), y, par, m, bottom)
+#let render(par, y: 0, bottom: false) = get-ctx(ctx => {
+  let style = resolve-style(ctx, par)
+  let func = shapes.at(style.shape).render
+  let par = par
+  par.resolved-style = style
+  func(ctx.x-pos.at(par.i), y, par, bottom)
 },)
 
 #let render-lifelines() = get-ctx(ctx => {
   let participants = ctx.participants
   for p in participants.filter(p => not p.invisible) {
+    let style = p.resolved-style
     let x = ctx.x-pos.at(p.i)
 
     // Draw vertical line
@@ -318,66 +111,61 @@
 
     let rects = ()
     let destructions = ()
-    let lines = ()
+    let stack = ()
 
     // Compute lifeline rectangles + destruction positions
-    for line in ctx.lifelines.at(p.i).lines {
-      let event = line.first()
-      if event == "create" {
-        last-y = line.at(1)
+    for event in ctx.lifelines.at(p.i).events {
+      if event.type == "create" {
+        last-y = event.y
 
-      } else if event == "enable" {
-        if lines.len() == 0 {
+      } else if event.type == "enable" {
+        if stack.len() == 0 {
           draw.line(
             (x, last-y),
-            (x, line.at(1)),
-            stroke: p.line-stroke
+            (x, event.y),
+            stroke: style.track
           )
         }
-        lines.push(line)
+        stack.push(event)
       
-      } else if event == "disable" or event == "destroy" {
+      } else if event.type == "disable" or event.type == "destroy" {
         let lvl = 0
-        if lines.len() != 0 {
-          let l = lines.pop()
-          lvl = lines.len()
+        if stack.len() != 0 {
+          let e = stack.pop()
+          lvl = stack.len()
           rects.push((
             x + lvl * LIFELINE-W / 2,
-            l.at(1),
-            line.at(1),
-            l.at(2)
+            e.y,
+            event.y,
+            e.style
           ))
-          last-y = line.at(1)
+          last-y = event.y
         }
 
-        if event == "destroy" {
-          destructions.push((x + lvl * LIFELINE-W / 2, line.at(1)))
+        if event.type == "destroy" {
+          destructions.push((x + lvl * LIFELINE-W / 2, event.y))
         }
-      } else if event == "delay-start" {
+      } else if event.type == "delay-start" {
         draw.line(
           (x, last-y),
-          (x, line.at(1)),
-          stroke: p.line-stroke
+          (x, event.y),
+          stroke: style.track
         )
-        last-y = line.at(1)
-      } else if event == "delay-end" {
+        last-y = event.y
+      } else if event.type == "delay-end" {
         draw.line(
           (x, last-y),
-          (x, line.at(1)),
-          stroke: (
-            dash: "loosely-dotted",
-            paint: gray.darken(40%),
-            thickness: .8pt
-          )
+          (x, event.y),
+          stroke: event.style.stroke
         )
-        last-y = line.at(1)
+        last-y = event.y
       }
     }
 
     draw.line(
       (x, last-y),
       (x, ctx.y),
-      stroke: p.line-stroke
+      stroke: style.track
     )
 
     // Draw lifeline rectangles (reverse for bottom to top)
@@ -399,7 +187,7 @@
     }
 
     // Draw participants (end)
-    if p.show-bottom {
+    if style.show-bottom {
       (p.draw)(p, y: ctx.y, bottom: true)
     }
   }

src/core/draw/participant/actor.typ

@@ -0,0 +1,75 @@
+#import "/src/cetz.typ": draw
+
+#import "/src/core/utils.typ": normalize-measure, normalize-units
+
+#let name = "actor"
+
+#let render(x, y, p, bottom) = {
+  let m = normalize-measure(p.display-name)
+  let style = p.resolved-style
+  let spacing = normalize-units(style.spacing)
+  let width = normalize-units(style.width)
+  let height = width * 2
+  let w2 = width / 2
+  let head-r = width / 4
+  let arms-y = height * 0.375
+
+  let y0 = if bottom {
+    y - m.height - spacing
+  } else {
+    y + m.height + height + spacing
+  }
+
+  // Head
+  draw.circle(
+    (x, y0 - head-r),
+    radius: head-r,
+    fill: style.fill,
+    stroke: style.stroke
+  )
+
+  // Body
+  draw.line(
+    (x, y0 - head-r * 2),
+    (x, y0 - height + w2),
+    stroke: style.stroke
+  )
+  
+  // Arms
+  draw.line(
+    (x - w2, y0 - arms-y),
+    (x + w2, y0 - arms-y),
+    stroke: style.stroke
+  )
+
+  // Legs
+  draw.line(
+    (x - w2, y0 - height),
+    (x, y0 - height + w2),
+    (x + w2, y0 - height),
+    stroke: style.stroke
+  )
+  draw.content(
+    (x, y),
+    p.display-name,
+    anchor: if bottom {"north"} else {"base"}
+  )
+}
+
+#let get-size(par) = {
+  let m = normalize-measure(par.display-name)
+
+  let width = normalize-units(par.resolved-style.width)
+  let height = width * 2
+  let spacing = normalize-units(par.resolved-style.spacing)
+
+  return (
+    width: calc.max(m.width, width),
+    height: height + spacing + m.height
+  )
+}
+
+#let default-style = (
+  width: 20pt,
+  spacing: 5pt
+)

src/core/draw/participant/boundary.typ

@@ -0,0 +1,59 @@
+#import "/src/cetz.typ": draw
+
+#import "/src/core/utils.typ": normalize-measure, normalize-units
+
+#let name = "boundary"
+
+#let render(x, y, p, bottom) = {
+  let m = normalize-measure(p.display-name)
+  let style = p.resolved-style
+  let height = normalize-units(style.height)
+  let spacing = normalize-units(style.spacing)
+  let circle-r = height / 2
+  let y0 = if bottom {
+    y - m.height - spacing
+  } else {
+    y + m.height + height + spacing
+  }
+  let x0 = x - height
+  let y1 = y0 - circle-r
+  let y2 = y0 - height
+
+  draw.circle(
+    (x + circle-r, y1),
+    radius: circle-r,
+    fill: style.fill,
+    stroke: style.stroke
+  )
+  draw.line(
+    (x0, y0), (x0, y2),
+    stroke: style.stroke
+  )
+  draw.line(
+    (x0, y1), (x, y1),
+    stroke: style.stroke
+  )
+  draw.content(
+    (x, y),
+    p.display-name,
+    anchor: if bottom {"north"} else {"base"}
+  )
+}
+
+#let get-size(par) = {
+  let m = normalize-measure(par.display-name)
+
+  let height = normalize-units(par.resolved-style.height)
+  let width = height * 2
+  let spacing = normalize-units(par.resolved-style.spacing)
+
+  return (
+    width: calc.max(m.width, width),
+    height: height + spacing + m.height
+  )
+}
+
+#let default-style = (
+  height: 20pt,
+  spacing: 5pt
+)

src/core/draw/participant/collections.typ

@@ -0,0 +1,108 @@
+#import "/src/cetz.typ": draw
+
+#import "/src/core/utils.typ": normalize-measure, normalize-units
+
+#let name = "collections"
+
+#let normalize-offset(offset) = {
+  let dx = 0pt
+  let dy = 0pt
+  if type(offset) == array {
+    if offset.len() >= 2 {
+      dx = offset.at(0)
+      dy = offset.at(1)
+    }
+  } else if type(offset) == dictionary {
+    dx = offset.at("dx", default: dx)
+    dy = offset.at("dx", default: dy)
+  } else {
+    dx = offset
+    dy = offset
+  }
+  return (
+    x: normalize-units(dx),
+    y: normalize-units(dy)
+  )
+}
+
+#let render(x, y, p, bottom) = {
+  let style = p.resolved-style
+  let name = box(
+    p.display-name,
+    inset: style.inset,
+    fill: style.fill,
+    stroke: style.stroke
+  )
+  let m = normalize-measure(name)
+  let offset = normalize-offset(style.offset)
+
+  let w = m.width
+  let h = m.height
+  let dx = offset.x
+  let dy = offset.y
+  let total-w = w + calc.abs(dx)
+  let total-h = h + calc.abs(dy)
+
+  let x0 = x - total-w / 2
+  let x1 = x0 + calc.abs(dx)
+  let x3 = x0 + total-w
+  let x2 = x3 - calc.abs(dx)
+  
+  let y0 = if bottom {y} else {y + total-h}
+  let y1 = y0 - calc.abs(dy)
+  let y3 = y0 - total-h
+  let y2 = y3 + calc.abs(dy)
+
+  let r1 = (x1, y0, x3, y2)
+  let r2 = (x0, y1, x2, y3)
+
+  if dx < 0 {
+    r1.at(0) = x0
+    r1.at(2) = x2
+    r2.at(0) = x1
+    r2.at(2) = x3
+  }
+
+  if dy < 0 {
+    r1.at(1) = y1
+    r1.at(3) = y3
+    r2.at(1) = y0
+    r2.at(3) = y2
+  }
+  draw.rect(
+    (r1.at(0), r1.at(1)),
+    (r1.at(2), r1.at(3)),
+    fill: style.fill,
+    stroke: style.stroke
+  )
+  
+  draw.content(
+    (
+      (r2.at(0) + r2.at(2)) / 2,
+      (r2.at(1) + r2.at(3)) / 2
+    ),
+    name,
+    anchor: "mid"
+  )
+}
+
+#let get-size(par) = {
+  let m = normalize-measure(box(
+    par.display-name,
+    inset: par.resolved-style.inset
+  ))
+  
+  let offset = normalize-offset(par.resolved-style.offset)
+  let dx = offset.x
+  let dy = offset.y
+
+  return (
+    width: m.width + calc.abs(dx),
+    height: m.height + calc.abs(dy)
+  )
+}
+
+#let default-style = (
+  inset: (x: 3pt, y: 5pt),
+  offset: (3pt, 3pt)
+)

src/core/draw/participant/control.typ

@@ -0,0 +1,54 @@
+#import "/src/cetz.typ": draw
+
+#import "/src/core/utils.typ": normalize-measure, normalize-units
+
+#let name = "control"
+
+#let render(x, y, p, bottom) = {
+  let m = normalize-measure(p.display-name)
+  let style = p.resolved-style
+  let size = normalize-units(style.size)
+  let spacing = normalize-units(style.spacing)
+  let r = size / 2
+  let y0 = if bottom {
+    y - m.height - spacing
+  } else {
+    y + m.height + size + spacing
+  }
+
+  draw.circle(
+    (x, y0 - r),
+    radius: r,
+    fill: style.fill,
+    stroke: style.stroke
+  )
+  let s = stroke(style.stroke)
+  draw.mark(
+    (x, y0), (x - r / 2, y0),
+    symbol: "stealth",
+    fill: s.paint,
+    stroke: s.paint
+  )
+  draw.content(
+    (x, y),
+    p.display-name,
+    anchor: if bottom {"north"} else {"base"}
+  )
+}
+
+#let get-size(par) = {
+  let m = normalize-measure(par.display-name)
+
+  let size = normalize-units(par.resolved-style.size)
+  let spacing = normalize-units(par.resolved-style.spacing)
+
+  return (
+    width: calc.max(m.width, size),
+    height: size + spacing + m.height
+  )
+}
+
+#let default-style = (
+  size: 20pt,
+  spacing: 5pt
+)

src/core/draw/participant/custom.typ

@@ -0,0 +1,43 @@
+#import "/src/cetz.typ": draw
+
+#import "/src/core/utils.typ": normalize-measure, normalize-units
+
+#let name = "custom"
+
+#let render(x, y, p, bottom) = {
+  let style = p.resolved-style
+  let elmts = (style.image, p.display-name)
+  if bottom {
+    elmts = elmts.rev()
+  }
+  let shape = align(
+    center,
+    stack(
+      dir: ttb,
+      spacing: normalize-units(style.spacing) * 1pt,
+      ..elmts
+    )
+  )
+  let anchor = if bottom {"north"} else {"base"}
+  draw.content(
+    (x, y),
+    shape,
+    anchor: anchor
+  )
+}
+
+#let get-size(par) = {
+  let name-m = normalize-measure(par.display-name)
+  let img-m = normalize-measure(par.resolved-style.image)
+  let spacing = normalize-units(par.resolved-style.spacing)
+
+  return (
+    width: calc.max(name-m.width, img-m.width),
+    height: name-m.height + spacing + img-m.height
+  )
+}
+
+#let default-style = (
+  image: none,
+  spacing: 5pt
+)

src/core/draw/participant/database.typ

@@ -0,0 +1,64 @@
+#import "/src/cetz.typ": draw
+
+#import "/src/core/utils.typ": normalize-measure, normalize-units
+
+#let name = "database"
+
+#let render(x, y, p, bottom) = {
+  let m = normalize-measure(p.display-name)
+  let style = p.resolved-style
+  let width = normalize-units(style.width)
+  let spacing = normalize-units(style.spacing)
+  let height = width * 4 / 3
+  let rx = width / 2
+  let ry = rx / 2
+  let y0 = if bottom {
+    y - m.height - spacing
+  } else {
+    y + m.height + height + spacing
+  }
+  let y1 = y0 - height
+
+  draw.merge-path(
+    close: true,
+    fill: style.fill,
+    stroke: style.stroke,
+    {
+      draw.bezier((x - rx, y0 - ry), (x, y0), (x - rx, y0 - ry/2), (x - rx/2, y0))
+      draw.bezier((), (x + rx, y0 - ry), (x + rx/2, y0), (x + rx, y0 - ry/2))
+      draw.line((), (x + rx, y1 + ry))
+      draw.bezier((), (x, y1), (x + rx, y1 + ry/2), (x + rx/2, y1))
+      draw.bezier((), (x - rx, y1 + ry), (x - rx/2, y1), (x - rx, y1 + ry/2))
+    }
+  )
+  draw.merge-path(
+    stroke: style.stroke,
+    {
+      draw.bezier((x - rx, y0 - ry), (x, y0 - ry*2), (x - rx, y0 - 3*ry/2), (x - rx/2, y0 - ry*2))
+      draw.bezier((), (x + rx, y0 - ry), (x + rx/2, y0 - ry*2), (x + rx, y0 - 3*ry/2))
+    }
+  )
+  draw.content(
+    (x, y),
+    p.display-name,
+    anchor: if bottom {"north"} else {"base"}
+  )
+}
+
+#let get-size(par) = {
+  let m = normalize-measure(par.display-name)
+
+  let width = normalize-units(par.resolved-style.width)
+  let height = width * 4 / 3
+  let spacing = normalize-units(par.resolved-style.spacing)
+
+  return (
+    width: calc.max(m.width, width),
+    height: height + spacing + m.height
+  )
+}
+
+#let default-style = (
+  width: 24pt,
+  spacing: 5pt
+)

src/core/draw/participant/default.typ

@@ -0,0 +1,37 @@
+#import "/src/cetz.typ": draw
+
+#import "/src/core/utils.typ": normalize-measure
+
+#let name = "participant"
+
+#let render(x, y, p, bottom) = {
+  let style = p.resolved-style
+  let name = box(
+    p.display-name,
+    inset: style.inset,
+    radius: style.radius,
+    fill: style.fill,
+    stroke: style.stroke
+  )
+  let anchor = if bottom {"north"} else {"base"}
+  draw.content(
+    (x, y),
+    name,
+    anchor: anchor
+  )
+}
+
+#let get-size(par) = {
+  return normalize-measure(box(
+    par.display-name,
+    inset: par.resolved-style.inset
+  ))
+}
+
+#let default-style = (
+  inset: (
+    x: 3pt,
+    y: 5pt
+  ),
+  radius: 2pt
+)

src/core/draw/participant/entity.typ

@@ -0,0 +1,55 @@
+#import "/src/cetz.typ": draw
+
+#import "/src/core/utils.typ": normalize-measure, normalize-units
+
+#let name = "entity"
+
+#let render(x, y, p, bottom) = {
+  let m = normalize-measure(p.display-name)
+  let style = p.resolved-style
+  let size = normalize-units(style.size)
+  let spacing = normalize-units(style.spacing)
+  let gap = normalize-units(style.gap)
+  let r = size / 2
+  let y0 = if bottom {
+    y - m.height - spacing
+  } else {
+    y + m.height + size + spacing
+  }
+  let y1 = y0 - size - gap
+
+  draw.circle(
+    (x, y0 - r),
+    radius: r,
+    fill: style.fill,
+    stroke: style.stroke
+  )
+  draw.line(
+    (x - r, y1),
+    (x + r, y1),
+    stroke: style.stroke
+  )
+  draw.content(
+    (x, y),
+    p.display-name,
+    anchor: if bottom {"north"} else {"base"}
+  )
+}
+
+#let get-size(par) = {
+  let m = normalize-measure(par.display-name)
+
+  let size = normalize-units(par.resolved-style.size)
+  let spacing = normalize-units(par.resolved-style.spacing)
+
+  return (
+    width: calc.max(m.width, size),
+    height: size + spacing + m.height
+  )
+}
+
+#let default-style = (
+  size: 20pt,
+  gap: 1.5pt,
+  spacing: 5pt
+)

src/core/draw/participant/queue.typ

@@ -0,0 +1,120 @@
+#import "/src/cetz.typ": draw
+
+#import "/src/core/utils.typ": normalize-measure
+
+#let name = "queue"
+
+#let render(x, y, p, bottom) = {
+  let style = p.resolved-style
+  let m = normalize-measure(box(
+    p.display-name,
+    inset: style.inset
+  ))
+  
+  let w = m.width
+  let h = m.height
+  let ry = h / 2
+  let rx = ry / 2
+  let total-w = w + 3 * rx
+
+  let y0 = if bottom {y} else {y + h}
+  let y1 = y0 - h
+  let ym = y0 - ry
+
+  let xll = x - total-w / 2
+  let xrr = x + total-w / 2
+  let xlm = xll + rx
+  let xrm = xrr - rx
+  let xrl = xrm - rx
+  
+  /*
+   /A----------/B\   --- y0
+   Fh          G C   --- ym
+   \E----------\D/   --- y1
+  
+   ||          |||
+   ||          ||\-- xrr
+   ||          |\--- xrm
+   ||          \---- xrl
+   |\--------------- xlm
+   \---------------- xll
+  
+  h <-> G == w
+  F <-> h == rx
+  G <-> C == 2 * rx == ry
+  A <-> E == B <-> D == 2 * ry == h
+  */
+
+  draw.merge-path(
+    close: true,
+    fill: style.fill,
+    stroke: style.stroke,
+    {
+      draw.bezier(
+        (xrm, y0),
+        (xrr, ym),
+        (xrm + rx/2, y0),
+        (xrr, ym + ry/2)
+      )
+      draw.bezier(
+        (),
+        (xrm, y1),
+        (xrr, ym - ry/2),
+        (xrm + rx/2, y1)
+      )
+      draw.line((), (xlm, y1))
+      draw.bezier(
+        (),
+        (xll, ym),
+        (xlm - rx/2, y1),
+        (xll, ym - ry/2)
+      )
+      draw.bezier(
+        (),
+        (xlm, y0),
+        (xll, ym + ry/2),
+        (xlm - rx/2, y0)
+      )
+    }
+  )
+  draw.merge-path(
+    stroke: style.stroke,
+    {
+      draw.bezier(
+        (xrm, y0),
+        (xrl, ym),
+        (xrm - rx/2, y0),
+        (xrl, ym + ry/2)
+      )
+      draw.bezier(
+        (),
+        (xrm, y1),
+        (xrl, ym - ry/2),
+        (xrm - rx/2, y1)
+      )
+    }
+  )
+  draw.content(
+    ((xlm + xrl) / 2, ym),
+    p.display-name,
+    anchor: "mid"
+  )
+}
+
+#let get-size(par) = {
+  let m = normalize-measure(box(
+    par.display-name,
+    inset: par.resolved-style.inset
+  ))
+
+  let rx = m.height / 4
+
+  return (
+    width: m.width + 3 * rx,
+    height: m.height
+  )
+}
+
+#let default-style = (
+  inset: (x: 3pt, y: 5pt)
+)

src/core/draw/separator.typ

@@ -1,47 +1,65 @@
-#import "/src/cetz.typ": draw
+#import "/src/cetz.typ": draw, styles
 
 #import "/src/consts.typ": *
-#import "/src/core/utils.typ": get-ctx, set-ctx
+#import "/src/core/utils.typ": get-ctx, normalize-units, set-y
+
+#let separator-default-style = (
+  inset: (
+    x: 3pt, y: 5pt
+  ),
+  fill: auto,
+  stroke: auto,
+  gap: 3pt,
+  outset: 20pt
+)
 
 #let render(sep) = get-ctx(ctx => {
-  ctx.y -= Y-SPACE
-
-  let x0 = ctx.x-pos.first() - 20
-  let x1 = ctx.x-pos.last() + 20
-  let m = measure(
-    box(
-      sep.name,
-      inset: (left: 3pt, right: 3pt, top: 5pt, bottom: 5pt)
-    )
+  let style = styles.resolve(
+    ctx.style,
+    merge: sep.style,
+    root: "separator",
+    base: separator-default-style
   )
+  let gap = normalize-units(style.gap)
+  let outset = normalize-units(style.outset)
+
+  ctx.y -= ctx.style.y-space
+
+  let x0 = ctx.x-pos.first() - outset
+  let x1 = ctx.x-pos.last() + outset
+  let name = box(
+    sep.name,
+    inset: style.inset,
+    stroke: style.stroke,
+    fill: style.fill
+  )
+  let m = measure(name)
   let w = m.width / 1pt
   let h = m.height / 1pt
   let cx = (x0 + x1) / 2
   let xl = cx - w / 2
   let xr = cx + w / 2
 
-  ctx.y -= h / 2
-  draw.rect(
-    (x0, ctx.y),
-    (x1, ctx.y - 3),
-    stroke: none,
-    fill: white
-  )
-  draw.line((x0, ctx.y), (x1, ctx.y))
-  ctx.y -= 3
-  draw.line((x0, ctx.y), (x1, ctx.y))
-  draw.content(
-    ((x0 + x1) / 2, ctx.y + 1.5),
-    sep.name,
-    anchor: "center",
-    padding: (5pt, 3pt),
-    frame: "rect",
-    fill: COL-SEP-NAME
-  )
-  ctx.y -= h / 2
+  let y0 = ctx.y
+  let y2 = y0 - h
+  let y1 = (y0 + y2) / 2
 
-  set-ctx(c => {
-    c.y = ctx.y
-    return c
-  })
+  let gap-y0 = y1 + gap / 2
+  let gap-y1 = gap-y0 - gap
+
+  draw.rect(
+    (x0, gap-y0),
+    (x1, gap-y1),
+    stroke: none,
+    fill: style.fill
+  )
+  draw.line((x0, gap-y0), (x1, gap-y0))
+  draw.line((x0, gap-y1), (x1, gap-y1))
+  draw.content(
+    (cx, y1),
+    name,
+    anchor: "mid"
+  )
+
+  set-y(y2)
 })

src/core/draw/sequence.typ

@@ -49,7 +49,7 @@
 #let is-cross-tip = is-tip-of-type.with("x")
 
 #let render(seq) = get-ctx(ctx => {
-  ctx.y -= Y-SPACE
+  ctx.y -= ctx.style.y-space
 
   let i1 = ctx.pars-i.at(seq.p1)
   let i2 = ctx.pars-i.at(seq.p2)
@@ -70,7 +70,8 @@
   h = calc.max(
     h,
     ..seq.linked-notes.map(n => {
-      note.get-size(n).height / 2
+      let nt = ctx.notes.at(n.id)
+      note.get-size(nt).height / 2
     })
   )
   ctx.y -= h
@@ -102,23 +103,23 @@
   if seq.disable-src {
     let src-line = ctx.lifelines.at(i1)
     src-line.level -= 1
-    src-line.lines.push(("disable", start-info.y))
+    src-line.events.push((type: "disable", y: start-info.y))
     ctx.lifelines.at(i1) = src-line
   }
   if seq.destroy-src {
     let src-line = ctx.lifelines.at(i1)
-    src-line.lines.push(("destroy", start-info.y))
+    src-line.events.push((type: "destroy", y: start-info.y))
     ctx.lifelines.at(i1) = src-line
   }
   if seq.disable-dst {
     let dst-line = ctx.lifelines.at(i2)
     dst-line.level -= 1
-    dst-line.lines.push(("disable", end-info.y))
+    dst-line.events.push((type: "disable", y: end-info.y))
     ctx.lifelines.at(i2) = dst-line
   }
   if seq.destroy-dst {
     let dst-line = ctx.lifelines.at(i2)
-    dst-line.lines.push(("destroy", end-info.y))
+    dst-line.events.push((type: "destroy", y: end-info.y))
     ctx.lifelines.at(i2) = dst-line
   }
   if seq.enable-dst {
@@ -341,12 +342,12 @@
 
   if seq.create-dst {
     let dst-line = ctx.lifelines.at(i2)
-    dst-line.lines.push(("create", end-info.y))
+    dst-line.events.push((type: "create", y: end-info.y))
     ctx.lifelines.at(i2) = dst-line
   }
   if seq.enable-dst {
     let dst-line = ctx.lifelines.at(i2)
-    dst-line.lines.push(("enable", end-info.y, seq.lifeline-style))
+    dst-line.events.push((type: "enable", y: end-info.y, style: seq.lifeline-style))
     ctx.lifelines.at(i2) = dst-line
   }
 
@@ -354,7 +355,8 @@
     end-info.y = calc.min(
       end-info.y,
       y0 - calc.max(..seq.linked-notes.map(n => {
-        let m = note.get-size(n)
+        let nt = ctx.notes.at(n.id)
+        let m = note.get-size(nt)
         return m.height / 2
       }))
     )

src/core/renderer.typ

@@ -1,19 +1,28 @@
 #import "/src/cetz.typ": canvas, draw
 
-#import "draw/note.typ": get-box as get-note-box, get-size as get-note-size
+#import "draw/note.typ"
 #import "draw/participant.typ"
 #import "utils.typ": *
 #import "/src/consts.typ": *
 
 #let DEBUG-INVISIBLE = false
 
-#let init-lifelines(participants) = {
-  return participants.map(p => {
+#let init-lifelines() = set-ctx(ctx => {
+  ctx.setup.participants = ctx.setup.participants.map(p => {
     p.insert("lifeline-lvl", 0)
     p.insert("max-lifelines", 0)
     p
   })
-}
+  return ctx
+})
+
+#let set-participants-i() = set-ctx(ctx => {
+  ctx.setup.insert(
+    "pars-i",
+    get-participants-i(ctx.setup.participants)
+  )
+  return ctx
+})
 
 #let unwrap-syncs(elements) = {
   let i = 0
@@ -78,28 +87,29 @@
   return participants
 }
 
-#let note-get-cell(pars-i, note) = {
+#let note-get-cell(notes, pars-i, n) = {
   let (p1, p2) = (none, none)
   let cell = none
-  if note.side == "left" {
-    p1 = note.pos2
-    p2 = note.pos
-    cell = get-note-box(note)
-  } else if note.side == "right" {
-    p1 = note.pos
-    p2 = note.pos2
-    cell = get-note-box(note)
-  } else if note.side == "over" and note.aligned-with != none {
-    let box1 = get-note-box(note)
-    let box2 = get-note-box(note.aligned-with)
+  if n.side == "left" {
+    p1 = n.pos2
+    p2 = n.pos
+    cell = note.get-box(n)
+  } else if n.side == "right" {
+    p1 = n.pos
+    p2 = n.pos2
+    cell = note.get-box(n)
+  } else if n.side == "over" and n.aligned-with != none {
+    let aligned-with = notes.at(n.aligned-with.id)
+    let box1 = note.get-box(n)
+    let box2 = note.get-box(aligned-with)
     let m1 = measure(box1)
     let m2 = measure(box2)
     cell = box(
       width: (m1.width + m2.width) / 2,
       height: calc.max(m1.height, m2.height)
     )
-    p1 = note.pos
-    p2 = note.aligned-with.pos
+    p1 = n.pos
+    p2 = n.aligned-with.pos
   } else {
     return none
   }
@@ -107,7 +117,7 @@
   let i1 = pars-i.at(p1)
   let i2 = pars-i.at(p2)
   cell = (
-    elmt: note,
+    elmt: n,
     i1: calc.min(i1, i2),
     i2: calc.max(i1, i2),
     cell: cell
@@ -116,7 +126,7 @@
   return cell
 }
 
-#let compute-max-lifeline-levels(participants, elements, pars-i) = {
+#let compute-max-lifeline-levels(participants, elements, notes, pars-i) = {
   let cells = ()
   for elmt in elements {
     if elmt.type == "seq" {
@@ -135,14 +145,14 @@
       )
     
     } else if elmt.type == "note" {
-      let cell = note-get-cell(pars-i, elmt)
+      let cell = note-get-cell(notes, pars-i, notes.at(elmt.id))
       if cell != none {
         cells.push(cell)
       }
     }
   }
 
-  return (participants, elements, cells)
+  return (participants, cells)
 }
 
 /// Compute minimum widths for participant names and shapes
@@ -155,19 +165,18 @@
     let m2 = participant.get-size(p2)
     let w1 = m1.width
     let w2 = m2.width
-    widths.push(w1 / 2pt + w2 / 2pt + PAR-SPACE)
+    widths.push(w1 / 2 + w2 / 2 + PAR-SPACE)
   }
   return widths
 }
 
 /// Compute minimum width for over notes
-#let notes-min-col-widths(elements, widths, pars-i) = {
+#let notes-min-col-widths(notes, widths, pars-i) = {
   let widths = widths
-  let notes = elements.filter(e => e.type == "note")
   for n in notes.filter(e => (e.side == "over" and 
                               type(e.pos) == str)) {
     
-    let m = get-note-size(n)
+    let m = note.get-size(n)
     let i = pars-i.at(n.pos)
 
     if i < widths.len() {
@@ -220,7 +229,7 @@
 }
 
 /// Compute remaining widths for longer sequences (spanning multiple columns)
-#let long-seq-min-col-widths(cells, widths) = {
+#let long-seq-min-col-widths(participants, cells, widths) = {
   let widths = widths
   let multicol-cells = cells.filter(c => c.i2 - c.i1 > 1)
   multicol-cells = multicol-cells.sorted(key: c => {
@@ -228,13 +237,23 @@
   })
   for cell in multicol-cells {
     let m = measure(cell.cell)
+
+    let i1 = cell.i1
+    let i2 = cell.i2 - 1
+    let i = i2
+    if cell.i1 == 0 and participants.at(0).name == "[" {
+      i = 0
+      i1 += 1
+      i2 += 1
+    }
     let width = (
       m.width / 1pt +
       COMMENT-PAD -
-      widths.slice(cell.i1, cell.i2 - 1).sum()
+      widths.slice(i1, i2).sum()
     )
-    widths.at(cell.i2 - 1) = calc.max(
-      widths.at(cell.i2 - 1), width
+    
+    widths.at(i) = calc.max(
+      widths.at(i), width
     )
   }
   return widths
@@ -296,56 +315,71 @@
   return widths
 }
 
-#let compute-columns-width(participants, elements, pars-i) = {
-  elements = elements.filter(is-elmt)
+#let compute-columns-width() = set-ctx(ctx => {
+  let elements = ctx.setup.elements.filter(is-elmt)
+  let participants = ctx.setup.participants
+  let notes = ctx.setup.notes
+  let pars-i = ctx.setup.pars-i
   elements = unwrap-syncs(elements)
 
   let cells
-  (participants, elements, cells) = compute-max-lifeline-levels(participants, elements, pars-i)
+  (participants, cells) = compute-max-lifeline-levels(participants, elements, notes, pars-i)
 
   let widths = participants-min-col-widths(participants)
-  widths = notes-min-col-widths(elements, widths, pars-i)
+  widths = notes-min-col-widths(notes, widths, pars-i)
   widths = simple-seq-min-col-widths(cells, widths)
   widths = self-seq-min-col-widths(cells, widths)
-  widths = long-seq-min-col-widths(cells, widths)
+  widths = long-seq-min-col-widths(participants, cells, widths)
   widths = col-widths-add-lifelines(participants, widths)
   widths = process-col-elements(elements, widths, pars-i)
-  return widths
-}
 
-#let setup-ctx(participants, elements) = (ctx => {
-  let state = ctx.at("shared-state", default: (:))
+  let ctx = ctx
+  ctx.insert("widths", widths)
 
-  let chronos-ctx = (
-    participants: init-lifelines(participants),
-    pars-i: get-participants-i(participants),
-    y: 0,
-    groups: (),
-    lifelines: participants.map(_ => (
-      level: 0,
-      lines: ()
-    ))
-  )
-  chronos-ctx.insert(
-    "widths",
-    compute-columns-width(
-      chronos-ctx.participants,
-      elements,
-      chronos-ctx.pars-i
-    )
-  )
-
-  // Compute each column's X position
   let x-pos = (0,)
-  for width in chronos-ctx.widths {
+  for width in widths {
     x-pos.push(x-pos.last() + width)
   }
-  chronos-ctx.insert("x-pos", x-pos)
-  state.insert("chronos", chronos-ctx)
-  ctx.shared-state = state
-  return (
-    ctx: ctx
-  )
+  ctx.insert("x-pos", x-pos)
+
+  return ctx
+})
+
+#let setup-ctx(participants, elements, notes) = draw.get-ctx(_ => {
+  set-ctx(c => {
+    c.insert("participants", participants)
+    c.insert("setup", (
+      elements: elements,
+      participants: participants,
+      notes: notes
+    ))
+    return c
+  })
+
+  participant.pre-resolve-styles()
+
+  init-lifelines()
+  set-participants-i()
+  
+  note.pre-resolve-styles()
+  compute-columns-width()
+
+  set-ctx(c => {
+    let setup = c.setup
+    c += (
+      participants: setup.participants,
+      pars-i: setup.pars-i,
+      y: 0,
+      groups: (),
+      lifelines: setup.participants.map(_ => (
+        level: 0,
+        events: ()
+      )),
+      notes: setup.notes
+    )
+    c.remove("setup")
+    return c
+  })
 },)
 
 #let render-debug() = get-ctx(ctx => {
@@ -366,13 +400,14 @@
   }
 })
 
-#let render(participants, elements) = context canvas(length: 1pt, {
-  setup-ctx(participants, elements)
+#let render(participants, elements, notes) = context canvas(length: 1pt, {
+  setup-ctx(participants, elements, notes)
 
   // Draw participants (start)
   get-ctx(ctx => {
     for p in ctx.participants {
-      if p.from-start and not p.invisible and p.show-top {
+      let style = p.resolved-style
+      if style.from-start and not p.invisible and style.show-top {
         (p.draw)(p)
       }
     }
@@ -387,9 +422,11 @@
     }
   }
 
-  set-ctx(ctx => {
-    ctx.y -= Y-SPACE
-    return ctx
+  get-ctx(ctx => {
+    set-ctx(c => {
+      c.y -= ctx.style.y-space
+      return c
+    })
   })
 
   draw.on-layer(-1, {

src/core/setup.typ

@@ -126,6 +126,7 @@
     "linked",
     note.pos == none and note.side != "across"
   )
+  note.insert("id", ctx.notes.len())
   let names = ctx.participants.map(p => p.name)
   if note.pos == none and note.side != "across" {
     let i1 = names.position(n => n == ctx.last-seq.p1)
@@ -149,6 +150,7 @@
     let n = ctx.last-note.note
     n.aligned-with = note
     ctx.elmts.at(ctx.last-note.i) = n
+    ctx.notes.at(ctx.last-note.note.id) = n
   }
 
   if note.side in ("left", "right") {
@@ -186,6 +188,8 @@
     }
   }
 
+  ctx.notes.push(note)
+
   ctx.elmts.at(ctx.i) = note
 
   ctx.last-note = (
@@ -226,6 +230,7 @@
     linked: (),
     last-seq: none,
     last-note: none,
+    notes: (),
     participants: (),
     elmts: elmts,
     i: 0
@@ -290,10 +295,10 @@
     ).first())
   }
 
-  return (ctx.elmts, participants)
+  return (ctx.elmts, participants, ctx.notes)
 }
 
-#let finalize-setup(elmts, participants) = {
+#let finalize-setup(elmts, participants, notes) = {
   for (i, p) in participants.enumerate() {
     p.insert("i", i)
     participants.at(i) = p
@@ -323,14 +328,11 @@
     elmts.at(i).insert("max-i", max-i)
   }
 
-  return (elmts, participants)
+  return (elmts, participants, notes)
 }
 
 #let setup(elements) = {
   let (elmts, activation-history) = unwrap-containers(elements)
-  
-  let participants
-  (elmts, participants) = prepare-participants(elmts)
-
-  return finalize-setup(elmts, participants)
+  let (elmts, participants, notes) = prepare-participants(elmts)
+  return finalize-setup(elmts, participants, notes)
 }

src/core/utils.typ

@@ -1,4 +1,6 @@
-#import "/src/cetz.typ": draw
+#import "/src/cetz.typ": draw, styles
+
+#import "/src/consts.typ": default-style
 
 #let is-elmt(elmt) = {
   if type(elmt) != dictionary {
@@ -19,6 +21,15 @@
   }
   panic("Unsupported type '" + str(type(value)) + "'")
 }
+
+#let normalize-measure(body) = {
+  let m = measure(body)
+  return (
+    width: normalize-units(m.width),
+    height: normalize-units(m.height)
+  )
+}
+
 #let get-participants-i(participants) = {
   let pars-i = (:)
   for (i, p) in participants.enumerate() {
@@ -33,6 +44,9 @@
   let pars-i = get-participants-i(participants)
 
   for elmt in group.elmts {
+    if not is-elmt(elmt) {
+      continue
+    }
     if elmt.type == "seq" {
       let i1 = pars-i.at(elmt.p1)
       let i2 = pars-i.at(elmt.p2)
@@ -93,15 +107,47 @@
   )
 })
 
+#let extract-ctx(cetz-ctx, with-style: false) = {
+  let state = cetz-ctx.at("shared-state", default: (:))
+  let ctx = state.at("chronos", default: (:))
+  if with-style {
+    ctx.style = styles.resolve(
+      cetz-ctx.style,
+      root: "chronos",
+      base: default-style
+    )
+    // Normalize because it is used very frequently
+    ctx.style.y-space = normalize-units(ctx.style.y-space)
+  }
+  return ctx
+}
+
 #let set-ctx(func) = draw.set-ctx(c => {
-  let ctx = c.shared-state.chronos
+  let ctx = extract-ctx(c)
   let new-ctx = func(ctx)
   assert(new-ctx != none, message: "set-ctx must return a context!")
-  c.shared-state.chronos = new-ctx
+  let state = c.at("shared-state", default: (:))
+  state.chronos = new-ctx
+  c.shared-state = state
   return c
 })
 
 #let get-ctx(func) = draw.get-ctx(c => {
-  let ctx = c.shared-state.chronos
+  let ctx = extract-ctx(c, with-style: true)
   func(ctx)
 })
+
+#let set-y(new-y) = set-ctx(c => {
+  c.y = new-y
+  return c
+})
+
+#let expand-parent-group(x0, x1) = set-ctx(ctx => {
+  if ctx.groups.len() != 0 {
+    let group = ctx.groups.last()
+    group.min-x = calc.min(group.min-x, x0)
+    group.max-x = calc.max(group.max-x, x1)
+    ctx.groups.last() = group
+  }
+  return ctx
+})

src/diagram.typ

@@ -1,16 +1,15 @@
-#import "core/draw/event.typ": render as evt-render
 #import "core/renderer.typ": render
 #import "core/setup.typ": setup
-#import "core/utils.typ": fit-canvas, set-ctx
+#import "core/utils.typ": fit-canvas
 
 #let diagram(elements, width: auto) = {
   if elements == none {
     return
   }
   
-  let (elmts, participants) = setup(elements)
+  let (elmts, participants, notes) = setup(elements)
 
-  let canvas = render(participants, elmts)
+  let canvas = render(participants, elmts, notes)
   fit-canvas(canvas, width: width)
 }
 

src/group.typ

@@ -1,23 +1,25 @@
 #import "core/draw/group.typ"
 
-#let _grp(name, desc: none, type: "default", elmts) = {
+#let _grp(name, desc: none, type: "default", elmts, ..style) = {
   return ((
     type: "grp",
     draw: group.render-start,
     name: name,
     desc: desc,
     grp-type: type,
-    elmts: elmts
+    elmts: elmts,
+    style: style.named()
   ),)
 }
 
-#let _alt(desc, elmts, ..args) = {
+#let _alt(desc, elmts, ..elses-style) = {
   let all-elmts = ()
   all-elmts += elmts
-  let args = args.pos()
-  for i in range(0, args.len(), step: 2) {
-    let else-desc = args.at(i)
-    let else-elmts = args.at(i + 1, default: ())
+  let elses = elses-style.pos()
+  let style = elses-style.named()
+  for i in range(0, elses.len(), step: 2) {
+    let else-desc = elses.at(i)
+    let else-elmts = elses.at(i + 1, default: ())
     all-elmts.push((
       type: "else",
       draw: group.render-else,
@@ -26,10 +28,10 @@
     all-elmts += else-elmts
   }
 
-  return _grp("alt", desc: desc, type: "alt", all-elmts)
+  return _grp("alt", desc: desc, type: "alt", all-elmts, ..style)
 }
 
-#let _loop(desc, min: none, max: auto, elmts) = {
+#let _loop(desc, min: none, max: auto, elmts, ..style) = {
   let name = "loop"
   if min != none {
     if max == auto {
@@ -37,7 +39,7 @@
     }
     name += "(" + str(min) + "," + str(max) + ")"
   }
-  _grp(name, desc: desc, type: "loop", elmts)
+  _grp(name, desc: desc, type: "loop", elmts, ..style)
 }
-#let _opt(desc, elmts) = grp("opt", desc: desc, type: "opt", elmts)
-#let _break(desc, elmts) = grp("break", desc: desc, type: "break", elmts)
+#let _opt(desc, elmts, ..style) = _grp("opt", desc: desc, type: "opt", elmts, ..style.named())
+#let _break(desc, elmts, ..style) = _grp("break", desc: desc, type: "break", elmts, ..style.named())

src/misc.typ

@@ -1,22 +1,26 @@
+#import "cetz.typ": styles
+
 #import "core/draw/delay.typ"
+#import "core/draw/event.typ": render as evt-render
 #import "core/draw/separator.typ"
 #import "core/draw/sync.typ"
-#import "core/utils.typ": set-ctx
+#import "core/utils.typ": get-ctx, normalize-units, set-y
 
-#let _sep(name) = {
+#let _sep(name, ..style) = {
   return ((
     type: "sep",
     draw: separator.render,
-    name: name
+    name: name,
+    style: style.named()
   ),)
 }
 
-#let _delay(name: none, size: 30) = {
+#let _delay(name: none, ..style) = {
   return ((
     type: "delay",
     draw: delay.render,
     name: name,
-    size: size
+    style: style.named()
   ),)
 }
 
@@ -28,26 +32,36 @@
   ),)
 }
 
-#let gap-render(gap) = set-ctx(ctx => {
-  ctx.y -= gap.size
-  return ctx
+#let gap-default-style = (
+  size: 20pt
+)
+
+#let gap-render(gap) = get-ctx(ctx => {
+  let style = styles.resolve(
+    ctx.style,
+    merge: gap.style,
+    root: "gap",
+    base: gap-default-style
+  )
+  let size = normalize-units(style.size)
+  set-y(ctx.y - size)
 })
 
-#let _gap(size: 20) = {
+#let _gap(..style) = {
   return ((
     type: "gap",
     draw: gap-render,
-    size: size
+    style: style.named()
   ),)
 }
 
-#let _evt(participant, event) = {
+#let _evt(participant, event, ..style) = {
   return ((
     type: "evt",
     draw: evt-render,
     participant: participant,
     event: event,
-    lifeline-style: auto
+    style: style.named()
   ),)
 }
 

src/note.typ

@@ -18,10 +18,9 @@
   side,
   content,
   pos: none,
-  color: COL-NOTE,
-  shape: "default",
   aligned: false,
-  allow-overlap: true
+  allow-overlap: true,
+  ..style
 ) = {
   if side == "over" {
     if pos == none {
@@ -33,19 +32,15 @@
       panic("Aligned notes can only be over a participant (got side '" + side + "')")
     }
   }
-  if color == auto {
-    color = COL-NOTE
-  }
   return ((
     type: "note",
     draw: note.render,
     side: side,
     content: content,
     pos: pos,
-    color: color,
-    shape: shape,
     aligned: aligned,
     aligned-with: none,
-    allow-overlap: allow-overlap
+    allow-overlap: allow-overlap,
+    style: style.named()
   ),)
 }

src/participant.typ

@@ -17,35 +17,16 @@
 #let _par(
   name,
   display-name: auto,
-  from-start: true,
   invisible: false,
-  shape: "participant",
-  color: DEFAULT-COLOR,
-  line-stroke: (
-    dash: "dashed",
-    paint: gray.darken(40%),
-    thickness: .5pt
-  ),
-  custom-image: none,
-  show-bottom: true,
-  show-top: true,
+  ..style
 ) = {
-  if color == auto {
-    color = DEFAULT-COLOR
-  }
   return ((
     type: "par",
     draw: participant.render,
     name: name,
     display-name: if display-name == auto {name} else {display-name},
-    from-start: from-start,
     invisible: invisible,
-    shape: shape,
-    color: color,
-    line-stroke: line-stroke,
-    custom-image: custom-image,
-    show-bottom: show-bottom,
-    show-top: show-top
+    style: style.named()
   ),)
 }
 

tests/note/color/test.typ

@@ -5,9 +5,9 @@
   _par("a", display-name: "Alice")
   _par("b", display-name: "Bob")
 
-  _note("left", [This is displayed\ left of Alice.], pos: "a", color: rgb("#00FFFF"))
+  _note("left", [This is displayed\ left of Alice.], pos: "a", fill: rgb("#00FFFF"))
   _note("right", [This is displayed right of Alice.], pos: "a")
   _note("over", [This is displayed over Alice.], pos: "a")
-  _note("over", [This is displayed\ over Bob and Alice.], pos: ("a", "b"), color: rgb("#FFAAAA"))
+  _note("over", [This is displayed\ over Bob and Alice.], pos: ("a", "b"), fill: rgb("#FFAAAA"))
   _note("over", [This is yet another\ example of\ a long note.], pos: ("a", "b"))
 })

tests/participant/shapes/test.typ

@@ -15,7 +15,7 @@
   _par("Foo5", display-name: "Database", shape: "database")
   _par("Foo6", display-name: "Collections", shape: "collections")
   _par("Foo7", display-name: "Queue", shape: "queue")
-  _par("Foo8", display-name: "Typst", shape: "custom", custom-image: TYPST)
-  _par("Foo9", display-name: "Ferris", shape: "custom", custom-image: FERRIS)
-  _par("Foo10", display-name: "Baryhobal", shape: "custom", custom-image: ME)
+  _par("Foo8", display-name: "Typst", shape: "custom", image: TYPST)
+  _par("Foo9", display-name: "Ferris", shape: "custom", image: FERRIS)
+  _par("Foo10", display-name: "Baryhobal", shape: "custom", image: ME)
 })