nuxt-x-affiliate
Tag Chips
Clickable tag chips at the end of an article — wrap or horizontal-scroll layout.
Tag Chips
The XAFTagChips component renders clickable tag chips at the end of an article or in a sidebar — each tag renders as a #label chip. If a tag has an href, it renders as a link (<a rel="tag">); otherwise as a plain <span>.
Components
<XAFTagChips />
<XAFTagChips
title="Tags"
layout="wrap"
:tags="[
{ label: 'mechanical', href: '/tag/mechanical' },
{ label: 'wireless', href: '/tag/wireless' },
{ label: 'tkl', href: '/tag/tkl' },
{ label: 'hot-swap', href: '/tag/hot-swap' },
'low-profile',
]"
/>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
tags | (string | Tag)[] | required | Plain strings or { label, href? } objects. |
layout | 'wrap' | 'scroll' | 'wrap' | Flex-wrap or horizontal scroll. |
title | string | "Tags" | Section heading. |
layout="scroll" is useful inside a narrow sidebar where wrapping would create awkward multi-line stacks.
AI Context
component: XAFTagChips
package: "@xenterprises/nuxt-x-affiliate"
use-when: Clickable tag chips at end of article or sidebar in wrap or horizontal-scroll layout.