Block · C-043 · storefront

NoticeList

A compact announcement list with dates, optional links, tags and a closing link to view everything. It ships an explicit empty state.

Install

Blocks compose Koten primitives; install koten-theme first.

npx shadcn@latest add https://koten.codehive.com.co/r/notice-list.json

Anatomy

This block composes Koten primitives. Read the source files before changing it.

@/components/patterns/notice-list.tsx
@/lib/koten/cn.ts
@/lib/koten/format.ts
@/lib/koten/intl.ts
@/lib/koten/labels.ts
@/lib/koten/provider.tsx

Accessibility

The list is a <ul> with aria-label; dates use <time dateTime> so the ISO value survives.
Linked titles are real links and stay distinguishable from plain text without relying on colour.
The empty state is communicated in text, not just by the absence of rows.

Read the whole page