@spunto/design-system 0.31.0 → 0.31.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/components/tasks/event-stream.tsx +13 -5
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spunto/design-system",
3
- "version": "0.31.0",
3
+ "version": "0.31.1",
4
4
  "description": "Spunto's shared design system — warm/flame tokens, color constants, and UI primitives.",
5
5
  "type": "module",
6
6
  "license": "MIT",
package/src/components/tasks/event-stream.tsx CHANGED
@@ -68,7 +68,13 @@ type Item =
68
68
  /** A chain of machinery, folded — see `tool-stack.tsx`. */
69
69
  | { kind: "run"; run: ToolRun }
70
70
 
71
- /** A marker on the rail. `tone` is what carries meaning at a glance, so it stays a small set. */
71
+ /**
72
+ * A marker on the rail. `tone` is what carries meaning at a glance, so it stays a small set.
73
+ *
74
+ * The rail runs *behind* every marker, so the disc must stay opaque: the tone's tint is a
75
+ * background-image laid over `bg-background`, never a translucent background-color (a `bg-x/10`
76
+ * would replace the opaque fill and let the line show through the icon).
77
+ */
72
78
  function Marker({
73
79
  icon,
74
80
  tone = "muted",
@@ -80,10 +86,12 @@ function Marker({
80
86
  <span
81
87
  className={cn(
82
88
  "absolute left-0 top-0.5 flex h-6 w-6 -translate-x-1/2 items-center justify-center rounded-full border bg-background",
83
- tone === "primary" && "border-primary/40 bg-primary/10 text-primary",
84
- tone === "success" && "border-green-500/40 bg-green-500/10 text-green-600 dark:text-green-500",
85
- tone === "danger" && "border-destructive/40 bg-destructive/10 text-destructive",
86
- tone === "pending" && "border-amber-500/40 bg-amber-500/10 text-amber-600 dark:text-amber-500",
89
+ tone === "primary" && "border-primary/40 bg-linear-to-b from-primary/10 to-primary/10 text-primary",
90
+ tone === "success" &&
91
+ "border-green-500/40 bg-linear-to-b from-green-500/10 to-green-500/10 text-green-600 dark:text-green-500",
92
+ tone === "danger" && "border-destructive/40 bg-linear-to-b from-destructive/10 to-destructive/10 text-destructive",
93
+ tone === "pending" &&
94
+ "border-amber-500/40 bg-linear-to-b from-amber-500/10 to-amber-500/10 text-amber-600 dark:text-amber-500",
87
95
  tone === "muted" && "text-muted-foreground",
88
96
  )}
89
97
  >