Component names: canonical tags are <velin-tooltip> and <velin-stepper>; source files components/velin-tooltip.js and components/velin-stepper.js. <velin-tooltip-wc> and <velin-stepper-wc> remain as deprecated aliases (console warning once).
Spacing:.velin-mb-* is margin-bottom only; use .velin-my-* for block-axis spacing.
Visual: default text/primary tokens are darker for AAA — use data-velin-contrast="aa" on <html> if you need the previous lighter palette without retuning tokens.
Migration
Replace <velin-tooltip-wc> → <velin-tooltip> and <velin-stepper-wc> → <velin-stepper> in HTML; legacy tags still work in 0.9.0.
Imports: VelinTooltip / VelinStepper from @birdapi/velinstyle (or component paths); VelinTooltipWC / VelinStepperWC re-exported as deprecated.
🐛
Fixed
Security:velin-secure-field no longer emits plaintext or AES keys; hardened sanitizeURL / sanitizeSearchUrl; DOMPurify SVG sanitization in velin-icon; search result URLs validated.
Audit follow-up:velin-scroll-top declarative attribute; src/base/wc-placeholder.css CLS guards for all loader tags; velin-persist in component-contracts.json; Playwright cross-browser smoke (npm run test:e2e); shared docs theme picker assets (docs/assets/theme-picker.*).
Velin-Meta:velinstyle meta builds dist/velin-agent.json and dist/llms.txt for AI assistants; MIME application/vnd.velinstyle.meta+json; page-level <script id="velin-meta">; velinstyle meta page <file> --write; docs generate --scope meta; export @birdapi/velinstyle/meta.
WCAG 2.2 AAA defaults: OKLCH color tokens (:root, dark, 13 themes) validated at 7:1 via npm run test:contrast; data-velin-contrast="aa" opt-down to AA palette.
A11y runtime:@birdapi/velinstyle/a11y with initA11y() (live announcer, scroll padding); core/a11y/component-contracts.json; docs/generated/a11y/wcag22-aaa-matrix.md; npm run test:a11y:coverage.
Component a11y:a11y-utils.js, fixes for velin-icon, velin-search, velin-theme-toggle, velin-popover (aria-labelledby), dialogs, toasts, and more; scanner rules velin-icon-label, sparkline-label, skeleton-text.
VelinHighlight:core/highlight/ (velinSyntax, highlightElement, highlightAll, initHighlight, registerLanguage, lazyLoadLanguage); lexers for JS/TS, HTML, CSS, JSON, Markdown, Shell, SQL, PHP, Blade; highlight.css with OKLCH/P3 token colors and reduced-motion fade.
<velin-code-block> Web Component (copy, line numbers, line highlight, collapsible); velin-code attribute bridge with lazy in-view highlighting.
VelinSearch:core/search/ API (velinSearch, createSearch, registerSearchProvider), fuzzy offline search, highlight, category filters; optional Web Worker (core/search/worker.js).
<velin-search> Web Component with autocomplete, keyboard navigation, grouped results.
Search benchmark:tests/search-benchmark.test.js — fuzzy query over 10k entries (main thread under 400ms, worker under 500ms in CI); npm run test:search:bench.
Auto-generated reference:velinstyle docs generate / npm run docs:generate writes Markdown to docs/generated/ (components, tokens, utilities, CLI, scanner rules, a11y modules). CI verifies committed snapshots.
Tokens JSON:zIndex block in schema/build/validate; deterministic key order in tokens build; examples/tokens.full.json.
Changed
Documentation and samples: landmark structure (<header role="banner">), AAA migration section, updated docs/a11y.html and token pages.
test:a11y enables color-contrast-enhanced; JSDOM canvas stub for axe in CI.
Package and CLI version 0.9.0; CI runs tokens:validate, test:security, test:perf, ci:checks (bundle budget, search-index drift, loader drift).
Package:. export → runtime-entry.js; full bundle at @birdapi/velinstyle/bundle; TypeScript dist/velinstyle.d.ts. Subpaths: /search, /motion, /attributes, /highlight, /sanitize. Distribution via velinstyle.info.
velin-reveal.js delegates to core/motion; attribute bridge uses <velin-tooltip> / lazy loaders from renamed component files.
Motion tokens: five new easings (spring, elastic, expo-out, back-out, snappy) and two new durations (slowest 800ms, cinematic 1200ms) in tokens/motion.css.
Filter-effect utilities: new utilities/filter-effects.css with velin-saturate-*, velin-hue-rotate-*, velin-contrast-*, velin-invert, velin-sepia, velin-drop-shadow-*, extended velin-backdrop-*, and velin-glass / velin-glass-strong composites.
Chart-animation utilities: new utilities/chart-animation.css with velin-stroke-draw, velin-sparkline-glow, velin-value-bump, velin-live-pulse, velin-count-fade keyframes and matching velin-chart-line / velin-chart-area / velin-chart-glow / velin-spark-tick / velin-live-pulse classes — all reduced-motion safe.
Three new Web Components:<velin-sparkline> (animated draw-in + live update() API), <velin-counter> (rAF + Intl.NumberFormat count-up with currency/percent/locale), <velin-live-dot> (slotted realtime indicator).
Two motion helpers:velin-reveal.js (initReveal() plus [data-velin-reveal-auto] auto-init) and velin-flip.js (flipReorder(), filterList() plus [data-velin-flip] + [data-velin-filter-value] / [data-velin-filter-input] auto-wiring).
Demo upgrades: crypto dashboard uses sparkline tick + counters + live-dot; forum and shop chips/searches drive real FLIP-animated list filtering; grid/list view toggle on the shop animates layout changes via FLIP.
CLI velinstyle scaffold: prompt-based HTML from blueprint composition (cli/scaffold.js, scaffold-recipes.json); list-intents, -o, --json.
CLI velinstyle layout:audit, suggest, and fix for flex/grid/responsive issues (cli/layout-audit.js).
Docs: new pages docs/utilities/motion.html, docs/utilities/filter-effects.html, docs/utilities/chart-animation.html, docs/components/sparkline.html, docs/components/counter.html, docs/components/live-dot.html; docs/guides/prompt-scaffolding.html, docs/guides/responsive-layout.html; layout and getting-started sections for 0.8.0 CLI.
Changed
src/velinstyle.css imports the new filter-effects + chart-animation utilities.
components/index.js exports the three new WCs and two helpers.
index.html drops the inline scroll-reveal IIFE in favour of the shared velin-reveal helper via data-velin-reveal-auto.
CLI help version 0.8.0; package version 0.8.0.
🚀
Added
velinstyle prefix JSON maps: optional velinstyle-prefix-map.json next to the migrated tree (or --map <file>) supplies explicit token → velin-class replacements; merged after auto map, overrides catalog and --bootstrap-display. Keys _* / $* ignored. Sample: examples/velinstyle-prefix-map.sample.json. Documented in README, README.de, docs/migration.html, docs/guides/existing-project.html.
Vitest / jsdom: tests/setup.js mocks window.matchMedia for velin-theme-toggle tests; velin-popover test now sets trigger="hover" so role="tooltip" is asserted correctly.
Drawer CSS: Fixed side="end" drawer showing content and not closing due to inset-inline-start: 0 leaking to all sides. Each side now explicitly resets opposing inset values.
FOUC Protection: Added :not(:defined) rule in reset.css hiding VelinStyle custom elements until they are registered, preventing flash of unstyled content.
CLI require() bug: Replaced CJS require('fs').unlinkSync with ESM unlinkSync import in cli/index.js.
CLI version: Updated help text to v0.6.1.
CLI a11y layer: security.css now included in the a11y layer file list.
Multi-Provider Icon System: <velin-icon> now supports a provider attribute for CDN-based icons from Lucide, Heroicons, Bootstrap Icons, Material Symbols, Font Awesome, and Tabler Icons.
VelinIcon.registerProvider(): Static method to register custom icon providers at runtime.
cli/icon-providers.js: Provider registry with CDN URL mappings, variant support, license info, and homepage links for 6 providers.
Design Tokens: OKLCH color palette, spacing scale (4px base), typography scale (1.25x Major Third), border-radius, shadows, motion, z-index, and aspect-ratio tokens
Dark Mode: Automatic via prefers-color-scheme and explicit via data-velin-theme="dark" attribute
Modern CSS Reset: box-sizing: border-box, scroll behavior, motion reduction, min font-size for mobile inputs
Accessibility Layer: .velin-sr-only, .velin-skip-link, :focus-visible outlines, prefers-reduced-motion support, forced-colors (Windows High Contrast) support, skeleton loading with CLS protection
Layout System: Responsive container with Container Queries, CSS Grid with auto-fit/auto-fill, Flexbox utilities, stack and cluster patterns
BEM Components: Button (6 variants + 4 sizes), Card, Form inputs, Navigation, Alert, Badge, Table, Tooltip, Modal (CSS)
Utility Classes: Flex, spacing, text alignment, display, visibility, color utilities
Web Components: <velin-modal>, <velin-tabs>, <velin-accordion>, <velin-dropdown>, <velin-toast>, <velin-icon> with full keyboard and screen reader support
Focus Manager: Shared module with trapFocus(), rovingTabindex(), saveFocus(), restoreFocus()
Icon System: 51 essential SVG icons with sprite builder and <velin-icon> component