List Caption

The VListsCaption component renders a list of captions with optional links. If a caption has a url, it will be displayed as a clickable link; otherwise, it will be shown as plain text.

Props

Name	Type	Required	Description
`items`	`IListsCaption[]` (Array)	true	Array of caption objects containing text and optional URLs.

IListsCaption Interface

interface IListsCaption {
  url?: string;
  text: string;
}

Example

vue

<script setup lang="ts">
import VListsCaption from 'UiKit/components/VList/VListsCaption.vue';

const captions = [
  { text: 'Vue.js Documentation', url: 'https://vuejs.org' },
  { text: 'Vite Guide', url: 'https://vitejs.dev' },
  { text: 'Local Caption' }, // No URL, displayed as plain text
];
</script>

<template>
  <VListsCaption :items="captions" />
</template>

Vue.js Documentation
Vite Guide
Local Caption