Text

Text in der Schriftskala: eine Skala, überall gleich verwendet.

micro: Route each request to the model you choosecaption: Route each request to the model you choosesmall: Route each request to the model you choosebody: Route each request to the model you choosebody-lg: Route each request to the model you choosetitle-sm: Route each request to the model you choosetitle: Route each request to the model you choosetitle-lg: Route each request to the model you choosedisplay: Route each request to the model you choose$1,284.20

<div className="flex flex-col gap-8">
      {(Object.keys(KAESO_TEXT_VARIANTS.variant) as TextVariant[]).map((v) => (
        <Text key={v} variant={v}>
          {v === "metric" ? "$1,284.20" : `${v}: Route each request to the model you choose`}
        </Text>
      ))}
    </div>

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

Props

as
ElementType
Das Element oder die Komponente, als die gerendert wird, etwa section oder ul.
children
ReactNode
Der Text.
mono
boolean
Geist Mono, für Schlüssel, IDs, Modell-IDs und Code.
tabular
boolean
Tabellarische Ziffern. Für metric standardmäßig an.
tone
"success" | "warning" | "danger" | "info" | "inherit" | "secondary" | "default" | "tertiary" = default
Die Farbrolle des Texts; Statustöne stehen neben Wörtern, die dasselbe sagen.
truncate
boolean
Eine Zeile mit Auslassungspunkten; der volle Text erscheint im Tooltip, wenn er abgeschnitten ist.
variant
"title" | "display" | "title-sm" | "title-lg" | "body" | "caption" | "small" | "micro" | "body-lg" | "metric" = body
Der Schriftstil, von micro bis display.
weight
"medium" | "regular" | "semibold"
Die Schriftstärke, wenn sie von der des Schriftstils abweicht.