Skip to content

Latest commit

 

History

History
88 lines (57 loc) · 3.17 KB

File metadata and controls

88 lines (57 loc) · 3.17 KB

Roadmap

Current state of the library and what's next.

Status

All originally planned phases (0–10+) are closed. The library currently ships 70+ components: ~60 atomic, 7 patterns, 4 layouts, 4 chart primitives, plus 10 composables and an i18n provider.

Done

Phase 0 — Foundation

  • Vite library mode + TypeScript
  • ESLint flat config + Prettier
  • Storybook 8 + addons (essentials, a11y, themes)
  • Vitest + jsdom + @vue/test-utils
  • Changesets + GitHub Actions release pipeline
  • Storybook deploy to GitHub Pages
  • Design tokens: colors, typography, spacing, radius, shadow, motion, z-index
  • Semantic tokens + themes (:root[data-theme='light' | 'dark'])
  • Reset and global.css
  • useTheme() — toggle theme + subscribe to prefers-color-scheme
  • Icons — lucide-vue-next + UidIcon + @dskripchenko/ui/icons sub-export

Phase 1–6 — Core components

  • Forms: Button, Input, Textarea, Checkbox, Radio, Switch, Label, FormField
  • Feedback: Spinner, Skeleton, Badge, Alert, Progress, Toast
  • Overlays: Modal, Drawer, Tooltip, Popover, Menu
  • Navigation: Tabs, Breadcrumb, Link, Pagination (+ Cursor/LoadMore/InfiniteScroll/PageSize)
  • Data: Card, Avatar, Tag, Divider, Accordion, Table
  • Layout helpers: Stack, Grid, Container

Phase 7 — Patterns

  • Header, Footer, Sidebar (+ Item, Group, Divider)
  • PageHeader, EmptyState, ErrorState, Result

Phase 8 — Wizards

  • Stepper, Wizard, WizardStep + useWizard()

Phase 9 — Layouts

  • SimpleLayout, SidebarLayout, AuthLayout, WizardLayout + useSidebar()

Phase 10+ — Advanced

  • Select, DatePicker, Slider, ColorPicker, Command, VirtualList

Expansion (after Phase 10)

Round 1 — forms & data (v0.2.0): NumberInput, TimePicker, DateRangePicker, TagsInput, Combobox, TreeView, Timeline, FileUpload, Code

Round 2 — medium priority (v0.3.0): Rating, Splitter, Stat, DescriptionList, Result (pattern)

Round 3 — low priority (v0.4.0): BackTop, Affix, Anchor, Watermark, Tour, Mention, TreeSelect

Round 4 — niche (v0.5.0): Calendar, Carousel, Cascader, Transfer, NotificationBadge

Quality & DX

  • Bundle visualizer (pnpm build:analyze)
  • A11y audit (roving tabindex, keyboard nav, ARIA)
  • i18n — UidLocaleProvider + useLocale + ru/en built-in locales
  • Charts — Sparkline, ProgressRing, Gauge, Heatmap (SVG, no runtime deps)
  • Multi-language documentation (en/ru/de/zh)

What's next

In order of decreasing usefulness:

Possible components (on demand)

  • Dual range slider with two thumbs
  • TimePicker with seconds support and 24-hour AM/PM hybrid
  • Tree-grid (table whose rows expand into trees)

Quality & DX

  • Visual regression tests (Chromatic / Percy)
  • Bundle-size budget enforced in CI

Principles

  1. Build for what's needed now. Don't build for hypotheticals.
  2. Every new component ships with .vue + .css + .spec.ts + .stories.ts + index.ts, exported from src/index.ts.
  3. If a component is harder than it looks (Calendar, Cascader), consider a headless library as a peer-dep instead of a custom build.