Skip to content

Release of v0.1.24#96

Merged
alessandrobellesia merged 36 commits into
mainfrom
develop
Jun 15, 2026
Merged

Release of v0.1.24#96
alessandrobellesia merged 36 commits into
mainfrom
develop

Conversation

@alessandrobellesia

Copy link
Copy Markdown
Member

Added

  • CSS Relative Color Syntax support: New color generation system using native CSS hsl(from color h s calc(...)). Brand/accent colors use proportional scaling (l * 1.1), while surface/word colors use fixed steps (l + 12). This significantly reduces the number of CSS variables, improving Chrome DevTools inspector performance.
  • CSS @layer support: Optional cascade layers for better CSS specificity management.
  • Components without CSS custom properties: Option to generate components with hardcoded values instead of CSS variables for maximum performance.
  • New configuration options:
    • $use-color-mix: true - Enable/disable Relative Color Syntax mode (default: true)
    • $use-css-layers: false - Enable/disable CSS @layer cascade management (default: false)
    • $layer-order - Define layer priority order
    • $layer-prefix - Prefix for layer names (default: volver)
    • $use-custom-props-for-components: true - Enable/disable CSS variables in components (default: true)
  • New color functions: relative-color-value(), color-mix-shades-map(), color-mix-darken-map(), color-mix-lighten-map(), color-mix-alpha-map()
  • contrast filter props (--contrast-*) and utility classes (.contrast-*).
  • design-tokens.json is now regenerated on build and shipped with the package.

Changed

  • Migrated if() function calls to new Sass CSS-compatible syntax (if(sass($condition): $value; else: $fallback))
  • Color shades now use single --color-{name} variable with Relative Color Syntax instead of separate -hue, -saturation, -lightness variables
  • Updated box-shadow, glass effects, and component modifiers to use modern CSS color functions
  • .transition-* utilities now use the --duration-* / --ease-* custom properties so they react to theming.

Fixed

  • Reduced CSS output size and number of CSS custom properties for better browser DevTools performance
  • Invalid flex-wrap: no-wrap value in vv-breadcrumb and vv-dialog.
  • :export color tokens not being emitted due to a wrong type check.
  • Aligned focus and disabled states between vv-avatar, vv-radio and vv-tab.

depfu Bot and others added 30 commits October 24, 2025 07:11
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Implement CSS @layer cascade and color-mix features
Add $zero-specificity parameter to theme mixins with :where() wrapping
Rename $props to $use-custom-props across all mixins for consistency
Update spread-map-into-attrs mixin to use $use-custom-props parameter
Update all mixin calls in components and theme files
Remove obsolete $props parameter from spread-map-into-bem mixin
…-themes

feat: add zero-specificity support and standardize mixin parameters
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
fix: Update vite and fix some wornings
Update dependencies to vite@8
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
Fixes a set of issues found during a library audit and adds a couple of
small improvements, prepping the 0.1.25 release.

- fix invalid `flex-wrap: no-wrap` in vv-breadcrumb and vv-dialog
- fix `:export` color tokens not emitted due to a wrong type check
- make `.transition-*` utilities use `--duration-*` / `--ease-*` so they react to theming
- align focus/disabled states across vv-avatar, vv-radio and vv-tab
- add `contrast` filter props and utilities
- regenerate and ship `design-tokens.json` on build
- validate compiled CSS in CI (stylelint on dist)
- drop the dead `pnpm` field from package.json and unpin vue-router

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
- import `compile` from `sass-embedded` (the declared dependency) instead
  of `sass`, which is not installed on a clean CI install
- skip `var()`/`calc()` channel substitution when the legacy `colors-values`
  lookup table is absent (CSS Relative Color Syntax mode), keeping the
  compiled value as-is instead of crashing
- regenerate design-tokens.json

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Alessandro Bellesia and others added 6 commits June 15, 2026 10:32
Add blur, backdrop-blur, brightness, contrast and saturation utility
classes to the Effects & Transitions section, which were missing.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
A previous sed-style substitution while fixing the $contrast map also
flipped the $brightness 200 key to contrast(2). Restore brightness(2)
so .brightness-200 applies a brightness filter as intended.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The final v0.1.24 was never tagged (only betas), so the audit fixes and
additions go into 0.1.24 instead of a new 0.1.25. Update the date to the
actual release date.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
build.yml is reused by the PR check suite, where there is no release
event, so `github.event.release.tag_name` is empty and `pnpm version`
fails with ERR_PNPM_INVALID_VERSION_BUMP. Guard the bump, pack and
artifact-upload steps with `github.event_name == 'release'`.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
- set an explicit `node-version: 24` (matching the publish jobs); the
  previous `${{ matrix.node-version }}` referenced a non-existent matrix
  and resolved to an empty value
- run "Setup GitHub Pages" and "Upload styleguide" only on release events,
  so PR checks still build the styleguide but skip the pages artifact
  (which only the release deploy job consumes)

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…-consistency

fix: correct invalid CSS values, color export and component consistency
@coderabbitai

coderabbitai Bot commented Jun 15, 2026

Copy link
Copy Markdown

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 1dd0853c-08f3-4504-b85c-3e66402a7611

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch develop

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@sonarqubecloud

Copy link
Copy Markdown

@alessandrobellesia alessandrobellesia merged commit a62545b into main Jun 15, 2026
16 of 17 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant