'use client'
// Reusable design-language chips. Geltung (Pflicht/Empfehlung/Kann) and Severity
// follow the handoff specs exactly (bg/text/border + marker glyph). Klartext label
// leads; internal IDs are never shown by the chip itself. See ./tokens.
import {
GELTUNG, PFLICHT_MARKER, SEVERITY, DOMAIN,
normalizeGeltung, normalizeSeverity, Geltung, Severity, Domain,
} from './tokens'
function GeltungMarker({ g }: { g: Geltung }) {
const m = GELTUNG[g].marker
if (m === 'square') {
return
}
// diamond ◇ (Empfehlung) / circle ○ (Kann) — open glyphs in the chip text color
return {m === 'diamond' ? '◇' : '○'}
}
export function GeltungChip({ value, className = '' }: { value: Geltung | string; className?: string }) {
const g = normalizeGeltung(value)
const t = GELTUNG[g]
return (
{t.label}
)
}
export function SeverityChip({ value, className = '' }: { value: Severity | string; className?: string }) {
const s = normalizeSeverity(value)
const t = SEVERITY[s]
return (
{t.label}
)
}
// Small domain tag (Safety / Cyber / Schnittstelle) — tinted, not neon.
export function DomainTag({ value, label, className = '' }: { value: Domain; label?: string; className?: string }) {
const d = DOMAIN[value]
return (
{label || d.label}
)
}
// Monospace internal ID — IDs are ALWAYS secondary/nachgestellt, never a heading.
export function MonoId({ children, className = '' }: { children: React.ReactNode; className?: string }) {
return {children}
}