ValyroUI Русская версия

Roadmap

What is done, in progress and planned in ValyroUI: components, themes, accessibility, frameworks and tools.

In progress

Planned

Done

  • OKLCH themes and the full Tailwind v4 mapping (2026-10-19) — Every colour of the 19 themes is written in oklch() and decodes to the same 8-bit sRGB. valyro-ui/tailwind.css turns every colour, radius, shadow, font and motion token into a utility.
  • One BEM rule for class names (2026-10-19) — The rule is written down and checked by a test. Modifiers outside the base components became data attributes; the old classes stay as aliases, with the same specificity.
  • Polish of the base components (2026-10-19) — Buttons, navigation, layout, forms, overlays and notifications: form.reset() restores uncontrolled fields, required is announced on the control, touch targets from 40px on touch screens, a few missing props.
  • Performance pilot: CSS animations (2026-10-19) — Global spring tokens, data-ui-enter entrances and scroll progress on scroll-driven animations. ReadingProgress, ParallaxLayers, HalftoneImageReveal and the rolling NumberTicker no longer run JS on every frame.
  • Accessibility pilot: the React Aria level (2026-10-19) — A live announcer and locale-aware typeahead in valyro-ui/headless. TreeView gets multi-letter typeahead and disabled nodes; DataTable announces sorting and selects a range with Shift+click.
  • Architecture pilot: compound parts and headless hooks (2026-10-19) — useAccordion, useTreeView and useDataTable with prop getters; Accordion, TreeView and DataTable are built on them. TreeView takes nested TreeView.Item parts.
  • CSS animations, stage 2 (2026-10-19) — ProgressBar, Calendar, Tabs, Toaster, WheelPicker, CoverflowCarousel, MapChart, ScrollScene, ShapeMorph and folding trees now animate in CSS. WheelPicker went from 80 frame callbacks per spin to none.
  • Accessibility, stage 2: the audit’s top 10 (2026-10-19) — A native range input inside Slider, keyboard and screen reader moves for drag and drop, the page hidden behind modals, result counts read out, new DateField and TimeField, week start and clock from the locale, manual and vertical Tabs.
  • Headless hooks for forms, menus, tabs and dialogs (2026-10-19) — useListbox, useSelect, useCombobox, useTabs, useMenu, useDialog, useRadioGroup, useField, usePagination, useTooltip and useResizablePanels; the kit’s components render with them and take compound parts.
  • BEM and tokens in the base components’ CSS (2026-10-19) — The same BEM rule and spacing tokens instead of hard values in buttons, navigation, layout, forms, overlays and notifications.
  • Quality pass: themes, modes, devices and frameworks (2026-10-19) — Every theme in light and dark mode meets WCAG AA contrast under a test, the site has no sideways scroll from 320 to 1920px, and the kit installs and builds in all 20 setups of the guide.
  • Animations in CSS, without a JS runtime (2026-10-19) — Spirals, wheels, stacked panels, text on a path, the horizon grid and the showcase ring, ripples, toggles, the theme sweep and the tab height now run on CSS and SVG animation. JS is left only where it follows a gesture, draws a canvas or types text.
  • Accessibility at the level of React Aria Components (2026-10-19) — New Listbox with Shift and Ctrl+A range selection and CheckboxGroup, a native mode and required for Select, hidden range inputs in ColorPicker and every custom slider, Tab out of menus as in the WAI-ARIA patterns.
  • Compound parts and headless hooks for every component (2026-10-19) — CheckboxTree, Stepper, Calendar, Slider, Sortable, Carousel, Popover and NumberInput run on hooks from valyro-ui/headless too, with Stepper.Step, Carousel.Slide, CheckboxTree.Item and Calendar header and grid parts.