Skip to content

Releases: genexuslabs/design-systems

[2025-11-12] Design Systems

12 Nov 20:45

Choose a tag to compare

Pre-release

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
image image

@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-build and @genexus/mercury-cli packages. Additionally, the @genexus/vite-plugin-mercury package has been added to facilitate configuration in Vite-based environments by @ncamera in #646.

  • This change refines both the CLI and build processes, and improves asset generation and build logic. Projects upgrading from v0.36.0 or beta.1 should review compatibility with the updated packages and asset paths.

  • To run the mercury update binary, now you must install @genexus/mercury-cli@1.0.0-beta.2

@genexus/mercury-build v1.0.0-beta.2

  • Now requires @genexus/mercury v1.0.0-beta.2

@genexus/mercury-cli v1.0.0-beta.2

  • Now requires @genexus/mercury v1.0.0-beta.2

@genexus/vite-plugin-mercury v1.0.0-beta.2

  • Now requires @genexus/mercury v1.0.0-beta.2

Full Changelog: v1.0.0-beta.1...v1.0.0-beta.2

[2025-11-10] Design Systems

10 Nov 21:37

Choose a tag to compare

Mercury v0.36.0

  • The Mercury implementation is divided into the @genexus/mercury-build and @genexus/mercury-cli packages. Additionally, the @genexus/vite-plugin-mercury package 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-cli package (which uses the @genexus/mercury-build under the hood).

  • The @genexus/mercury package now only contains the core implementation for Mercury (CSS, fonts, icons, and some JavaScript).

  • Now, when running the mercury command of the CLI, the icons and fonts are generated under the node_modules/.genexus/mercury/assets/ folder. In other words, the mercury command 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-mercury package 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.css bundle in now automatically inlined in the index.html, so you don't need to load it.

    • The base/icons.css bundle 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-cli package to use the Mercury CLI.

  • The CLI's outDir flag has been removed. Now, the generated CSS bundles will always be located in the node_modules/.genexus/mercury/assets/css folder (this node_modules is always generated in the same directory where the mercury binary 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.ts file is now located in the ./node_modules/.genexus/mercury/bundle-to-hash-mappings.ts path.

Full Changelog: v0.0.228...v0.0.230

[2025-11-06] Design Systems

06 Nov 15:49

Choose a tag to compare

Mercury v0.35.1

  • [ch-chat] Move the header of chat messages to the contentBefore section 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-panel icon by @bsastregx in #671

    category name colorType representation
    objects master-panel none

Full Changelog: v0.0.227...v0.0.228

[2025-10-30] Design Systems

30 Oct 20:07

Choose a tag to compare

Pre-release

Mercury v1.0.0-beta.1

Tabular Grid

  • The vertical padding of tabular-grid cells has been reduced from 8px to 7px. This adjustment is needed because the cell font is body-regular-m, and all body typographic styles have increased their line-height from 1.2 to 1.4. The line-height change caused single-line cells to become taller than intended. Reducing the cell padding softens the height difference, resulting in a minor change from 30.4px to approximately 31px.

Tree

  • The tree-view item line-height was reduced from 1.4 to 1.2. The previous excessive height was caused by body typographic styles increasing their line-height from 1.2 to 1.4. This change improves readability and keeps items compact.This adjustment reduced the total height of a tree-view item from 26px to 20px.

Typography

Class Font Size Line Height Change Before (1.3) After (1.2)
.subtitle-regular-m 16px 1.31.2 20.8px (16 × 1.3) 19.2px (16 × 1.2)
.subtitle-semi-bold-m 16px 1.31.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

24 Oct 14:45

Choose a tag to compare

Showcase

  • Add support to navigate between different versions in the showcase by @ncamera in #663

  • Add warning message for Beta versions by @ncamera in #664

  • 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

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

23 Oct 15:29

Choose a tag to compare

Pre-release

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

image image image

[2025-10-23] Design Systems

23 Oct 14:18

Choose a tag to compare

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

  • Improve the UI/UX of the "icons" page by @ncamera in #660

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)

10 Oct 14:35

Choose a tag to compare

Mercury 0.33.0

  • Added 16 new system icons, and rename 2 system icons by @bsastregx in #656
category name colorType representation
system block *
system disturb *
system dock-to-left *
system dock-to-right *
system draft-doc *
system draft *
system favorite-fill *
system favorite *
system filters *
system flag *
system grid *
system mop *
system pin-fill *
system pin *
system status *
system unchecked *
system unpublished *

(*) 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)

29 Sep 16:39

Choose a tag to compare

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
    before after

Full Changelog: v0.0.223...v0.0.224

v0.0.223

15 Sep 18:33

Choose a tag to compare

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 renderItem property. 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 MercuryMessageMetadata type for the ChatMessage metadata is now exported in @genexus/mercury:

    type MercuryChatMessageMetadata = {
      agentName: string;
      time?: string;
    }
  • Improved code block styles

    Before After
    code-block-before code-block-after
  • Support for uploading files (audio, video, image, and application/file)
    chat -files

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