Widgets

Vue component showcase

A dedicated space for reusable front end experiments and production-ready interface patterns.

Customer data table

Sortable columns, quick search, and paginated sample data.
{{ customer.firstName }} {{ customer.lastName }} {{ customer.phone }} {{ customer.email }} {{ customer.details }}
No customers match your search.

{{ resultsSummary }}

KPI overview

Sample front end metrics with a simple Vue-driven trend chart.

{{ metric.label }}

{{ metric.value }}

{{ metric.change >= 0 ? '+' : '' }}{{ metric.change }}% vs last month

{{ point.label }} {{ label.value }}

Monthly recurring revenue over the last six months.

Current month: {{ currentRevenue }}

Top month {{ topRevenueMonth.label }} · {{ topRevenueMonth.display }}
Average MRR {{ averageRevenue }}
Net growth {{ revenueGrowthSummary }}

Leaderboard

Sample rankings for a competitive widget or top-performer dashboard.

{{ entry.rank }}
{{ entry.name }} {{ entry.team }}
{{ entry.score.toLocaleString() }} pts {{ entry.change >= 0 ? '+' : '' }}{{ entry.change }}% this week
Ranked data Delta tracking Spotlight cards

HTML5 video player

Standard browser video controls with a sample source. Swap in a licensed stream URL when you have one.

HTML5 Player Sample MP4 Source Ready for Licensed Live Feed
Note: This slot is set up for a legal video source. If you have an authorized FIFA World Cup stream URL or embed source, it can replace the sample video directly in this card.

News RSS

Five sample headlines sourced from the BBC News public RSS feed.

{{ headline.title }}

{{ headline.description }}

Source: BBC News RSS · https://feeds.bbci.co.uk/news/rss.xml