@genexus/mercury 0.9.6 → 0.9.9

package/dist/mercury.scss

@@ -786,13 +786,17 @@
 }
 
 @mixin spacing-body(
-  $body-selector: ".spacing-body",
-  $body-block-selector: ".spacing-body-block",
-  $body-block-start-selector: ".spacing-body-block-start",
-  $body-block-end-selector: ".spacing-body-block-end",
-  $body-inline-selector: ".spacing-body-inline",
-  $body-inline-start-selector: ".spacing-body-inline-start",
-  $body-inline-end-selector: ".spacing-body-inline-end"
+  $body-selector: ".spacing-body,:host(.spacing-body)",
+  $body-block-selector: ".spacing-body-block,:host(.spacing-body-block)",
+  $body-block-start-selector:
+    ".spacing-body-block-start,:host(.spacing-body-block-start)",
+  $body-block-end-selector:
+    ".spacing-body-block-end,:host(.spacing-body-block-end)",
+  $body-inline-selector: ".spacing-body-inline,:host(.spacing-body-inline)",
+  $body-inline-start-selector:
+    ".spacing-body-inline-start,:host(.spacing-body-inline-start)",
+  $body-inline-end-selector:
+    ".spacing-body-inline-end,:host(.spacing-body-inline-end)"
 ) {
   #{$body-selector} {
     @extend %spacing-body;
@@ -845,7 +849,7 @@
 /// @param {String} $elevation-01-selector [".elevation-01"] -
 /// @param {String} $elevation-02-selector [".elevation-02"] -
 /// @param {String} $elevation-03-selector [".elevation-03"] -
-@mixin utilities-background(
+@mixin utilities-elevation(
   $elevation-01-selector: ".elevation-01",
   $elevation-02-selector: ".elevation-02",
   $elevation-03-selector: ".elevation-03"
@@ -2315,13 +2319,17 @@
 }
 
 @mixin spacing-body(
-  $body-selector: ".spacing-body",
-  $body-block-selector: ".spacing-body-block",
-  $body-block-start-selector: ".spacing-body-block-start",
-  $body-block-end-selector: ".spacing-body-block-end",
-  $body-inline-selector: ".spacing-body-inline",
-  $body-inline-start-selector: ".spacing-body-inline-start",
-  $body-inline-end-selector: ".spacing-body-inline-end"
+  $body-selector: ".spacing-body,:host(.spacing-body)",
+  $body-block-selector: ".spacing-body-block,:host(.spacing-body-block)",
+  $body-block-start-selector:
+    ".spacing-body-block-start,:host(.spacing-body-block-start)",
+  $body-block-end-selector:
+    ".spacing-body-block-end,:host(.spacing-body-block-end)",
+  $body-inline-selector: ".spacing-body-inline,:host(.spacing-body-inline)",
+  $body-inline-start-selector:
+    ".spacing-body-inline-start,:host(.spacing-body-inline-start)",
+  $body-inline-end-selector:
+    ".spacing-body-inline-end,:host(.spacing-body-inline-end)"
 ) {
   #{$body-selector} {
     @extend %spacing-body;
@@ -3605,25 +3613,13 @@
   --accordion-header__border-width: var(--mer-border__width--sm);
   --accordion-header__border-color: transparent;
   --accordion-header__border-radius: var(--accordion-panel__border-radius);
-  --accordion-header__border: var(--accordion-header__border-width) solid
-    var(--accordion-header__border-color);
-  // note: just overriding "--accordion-header__border-color" doesn't seem to work.
-  // header:hover
-  --accordion-header__border-color--hover: var(
-    --mer-border-color__primary--hover
-  );
-  --accordion-header__border--hover: var(--accordion-header__border-width) solid
-    var(--accordion-header__border-color--hover);
-  // header:active
-  --accordion-header__border-color--active: var(
-    --mer-border-color__primary--active
-  );
-  --accordion-header__border--active: var(--accordion-header__border-width)
-    solid var(--accordion-header__border-color--active);
+  --accordion-header__border-block-end-color: var(
+    --mer-border-color__on-surface
+  ); // for expanded
 
   // section
   --accordion-section__border-color: var(--mer-border-color__on-elevation--01);
-  --accordion-section__margin-block: 1px var(--mer-spacing--sm);
+  --accordion-section__margin-block: var(--mer-spacing--sm);
   --accordion-section__margin-inline: var(--mer-spacing--sm);
   --accordion-section__bg-color: var(--mer-surface__elevation--01);
   --accordion-section__border: var(--mer-border__width--sm) solid
@@ -3656,14 +3652,21 @@
   padding: var(--accordion-header__padding);
   gap: var(--accordion-header__gap);
   color: var(--accordion-header__color);
-  outline: var(--accordion-header__border);
-  border-radius: var(--accordion-header__border-radius);
+  border: var(--accordion-header__border-width) solid
+    var(--accordion-header__border-color);
 
   &--hover {
-    --accordion-header__border: var(--accordion-header__border--hover);
+    --accordion-header__border-color: var(--mer-border-color__primary--hover);
   }
   &--active {
-    --accordion-header__border: var(--accordion-header__border--active);
+    --accordion-header__border-color: var(--mer-border-color__primary--active);
+  }
+
+  &--hover,
+  &--active {
+    --accordion-header__border-block-end-color: var(
+      --accordion-header__border-color
+    );
   }
 
   &--focus-visible {
@@ -3679,6 +3682,14 @@
       color: var(--mer-accent__primary--disabled);
     }
   }
+
+  // expanded
+  &--expanded {
+    border-block-end-color: var(--accordion-header__border-block-end-color);
+
+    &-disabled {
+    }
+  }
 }
 
 %accordion-panel {
@@ -3703,15 +3714,10 @@
   // "1px" is used to improve the display of the outline when :focus-visible
   margin-block: var(--accordion-section__margin-block);
   margin-inline: var(--accordion-section__margin-inline);
-  padding-block: var(--accordion-section__padding-block);
-  padding-inline: var(--accordion-section__padding-inline);
-  background-color: var(--accordion-section__bg-color);
-  border: var(--accordion-section__border);
-  border-radius: var(--accordion-section__border-radius);
+  // background-color: var(--accordion-section__bg-color);
 
   &-outlined {
     &--disabled {
-      border-color: var(--accordion-section-outlined__border-color--disabled);
     }
   }
 }
@@ -3722,6 +3728,9 @@
   $panel-disabled-selector: ".accordion-filled::part(panel disabled)",
   $header-selector: ".accordion-filled::part(header)",
   $header-disabled-selector: ".accordion-filled::part(header disabled)",
+  $header-expanded-selector: ".accordion-filled::part(header expanded)",
+  $header-expanded-disabled-selector:
+    ".accordion-filled::part(header expanded disabled)",
   $section-selector: ".accordion-filled::part(section)"
 ) {
   #{$accordion-selector} {
@@ -3750,6 +3759,14 @@
     }
   }
 
+  #{$header-expanded-selector} {
+    @extend %accordion-header--expanded;
+  }
+
+  #{$header-expanded-disabled-selector} {
+    @extend %accordion-header--expanded-disabled;
+  }
+
   #{$section-selector} {
     @extend %accordion-section;
   }
@@ -3765,6 +3782,9 @@
   $panel-disabled-selector: ".accordion-outlined::part(panel disabled)",
   $header-selector: ".accordion-outlined::part(header)",
   $header-disabled-selector: ".accordion-outlined::part(header disabled)",
+  $header-expanded-selector: ".accordion-outlined::part(header expanded)",
+  $header-expanded-disabled-selector:
+    ".accordion-outlined::part(header expanded disabled)",
   $section-selector: ".accordion-outlined::part(section)",
   $section-disabled-selector: ".accordion-outlined::part(section disabled)"
 ) {
@@ -3795,6 +3815,14 @@
     }
   }
 
+  #{$header-expanded-selector} {
+    @extend %accordion-header--expanded;
+  }
+
+  #{$header-expanded-disabled-selector} {
+    @extend %accordion-header--expanded-disabled;
+  }
+
   #{$section-selector} {
     @extend %accordion-section;
   }
@@ -4885,13 +4913,17 @@
 }
 
 @mixin spacing-body(
-  $body-selector: ".spacing-body",
-  $body-block-selector: ".spacing-body-block",
-  $body-block-start-selector: ".spacing-body-block-start",
-  $body-block-end-selector: ".spacing-body-block-end",
-  $body-inline-selector: ".spacing-body-inline",
-  $body-inline-start-selector: ".spacing-body-inline-start",
-  $body-inline-end-selector: ".spacing-body-inline-end"
+  $body-selector: ".spacing-body,:host(.spacing-body)",
+  $body-block-selector: ".spacing-body-block,:host(.spacing-body-block)",
+  $body-block-start-selector:
+    ".spacing-body-block-start,:host(.spacing-body-block-start)",
+  $body-block-end-selector:
+    ".spacing-body-block-end,:host(.spacing-body-block-end)",
+  $body-inline-selector: ".spacing-body-inline,:host(.spacing-body-inline)",
+  $body-inline-start-selector:
+    ".spacing-body-inline-start,:host(.spacing-body-inline-start)",
+  $body-inline-end-selector:
+    ".spacing-body-inline-end,:host(.spacing-body-inline-end)"
 ) {
   #{$body-selector} {
     @extend %spacing-body;
@@ -4944,12 +4976,10 @@
 %combo-box {
   --ch-combo-box-separation-y: var(--mer-spacing--3xs);
   --ch-combo-box-item-gap: var(--mer-spacing--xs);
-
-  --ch-combo-box-item__image-size: var(--mer-spacing--md);
+  --ch-combo-box-item__image-size: var(--mer-icon__box--md);
+  --ch-combo-box-item__background-image-size: 100%;
   --ch-combo-box-group__expandable-button-size: var(--mer-spacing--md);
-
   --ch-combo-box-group__expandable-button-image-size: var(--mer-spacing--sm);
-  --ch-combo-box-item__background-image-size: 100%;
 
   @include control-border();
   @include control-colors-enabled();
@@ -5053,11 +5083,13 @@
   //                 Window
   // - - - - - - - - - - - - - - - - - - - -
   #{$window-selector} {
+    @include items-container-border();
+    @include items-container-border-radius();
     @include items-container-colors();
     @include items-container-padding();
-    @include items-container-dropdown();
     @include items-container-gap();
     @include items-container-max-height();
+    @include items-container-dropdown();
   }
 
   // - - - - - - - - - - - - - - - - - - - -
@@ -6757,13 +6789,17 @@
 }
 
 @mixin spacing-body(
-  $body-selector: ".spacing-body",
-  $body-block-selector: ".spacing-body-block",
-  $body-block-start-selector: ".spacing-body-block-start",
-  $body-block-end-selector: ".spacing-body-block-end",
-  $body-inline-selector: ".spacing-body-inline",
-  $body-inline-start-selector: ".spacing-body-inline-start",
-  $body-inline-end-selector: ".spacing-body-inline-end"
+  $body-selector: ".spacing-body,:host(.spacing-body)",
+  $body-block-selector: ".spacing-body-block,:host(.spacing-body-block)",
+  $body-block-start-selector:
+    ".spacing-body-block-start,:host(.spacing-body-block-start)",
+  $body-block-end-selector:
+    ".spacing-body-block-end,:host(.spacing-body-block-end)",
+  $body-inline-selector: ".spacing-body-inline,:host(.spacing-body-inline)",
+  $body-inline-start-selector:
+    ".spacing-body-inline-start,:host(.spacing-body-inline-start)",
+  $body-inline-end-selector:
+    ".spacing-body-inline-end,:host(.spacing-body-inline-end)"
 ) {
   #{$body-selector} {
     @extend %spacing-body;
@@ -13618,15 +13654,15 @@
   --icon__system_dark-mode_primary--hover: url('#{$icons-path}system/light/dark-mode.svg#primary--hover'); 
   --icon__system_dark-mode_primary--active: url('#{$icons-path}system/light/dark-mode.svg#primary--active'); 
   --icon__system_dark-mode_primary--disabled: url('#{$icons-path}system/light/dark-mode.svg#primary--disabled'); 
-  --icon__system_Cut_on-surface--enabled: url('#{$icons-path}system/light/Cut.svg#on-surface--enabled'); 
-  --icon__system_Cut_on-surface--hover: url('#{$icons-path}system/light/Cut.svg#on-surface--hover'); 
-  --icon__system_Cut_on-surface--active: url('#{$icons-path}system/light/Cut.svg#on-surface--active'); 
-  --icon__system_Cut_on-surface--disabled: url('#{$icons-path}system/light/Cut.svg#on-surface--disabled'); 
-  --icon__system_Cut_on-elevation--enabled: url('#{$icons-path}system/light/Cut.svg#on-elevation--enabled'); 
-  --icon__system_Cut_primary--enabled: url('#{$icons-path}system/light/Cut.svg#primary--enabled'); 
-  --icon__system_Cut_primary--hover: url('#{$icons-path}system/light/Cut.svg#primary--hover'); 
-  --icon__system_Cut_primary--active: url('#{$icons-path}system/light/Cut.svg#primary--active'); 
-  --icon__system_Cut_primary--disabled: url('#{$icons-path}system/light/Cut.svg#primary--disabled'); 
+  --icon__system_cut_on-surface--enabled: url('#{$icons-path}system/light/cut.svg#on-surface--enabled'); 
+  --icon__system_cut_on-surface--hover: url('#{$icons-path}system/light/cut.svg#on-surface--hover'); 
+  --icon__system_cut_on-surface--active: url('#{$icons-path}system/light/cut.svg#on-surface--active'); 
+  --icon__system_cut_on-surface--disabled: url('#{$icons-path}system/light/cut.svg#on-surface--disabled'); 
+  --icon__system_cut_on-elevation--enabled: url('#{$icons-path}system/light/cut.svg#on-elevation--enabled'); 
+  --icon__system_cut_primary--enabled: url('#{$icons-path}system/light/cut.svg#primary--enabled'); 
+  --icon__system_cut_primary--hover: url('#{$icons-path}system/light/cut.svg#primary--hover'); 
+  --icon__system_cut_primary--active: url('#{$icons-path}system/light/cut.svg#primary--active'); 
+  --icon__system_cut_primary--disabled: url('#{$icons-path}system/light/cut.svg#primary--disabled'); 
   --icon__system_copy_on-surface--enabled: url('#{$icons-path}system/light/copy.svg#on-surface--enabled'); 
   --icon__system_copy_on-surface--hover: url('#{$icons-path}system/light/copy.svg#on-surface--hover'); 
   --icon__system_copy_on-surface--active: url('#{$icons-path}system/light/copy.svg#on-surface--active'); 
@@ -13663,15 +13699,15 @@
   --icon__system_check_primary--hover: url('#{$icons-path}system/light/check.svg#primary--hover'); 
   --icon__system_check_primary--active: url('#{$icons-path}system/light/check.svg#primary--active'); 
   --icon__system_check_primary--disabled: url('#{$icons-path}system/light/check.svg#primary--disabled'); 
-  --icon__system_Card_on-surface--enabled: url('#{$icons-path}system/light/Card.svg#on-surface--enabled'); 
-  --icon__system_Card_on-surface--hover: url('#{$icons-path}system/light/Card.svg#on-surface--hover'); 
-  --icon__system_Card_on-surface--active: url('#{$icons-path}system/light/Card.svg#on-surface--active'); 
-  --icon__system_Card_on-surface--disabled: url('#{$icons-path}system/light/Card.svg#on-surface--disabled'); 
-  --icon__system_Card_on-elevation--enabled: url('#{$icons-path}system/light/Card.svg#on-elevation--enabled'); 
-  --icon__system_Card_primary--enabled: url('#{$icons-path}system/light/Card.svg#primary--enabled'); 
-  --icon__system_Card_primary--hover: url('#{$icons-path}system/light/Card.svg#primary--hover'); 
-  --icon__system_Card_primary--active: url('#{$icons-path}system/light/Card.svg#primary--active'); 
-  --icon__system_Card_primary--disabled: url('#{$icons-path}system/light/Card.svg#primary--disabled'); 
+  --icon__system_card_on-surface--enabled: url('#{$icons-path}system/light/card.svg#on-surface--enabled'); 
+  --icon__system_card_on-surface--hover: url('#{$icons-path}system/light/card.svg#on-surface--hover'); 
+  --icon__system_card_on-surface--active: url('#{$icons-path}system/light/card.svg#on-surface--active'); 
+  --icon__system_card_on-surface--disabled: url('#{$icons-path}system/light/card.svg#on-surface--disabled'); 
+  --icon__system_card_on-elevation--enabled: url('#{$icons-path}system/light/card.svg#on-elevation--enabled'); 
+  --icon__system_card_primary--enabled: url('#{$icons-path}system/light/card.svg#primary--enabled'); 
+  --icon__system_card_primary--hover: url('#{$icons-path}system/light/card.svg#primary--hover'); 
+  --icon__system_card_primary--active: url('#{$icons-path}system/light/card.svg#primary--active'); 
+  --icon__system_card_primary--disabled: url('#{$icons-path}system/light/card.svg#primary--disabled'); 
   --icon__system_card-variant_on-surface--enabled: url('#{$icons-path}system/light/card-variant.svg#on-surface--enabled'); 
   --icon__system_card-variant_on-surface--hover: url('#{$icons-path}system/light/card-variant.svg#on-surface--hover'); 
   --icon__system_card-variant_on-surface--active: url('#{$icons-path}system/light/card-variant.svg#on-surface--active'); 
@@ -13681,15 +13717,6 @@
   --icon__system_card-variant_primary--hover: url('#{$icons-path}system/light/card-variant.svg#primary--hover'); 
   --icon__system_card-variant_primary--active: url('#{$icons-path}system/light/card-variant.svg#primary--active'); 
   --icon__system_card-variant_primary--disabled: url('#{$icons-path}system/light/card-variant.svg#primary--disabled'); 
-  --icon__system_Assistant_on-surface--enabled: url('#{$icons-path}system/light/Assistant.svg#on-surface--enabled'); 
-  --icon__system_Assistant_on-surface--hover: url('#{$icons-path}system/light/Assistant.svg#on-surface--hover'); 
-  --icon__system_Assistant_on-surface--active: url('#{$icons-path}system/light/Assistant.svg#on-surface--active'); 
-  --icon__system_Assistant_on-surface--disabled: url('#{$icons-path}system/light/Assistant.svg#on-surface--disabled'); 
-  --icon__system_Assistant_on-elevation--enabled: url('#{$icons-path}system/light/Assistant.svg#on-elevation--enabled'); 
-  --icon__system_Assistant_primary--enabled: url('#{$icons-path}system/light/Assistant.svg#primary--enabled'); 
-  --icon__system_Assistant_primary--hover: url('#{$icons-path}system/light/Assistant.svg#primary--hover'); 
-  --icon__system_Assistant_primary--active: url('#{$icons-path}system/light/Assistant.svg#primary--active'); 
-  --icon__system_Assistant_primary--disabled: url('#{$icons-path}system/light/Assistant.svg#primary--disabled'); 
   --icon__system_arrow-up_on-surface--enabled: url('#{$icons-path}system/light/arrow-up.svg#on-surface--enabled'); 
   --icon__system_arrow-up_on-surface--hover: url('#{$icons-path}system/light/arrow-up.svg#on-surface--hover'); 
   --icon__system_arrow-up_on-surface--active: url('#{$icons-path}system/light/arrow-up.svg#on-surface--active'); 
@@ -13762,6 +13789,15 @@
   --icon__system_add-circle_primary--hover: url('#{$icons-path}system/light/add-circle.svg#primary--hover'); 
   --icon__system_add-circle_primary--active: url('#{$icons-path}system/light/add-circle.svg#primary--active'); 
   --icon__system_add-circle_primary--disabled: url('#{$icons-path}system/light/add-circle.svg#primary--disabled'); 
+  --icon__system_Assistant_on-surface--enabled: url('#{$icons-path}system/light/Assistant.svg#on-surface--enabled'); 
+  --icon__system_Assistant_on-surface--hover: url('#{$icons-path}system/light/Assistant.svg#on-surface--hover'); 
+  --icon__system_Assistant_on-surface--active: url('#{$icons-path}system/light/Assistant.svg#on-surface--active'); 
+  --icon__system_Assistant_on-surface--disabled: url('#{$icons-path}system/light/Assistant.svg#on-surface--disabled'); 
+  --icon__system_Assistant_on-elevation--enabled: url('#{$icons-path}system/light/Assistant.svg#on-elevation--enabled'); 
+  --icon__system_Assistant_primary--enabled: url('#{$icons-path}system/light/Assistant.svg#primary--enabled'); 
+  --icon__system_Assistant_primary--hover: url('#{$icons-path}system/light/Assistant.svg#primary--hover'); 
+  --icon__system_Assistant_primary--active: url('#{$icons-path}system/light/Assistant.svg#primary--active'); 
+  --icon__system_Assistant_primary--disabled: url('#{$icons-path}system/light/Assistant.svg#primary--disabled'); 
 
   }
 
@@ -14275,15 +14311,15 @@
   --icon__system_dark-mode_primary--hover: url('#{$icons-path}system/dark/dark-mode.svg#primary--hover'); 
   --icon__system_dark-mode_primary--active: url('#{$icons-path}system/dark/dark-mode.svg#primary--active'); 
   --icon__system_dark-mode_primary--disabled: url('#{$icons-path}system/dark/dark-mode.svg#primary--disabled'); 
-  --icon__system_Cut_on-surface--enabled: url('#{$icons-path}system/dark/Cut.svg#on-surface--enabled'); 
-  --icon__system_Cut_on-surface--hover: url('#{$icons-path}system/dark/Cut.svg#on-surface--hover'); 
-  --icon__system_Cut_on-surface--active: url('#{$icons-path}system/dark/Cut.svg#on-surface--active'); 
-  --icon__system_Cut_on-surface--disabled: url('#{$icons-path}system/dark/Cut.svg#on-surface--disabled'); 
-  --icon__system_Cut_on-elevation--enabled: url('#{$icons-path}system/dark/Cut.svg#on-elevation--enabled'); 
-  --icon__system_Cut_primary--enabled: url('#{$icons-path}system/dark/Cut.svg#primary--enabled'); 
-  --icon__system_Cut_primary--hover: url('#{$icons-path}system/dark/Cut.svg#primary--hover'); 
-  --icon__system_Cut_primary--active: url('#{$icons-path}system/dark/Cut.svg#primary--active'); 
-  --icon__system_Cut_primary--disabled: url('#{$icons-path}system/dark/Cut.svg#primary--disabled'); 
+  --icon__system_cut_on-surface--enabled: url('#{$icons-path}system/dark/cut.svg#on-surface--enabled'); 
+  --icon__system_cut_on-surface--hover: url('#{$icons-path}system/dark/cut.svg#on-surface--hover'); 
+  --icon__system_cut_on-surface--active: url('#{$icons-path}system/dark/cut.svg#on-surface--active'); 
+  --icon__system_cut_on-surface--disabled: url('#{$icons-path}system/dark/cut.svg#on-surface--disabled'); 
+  --icon__system_cut_on-elevation--enabled: url('#{$icons-path}system/dark/cut.svg#on-elevation--enabled'); 
+  --icon__system_cut_primary--enabled: url('#{$icons-path}system/dark/cut.svg#primary--enabled'); 
+  --icon__system_cut_primary--hover: url('#{$icons-path}system/dark/cut.svg#primary--hover'); 
+  --icon__system_cut_primary--active: url('#{$icons-path}system/dark/cut.svg#primary--active'); 
+  --icon__system_cut_primary--disabled: url('#{$icons-path}system/dark/cut.svg#primary--disabled'); 
   --icon__system_copy_on-surface--enabled: url('#{$icons-path}system/dark/copy.svg#on-surface--enabled'); 
   --icon__system_copy_on-surface--hover: url('#{$icons-path}system/dark/copy.svg#on-surface--hover'); 
   --icon__system_copy_on-surface--active: url('#{$icons-path}system/dark/copy.svg#on-surface--active'); 
@@ -14320,15 +14356,15 @@
   --icon__system_check_primary--hover: url('#{$icons-path}system/dark/check.svg#primary--hover'); 
   --icon__system_check_primary--active: url('#{$icons-path}system/dark/check.svg#primary--active'); 
   --icon__system_check_primary--disabled: url('#{$icons-path}system/dark/check.svg#primary--disabled'); 
-  --icon__system_Card_on-surface--enabled: url('#{$icons-path}system/dark/Card.svg#on-surface--enabled'); 
-  --icon__system_Card_on-surface--hover: url('#{$icons-path}system/dark/Card.svg#on-surface--hover'); 
-  --icon__system_Card_on-surface--active: url('#{$icons-path}system/dark/Card.svg#on-surface--active'); 
-  --icon__system_Card_on-surface--disabled: url('#{$icons-path}system/dark/Card.svg#on-surface--disabled'); 
-  --icon__system_Card_on-elevation--enabled: url('#{$icons-path}system/dark/Card.svg#on-elevation--enabled'); 
-  --icon__system_Card_primary--enabled: url('#{$icons-path}system/dark/Card.svg#primary--enabled'); 
-  --icon__system_Card_primary--hover: url('#{$icons-path}system/dark/Card.svg#primary--hover'); 
-  --icon__system_Card_primary--active: url('#{$icons-path}system/dark/Card.svg#primary--active'); 
-  --icon__system_Card_primary--disabled: url('#{$icons-path}system/dark/Card.svg#primary--disabled'); 
+  --icon__system_card_on-surface--enabled: url('#{$icons-path}system/dark/card.svg#on-surface--enabled'); 
+  --icon__system_card_on-surface--hover: url('#{$icons-path}system/dark/card.svg#on-surface--hover'); 
+  --icon__system_card_on-surface--active: url('#{$icons-path}system/dark/card.svg#on-surface--active'); 
+  --icon__system_card_on-surface--disabled: url('#{$icons-path}system/dark/card.svg#on-surface--disabled'); 
+  --icon__system_card_on-elevation--enabled: url('#{$icons-path}system/dark/card.svg#on-elevation--enabled'); 
+  --icon__system_card_primary--enabled: url('#{$icons-path}system/dark/card.svg#primary--enabled'); 
+  --icon__system_card_primary--hover: url('#{$icons-path}system/dark/card.svg#primary--hover'); 
+  --icon__system_card_primary--active: url('#{$icons-path}system/dark/card.svg#primary--active'); 
+  --icon__system_card_primary--disabled: url('#{$icons-path}system/dark/card.svg#primary--disabled'); 
   --icon__system_card-variant_on-surface--enabled: url('#{$icons-path}system/dark/card-variant.svg#on-surface--enabled'); 
   --icon__system_card-variant_on-surface--hover: url('#{$icons-path}system/dark/card-variant.svg#on-surface--hover'); 
   --icon__system_card-variant_on-surface--active: url('#{$icons-path}system/dark/card-variant.svg#on-surface--active'); 
@@ -14338,15 +14374,6 @@
   --icon__system_card-variant_primary--hover: url('#{$icons-path}system/dark/card-variant.svg#primary--hover'); 
   --icon__system_card-variant_primary--active: url('#{$icons-path}system/dark/card-variant.svg#primary--active'); 
   --icon__system_card-variant_primary--disabled: url('#{$icons-path}system/dark/card-variant.svg#primary--disabled'); 
-  --icon__system_Assistant_on-surface--enabled: url('#{$icons-path}system/dark/Assistant.svg#on-surface--enabled'); 
-  --icon__system_Assistant_on-surface--hover: url('#{$icons-path}system/dark/Assistant.svg#on-surface--hover'); 
-  --icon__system_Assistant_on-surface--active: url('#{$icons-path}system/dark/Assistant.svg#on-surface--active'); 
-  --icon__system_Assistant_on-surface--disabled: url('#{$icons-path}system/dark/Assistant.svg#on-surface--disabled'); 
-  --icon__system_Assistant_on-elevation--enabled: url('#{$icons-path}system/dark/Assistant.svg#on-elevation--enabled'); 
-  --icon__system_Assistant_primary--enabled: url('#{$icons-path}system/dark/Assistant.svg#primary--enabled'); 
-  --icon__system_Assistant_primary--hover: url('#{$icons-path}system/dark/Assistant.svg#primary--hover'); 
-  --icon__system_Assistant_primary--active: url('#{$icons-path}system/dark/Assistant.svg#primary--active'); 
-  --icon__system_Assistant_primary--disabled: url('#{$icons-path}system/dark/Assistant.svg#primary--disabled'); 
   --icon__system_arrow-up_on-surface--enabled: url('#{$icons-path}system/dark/arrow-up.svg#on-surface--enabled'); 
   --icon__system_arrow-up_on-surface--hover: url('#{$icons-path}system/dark/arrow-up.svg#on-surface--hover'); 
   --icon__system_arrow-up_on-surface--active: url('#{$icons-path}system/dark/arrow-up.svg#on-surface--active'); 
@@ -14419,6 +14446,15 @@
   --icon__system_add-circle_primary--hover: url('#{$icons-path}system/dark/add-circle.svg#primary--hover'); 
   --icon__system_add-circle_primary--active: url('#{$icons-path}system/dark/add-circle.svg#primary--active'); 
   --icon__system_add-circle_primary--disabled: url('#{$icons-path}system/dark/add-circle.svg#primary--disabled'); 
+  --icon__system_Assistant_on-surface--enabled: url('#{$icons-path}system/dark/Assistant.svg#on-surface--enabled'); 
+  --icon__system_Assistant_on-surface--hover: url('#{$icons-path}system/dark/Assistant.svg#on-surface--hover'); 
+  --icon__system_Assistant_on-surface--active: url('#{$icons-path}system/dark/Assistant.svg#on-surface--active'); 
+  --icon__system_Assistant_on-surface--disabled: url('#{$icons-path}system/dark/Assistant.svg#on-surface--disabled'); 
+  --icon__system_Assistant_on-elevation--enabled: url('#{$icons-path}system/dark/Assistant.svg#on-elevation--enabled'); 
+  --icon__system_Assistant_primary--enabled: url('#{$icons-path}system/dark/Assistant.svg#primary--enabled'); 
+  --icon__system_Assistant_primary--hover: url('#{$icons-path}system/dark/Assistant.svg#primary--hover'); 
+  --icon__system_Assistant_primary--active: url('#{$icons-path}system/dark/Assistant.svg#primary--active'); 
+  --icon__system_Assistant_primary--disabled: url('#{$icons-path}system/dark/Assistant.svg#primary--disabled'); 
 
   }
   
@@ -18193,7 +18229,7 @@
     }
 
     @if $utility-classes {
-      @include utilities-background();
+      @include utilities-elevation();
     }
 
     @if $layout-classes {
@@ -18268,7 +18304,7 @@
   }
 
   @if $pills {
-    @include pills($add--icon: $icons-variables);
+    @include pills();
   }
 
   @if $radio-group {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@genexus/mercury",
-  "version": "0.9.6",
+  "version": "0.9.9",
   "description": "Mercury is the design system designed for GeneXus IDE Web and GeneXus Next",
   "main": "dist/mercury.scss",
   "module": "dist/assets-manager.js",
@@ -27,7 +27,7 @@
   "license": "MIT",
   "devDependencies": {
     "@atao60/fse-cli": "^0.1.9",
-    "@genexus/chameleon-controls-library": "6.0.0-next.45",
+    "@genexus/chameleon-controls-library": "6.0.0-next.47",
     "@genexus/svg-sass-generator": "1.1.24",
     "chokidar": "^3.6.0",
     "chokidar-cli": "^3.0.0",