@widergy/energy-ui 3.168.0 → 3.170.0

package/CHANGELOG.md

@@ -1,16 +1,30 @@
-# [3.168.0](https://github.com/widergy/energy-ui/compare/v3.167.1...v3.168.0) (2026-06-18)
+# [3.170.0](https://github.com/widergy/energy-ui/compare/v3.169.0...v3.170.0) (2026-06-22)
 
 
 ### Features
 
-* [CX-2398] new ut loading version ([#815](https://github.com/widergy/energy-ui/issues/815)) ([b115b7e](https://github.com/widergy/energy-ui/commit/b115b7ecabd6e84e4917381f0d7876207602ffae))
+* [AXCH-1778] test id support for utdotmenu ([#823](https://github.com/widergy/energy-ui/issues/823)) ([76d71f4](https://github.com/widergy/energy-ui/commit/76d71f4befad18fa1da9c43533cc53b95e3c673c))
 
-## [3.167.1](https://github.com/widergy/energy-ui/compare/v3.167.0...v3.167.1) (2026-06-18)
+# [3.169.0](https://github.com/widergy/energy-ui/compare/v3.168.0...v3.169.0) (2026-06-18)
 
+### Novedades y Mejoras
 
-### Bug Fixes
+* El selector desplegable ahora permite personalizar cómo se ve cada opción de la lista, tanto en modo de selección única como múltiple. [#821](https://github.com/widergy/Energy-UI/pull/821) [AXCH-1774](https://widergy.atlassian.net/browse/AXCH-1774)
+
+# [3.168.0](https://github.com/widergy/energy-ui/compare/v3.167.1...v3.168.0) (2026-06-18)
+
+### Novedades y Mejoras
+
+* Se incorpora una nueva experiencia visual de carga: un indicador animado moderno que utiliza los colores e identidad propios de cada cliente, con efecto de brillo y logo centrado. La experiencia anterior se mantiene activa por defecto, garantizando que ningún flujo existente se vea afectado. [#815](https://github.com/widergy/Energy-UI/pull/815) [CX-2398](https://widergy.atlassian.net/browse/CX-2398)
+* Durante la carga de secciones de la aplicación, el nuevo indicador visual ya puede mostrarse en pantalla completa o adaptado al contenedor, según el contexto de navegación. [#815](https://github.com/widergy/Energy-UI/pull/815) [CX-2398](https://widergy.atlassian.net/browse/CX-2398)
+* Las vistas principales de la aplicación —resumen de cuentas, perfil de usuario, listado de cuentas, trámites, estado de corte, consumo, historial, atención al cliente y facturas— fueron actualizadas para aprovechar la nueva experiencia de carga cuando está habilitada. [#815](https://github.com/widergy/Energy-UI/pull/815) [CX-2398](https://widergy.atlassian.net/browse/CX-2398)
+* El resumen de factura inteligente incorpora soporte para la nueva experiencia de carga, manteniendo compatibilidad total con la versión anterior. [#815](https://github.com/widergy/Energy-UI/pull/815) [CX-2398](https://widergy.atlassian.net/browse/CX-2398)
+
+## [3.167.1](https://github.com/widergy/energy-ui/compare/v3.167.0...v3.167.1) (2026-06-18)
+
+### Correcciones
 
-* multiple fixes ([#822](https://github.com/widergy/energy-ui/issues/822)) ([c6ce17d](https://github.com/widergy/energy-ui/commit/c6ce17d96fc15531bbde7a390960bcf22e709da4))
+* Mejoras internas de la plataforma. [#822](https://github.com/widergy/Energy-UI/pull/822) [`28c89f8`](https://github.com/widergy/Energy-UI/commit/28c89f8) [CX-9999](https://widergy.atlassian.net/browse/CX-9999)
 
 # [3.167.0](https://github.com/widergy/energy-ui/compare/v3.166.1...v3.167.0) (2026-06-17)
 

package/dist/components/UTDotMenu/index.js

@@ -20,6 +20,7 @@ const UTDotMenu = _ref => {
   let {
     className,
     classNames = _constants.DEFAULT_PROPS.classNames,
+    dataTestId,
     disabled,
     Icon = _constants.DEFAULT_PROPS.Icon,
     menuItemProps,
@@ -29,12 +30,14 @@ const UTDotMenu = _ref => {
   } = _ref;
   const [anchorEl, setAnchorEl] = (0, _react.useState)(null);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: className
+    className: className,
+    "data-testid": dataTestId
   }, /*#__PURE__*/_react.default.createElement(_UTButton.default, {
     classNames: {
       icon: classNames.icon,
       root: classNames.button
     },
+    dataTestId: dataTestId ? "".concat(dataTestId, ".button") : undefined,
     disabled: disabled,
     Icon: Icon,
     onClick: event => setAnchorEl(event.currentTarget),
@@ -52,15 +55,18 @@ const UTDotMenu = _ref => {
       },
       ...(menuProps === null || menuProps === void 0 ? void 0 : menuProps.PaperProps)
     }
-  }), options.map(option => {
+  }), options.map((option, index) => {
     const {
       colorTheme,
+      dataTestId: optionTestId,
       icon,
       iconProps,
       name,
       onPress
     } = option;
+    const itemTestId = optionTestId !== null && optionTestId !== void 0 ? optionTestId : dataTestId ? "".concat(dataTestId, ".").concat(index) : undefined;
     return /*#__PURE__*/_react.default.createElement(_MenuItem.default, _extends({
+      "data-testid": itemTestId,
       key: name,
       onClick: onPress
     }, menuItemProps), icon && /*#__PURE__*/_react.default.createElement(_UTIcon.default, _extends({
@@ -78,12 +84,14 @@ UTDotMenu.propTypes = {
     button: _propTypes.string,
     icon: _propTypes.string
   }),
+  dataTestId: _propTypes.string,
   disabled: _propTypes.bool,
   Icon: (0, _propTypes.oneOfType)([_propTypes.elementType, _propTypes.string]),
   menuItemProps: _propTypes.object,
   menuProps: _propTypes.object,
   options: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
     colorTheme: _propTypes.string,
+    dataTestId: _propTypes.string,
     icon: _propTypes.string,
     iconProps: _propTypes.object,
     name: _propTypes.string,

package/dist/components/UTDotMenu/stories/UTDotMenu.stories.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.Small = exports.Playground = exports.IconoPersonalizado = exports.Default = exports.ConIconos = exports.ConIconProps = exports.BotonDeshabilitado = exports.AccionDestructiva = void 0;
+exports.default = exports.Small = exports.Playground = exports.IconoPersonalizado = exports.Default = exports.ConTestIds = exports.ConIconos = exports.ConIconProps = exports.BotonDeshabilitado = exports.AccionDestructiva = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _ = _interopRequireDefault(require(".."));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -50,6 +50,18 @@ var _default = exports.default = {
         }
       }
     },
+    dataTestId: {
+      control: 'text',
+      description: 'Test id del contenedor raíz. El botón trigger recibe automáticamente el valor de esta prop con el sufijo `.button`. ' + 'Cada ítem del menú usa su propio `dataTestId` directamente (sin concatenación con el contenedor).',
+      table: {
+        defaultValue: {
+          summary: 'undefined'
+        },
+        type: {
+          summary: 'string'
+        }
+      }
+    },
     classNames: {
       control: false,
       description: 'Clases personalizadas para el botón trigger. Acepta `button` e `icon`.',
@@ -112,13 +124,13 @@ var _default = exports.default = {
     },
     options: {
       control: false,
-      description: 'Array de opciones del menú. Cada opción puede incluir `icon`, `colorTheme` e `iconProps` para pasar props extra a UTIcon.',
+      description: 'Array de opciones del menú. Cada opción puede incluir `icon`, `colorTheme`, `iconProps` para props extra a UTIcon, ' + 'y `dataTestId` para identificar el ítem. El test id del ítem se usa directamente tal como se provee en la opción.',
       table: {
         defaultValue: {
           summary: 'undefined'
         },
         type: {
-          summary: 'arrayOf(shape({ name, onPress, colorTheme?, icon?, iconProps? }))'
+          summary: 'arrayOf(shape({ name, onPress, colorTheme?, dataTestId?, icon?, iconProps? }))'
         }
       }
     },
@@ -262,6 +274,33 @@ const ConIconProps = exports.ConIconProps = {
     }
   }
 };
+const ConTestIds = exports.ConTestIds = {
+  args: {
+    dataTestId: 'section.dotMenu',
+    options: [{
+      name: 'Editar',
+      icon: 'IconPencil',
+      dataTestId: 'section.dotMenu.edit'
+    }, {
+      name: 'Duplicar',
+      icon: 'IconCopy',
+      dataTestId: 'section.dotMenu.duplicate'
+    }, {
+      name: 'Eliminar',
+      icon: 'IconTrash',
+      colorTheme: 'error',
+      dataTestId: 'section.dotMenu.delete'
+    }]
+  },
+  name: 'Con test ids',
+  parameters: {
+    docs: {
+      description: {
+        story: 'El contenedor recibe `dataTestId="section.dotMenu"` y el botón trigger recibe `"section.dotMenu.button"` automáticamente. ' + 'Cada ítem usa su propio `dataTestId` tal como se provee, sin concatenación con el contenedor.'
+      }
+    }
+  }
+};
 const BotonDeshabilitado = exports.BotonDeshabilitado = {
   args: {
     disabled: true,

package/dist/components/UTSelect/versions/V1/README.md

@@ -14,6 +14,7 @@
 | autocompleteProps     | object                     | {}                                     | Additional props to pass to the underlying Material-UI Autocomplete component.                                                               |
 | className             | string                     |                                        | Additional CSS class name for the component container.                                                                                       |
 | clearable             | bool                       | true                                   | Determines whether a button to clear the current selection should be shown.                                                                  |
+| CustomRow             | elementType                |                                        | Custom React component to render each option row. Receives `{ item, isChecked }` as props, where `item` is the option object and `isChecked` indicates if the option is selected. |
 | dataTestId            | string                     |                                        | Test ID for the main input component.                                                                                                        |
 | disabled              | bool                       | false                                  | Disables the select input.                                                                                                                   |
 | disableFilterOptions  | bool                       | false                                  | Disables option filtering, showing all options even when typing in the search field.                                                         |
@@ -231,6 +232,40 @@ const ReadOnlyExample = () => {
 };
 ```
 
+### With Custom Row Renderer
+
+```jsx
+import React, { useState } from 'react';
+import UTSelect from './UTSelect';
+
+const options = [
+  { name: 'Alice', value: '1', subtitle: 'Admin' },
+  { name: 'Bob', value: '2', subtitle: 'Editor' },
+  { name: 'Carol', value: '3', subtitle: 'Viewer' }
+];
+
+const MyCustomRow = ({ item, isChecked }) => (
+  <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>
+    <span style={{ fontWeight: isChecked ? 'bold' : 'normal' }}>{item.name}</span>
+    <span style={{ color: 'gray', fontSize: 12 }}>{item.subtitle}</span>
+  </div>
+);
+
+const CustomRowExample = () => {
+  const [value, setValue] = useState(null);
+
+  return (
+    <UTSelect
+      CustomRow={MyCustomRow}
+      onChange={setValue}
+      options={options}
+      placeholder="Select a user"
+      value={value}
+    />
+  );
+};
+```
+
 ### With Search Term Handling
 
 ```jsx

package/dist/components/UTSelect/versions/V1/UTSelectV1.mdx

@@ -0,0 +1,13 @@
+import { ArgTypes, Canvas, Description, Meta, Title } from '@storybook/blocks';
+
+import * as UTSelectV1Stories from './UTSelectV1.stories.js';
+
+<Meta of={UTSelectV1Stories} />
+
+<Title>UTSelect V1</Title>
+
+<Description of={UTSelectV1Stories} />
+
+<Canvas of={UTSelectV1Stories.Playground} withToolbar />
+
+<ArgTypes exclude={['classes']} />