@genexus/genexus-ide-ui 0.0.12 → 0.0.14

package/dist/node_modules/@genexus/gemini/dist/collection/components/grid/gxg-grid.css

@@ -1,3 +1,319 @@
+:root {
+  --ui-animaton-speed: 0.2s;
+}
+
+/*ALIGNMENT*/
+/*****************************************************
+TYPOGRAPHY
+*****************************************************/
+/*Title 01 (Positive)*/
+.gxg-title-01 {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-bold);
+  font-size: var(--font-size-md);
+  letter-spacing: var(--letter-spacing-md);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+}
+
+/*Title 01 (Negative)*/
+.gxg-title-01--negative {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-bold);
+  font-size: var(--font-size-md);
+  letter-spacing: var(--letter-spacing-md);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--color-on-primary);
+}
+
+/*Title 02 (Positive)*/
+.gxg-title-02 {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-bold);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-sm);
+  color: var(--color-on-background);
+  text-align: start;
+  text-transform: uppercase;
+  line-height: 1.556em;
+}
+
+.gxg-title-02--negative {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-bold);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-sm);
+  color: var(--color-on-background);
+  text-align: start;
+  text-transform: uppercase;
+  line-height: 1.556em;
+  color: var(--color-on-primary);
+}
+
+/*Title 03*/
+.gxg-title-03 {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-xs);
+  letter-spacing: var(--letter-spacing-sm);
+  color: var(--color-on-background);
+  text-align: start;
+  text-transform: uppercase;
+  line-height: 1.556em;
+}
+
+.gxg-title-03--negative {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-xs);
+  letter-spacing: var(--letter-spacing-sm);
+  color: var(--color-on-background);
+  text-align: start;
+  text-transform: uppercase;
+  line-height: 1.556em;
+  color: var(--color-on-primary);
+}
+
+/*Title 04*/
+.gxg-title-04 {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-semibold);
+  font-size: var(--font-size-md);
+  letter-spacing: var(--letter-spacing-md);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+}
+
+.gxg-title-04--negative {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-semibold);
+  font-size: var(--font-size-md);
+  letter-spacing: var(--letter-spacing-md);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--color-on-primary);
+}
+
+/*Title 05*/
+.gxg-title-05 {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-semibold);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-sm);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.556em;
+}
+
+.gxg-title-05--negative {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-semibold);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-sm);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.556em;
+  color: var(--color-on-primary);
+}
+
+/*Text*/
+.gxg-text {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+}
+
+.gxg-text--negative {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--color-on-primary);
+}
+
+.gxg-text--gray {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--gray-05);
+}
+
+/*Quote*/
+.gxg-quote {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  font-style: italic;
+}
+
+.gxg-quote--negative {
+  color: var(--color-on-primary);
+}
+
+/*Link*/
+.gxg-link {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--color-primary);
+  text-decoration: underline;
+  cursor: pointer;
+  display: inline-block;
+}
+.gxg-link:hover {
+  color: var(--color-primary-hover);
+}
+.gxg-link:active {
+  color: var(--color-primary-active);
+}
+
+.gxg-link-gray {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--color-primary);
+  text-decoration: underline;
+  cursor: pointer;
+  display: inline-block;
+  color: var(--gray-04);
+}
+.gxg-link-gray:hover {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--color-primary);
+  text-decoration: underline;
+  cursor: pointer;
+  display: inline-block;
+  color: var(--gray-04);
+  color: var(--gray-06);
+}
+
+/*Alerts*/
+.gxg-alert-error {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--color-error-dark);
+  display: inline-block;
+}
+
+.gxg-alert-warning {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--color-warning-dark);
+  display: inline-block;
+}
+
+.gxg-alert-success {
+  font-family: var(--font-family-primary);
+  font-weight: var(--font-weight-regular);
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-on-background);
+  text-align: start;
+  line-height: 1.455em;
+  color: var(--color-success-dark);
+  display: inline-block;
+}
+
+/*Tab*/
+.gxg-tab--disabled {
+  color: var(--color-primary-disabled);
+  pointer-events: none;
+}
+.gxg-tab--disabled[disabled] {
+  color: var(--color-primary-disabled);
+  pointer-events: none;
+}
+
+/*Label*/
+.gxg-label {
+  font-family: var(--font-family-primary) !important;
+  font-weight: var(--font-weight-semibold);
+  font-size: var(--font-size-sm) !important;
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-primary-enabled);
+  text-align: center;
+  line-height: 1.455em;
+}
+.gxg-label:hover {
+  color: var(--color-primary-hover);
+}
+.gxg-label:focus {
+  color: var(--color-primary-active);
+}
+.gxg-label:active {
+  color: var(--color-primary-active);
+}
+.gxg-label[disabled] {
+  color: var(--color-primary-disabled);
+}
+
+.gxg-label--negative {
+  color: var(--color-on-primary);
+}
+.gxg-label--negative[disabled] {
+  color: var(--color-on-disabled);
+}
+
+/*****************************************************
+GXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES
+*****************************************************/
+.gxg-button-styles {
+  font-family: var(--font-family-primary) !important;
+  font-weight: var(--font-weight-semibold);
+  font-size: var(--font-size-sm) !important;
+  letter-spacing: var(--letter-spacing-xs);
+  color: var(--color-primary-enabled);
+  text-align: center;
+  line-height: 1.455em;
+}
+
+/*****************************************************
+FORM ELEMENTS
+*****************************************************/
 :root {
   --indent: var(--spacing-comp-02);
 }
@@ -11,6 +327,33 @@ ch-grid {
   --focus-style: 2px solid var(--color-primary-active);
 }
 
+ch-grid::part(main) {
+  /* Track */
+  /* Handle */
+  /* Handle on hover */
+}
+ch-grid::part(main)::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+ch-grid::part(main)::-webkit-scrollbar-track {
+  background-color: var(--gray-02);
+  border-radius: 10px;
+}
+ch-grid::part(main)::-webkit-scrollbar-thumb {
+  background: var(--gray-05);
+  border-radius: 10px;
+}
+ch-grid::part(main)::-webkit-scrollbar-thumb:hover {
+  background: var(--gray-04);
+  cursor: pointer;
+}
+ch-grid::part(main) .gxg-scroll {
+  display: block;
+  overflow-y: auto;
+  padding-right: 2px;
+}
+
 gxg-grid.no-border ch-grid {
   border: 0;
 }
@@ -179,10 +522,6 @@ ch-grid-row[dragging] {
   box-shadow: var(--box-shadow-03);
 }
 
-ch-grid-row[focused] {
-  border-color: var(--color-primary-active);
-}
-
 ch-grid-row[selected] > ch-grid-cell:not([selected]) {
   background-color: var(--color-secondary-enabled);
 }
@@ -192,7 +531,7 @@ ch-grid-cell[selected] {
   background-color: var(--color-secondary-enabled) !important;
 }
 
-ch-grid-row[selected] ch-grid-cell {
+ch-grid-row[selected] > ch-grid-cell {
   color: var(--color-on-secondary);
 }
 ch-grid-row[selected] + ch-grid-row[selected] ch-grid-cell {
@@ -206,7 +545,6 @@ ch-grid-cell {
   padding-block-start: var(--spacing-comp-01);
   padding-block-end: var(--spacing-comp-01);
   align-items: center;
-  min-height: var(--spacing-comp-04);
 }
 
 ch-grid-column::part(settings-mask) {
@@ -446,8 +784,4 @@ LARGE VERSION (html tag has 'gxg-large' class)
 **********************************************/
 gxg-grid.large ch-grid {
   font-size: var(--font-size-lg);
-}
-gxg-grid.large ch-grid-cell {
-  padding-block-start: calc(var(--spacing-comp-01) * 1.5);
-  padding-block-end: calc(var(--spacing-comp-01) * 1.5);
 }

package/dist/node_modules/@genexus/gemini/dist/collection/components/list-box/list-box.css

@@ -426,7 +426,7 @@ FORM ELEMENTS
 
 .container:focus-within {
   outline-style: solid;
-  outline-color: var(--color-primary-enabled);
+  outline-color: var(--color-primary-active);
   outline-width: var(--border-width-md);
   outline-offset: 0;
 }

package/dist/node_modules/@genexus/gemini/dist/collection/components/menu/menu.css

@@ -655,47 +655,55 @@ FORM ELEMENTS
 *****************************************************/
 :host {
   display: inline-block;
+  position: absolute;
+}
+
+.outer-wrapper {
+  color: var(--color-on-background);
+  font-family: var(--font-family-primary);
+  overflow: hidden;
+  box-shadow: var(--box-shadow-01);
   background: var(--color-background);
+  transition-property: height;
+}
+
+.inner-wrapper {
   border-radius: var(--border-width-md);
-  box-shadow: var(--box-shadow-01);
+  box-sizing: border-box;
 }
-:host .menu__header {
+
+.menu__header {
   border-bottom-style: var(--border-style-regular);
   border-bottom-width: var(--border-width-sm);
-  border-bottom-color: var(--gray-04);
+  border-bottom-color: var(--gray-03);
 }
-:host .menu__header__title {
-  color: var(--color-on-background);
-  font-family: var(--font-family-primary);
-  font-size: var(--font-size-xs);
+
+.menu__header__title {
+  font-size: var(--font-size-sm);
   font-weight: var(--font-weight-bold);
   text-transform: uppercase;
   margin-top: 0;
   margin-bottom: 0;
-  padding: var(--spacing-comp-03) var(--spacing-comp-05) var(--spacing-comp-03) var(--spacing-comp-05);
-}
-:host .menuList {
-  list-style-type: none;
-  display: block;
-  padding-left: 0;
-  margin: 0;
-  font-family: var(--font-family-primary);
-  font-weight: var(--font-weight-regular);
-  font-size: var(--font-size-sm);
-  letter-spacing: var(--letter-spacing-xs);
-  color: var(--color-on-background);
-  text-align: start;
-  line-height: 1.455em;
+  padding: var(--spacing-comp-01) var(--spacing-comp-03);
 }
 
 :host([full-width]) {
   width: 100% !important;
 }
 
-:host([tabs]) .menuList {
+:host([tabs]) .menu-list {
   font-size: var(--font-size-sm);
   font-weight: var(--font-weight-semibold);
 }
-:host([tabs]) .menuList ::slotted(gxg-menu-item) {
+:host([tabs]) .menu-list ::slotted(gxg-menu-item) {
   text-transform: uppercase;
+}
+
+:host ::slotted(gxg-menu-list) {
+  border-bottom-style: var(--border-style-regular);
+  border-bottom-width: var(--border-width-sm);
+  border-bottom-color: var(--gray-03);
+}
+:host ::slotted(gxg-menu-list) {
+  border-bottom: none;
 }

package/dist/node_modules/@genexus/gemini/dist/collection/components/menu-item/menu-item.css

@@ -653,8 +653,16 @@ GXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES
 /*****************************************************
 FORM ELEMENTS
 *****************************************************/
+:host(.gxg--disabled) .form-element,
+:host(.gxg--disabled.form-element) {
+  pointer-events: none;
+  background-color: var(--color-background-disabled) !important;
+  color: var(--color-on-background--disabled) !important;
+  border-color: var(--gxg-border-color--disabled) !important;
+  cursor: default !important;
+}
+
 :host .menu-item {
-  color: var(--color-on-background);
   position: relative;
 }
 :host .menu-item:before {
@@ -665,24 +673,40 @@ FORM ELEMENTS
   background-color: transparent;
   position: absolute;
 }
-:host .menu-item__container {
-  height: var(--spacing-comp-06);
-  background-color: transparent;
+:host .menu-item--ellipsis .menu-item__label {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  width: 100%;
+}
+:host .menu-item__button {
+  all: unset;
+  color: var(--color-on-background);
+  padding: 0 var(--spacing-comp-01);
+  min-height: var(--gxg-list-item-height);
+  width: 100%;
+  box-sizing: border-box;
   cursor: pointer;
-  padding: 0 var(--spacing-comp-05) 0 var(--spacing-comp-05);
   display: flex;
   align-items: center;
+  gap: var(--spacing-comp-02);
+  border-radius: var(--border-width-md);
+  overflow: hidden;
 }
-:host .menu-item__container:hover {
-  background-color: var(--gray-02);
+:host .menu-item__button:hover {
+  background-color: var(--gxg-background-color-item-hover);
 }
-:host .menu-item gxg-icon {
-  margin-right: var(--spacing-comp-01);
+:host .menu-item__button:focus {
+  outline-style: solid;
+  outline-color: var(--color-primary-active);
+  outline-width: var(--border-width-md);
+  outline-offset: -2px;
 }
 :host :menu-item--tab {
   font-weight: var(--font-weight-semibold);
 }
 
-:host([active]) .menu-item:before {
-  background-color: var(--gray-03);
+:host([active]) .menu-item__button {
+  color: var(--gxg-color-selected);
+  background-color: var(--gxg-background-color-item-selected);
 }