Sparkline

Eine Reihe im Text: 80×24, der letzte Wert als Punkt.

gpt-534

<div className="flex items-center gap-12 text-body text-fg">
      <span className="mono text-small">gpt-5</span>
      <Sparkline aria-label="Requests over 7 days, rising" values={[12, 18, 15, 22, 28, 26, 34]} />
      <span className="tabular">34</span>
    </div>

import { Sparkline } from "@logicplanes/kaeso-ui";

Props

aria-label
string
Der zugängliche Name des Diagramms („Anfragen nach Modell“).
color
string = var(--k-viz-1)
Die Farbe der Linie (standardmäßig var(--k-viz-1)). seriesColor(id) übergeben, damit sie zur Serie an anderer Stelle passt.
fluid
boolean
Füllt die Breite des Containers bei 32px Höhe, ohne den Punkt am letzten Wert, wie in einer Kennzahlenkachel. Sonst ist sie 80×24.
values
number[]
Die Werte in Reihenfolge, die ältesten zuerst.