The @krizaka/ui badge with the 1.x variant kept as a deprecated alias of tone.

WebStableAffichage de données

Web — React, depuis @krizaka/orazaka-design-system. L'app mobile Orazaka prend les tokens du kit, pas ses composants. Stable : son API ne change qu’à une version majeure.

Pourquoi il existe au-dessus de Krizaka UI

Orazaka 1.x badges took variant (default, success…); the platform says tone. This adapter maps one onto the other so the apps keep working while they migrate.

Repose surBadge

Quand l’utiliser

In code already importing Badge from @krizaka/orazaka-design-system: a model's state, a job's status.

Quand ne pas l’utiliser

In new code: import Badge from @krizaka/ui/badge and write tone.À la place : Badge

Installation

Installer

npm install @krizaka/orazaka-design-system && npm install -D tailwindcss

Styles

@import "tailwindcss";
@import "@krizaka/orazaka-design-system/theme.css";

The package ships its TypeScript sources: add it to transpilePackages (with @krizaka/orazaka-shared and @krizaka/ui).

Importer

import { Badge } from "@krizaka/orazaka-design-system";

Exemples

A model's state

Local, loading, failed — the tones of the primitive.

Local · readyLoadingFailed

Props

The

Prop	Type	Défaut	Description
`variant`	`BadgeVariant`	—	@deprecated Since 2.0 — use `tone` (`default` → `neutral`, the other names are the same).

Accessibilité

The primitive's: a <span> read with its content; the colour is never the only signal.

Bonnes pratiques

Write tone, not variant (deprecated since 2.0; default → neutral).
One or two words: Local, Running, Failed.

Généré depuis le code de @krizaka/orazaka-design-system 2.5.0 : son meta.ts, ses exemples et ses types.Modifier cette documentation sur GitHub

Badge