Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions apps/web/src/charts/funnel-chart.ts
Original file line number Diff line number Diff line change
Expand Up @@ -202,10 +202,10 @@ export const view = Submodel.defineView<Model, Message, FunnelChartInputs>((mode

const stageBar = (h: H, stage: Stage, fade: number): Html =>
h.div(
[h.Class("relative h-2.5 w-full overflow-hidden rounded-[3px] bg-foreground/5")],
[h.Class("relative h-2.5 w-full overflow-hidden rounded-xs bg-foreground/5")],
[
h.div([
h.Class("absolute inset-y-0 left-0 rounded-[3px]"),
h.Class("absolute inset-y-0 left-0 rounded-xs"),
h.Style({
width: `${stage.widthPct * 100}%`,
"background-color": stage.color,
Expand Down
4 changes: 2 additions & 2 deletions apps/web/src/charts/funnel-dropoff-chart.ts
Original file line number Diff line number Diff line change
Expand Up @@ -177,13 +177,13 @@ const groupBars = (h: H, ctx: ColumnContext, step: Step, index: number): Html =>
...(index > 0 && capH > 0
? [
h.div([
h.Class(cn("absolute inset-x-0 rounded-[3px]", LOST_CLASS)),
h.Class(cn("absolute inset-x-0 rounded-xs", LOST_CLASS)),
h.Style({ bottom: `${height * 100}%`, height: `${capH * 100}%` }),
]),
]
: []),
h.div([
h.Class("absolute inset-x-0 bottom-0 rounded-[3px]"),
h.Class("absolute inset-x-0 bottom-0 rounded-xs"),
h.Style({ height: `${height * 100}%`, "background-color": group.color }),
]),
],
Expand Down
4 changes: 2 additions & 2 deletions apps/web/src/charts/hbar-chart.ts
Original file line number Diff line number Diff line change
Expand Up @@ -111,12 +111,12 @@ export const view = Submodel.defineView<Model, Message, HbarChartInputs>((model,
}),
h.div(
[
h.Class("relative w-full overflow-hidden rounded-[3px] bg-foreground/5"),
h.Class("relative w-full overflow-hidden rounded-xs bg-foreground/5"),
h.Style({ height: `${barH}px` }),
],
[
h.div([
h.Class("absolute inset-y-0 left-0 rounded-[3px]"),
h.Class("absolute inset-y-0 left-0 rounded-xs"),
h.Style({
width: `${bar.widthPct * 100}%`,
"background-color": bar.color,
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/charts/heatmap-chart.ts
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ const emptyState = (h: H, inputs: HeatmapChartInputs): Html => {
[
h.div(
[
h.Class("grid grid-cols-8 gap-[2px] rounded-sm p-[3px]"),
h.Class("grid grid-cols-8 gap-0.5 rounded-sm p-[3px]"),
h.Style({ background: grout(inputs.theme) }),
],
Array.from({ length: 32 }, (_, i) =>
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/charts/linked-cursor.ts
Original file line number Diff line number Diff line change
Expand Up @@ -146,7 +146,7 @@ export const linkedCursorOverlay = <M>(h: HtmlBuilder<M>, chartId: string): Html
],
[
h.div([
h.Class("absolute inset-y-0 left-0 w-px bg-muted-foreground/45 will-change-transform"),
h.Class("absolute inset-y-0 left-0 w-px bg-foreground-faint will-change-transform"),
h.Style({ transform: "translateX(calc(var(--linked-cursor-ratio) * (100cqw - 1px)))" }),
]),
],
Expand Down
4 changes: 2 additions & 2 deletions apps/web/src/components/infra/severity-tokens.ts
Original file line number Diff line number Diff line change
Expand Up @@ -45,8 +45,8 @@ export const BAR_VALUE_TONE: Record<SeverityLevel, string> = {
/** Status dot fill. */
export const STATUS_DOT: Record<HostStatus, string> = {
active: TONE_FILL.ok,
idle: "bg-muted-foreground/60",
ended: "bg-muted-foreground/40",
idle: "bg-foreground-subtle",
ended: "bg-foreground-faint",
} satisfies Record<HostStatus, string>

/** Status dot ring. */
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/lab/kit/overlays/view.ts
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ const itemLink = (h: H, name: OverlayItem, isActive: boolean): Html =>
"rounded-md border px-2 py-1 font-mono text-xs transition-colors",
isActive
? "active border-foreground/20 bg-accent font-medium text-foreground"
: "border-border text-muted-foreground hover:bg-accent/50 hover:text-foreground",
: "border-border text-muted-foreground hover:bg-surface-sunken hover:text-foreground",
),
),
...(isActive ? [h.DataAttribute("status", "active")] : []),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -207,7 +207,7 @@ const messageBlock = (h: H, model: Model, message: SpanMessage, span: AiSessionS
),
]
: []),
h.span([h.AriaHidden(true), h.Class("h-px min-w-4 flex-1 bg-border/60")], []),
h.span([h.AriaHidden(true), h.Class("h-px min-w-4 flex-1 bg-border-subtle")], []),
...(hasText ? [viewSwitch(h, { rendered, isRaw, rawKey: `${key}:raw` })] : []),
],
),
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/agent-sessions/session/span-visuals.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import type { IconName } from "../../../ui/icon"
// Span visuals, as icon names: one token
// per kind of work, read by the time breakdown, the waterfall and the flow.

const NO_WORK_FILL = "bg-muted-foreground/40"
const NO_WORK_FILL = "bg-foreground-faint"

export const CATEGORY_FILL = {
agent: "bg-chart-ai-agent",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -136,7 +136,7 @@ const parallelRule = (h: H, label: string, range: string): Html =>
icon(h, "BranchForkIcon", { size: 12, className: "shrink-0" }),
truncatedText(h, { text: label, className: "font-medium text-xs" }),
h.span([h.Class(cn(META, "shrink-0"))], [range]),
h.span([h.AriaHidden(true), h.Class("h-px min-w-6 grow bg-border/60")], []),
h.span([h.AriaHidden(true), h.Class("h-px min-w-6 grow bg-border-subtle")], []),
],
)

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ const summariseTurn = (chapter: Extract<TranscriptRow, { kind: "turn" }>): strin
...(chapter.toolNames.length > 0 ? [chapter.toolNames.join(", ")] : []),
].join(" · ")

const rule = (h: H): Html => h.span([h.AriaHidden(true), h.Class("h-px grow bg-border/60")], [])
const rule = (h: H): Html => h.span([h.AriaHidden(true), h.Class("h-px grow bg-border-subtle")], [])

export const turnChapter = (
h: H,
Expand Down
4 changes: 2 additions & 2 deletions apps/web/src/page/agent-sessions/session/view-checks.ts
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,7 @@ const evidenceRow = (h: H, model: Model, finding: SessionFinding, status: Sessio
[
h.AriaHasPopup("dialog"),
h.Class(
"group flex w-full items-baseline gap-2 rounded-sm px-1.5 py-0.5 text-left font-mono text-xs hover:bg-accent/50",
"group flex w-full items-baseline gap-2 rounded-sm px-1.5 py-0.5 text-left font-mono text-xs hover:bg-surface-sunken",
),
h.Type("button"),
h.OnClick(openSpan(model, finding.spanId)),
Expand Down Expand Up @@ -268,7 +268,7 @@ const disclosure = (
h.button(
[
h.AriaExpanded(isExpanded),
h.Class(cn(ROW_GRID, "w-full py-2.5 text-left hover:bg-accent/50")),
h.Class(cn(ROW_GRID, "w-full py-2.5 text-left hover:bg-surface-sunken")),
h.Type("button"),
h.OnClick(Message.ToggledChecks({ which: options.which, isOpen: !isExpanded })),
],
Expand Down
6 changes: 3 additions & 3 deletions apps/web/src/page/agent-sessions/session/view-waterfall.ts
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ const axisGrid = (h: H, ticks: ReadonlyArray<AxisTick>): ReadonlyArray<Html> =>
[
h.Key(String(tick.fraction)),
h.AriaHidden(true),
h.Class("absolute inset-y-0 w-px bg-border/40"),
h.Class("absolute inset-y-0 w-px bg-border-subtle"),
h.Style({ left: `${tick.fraction * 100}%` }),
],
[],
Expand Down Expand Up @@ -177,7 +177,7 @@ const turnHeader = (
return h.div(
[
h.Class(
"flex h-full w-full items-center rounded-md bg-card px-2.5 text-left text-xs hover:bg-accent/50",
"flex h-full w-full items-center rounded-md bg-card px-2.5 text-left text-xs hover:bg-surface-sunken",
),
],
[
Expand Down Expand Up @@ -326,7 +326,7 @@ const spanRow = (
h.AriaHasPopup("dialog"),
h.Class(
cn(
"flex h-full w-full cursor-pointer items-center px-2.5 text-left text-xs hover:bg-accent/50",
"flex h-full w-full cursor-pointer items-center px-2.5 text-left text-xs hover:bg-surface-sunken",
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",
isErrored && "bg-severity-error/6",
state.isFocused && "bg-accent/60",
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/agent-sessions/tool/view-charts.ts
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,7 @@ const cell = (
h.Class(
cn(
"flex min-w-0 flex-col",
"gap-3.5 border-b border-border px-6 pt-[22px] pb-5 @min-[900px]/page:[&:nth-child(odd)]:border-r",
"gap-3.5 border-b border-border px-6 py-5 @min-[900px]/page:[&:nth-child(odd)]:border-r",
),
),
],
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ const payloadLineView = (h: H, line: PayloadLine): Html =>
? h.span(
[
h.Class(
"my-0.5 inline-flex items-center gap-2 rounded-[3px] border border-dashed border-severity-error/60 px-1.5 text-2xs leading-4 text-severity-error",
"my-0.5 inline-flex items-center gap-2 rounded-xs border border-dashed border-severity-error/60 px-1.5 text-2xs leading-4 text-severity-error",
),
],
['"', line.missingKey, '"', h.span([h.Class("opacity-80")], ["missing, required"])],
Expand All @@ -85,7 +85,7 @@ const payloadLineView = (h: H, line: PayloadLine): Html =>
? []
: [
h.span(
[h.Class("ml-2 rounded-[3px] bg-muted px-1 text-2xs text-muted-foreground")],
[h.Class("ml-2 rounded-xs bg-muted px-1 text-2xs text-muted-foreground")],
[line.folded],
),
]),
Expand All @@ -101,7 +101,7 @@ const payloadLineView = (h: H, line: PayloadLine): Html =>
h.span(
[
h.Class(
"rounded-[3px] bg-muted px-1 text-2xs text-muted-foreground",
"rounded-xs bg-muted px-1 text-2xs text-muted-foreground",
),
],
["+", formatToolCount(line.note.hiddenBytes), " B not shown"],
Expand Down Expand Up @@ -253,7 +253,7 @@ export const sampleBody = (h: H, model: Model, row: ToolErrorOccurrenceRow): Htm
h.div(
[
h.Class(
"flex items-baseline gap-3 rounded-md border border-severity-error/20 bg-severity-error/[0.07] px-3 py-[9px] font-mono",
"flex items-baseline gap-3 rounded-md border border-severity-error/20 bg-severity-error/[0.07] px-3 py-2 font-mono",
),
],
[
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,7 @@ const variantsSection = (

const whereItHappens = (h: H, rows: ReadonlyArray<BreakdownRow>, isLoading: boolean): Html =>
h.section(
[h.Class("flex flex-col gap-3.5 border-b border-border px-4 pt-4 pb-[18px]")],
[h.Class("flex flex-col gap-3.5 border-b border-border p-4")],
[
h.span([h.Class(RAIL_TITLE)], ["Where it happens"]),
...(isLoading && rows.length === 0
Expand Down Expand Up @@ -276,7 +276,7 @@ const sessionsSection = (h: H, model: Model, inputs: ModalInputs, detail: ErrorD
[],
),
h.span(
[h.Class("flex w-0 min-w-0 grow flex-col items-start gap-[3px]")],
[h.Class("flex w-0 min-w-0 grow flex-col items-start gap-1")],
[
sessionLink(h, {
tool: inputs.tool,
Expand Down Expand Up @@ -319,7 +319,7 @@ const sessionsSection = (h: H, model: Model, inputs: ModalInputs, detail: ErrorD
)
})),
h.div(
[h.Class("flex h-9 shrink-0 items-center gap-[9px] px-4 font-mono text-xs")],
[h.Class("flex h-9 shrink-0 items-center gap-2 px-4 font-mono text-xs")],
[
h.span(
[h.Class("text-muted-foreground")],
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ const SAMPLES_PAGE = 25
const footer = (h: H, model: Model, shown: number, total: number): Html => {
const paging = pagingOf(model)
return h.div(
[h.Class("flex h-9 items-center gap-[9px] px-6 font-mono text-xs")],
[h.Class("flex h-9 items-center gap-2 px-6 font-mono text-xs")],
[
h.span(
[h.Class("text-muted-foreground")],
Expand Down Expand Up @@ -217,7 +217,7 @@ const sampleRow = (
}),
h.span([h.Class("shrink-0 text-xs text-foreground")], [time]),
h.span(
[h.Class("flex min-w-0 shrink items-center gap-[5px] text-xs")],
[h.Class("flex min-w-0 shrink items-center gap-1.5 text-xs")],
[
h.span([h.Class("shrink-0 text-foreground-subtle")], ["session"]),
sessionLink(h, {
Expand Down Expand Up @@ -250,7 +250,7 @@ const sampleRow = (
h.span(
[
h.Class(
"hidden shrink-0 rounded-sm border border-border px-[5px] text-2xs leading-3.5 text-foreground-subtle md:block",
"hidden shrink-0 rounded-sm border border-border px-1.5 text-2xs leading-3.5 text-foreground-subtle md:block",
),
],
["variant ", h.span([h.Class("text-foreground-soft")], [options.variant])],
Expand Down Expand Up @@ -285,7 +285,7 @@ const sampleRow = (
)}`,
),
h.Class(
"relative flex shrink-0 items-center gap-[5px] text-2xs text-muted-foreground transition-colors hover:text-foreground",
"relative flex shrink-0 items-center gap-1.5 text-2xs text-muted-foreground transition-colors hover:text-foreground",
),
],
[
Expand Down
4 changes: 2 additions & 2 deletions apps/web/src/page/agent-sessions/tool/view-error-modal.ts
Original file line number Diff line number Diff line change
Expand Up @@ -135,7 +135,7 @@ const headerLead = (h: H, inputs: ModalInputs): Html => {
h.span(
[
h.Class(
"ml-1 rounded-sm border border-border px-[5px] text-2xs text-foreground-subtle",
"ml-1 rounded-sm border border-border px-1.5 text-2xs text-foreground-subtle",
),
],
["error.type ", group.errorType],
Expand Down Expand Up @@ -236,7 +236,7 @@ const content = (h: H, model: Model, inputs: ModalInputs): Html => {
h.header(
[
h.Class(
"flex shrink-0 items-start gap-8 border-b border-border px-6 pt-5 pb-[18px] max-lg:flex-col max-lg:gap-4",
"flex shrink-0 items-start gap-8 border-b border-border px-6 py-5 max-lg:flex-col max-lg:gap-4",
),
],
[
Expand Down
4 changes: 2 additions & 2 deletions apps/web/src/page/agent-sessions/tool/view-errors.ts
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ const errorRow = (
[
h.Class(
cn(
"flex h-4.5 shrink-0 items-center rounded-sm border border-border px-[5px] text-2xs leading-3.5",
"flex h-4.5 shrink-0 items-center rounded-sm border border-border px-1.5 text-2xs leading-3.5",
TONE_TEXT.crit,
),
),
Expand Down Expand Up @@ -433,7 +433,7 @@ export const errorsTable = (h: H, inputs: ErrorsTableInputs): Html => {
? h.div(
[
h.Class(
"flex flex-col gap-2 border-t border-border px-2.5 pt-[22px] pb-5 font-mono",
"flex flex-col gap-2 border-t border-border px-2.5 py-5 font-mono",
),
],
[
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/agent-sessions/tools-kit/error-parts.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ export const maskChip = <M>(h: HtmlBuilder<M>, label: string, raw: string, class
inlineCodeClassName(
"chip",
cn(
"mx-px inline-block rounded-[3px] px-[3px] py-0 align-baseline text-2xs leading-3.75 font-normal text-muted-foreground",
"mx-px inline-block rounded-xs px-1 py-0 align-baseline text-2xs leading-3.75 font-normal text-muted-foreground",
className,
),
),
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/agent-sessions/tools-kit/metric-strip.ts
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ export const selectableTile = <M>(h: HtmlBuilder<M>, options: TileOptions<M>): H
})

const sublineText = <M>(h: HtmlBuilder<M>, children: ReadonlyArray<Html | string>): Html =>
h.span([h.Class("inline-flex items-center gap-[5px] font-mono tabular-nums")], children)
h.span([h.Class("inline-flex items-center gap-1.5 font-mono tabular-nums")], children)

/** `ToolDeltaValue`: the change in the metric's own unit, graded by `toolDelta`. */
const deltaValue = <M>(h: HtmlBuilder<M>, change: ToolDelta): Html =>
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/agent-sessions/tools-kit/scope-row.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ const chipButton = <M>(h: HtmlBuilder<M>, chip: ScopeChip, onRemove: M): Html =>
h.Key(`${chip.kind}:${chip.value}`),
h.AriaLabel(`Remove ${chip.kind} ${chip.value}`),
h.Class(
"inline-flex h-[22px] max-w-64 items-center gap-[5px] rounded-sm border border-primary/35 bg-primary/10 px-2 transition-colors hover:bg-primary/20",
"inline-flex h-[22px] max-w-64 items-center gap-1.5 rounded-sm border border-primary/35 bg-primary/10 px-2 transition-colors hover:bg-primary/20",
),
h.DataAttribute("base-ui-tooltip-trigger", ""),
h.DataAttribute("slot", "tooltip-trigger"),
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/agent-sessions/tools-kit/series-chart.ts
Original file line number Diff line number Diff line change
Expand Up @@ -154,7 +154,7 @@ export const seriesChart = <M>(
h.Class(
cn(
"flex min-w-0 flex-col",
"gap-4 border-b border-border px-6 pt-[22px] pb-5",
"gap-4 border-b border-border px-6 py-5",
refreshingClass(inputs.isWaiting),
),
),
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/agent-sessions/tools-kit/table.ts
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,7 @@ export const toolRowClass = (isSelected: boolean): string =>

export const toolTableFooter = <M>(h: HtmlBuilder<M>, subject: string, detail: string): Html =>
h.div(
[h.Class("flex h-9 items-center gap-[9px] px-2.5 font-mono text-xs")],
[h.Class("flex h-9 items-center gap-2 px-2.5 font-mono text-xs")],
[
h.span([h.Class("text-muted-foreground")], [subject]),
h.span([h.Class("text-foreground-subtle")], [detail]),
Expand Down
4 changes: 2 additions & 2 deletions apps/web/src/page/agent-sessions/tools/view-table.ts
Original file line number Diff line number Diff line change
Expand Up @@ -112,13 +112,13 @@ const cells = (h: H, row: Prepared, inputs: ToolsTableInputs, maxErrorRate: numb
const color = inputs.colorFor(row.key)
return [
h.span(
[h.Class("flex w-0 min-w-0 flex-1 items-center gap-[9px]")],
[h.Class("flex w-0 min-w-0 flex-1 items-center gap-2")],
[
h.span(
[
h.AriaHidden(true),
h.Class(
cn("size-2 shrink-0 rounded-xs", color === undefined && "bg-muted-foreground/50"),
cn("size-2 shrink-0 rounded-xs", color === undefined && "bg-foreground-subtle"),
),
...(color === undefined ? [] : [h.Style({ "background-color": color })]),
],
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/alerts/editor/view-condition.ts
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@ const severityPicker = (h: H, value: AlertSeverity): Html => {
children: [
statusDot(h, {
tone: "custom",
className: isSelected ? option.dot : "bg-muted-foreground/40",
className: isSelected ? option.dot : "bg-foreground-faint",
}),
option.label,
],
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/alerts/editor/view-hero.ts
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@ const header = (h: H, model: HeaderView, form: RuleForm, timeZone: string): Html
? []
: [
h.span(
[h.Class("hidden max-w-[360px] truncate text-muted-foreground text-xs md:inline")],
[h.Class("hidden max-w-90 truncate text-muted-foreground text-xs md:inline")],
["per ", summary],
),
]),
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/page/alerts/editor/view-impact.ts
Original file line number Diff line number Diff line change
Expand Up @@ -222,7 +222,7 @@ const fireRail = (
h.Class(
cn(
"absolute inset-y-0 min-w-0.5 rounded-[1px]",
tone === "crit" ? "bg-severity-error" : "bg-muted-foreground/60",
tone === "crit" ? "bg-severity-error" : "bg-foreground-subtle",
),
),
h.Style({ left: `${mark.left * 100}%`, width: `${mark.width * 100}%` }),
Expand Down
Loading
Loading