@widergy/energy-ui 3.171.1 → 3.171.3

package/CHANGELOG.md

@@ -1,9 +1,31 @@
-## [3.171.1](https://github.com/widergy/energy-ui/compare/v3.171.0...v3.171.1) (2026-06-23)
+## [3.171.3](https://github.com/widergy/energy-ui/compare/v3.171.2...v3.171.3) (2026-06-29)
 
 
 ### Bug Fixes
 
-* [OUG] radio group error ([#827](https://github.com/widergy/energy-ui/issues/827)) ([8b3224a](https://github.com/widergy/energy-ui/commit/8b3224a97d184dbc3ca37bb182c8b84e3cbb157a))
+* [CX-2712] selected marker z index google map ([#829](https://github.com/widergy/energy-ui/issues/829)) ([7a90960](https://github.com/widergy/energy-ui/commit/7a90960a618da21faf18f2e8d8fa3e3c09be321e))
+
+## [3.171.2](https://github.com/widergy/energy-ui/compare/v3.171.1...v3.171.2) (2026-06-27)
+
+### Novedades y Mejoras
+
+* Los selectores de opciones y fechas en modo picker ahora solo permiten seleccionar valores desde la lista, ofreciendo una experiencia más consistente y predecible. [#804](https://github.com/widergy/Energy-UI/pull/804) [DIS-1103](https://widergy.atlassian.net/browse/DIS-1103)
+* Se actualizó el espaciado visual de los componentes para lograr una presentación más uniforme en distintos tamaños de pantalla. [#804](https://github.com/widergy/Energy-UI/pull/804) [DIS-1103](https://widergy.atlassian.net/browse/DIS-1103)
+
+### Correcciones
+
+* Se corrigió el espaciado entre líneas en los títulos para mejorar la legibilidad. [#804](https://github.com/widergy/Energy-UI/pull/804) [DIS-1103](https://widergy.atlassian.net/browse/DIS-1103)
+* Mejoras internas de la plataforma. [`bd69f18`](https://github.com/widergy/Energy-UI/commit/bd69f18)
+
+## [3.171.1](https://github.com/widergy/energy-ui/compare/v3.171.0...v3.171.1) (2026-06-23)
+
+### Correcciones
+
+* Se corrigió un problema en el componente de selección de opciones que impedía mostrar correctamente los mensajes de error de validación. [#827](https://github.com/widergy/Energy-UI/pull/827) [OUG-999](https://widergy.atlassian.net/browse/OUG-999)
+
+### Novedades y Mejoras
+
+* Mejoras internas de la plataforma. [`accb722`](https://github.com/widergy/Energy-UI/commit/accb722)
 
 # [3.171.0](https://github.com/widergy/energy-ui/compare/v3.170.0...v3.171.0) (2026-06-22)
 

package/dist/components/UTBanner/stories/UTBanner.stories.js

@@ -66,7 +66,12 @@ var _default = exports.default = {
       description: 'Nombre del ícono (string) o componente React. Ej: "IconAlertCircle".'
     },
     iconProps: {
-      control: false
+      control: false,
+      description: 'Props adicionales que se pasan al componente Icon.'
+    },
+    classNames: {
+      control: false,
+      description: 'Clases CSS adicionales para personalizar el componente.'
     },
     onClose: {
       control: false
@@ -97,6 +102,16 @@ var _default = exports.default = {
     }
   },
   component: _.default,
+  parameters: {
+    controls: {
+      exclude: ['classNames']
+    },
+    docs: {
+      description: {
+        component: 'Componente para mostrar mensajes de notificación con soporte para icono, título, descripción, texto de ayuda, categoría y botones de acción. Soporta múltiples variantes de color y tamaño, y layouts horizontal y vertical.'
+      }
+    }
+  },
   title: 'Energy-UI/UTBanner'
 };
 const Playground = exports.Playground = {};

package/dist/components/UTBaseInputField/theme.js

@@ -37,6 +37,7 @@ const getBackgroundColor = _ref => {
   if (readOnly) return 'transparent';
   if (variant === 'gray') return theme.Palette.light['04'];
   if (variant === 'transparent' && error) return theme.Palette.error['01'];
+  if (variant === 'transparent') return 'transparent';
   if (disabled) return theme.Palette.light['03'];
   return theme.Palette.light['01'];
 };
@@ -141,22 +142,22 @@ const retrieveStyle = _ref4 => {
       borderWidth: '1px'
     },
     focusedRoot: {
-      backgroundColor: theme.Palette.light['01'],
+      backgroundColor: variant === 'transparent' ? theme.Palette.light['03'] : theme.Palette.light['01'],
       '&:hover': {
-        backgroundColor: theme.Palette.light['01']
+        backgroundColor: variant === 'transparent' ? theme.Palette.light['03'] : theme.Palette.light['01']
       }
     },
     withValueRoot: {
       ...(variant === 'transparent' && !error && {
-        backgroundColor: actionPalette['01']
+        backgroundColor: 'transparent'
       })
     },
     focusedInputContainer: {
-      ...(!error && {
+      ...(variant !== 'transparent' && !error && {
         borderColor: "".concat(actionPalette['04'], " !important"),
         borderWidth: '2px'
       }),
-      ...(error && {
+      ...(variant !== 'transparent' && error && {
         borderColor: "".concat(theme.Palette.error['04'], " !important")
       })
     },

package/dist/components/UTButton/styles.module.scss

@@ -40,13 +40,13 @@ $small-icon: var(--UT-button-icon-size-sm, 1.25rem);
 
 .smallChildrenContainer {
   @extend %childrenContainer;
-  grid-gap: var(--UT-button-gap-sm, 8px);
+  grid-gap: var(--UT-button-gap-sm, 0.5rem);
 }
 
 .largeChildrenContainer,
 .mediumChildrenContainer {
   @extend %childrenContainer;
-  grid-gap: var(--UT-button-gap-md, 8px);
+  grid-gap: var(--UT-button-gap-md, 0.5rem);
 }
 
 .loading {
@@ -54,15 +54,15 @@ $small-icon: var(--UT-button-icon-size-sm, 1.25rem);
 }
 
 .paddingLarge {
-  padding: var(--UT-button-padding-md, 12px) var(--UT-button-padding-lg, 16px);
+  padding: var(--UT-button-padding-md, 0.75rem) var(--UT-button-padding-lg, 1rem);
 }
 
 .paddingMedium {
-  padding: var(--UT-button-padding-sm, 8px) var(--UT-button-padding-md, 12px);
+  padding: var(--UT-button-padding-sm, 0.5rem) var(--UT-button-padding-md, 0.75rem);
 }
 
 .paddingSmall {
-  padding: var(--UT-button-padding-xs, 4px) var(--UT-button-padding-sm, 8px);
+  padding: var(--UT-button-padding-xs, 0.25rem) var(--UT-button-padding-sm, 0.5rem);
 }
 
 .hideTextOnResponsive {
@@ -74,33 +74,33 @@ $small-icon: var(--UT-button-icon-size-sm, 1.25rem);
 
   &.paddingLarge {
     @media #{$mobile} {
-      padding: var(--UT-button-padding-md, 12px);
+      padding: var(--UT-button-padding-md, 0.75rem);
     }
   }
 
   &.paddingMedium {
     @media #{$mobile} {
-      padding: var(--UT-button-padding-sm, 8px);
+      padding: var(--UT-button-padding-sm, 0.5rem);
     }
   }
 
   &.paddingSmall {
     @media #{$mobile} {
-      padding: var(--UT-button-padding-xs, 4px);
+      padding: var(--UT-button-padding-xs, 0.25rem);
     }
   }
 }
 
 .noChildren {
   &.paddingLarge {
-    padding: var(--UT-button-padding-md, 12px);
+    padding: var(--UT-button-padding-md, 0.75rem);
   }
 
   &.paddingMedium {
-    padding: var(--UT-button-padding-sm, 8px);
+    padding: var(--UT-button-padding-sm, 0.5rem);
   }
 
   &.paddingSmall {
-    padding: var(--UT-button-padding-xs, 4px);
+    padding: var(--UT-button-padding-xs, 0.25rem);
   }
 }

package/dist/components/UTButton/theme.js

@@ -113,7 +113,7 @@ const baseButtonTheme = theme => {
   var _theme$UTButton;
   return {
     root: {
-      borderRadius: 'var(--UT-button-radius, 4px)',
+      borderRadius: 'var(--UT-button-radius, 0.25rem)',
       boxShadow: 'none',
       minWidth: 'auto',
       textTransform: 'none',

package/dist/components/UTButtonGroup/styles.module.scss

@@ -8,7 +8,7 @@ $rounded-border-radius: 100px;
 
 .squareContainer {
   @extend %container;
-  border-radius: var(--UT-buttonGroup-radius, 8px);
+  border-radius: var(--UT-buttonGroup-radius, 0.5rem);
 
   & > button {
     border: none !important;

package/dist/components/UTCheckbox/versions/V1/theme.js

@@ -78,7 +78,10 @@ const conditionalStyles = _ref => {
     content: {
       ...(reversed && {
         flexDirection: 'row-reverse',
-        justifyContent: 'space-between'
+        justifyContent: 'space-between',
+        ...(variant === _constants.BUTTON_VARIANT && {
+          width: '100%'
+        })
       })
     },
     iconContainer: {

package/dist/components/UTDataCategory/styles.module.scss

@@ -7,7 +7,7 @@
   align-items: center;
   display: flex;
   flex-direction: row;
-  grid-gap: var(--UT-dataCategory-title-gap, 8px);
+  grid-gap: var(--UT-dataCategory-title-gap, 0.5rem);
   width: 100%;
 }
 

package/dist/components/UTDataCategory/theme.js

@@ -27,7 +27,7 @@ const retrieveStyle = _ref => {
   return {
     area: {
       ...areaBackgroundColor,
-      padding: 'var(--UT-dataCategory-padding, 16px)',
+      padding: 'var(--UT-dataCategory-padding, 1rem)',
       borderRadius: 8
     }
   };

package/dist/components/UTDataElement/index.js

@@ -100,7 +100,7 @@ const UTDataElement = _ref => {
   }, IconComponent && /*#__PURE__*/_react.default.createElement(IconComponent, _extends({
     name: Icon,
     colorTheme: "gray",
-    size: "var(--UT-dataElement-icon-size, 24px)"
+    size: "var(--UT-dataElement-icon-size, 1.5rem)"
   }, iconProps)), /*#__PURE__*/_react.default.createElement("div", {
     className: infoClasses
   }, (prefix || title || showBadge) && /*#__PURE__*/_react.default.createElement("div", {

package/dist/components/UTDataElement/styles.module.scss

@@ -4,13 +4,13 @@
 }
 
 .paddingSmall {
-  padding-bottom: var(--UT-dataElement-padding-sm, 8px);
-  padding-top: var(--UT-dataElement-padding-sm, 8px);
+  padding-bottom: var(--UT-dataElement-padding-sm, 0.5rem);
+  padding-top: var(--UT-dataElement-padding-sm, 0.5rem);
 }
 
 .paddingMedium {
-  padding-bottom: var(--UT-dataElement-padding-md, 16px);
-  padding-top: var(--UT-dataElement-padding-md, 16px);
+  padding-bottom: var(--UT-dataElement-padding-md, 1rem);
+  padding-top: var(--UT-dataElement-padding-md, 1rem);
 }
 
 .content {
@@ -25,31 +25,31 @@
 }
 
 .spacingSmall {
-  grid-gap: var(--UT-dataElement-gap-sm, 8px);
+  grid-gap: var(--UT-dataElement-gap-sm, 0.5rem);
 }
 
 .spacingMedium {
-  grid-gap: var(--UT-dataElement-gap-md, 16px);
+  grid-gap: var(--UT-dataElement-gap-md, 1rem);
 }
 
 .info {
   display: flex;
   flex: 1;
   flex-direction: row;
-  grid-gap: var(--UT-dataElement-content-gap-x, 8px);
+  grid-gap: var(--UT-dataElement-content-gap-x, 0.5rem);
   justify-content: space-between;
 }
 
 .vertical {
   flex-direction: column;
-  grid-gap: var(--UT-dataElement-content-gap-y, 8px);
+  grid-gap: var(--UT-dataElement-content-gap-y, 0.5rem);
 }
 
 .topInfo {
   align-items: center;
   display: flex;
   flex-direction: row;
-  grid-gap: var(--UT-dataElement-content-gap-x, 8px);
+  grid-gap: var(--UT-dataElement-content-gap-x, 0.5rem);
 }
 
 .iconCollapseButton {

package/dist/components/UTDatePicker/versions/V1/stories/UTDatePickerV1.stories.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.WithTitleRequired = exports.WithTitleAndError = exports.WithTitle = exports.WithRange = exports.WithHelpText = exports.TestSite = exports.Selected = exports.ReadOnlyEmpty = exports.ReadOnly = exports.Playground = exports.Focus = exports.Error = exports.Disabled = exports.Default = void 0;
+exports.default = exports.WithTitleRequired = exports.WithTitleAndError = exports.WithTitle = exports.WithRange = exports.WithHelpText = exports.TestSite = exports.Selected = exports.ReadOnlyEmpty = exports.ReadOnly = exports.Playground = exports.PickerVariant = exports.Focus = exports.Error = exports.Disabled = exports.Default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = require("prop-types");
 var _ = _interopRequireDefault(require("../../.."));
@@ -246,4 +246,62 @@ const WithTitleAndError = exports.WithTitleAndError = {
 };
 const TestSite = exports.TestSite = {
   render: () => /*#__PURE__*/_react.default.createElement(TestSiteStory, null)
+};
+const PickerVariant = exports.PickerVariant = {
+  name: 'Variant — Picker',
+  parameters: {
+    docs: {
+      description: {
+        story: 'Variante picker: fondo transparente en default, `light03` al hacer foco, sin borde. Ideal para usar sobre cards o fondos con color. Comparado con la variante select (fondo blanco con borde).'
+      }
+    }
+  },
+  render: () => /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      display: 'flex',
+      flexDirection: 'column',
+      gap: '2rem',
+      padding: '1rem'
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", {
+    style: {
+      fontSize: '0.7rem',
+      color: '#94a3b8',
+      fontFamily: 'monospace',
+      marginBottom: 4
+    }
+  }, "variant=select (default)"), /*#__PURE__*/_react.default.createElement(ControlledWrapper, {
+    variant: "select"
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      background: '#f1f5f9',
+      borderRadius: '0.5rem',
+      padding: '1rem'
+    }
+  }, /*#__PURE__*/_react.default.createElement("p", {
+    style: {
+      fontSize: '0.7rem',
+      color: '#94a3b8',
+      fontFamily: 'monospace',
+      marginBottom: 4
+    }
+  }, "variant=picker"), /*#__PURE__*/_react.default.createElement(ControlledWrapper, {
+    variant: "picker"
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      background: '#f1f5f9',
+      borderRadius: '0.5rem',
+      padding: '1rem'
+    }
+  }, /*#__PURE__*/_react.default.createElement("p", {
+    style: {
+      fontSize: '0.7rem',
+      color: '#94a3b8',
+      fontFamily: 'monospace',
+      marginBottom: 4
+    }
+  }, "variant=picker con valor seleccionado"), /*#__PURE__*/_react.default.createElement(ControlledWrapper, {
+    initialValue: "15/06/2024",
+    variant: "picker"
+  })))
 };

package/dist/components/UTLabel/UTLabel.stories.js

@@ -3,7 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.Default = void 0;
+exports.default = exports.HeadingBlocks = exports.Default = void 0;
+var _react = _interopRequireDefault(require("react"));
 var _utils = require("stories/utils");
 var _Palette = require("../../constants/Palette");
 var _constants = require("./constants");
@@ -151,4 +152,83 @@ const Default = exports.Default = {
     shade: '05'
   },
   name: 'Playground'
+};
+const BODY_TEXT = 'El sistema de diseño provee tokens de tipografía que garantizan consistencia visual en todos los productos. Cada nivel de heading tiene un line-height proporcional a su tamaño para una lectura cómoda.';
+const SMALL_TEXT = 'Los valores de consumo se actualizan cada 15 minutos y se almacenan durante 24 meses para análisis histórico.';
+const XSMALL_TEXT = 'Última actualización: 26/05/2026 · Fuente: medidor digital · ID lectura: 00487-A';
+const HEADINGS = [{
+  variant: 'title1',
+  label: 'Title 1 — H1',
+  heading: 'Gestión de energía para utilities modernas que operan en múltiples regiones del país'
+}, {
+  variant: 'title2',
+  label: 'Title 2 — H2',
+  heading: 'Seguimiento de consumo en tiempo real con integración a sistemas de medición inteligente'
+}, {
+  variant: 'title3',
+  label: 'Title 3 — H3',
+  heading: 'Configuración de alertas, notificaciones y umbrales de consumo por categoría de usuario'
+}, {
+  variant: 'subtitle1',
+  label: 'Subtitle 1 — H4',
+  heading: 'Parámetros de medición avanzada para clientes residenciales de alta demanda energética'
+}, {
+  variant: 'subtitle2',
+  label: 'Subtitle 2 — H5',
+  heading: 'Detalles del período de facturación correspondiente al bimestre actual del servicio eléctrico'
+}];
+const HeadingBlocks = exports.HeadingBlocks = {
+  name: 'Bloques heading + texto',
+  parameters: {
+    docs: {
+      description: {
+        story: 'Cada categoría de heading junto a párrafos de body, small y xsmall para verificar jerarquía y line-height.'
+      }
+    }
+  },
+  render: () => {
+    const pageStyle = {
+      display: 'flex',
+      flexDirection: 'column',
+      gap: '3rem',
+      maxWidth: '560px',
+      padding: '2rem'
+    };
+    const blockStyle = {
+      display: 'flex',
+      flexDirection: 'column',
+      gap: '0.75rem',
+      borderLeft: '3px solid #e2e8f0',
+      paddingLeft: '1rem'
+    };
+    const chipStyle = {
+      fontSize: '0.7rem',
+      color: '#94a3b8',
+      fontFamily: 'monospace',
+      marginBottom: '0.25rem'
+    };
+    return /*#__PURE__*/_react.default.createElement("div", {
+      style: pageStyle
+    }, HEADINGS.map(_ref => {
+      let {
+        variant,
+        label,
+        heading
+      } = _ref;
+      return /*#__PURE__*/_react.default.createElement("div", {
+        key: variant,
+        style: blockStyle
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        style: chipStyle
+      }, label), /*#__PURE__*/_react.default.createElement(_.default, {
+        variant: variant
+      }, heading), /*#__PURE__*/_react.default.createElement(_.default, {
+        variant: "small"
+      }, BODY_TEXT), /*#__PURE__*/_react.default.createElement(_.default, {
+        variant: "small"
+      }, SMALL_TEXT), /*#__PURE__*/_react.default.createElement(_.default, {
+        variant: "xsmall"
+      }, XSMALL_TEXT));
+    }));
+  }
 };

package/dist/components/UTLabel/constants.js

@@ -42,16 +42,16 @@ const VARIANTS_SIZES = exports.VARIANTS_SIZES = {
   [VARIANTS_NAMES.TD]: 'var(--UT-label-size-body, 1rem)'
 };
 const VARIANTS_LINE_HEIGHT = exports.VARIANTS_LINE_HEIGHT = {
-  [VARIANTS_NAMES.TITLE1]: 'var(--UT-label-lh-heading, 100%)',
-  [VARIANTS_NAMES.TITLE2]: 'var(--UT-label-lh-heading, 100%)',
-  [VARIANTS_NAMES.TITLE3]: 'var(--UT-label-lh-heading, 100%)',
-  [VARIANTS_NAMES.SUBTITLE1]: 'var(--UT-label-lh-heading, 100%)',
-  [VARIANTS_NAMES.SUBTITLE2]: 'var(--UT-label-lh-body, 1.375rem)',
-  [VARIANTS_NAMES.BODY]: 'var(--UT-label-lh-body, 1.375rem)',
-  [VARIANTS_NAMES.SMALL]: 'var(--UT-label-lh-small, 1.25rem)',
-  [VARIANTS_NAMES.XSMALL]: 'var(--UT-label-lh-xsmall, 1.125rem)',
-  [VARIANTS_NAMES.TH]: 'var(--UT-label-lh-body, 1.375rem)',
-  [VARIANTS_NAMES.TD]: 'var(--UT-label-lh-body, 1.375rem)'
+  [VARIANTS_NAMES.TITLE1]: 'var(--UT-label-lh-heading, 1.2)',
+  [VARIANTS_NAMES.TITLE2]: 'var(--UT-label-lh-heading, 1.2)',
+  [VARIANTS_NAMES.TITLE3]: 'var(--UT-label-lh-heading, 1.2)',
+  [VARIANTS_NAMES.SUBTITLE1]: 'var(--UT-label-lh-subheading, 1.4)',
+  [VARIANTS_NAMES.SUBTITLE2]: 'var(--UT-label-lh-subheading, 1.4)',
+  [VARIANTS_NAMES.BODY]: 'var(--UT-label-lh-body, 1.4)',
+  [VARIANTS_NAMES.SMALL]: 'var(--UT-label-lh-small, 1.4)',
+  [VARIANTS_NAMES.XSMALL]: 'var(--UT-label-lh-xsmall, 1.5)',
+  [VARIANTS_NAMES.TH]: 'var(--UT-label-lh-body, 1.4)',
+  [VARIANTS_NAMES.TD]: 'var(--UT-label-lh-body, 1.4)'
 };
 const WEIGHTS = exports.WEIGHTS = {
   thin: 'var(--UT-label-weight-thin, 100)',

package/dist/components/UTLabel/theme.js

@@ -71,7 +71,7 @@ const retrieveStyle = _ref2 => {
       '& h1, & h2, & h3, & h4, & h5, & h6': {
         color: darkTextColor,
         fontWeight: _constants.WEIGHTS.medium,
-        lineHeight: 'var(--UT-label-lh-heading, 1)',
+        lineHeight: 'var(--UT-label-lh-heading, 1.2)',
         margin: '0 0 var(--UT-label-markdown-margin-md, 8px) 0'
       },
       '& h1': {
@@ -127,9 +127,9 @@ const retrieveStyle = _ref2 => {
       },
       '& pre': {
         backgroundColor: theme.Palette[_Palette.COLOR_THEMES.light][_Palette.COLOR_SHADES.shade03],
-        borderRadius: 'var(--UT-radius-md, 8px)',
+        borderRadius: 'var(--UT-radius-md, 0.5rem)',
         fontSize: 'var(--UT-label-size-small, 0.875em)',
-        lineHeight: 'var(--UT-label-lh-small, 1.25em)',
+        lineHeight: 'var(--UT-label-lh-small, 1.4)',
         margin: '0 0 var(--UT-label-markdown-margin-xl, 24px) 0',
         padding: 'var(--UT-label-markdown-padding-sm, 12px) var(--UT-label-markdown-padding-md, 16px)',
         whiteSpace: 'pre-wrap'
@@ -176,7 +176,7 @@ const retrieveStyle = _ref2 => {
         fontSize: 'var(--UT-label-size-xsmall, 0.75em)'
       },
       '& img, & video, & audio': {
-        borderRadius: 'var(--UT-radius-md, 8px)',
+        borderRadius: 'var(--UT-radius-md, 0.5rem)',
         margin: '0 0 var(--UT-label-markdown-margin-xl, 24px) 0'
       },
       '& .contains-task-list': {

package/dist/components/UTMap/components/GoogleMaps/constants.js

@@ -3,12 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.polygonDefaultOptions = exports.googleMapDefaultOptions = void 0;
+exports.polygonDefaultOptions = exports.googleMapDefaultOptions = exports.MARKER_Z_INDEX = void 0;
 var _colorsModule = _interopRequireDefault(require("../../../../scss/variables/colors.module.scss"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const googleMapDefaultOptions = exports.googleMapDefaultOptions = {
   mapTypeControl: false
 };
+const MARKER_Z_INDEX = exports.MARKER_Z_INDEX = {
+  selected: 1000,
+  default: 1
+};
 const polygonDefaultOptions = (colorPolygon, colorBorderPolygon) => ({
   strokeWeight: 2,
   strokeOpacity: 0.8,

package/dist/components/UTMap/components/GoogleMaps/index.js

@@ -79,7 +79,8 @@ class GoogleMaps extends _react.PureComponent {
       return /*#__PURE__*/_react.default.createElement(_reactGoogleMaps.Marker, _extends({}, marker, {
         key: marker.key,
         onRightClick: this.handleMarkerRightClick,
-        onClick: markerData => this.handleMarkerClick(markerData, marker)
+        onClick: markerData => this.handleMarkerClick(markerData, marker),
+        zIndex: selected ? _constants.MARKER_Z_INDEX.selected : _constants.MARKER_Z_INDEX.default
       }, MultipleMarkersIcon && !singleMarker && {
         icon: MultipleMarkersIcon(label, selected),
         label: undefined