Skip to main content
Our new developer certification is live!

CardTaxonomies

Renders taxonomy tags for list cards (DefaultCard, IconCard). Kickstart cards use TechnologyTags with icons; other content types use styled button spans.

Props

PropTypeRequiredDefaultDescription
termsstring[]Yes-Taxonomy term UIDs (technology for kickstart, mixed for others)
isKickstartbooleanNofalseUse TechnologyTags with icons instead of plain spans
tagVariantButtonVariantNo'SecondaryFillButton'Button variant for non-kickstart tags

Usage

import CardTaxonomies from '@/components/molecules/CardTaxonomies';

<CardTaxonomies
  terms={card.taxonomies}
  isKickstart={card.contentType === 'kickstart'}
  tagVariant="SecondaryFillButton"
/>

Features

  • Kickstart: TechnologyTags with SVG icons, limited to 3 terms
  • Other types: Styled spans with formatTaxonomyTermLabel (underscores → spaces)
  • Truncation: Shows "..." when more than 3 terms

Notes

  • Used by DefaultCard and IconCard
  • Non-interactive (cards are wrapped in Link; nested links invalid)
  • Terms displayed via formatTaxonomyTermLabel for readability