Data

CSTimeline

Отображает последовательность событий и выделяет выбранный этап.

Предпросмотр

Интерактивный компонент

10 июня

Планирование

12 июня

Сборка

15 июня

Релиз

Использование

Vue · публичный API CS UI Kit

<script setup lang="ts">
import { ref } from 'vue'

const active = ref('build')
const items = [
  { value: 'plan', title: 'Планирование', date: '10 июня', icon: 'i-lucide-clipboard-list' },
  { value: 'build', title: 'Сборка', date: '12 июня', icon: 'i-lucide-hammer' },
  { value: 'release', title: 'Релиз', date: '15 июня', icon: 'i-lucide-rocket' },
]
</script>

<template>
  <CSTimeline v-model="active" :items="items" orientation="vertical" />
</template>

Пример использует компонент библиотеки. Подключите Nuxt-модуль `@cassoft-support/cs-platform-ui-kit/nuxt` или импортируйте компонент из публичного package entry.