Releases: genexuslabs/design-systems
[2025-11-12] Design Systems
Mercury v1.0.0-beta.2
-
Light mode tokens for Mercury and Globant have been refined, resulting in a more consistent and polished color scheme.
-
When using the Globant theme, now the primary color of the icons matches the primary color of the "Globant" theme.
| Mercury theme | Globant theme |
|---|---|
![]() |
![]() |
@genexus/vite-plugin-mercury v1.0.0-beta.2
- Added support to override the token values (the same feature as in the CLI).
⚠️ Breaking Changes
Mercury
-
Tokens names modified
Before After --color-accent-item-active--color-accent-item-pressed--color-border-item-active--color-border-item-pressed--color-accent-surface-elevation-01--color-accent-surface-elevation-1--color-accent-surface-elevation-02--color-accent-surface-elevation-2--color-accent-surface-elevation-03--color-accent-surface-elevation-3--color-border-surface-on-elevation-01--color-border-surface-on-elevation-1--color-border-surface-on-elevation-02--color-border-surface-on-elevation-2--color-border-surface-on-elevation-03--color-border-surface-on-elevation-3 -
The Mercury implementation has been divided into the
@genexus/mercury-buildand@genexus/mercury-clipackages. Additionally, the@genexus/vite-plugin-mercurypackage has been added to facilitate configuration in Vite-based environments by @ncamera in #646. -
This change refines both the
CLIand build processes, and improves asset generation and build logic. Projects upgrading fromv0.36.0orbeta.1should review compatibility with the updated packages and asset paths.- Follow this link to read the v0.36.0 release notes.
-
To run the
mercury updatebinary, now you must install@genexus/mercury-cli@1.0.0-beta.2
@genexus/mercury-build v1.0.0-beta.2
- Now requires
@genexus/mercuryv1.0.0-beta.2
@genexus/mercury-cli v1.0.0-beta.2
- Now requires
@genexus/mercuryv1.0.0-beta.2
@genexus/vite-plugin-mercury v1.0.0-beta.2
- Now requires
@genexus/mercuryv1.0.0-beta.2
Full Changelog: v1.0.0-beta.1...v1.0.0-beta.2
[2025-11-10] Design Systems
Mercury v0.36.0
- The Mercury implementation is divided into the
@genexus/mercury-buildand@genexus/mercury-clipackages. Additionally, the@genexus/vite-plugin-mercurypackage has been added to facilitate configuration in Vite-based environments by @ncamera in #646
Important changes
-
The CLI implementation for mercury has been moved to the
@genexus/mercury-clipackage (which uses the@genexus/mercury-buildunder the hood). -
The
@genexus/mercurypackage now only contains the core implementation for Mercury (CSS, fonts, icons, and some JavaScript). -
Now, when running the
mercurycommand of the CLI, the icons and fonts are generated under thenode_modules/.genexus/mercury/assets/folder. In other words, themercurycommand generated the following content:node_modules/.genexus/mercury/assets/css--> contains the CSS bundles to use in the dev server and dist build.node_modules/.genexus/mercury/assets/fonts--> contains the fonts to use in the dev server and dist build.node_modules/.genexus/mercury/assets/icons--> contains the icons to use in the dev server and dist build.
Tip
This change helps monorepo user experience fewer conflicts when multiple packages use different versions of Mercury, because now the Mercury assets will always be in the same folder (node_modules/.genexus/mercury/assets) and will be relative to the package that executes the mercury binary, regardless of the Mercury versions used in the monorepo.
-
Added the
@genexus/vite-plugin-mercurypackage to facilitate configuration in Vite-based environments. This package contains a Vite plugin which:-
Removes the need to copy the Mercury assets for the dev server and dist build. You can safely delete all copy tasks for the Mercury assets.
// vite.config.ts import { defineConfig } from "vite"; import { mercury } from "@genexus/vite-plugin-mercury"; // https://vite.dev/config/ export default defineConfig({ plugins: [ - viteStaticCopy({ - targets: [ - { - src: "{{ CSS outDir path }}", - dest: "{{ CSS bundles final path }}" - }, - { - src: "<path to node_modules>/@genexus/mercury/dist/assets/fonts", - dest: "{{ Fonts final path }}" - }, - { - src: "<path to node_modules>/@genexus/mercury/dist/assets/icons", - dest: "{{ Icons final path }}" - } - ] - }) + mercury({ + // (Optional) + assetsPaths: { + // Path where the CSS files of Mercury are located in the distribution build. + cssPath: "{{ CSS bundles final path }}", // Defaults to "/assets/css/" + + // Path where the font files of Mercury are located in the distribution build. + fontsPath: "{{ Fonts final path }}", // Defaults to "/assets/fonts/" + + // Path where the icon files of Mercury are located in the distribution build. + iconsPath: "{{ Icons final path }}" // Defaults to "/assets/icons/" + }, + + // More options... + }) ] }); -
The
base/base.cssbundle in now automatically inlined in the index.html, so you don't need to load it. -
The
base/icons.cssbundle in now preloaded in the index.html, so you don't need to load it. -
The bundle hashes are now automatically applied in the index.html, so you can safely remove the following:
- import { setBundleMapping } from "@genexus/mercury/bundles.js"; - import { bundleToHashMappings } from "./assets/mercury-css/bundle-to-hash-mappings"; - // Establishes the mapping between bundle names and their generated hashes. - // For example, it maps the `components/button` bundle name to `button-e261832acea09e81.css` - setBundleMapping(bundleToHashMappings);
-
-
The installation guide for Angular, NextJS, React, and StencilJS has been simplified.
⚠️ Breaking changes
-
Now, the CLI is no longer included when installing
@genexus/mercury. You must install the@genexus/mercury-clipackage to use the Mercury CLI. -
The CLI's
outDirflag has been removed. Now, the generated CSS bundles will always be located in thenode_modules/.genexus/mercury/assets/cssfolder (thisnode_modulesis always generated in the same directory where themercurybinary is executed). -
Changed the following default paths when using the Mercury CLI:
Before After Fonts "./assets/fonts/""/assets/fonts/"Icons "./assets/icons/""/assets/icons/" -
Removed the alternative way ("Using already generated CSS bundles") of using the CSS from the docs, as this unwanted feature limited the possibilities of the build process and the CLI.
-
The
bundle-to-hash-mappings.tsfile is now located in the./node_modules/.genexus/mercury/bundle-to-hash-mappings.tspath.
Full Changelog: v0.0.228...v0.0.230
[2025-11-06] Design Systems
Mercury v0.35.1
-
[ch-chat]Move the header of chat messages to thecontentBeforesection by @ncamera in #669
This allows the users to more easily add custom content in between the header and the message content. -
[readme][angular]Update Angular installation guide. Use{{ CSS bundles final path }}instead of fixed dummy paths by @bsastregx in #670 -
Recover back
objects/master-panelicon by @bsastregx in #671category name colorType representation objectsmaster-panelnone
Full Changelog: v0.0.227...v0.0.228
[2025-10-30] Design Systems
Mercury v1.0.0-beta.1
Tabular Grid
- The vertical padding of tabular-grid cells has been reduced from
8pxto7px. This adjustment is needed because the cell font isbody-regular-m, and all body typographic styles have increased their line-height from1.2to1.4. Theline-heightchange caused single-line cells to become taller than intended. Reducing the cell padding softens the height difference, resulting in a minor change from30.4pxto approximately31px.
Tree
- The tree-view item
line-heightwas reduced from1.4to1.2. The previous excessive height was caused by body typographic styles increasing their line-height from1.2to1.4. This change improves readability and keeps items compact.This adjustment reduced the total height of a tree-view item from26pxto20px.
Typography
| Class | Font Size | Line Height Change | Before (1.3) | After (1.2) |
|---|---|---|---|---|
.subtitle-regular-m |
16px | 1.3 → 1.2 |
20.8px (16 × 1.3) | 19.2px (16 × 1.2) |
.subtitle-semi-bold-m |
16px | 1.3 → 1.2 |
20.8px (16 × 1.3) | 19.2px (16 × 1.2) |
Tokens Added
--color-icon-error-hover--color-icon-error-pressed--color-icon-success-hover--color-icon-success-pressed--color-icon-warning-hover--color-icon-warning-pressed--color-text-error-hover--color-text-error-pressed--color-text-success-hover--color-text-success-pressed--color-text-warning-hover--color-text-warning-pressed
⚠️ Breaking Changes
Tokens Added
| before | after |
|---|---|
--color-icon-neutral-dark |
--color-icon-neutral-black |
--color-icon-status-error |
--color-icon-error-default |
--color-icon-status-success |
--color-icon-success-default |
--color-icon-status-warning |
--color-icon-warning-default |
--color-text-neutral-dark |
--color-text-neutral-black |
--color-text-status-error |
--color-text-error-default |
--color-text-status-success |
--color-text-success-default |
--color-text-status-warning |
--color-text-warning-default |
--color-text-semantic-success |
--color-text-success-default |
--color-text-semantic-error |
--color-text-error-default |
Tokens: Removed
| removed | suggested |
|---|---|
--color-accent-neutral-light |
--color-accent-neutral-neutral |
--color-border-neutral-light |
--color-border-neutral-neutral |
--color-icon-neutral-light |
--color-icon-neutral-neutral |
--color-icon-status-info |
--color-icon-primary-on-default |
--color-icon-status-neutral |
--color-icon-neutral-neutral |
--color-text-neutral-light |
--color-text-neutral-neutral |
--color-text-status-info |
--color-text-primary-on-default |
--color-text-status-neutral |
--color-text-neutral-neutral |
[2025-10-24] Design Systems
Showcase
-
Add support to navigate between different versions in the showcase by @ncamera in #663
-
Keep the directory location when navigating between versions by @ncamera in #665
-
Properly render the URLs in the version selector by @ncamera in #666
Mercury 0.35.0
[icons/system]Add two new icons by @bsastregx in #667
| category | name | colorType | representation |
|---|---|---|---|
system |
play-circle |
* |
|
system |
idea |
* |
(*) use the colorType of your choice
Full Changelog: v0.0.226...v0.0.227
[2025-10-23] Design Systems
Mercury v1.0.0-beta.0
-
Added support for light mode by @bsastregx in #565
-
Improvements in color contrasts, mainly in the focus state of elements by @bsastregx in #565
-
Now, all semantic tokens have been redefined and are now fully public by @bsastregx in #565
-
Added support for customizing all Mercury tokens at build time, using a configuration file (
mercury.config.ts) that the CLI can read by @ncamera in #565

[2025-10-23] Design Systems
Showcase
-
Add supported to deploy versions in virtual directories by @ncamera in #658
-
Improve the build of specific versions for the showcase by @ncamera in #659
Mercury 0.34.0
- Added support for globally defining the CSS hash mappings to avoid issues with duplicated Mercury versions by @ncamera in #661
Full Changelog: v0.0.225...v0.0.226
Design Systems (2025-10-10)
Mercury 0.33.0
- Added 16 new system icons, and rename 2 system icons by @bsastregx in #656
(*) use the colorType of your choice
Breaking changes
- Added 16 new system icons, and rename 2 system icons by @bsastregx in #656
| category | name before | name after | representation |
|---|---|---|---|
system |
expand |
expand-content |
|
system |
filters |
filter |
Full Changelog: v0.0.224...v0.0.225
Design Systems (2025-09-29)
Mercury 0.32.0
- Removed the padding-inline in the button-tertiary class by @bsastregx in #651
Breaking changes
-
Removed the padding-inline in the button-tertiary class by @bsastregx in #651
Before After 

Full Changelog: v0.0.223...v0.0.224
v0.0.223
Mercury 0.31.0
-
[chat]Added official styles for the Chat component, improved markdown-viewer styles and added assistant-fill icon by @bsastregx in #594 -
[combo-box][pill]Fixed the popover max size not working in some situations for the combo-box and pill components by @ncamera in #637
Chat
-
Add a custom item render for the
renderItemproperty. Some features that the mercury custom item render includes are:- Styles for differentiating error, warning, and success status messsages.
- A "header" for the assistant message, that displays an avatar, the assistant name, and the message time.
- A "copy" button for copying the message.
- A classical "three dots" animation for the "waiting" message type.
-
A
MercuryMessageMetadatatype for theChatMessagemetadata is now exported in@genexus/mercury:type MercuryChatMessageMetadata = { agentName: string; time?: string; }
-
Improved code block styles
Before After 

-
Support for uploading files (audio, video, image, and application/file)

Markdown viewer
- Styles for the markdown viewer has been improved to match the Figma designs.
Breaking Changes
Mercury
Important
Use @genexus/chameleon-controls-library version >= 6.22.1
- The size of the markdown-viewer headings has been reduced.
Full Changelog: v0.0.220...v0.0.222

