@widergy/energy-ui 3.158.1 → 3.160.0

package/CHANGELOG.md

@@ -1,9 +1,23 @@
-## [3.158.1](https://github.com/widergy/energy-ui/compare/v3.158.0...v3.158.1) (2026-06-01)
+# [3.160.0](https://github.com/widergy/energy-ui/compare/v3.159.0...v3.160.0) (2026-06-02)
 
 
-### Bug Fixes
+### Features
+
+* [AXCH-1489] second icon in ut button ([#805](https://github.com/widergy/energy-ui/issues/805)) ([a66bfc8](https://github.com/widergy/energy-ui/commit/a66bfc86748b07e516e5e5b53c2a08dcf3268d74))
+
+# [3.159.0](https://github.com/widergy/energy-ui/compare/v3.158.1...v3.159.0) (2026-06-01)
+
+### Novedades y Mejoras
+
+* Se optimizó el tamaño de la aplicación: ahora solo se cargan los recursos necesarios según lo que cada pantalla utiliza, lo que mejora los tiempos de carga y el rendimiento general. [#801](https://github.com/widergy/Energy-UI/pull/801) [AXAG-276](https://widergy.atlassian.net/browse/AXAG-276)
+* Los íconos de banderas se cargan de forma inteligente bajo demanda, evitando descargas innecesarias y reduciendo el consumo de datos. [#801](https://github.com/widergy/Energy-UI/pull/801) [AXAG-276](https://widergy.atlassian.net/browse/AXAG-276)
+* Mejoras internas de la plataforma. [#801](https://github.com/widergy/Energy-UI/pull/801) [AXAG-276](https://widergy.atlassian.net/browse/AXAG-276)
+
+## [3.158.1](https://github.com/widergy/energy-ui/compare/v3.158.0...v3.158.1) (2026-06-01)
+
+### Correcciones
 
-* moved components to deprecated ([#802](https://github.com/widergy/energy-ui/issues/802)) ([b305c18](https://github.com/widergy/energy-ui/commit/b305c185d5066725f09ed5a3b321a1feb12dcd02))
+* Mejoras internas de la plataforma. [#802](https://github.com/widergy/Energy-UI/pull/802) [`650c988`](https://github.com/widergy/Energy-UI/commit/650c988) [OUG-999](https://widergy.atlassian.net/browse/OUG-999)
 
 # [3.158.0](https://github.com/widergy/energy-ui/compare/v3.157.1...v3.158.0) (2026-05-19)
 

package/dist/components/UTButton/README.md

@@ -17,12 +17,16 @@ All these variants are defined in the component theme.
 
 ### Color Themes
 
-The color themes are defined by the component consumer and will vary accordingly.They define a set of variables (colors and opacities) that then combined with the variant will change how the buttons looks.
-The components supports an infinite amount of color themes but requieres the consumer to pass at least a `primary` one that works as a default.
+The color themes are defined by the component consumer and will vary accordingly. They define a set of variables (colors and opacities) that then combined with the variant will change how the button looks.
+The components supports an infinite amount of color themes but requires the consumer to pass at least a `primary` one that works as a default.
 
-### Icon
+### Icons
 
-The button can include an icon, which can be either from the Tabler Icons library or a custom SVG rendered as a React component. If using an icon from the Tabler Icons library, you should provide the name of the icon. Alternatively, a custom SVG can be passed directly to the component.
+The button can include up to two icons (left and right), each of which can be either a Tabler Icons name or a custom SVG React component.
+
+- **`LeftIcon`:** rendered at the start of the button content.
+- **`RightIcon`:** rendered at the end of the button content.
+- Additional props for each icon can be passed via `leftIconProps` and `rightIconProps`.
 
 ### Props
 
@@ -34,9 +38,14 @@ The button can include an icon, which can be either from the Tabler Icons librar
 | onClick              | func                                                  |           | Callback fired when the user clicks the component.                             |
 | loading              | bool                                                  | false     | If `true` a spinner is shown over the component.                               |
 | disabled             | bool                                                  | false     | If `true` the button is unclickable.                                           |
-| Icon                 | node \| string                                        |           | An Icon component that can be displayed within the button.                     |
-| iconPlacement        | 'left' \| 'right'                                     | 'left'    | Indicates where the icon is placed in relation with the contents of the button |
-| showTextOnResponsive | bool                                                  | false     | If `true` and Icon is not `null` the contents of the button are not displayed. |
-| type                 | 'string'                                              |           | HTML type attribute.                                                           |
+| LeftIcon             | node \| string                                        |           | Icon rendered at the start of the button.                                      |
+| leftIconProps        | object                                                |           | Additional props to apply to the left icon.                                    |
+| RightIcon            | node \| string                                        |           | Icon rendered at the end of the button.                                        |
+| rightIconProps       | object                                                |           | Additional props to apply to the right icon.                                   |
+| hideTextOnResponsive | bool                                                  | false     | If `true` and an icon is present, the button text is hidden on mobile.         |
+| count                | number                                                |           | Number to display in a badge inside the button.                                |
+| type                 | string                                                |           | HTML type attribute.                                                           |
 | classNames           | object                                                |           | Overrides the default button theme.                                            |
 | children             | node                                                  |           | The component contents.                                                        |
+| Icon                 | node \| string                                        |           | **Deprecated.** Use `LeftIcon` or `RightIcon` instead.                        |
+| iconPlacement        | 'left' \| 'right'                                     | 'left'    | **Deprecated.** Use `LeftIcon` or `RightIcon` instead.                        |

package/dist/components/UTButton/index.js

@@ -32,8 +32,12 @@ const UTButton = _ref => {
     hideTextOnResponsive,
     Icon,
     iconPlacement,
+    LeftIcon,
+    leftIconProps,
     loading,
     onClick,
+    RightIcon,
+    rightIconProps,
     size,
     type,
     variant
@@ -47,27 +51,33 @@ const UTButton = _ref => {
     ...materialButtonClasses
   } = classes;
   const {
-    IconComponent,
-    ...iconProps
+    LeftIconComponent,
+    leftIconProps: leftIconBaseProps,
+    RightIconComponent,
+    rightIconProps: rightIconBaseProps
   } = (0, _react.useMemo)(() => (0, _utils.getIconProps)({
     className: icon,
     colorTheme,
     hasContent: !!children,
     hideTextOnResponsive,
     Icon,
+    iconPlacement,
+    LeftIcon,
+    RightIcon,
     size,
     variant
-  }), [colorTheme, children, hideTextOnResponsive, icon, Icon, size, variant]);
-  const IconToShow = IconComponent && /*#__PURE__*/_react.default.createElement(IconComponent, iconProps);
+  }), [colorTheme, children, hideTextOnResponsive, icon, Icon, iconPlacement, LeftIcon, RightIcon, size, variant]);
+  const LeftIconToShow = LeftIconComponent && /*#__PURE__*/_react.default.createElement(LeftIconComponent, _extends({}, leftIconBaseProps, leftIconProps));
+  const RightIconToShow = RightIconComponent && /*#__PURE__*/_react.default.createElement(RightIconComponent, _extends({}, rightIconBaseProps, rightIconProps));
   const counterColorTheme = (0, _utils.getCounterColorTheme)(colorTheme, variant);
   const labelProps = (0, _utils.getLabelProps)(colorTheme, variant, size);
   const RenderedChildren = /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(childrenContainer, " ").concat(_stylesModule.default["".concat(size, "ChildrenContainer")])
   }, count && /*#__PURE__*/_react.default.createElement(_UTBadge.default, {
     colorTheme: counterColorTheme
-  }, count), iconPlacement === _constants.ICON_PLACEMENTS.left && IconToShow, children !== null && children !== undefined && children !== false && /*#__PURE__*/_react.default.createElement(_UTLabel.default, _extends({}, labelProps, {
+  }, count), LeftIconToShow, children !== null && children !== undefined && children !== false && /*#__PURE__*/_react.default.createElement(_UTLabel.default, _extends({}, labelProps, {
     className: "".concat(_stylesModule.default.textContainer, " ").concat(textClassName)
-  }), children), iconPlacement !== _constants.ICON_PLACEMENTS.left && IconToShow);
+  }), children), RightIconToShow);
   return /*#__PURE__*/_react.default.createElement(_Button.default, {
     classes: materialButtonClasses,
     className: "\n        ".concat(_stylesModule.default["padding".concat((0, _componentUtils.capitalize)(size))], "\n        ").concat(hideTextOnResponsive && _stylesModule.default.hideTextOnResponsive, "\n        ").concat(!hideTextOnResponsive && !children && _stylesModule.default.noChildren, "\n      "),
@@ -89,10 +99,20 @@ UTButton.propTypes = {
   dataTestId: _propTypes.string,
   disabled: _propTypes.bool,
   hideTextOnResponsive: _propTypes.bool,
+  /**
+   * @deprecated Use LeftIcon or RightIcon instead.
+   */
   Icon: _propTypes.elementType,
+  /**
+   * @deprecated Use LeftIcon or RightIcon instead.
+   */
   iconPlacement: _propTypes.string,
+  LeftIcon: _propTypes.elementType,
+  leftIconProps: _propTypes.object,
   loading: _propTypes.bool,
   onClick: _propTypes.func,
+  RightIcon: _propTypes.elementType,
+  rightIconProps: _propTypes.object,
   size: _propTypes.string,
   type: _propTypes.string,
   variant: _propTypes.string

package/dist/components/UTButton/stories/UTButton.stories.js

@@ -14,8 +14,11 @@ var _default = exports.default = {
     children: undefined,
     classNames: undefined,
     count: undefined,
-    Icon: undefined,
+    LeftIcon: undefined,
+    leftIconProps: undefined,
     onClick: undefined,
+    RightIcon: undefined,
+    rightIconProps: undefined,
     ..._storiesConstants.COMMON_ARGS
   },
   argTypes: {

package/dist/components/UTButton/stories/UTButtonAdornments.stories.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.IconPlacementRight = exports.IconPlacementLeft = exports.IconOnly = exports.CountOnly = exports.CountAndIcon = void 0;
+exports.default = exports.RightIconOnly = exports.LeftIconOnly = exports.IconOnly = exports.CountOnly = exports.CountAndIcon = exports.BothIcons = void 0;
 var _ = _interopRequireDefault(require(".."));
 var _storiesConstants = require("./storiesConstants");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -20,29 +20,34 @@ var _default = exports.default = {
     ..._storiesConstants.COMMON_PARAMETERS
   }
 };
-const IconPlacementLeft = exports.IconPlacementLeft = {
+const LeftIconOnly = exports.LeftIconOnly = {
   args: {
-    children: 'Icon Placement Left',
-    Icon: 'IconArrowLeft',
-    iconPlacement: 'left'
+    children: 'Left Icon',
+    LeftIcon: 'IconArrowLeft'
   }
 };
-const IconPlacementRight = exports.IconPlacementRight = {
+const RightIconOnly = exports.RightIconOnly = {
   args: {
-    children: 'Icon Placement Right',
-    Icon: 'IconArrowRight',
-    iconPlacement: 'right'
+    children: 'Right Icon',
+    RightIcon: 'IconArrowRight'
+  }
+};
+const BothIcons = exports.BothIcons = {
+  args: {
+    children: 'Descargas',
+    LeftIcon: 'IconDownload',
+    RightIcon: 'IconChevronDown'
   }
 };
 const IconOnly = exports.IconOnly = {
   args: {
-    Icon: 'IconSearch'
+    LeftIcon: 'IconSearch'
   }
 };
 const CountAndIcon = exports.CountAndIcon = {
   args: {
     count: 7,
-    Icon: 'IconBell'
+    LeftIcon: 'IconBell'
   }
 };
 const CountOnly = exports.CountOnly = {

package/dist/components/UTButton/stories/storiesConstants.js

@@ -95,7 +95,7 @@ const COMMON_ARG_TYPES = exports.COMMON_ARG_TYPES = {
   },
   hideTextOnResponsive: {
     control: 'boolean',
-    description: 'Si es `true` y el icono no es `null`, el contenido del botón no se muestra en dispositivos móviles.',
+    description: 'Si es `true` y hay ícono, el contenido del botón no se muestra en dispositivos móviles.',
     table: {
       defaultValue: {
         summary: _constants.DEFAULT_PROPS.hideTextOnResponsive
@@ -105,9 +105,9 @@ const COMMON_ARG_TYPES = exports.COMMON_ARG_TYPES = {
       }
     }
   },
-  Icon: {
+  LeftIcon: {
     control: 'text',
-    description: 'Icono a mostrar en el botón. Puede ser un nombre de icono de Tabler o un componente personalizado.',
+    description: 'Ícono a mostrar al inicio del botón. Puede ser un nombre de icono de Tabler o un componente personalizado.',
     table: {
       defaultValue: {
         summary: 'undefined'
@@ -117,16 +117,15 @@ const COMMON_ARG_TYPES = exports.COMMON_ARG_TYPES = {
       }
     }
   },
-  iconPlacement: {
-    control: 'inline-radio',
-    description: 'Posición del icono en relación al contenido del botón.',
-    options: Object.values(_constants.ICON_PLACEMENTS),
+  leftIconProps: {
+    control: false,
+    description: 'Props adicionales a aplicar al ícono izquierdo.',
     table: {
       defaultValue: {
-        summary: _constants.DEFAULT_PROPS.iconPlacement
+        summary: 'undefined'
       },
       type: {
-        summary: (0, _utils.joinArgTypes)(Object.values(_constants.ICON_PLACEMENTS))
+        summary: 'object'
       }
     }
   },
@@ -154,6 +153,30 @@ const COMMON_ARG_TYPES = exports.COMMON_ARG_TYPES = {
       }
     }
   },
+  RightIcon: {
+    control: 'text',
+    description: 'Ícono a mostrar al final del botón. Puede ser un nombre de icono de Tabler o un componente personalizado.',
+    table: {
+      defaultValue: {
+        summary: 'undefined'
+      },
+      type: {
+        summary: (0, _utils.joinArgTypes)(['string', 'ReactComponent'])
+      }
+    }
+  },
+  rightIconProps: {
+    control: false,
+    description: 'Props adicionales a aplicar al ícono derecho.',
+    table: {
+      defaultValue: {
+        summary: 'undefined'
+      },
+      type: {
+        summary: 'object'
+      }
+    }
+  },
   size: {
     control: 'inline-radio',
     description: 'Tamaño del botón.',
@@ -200,7 +223,6 @@ const COMMON_ARGS = exports.COMMON_ARGS = {
   dataTestId: 'customButtonId',
   disabled: _constants.DEFAULT_PROPS.disabled,
   hideTextOnResponsive: _constants.DEFAULT_PROPS.hideTextOnResponsive,
-  iconPlacement: _constants.DEFAULT_PROPS.iconPlacement,
   loading: _constants.DEFAULT_PROPS.loading,
   size: _constants.DEFAULT_PROPS.size,
   type: 'button',

package/dist/components/UTButton/utils.js

@@ -11,24 +11,69 @@ var _constants = require("./constants");
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const getButtonElementColorTheme = (buttonColorTheme, buttonVariant) => buttonVariant === _constants.VARIANTS_NAMES.filled ? buttonColorTheme === _constants.COLORS_MAPPER.negative ? _Palette.COLOR_THEMES.neutral : _Palette.COLOR_THEMES.negative : _constants.COLORS_MAPPER[buttonColorTheme];
-const getIconProps = _ref => {
+const buildSingleIconProps = _ref => {
   let {
     className,
-    colorTheme: buttonColorTheme,
+    colorTheme,
     hasContent,
     hideTextOnResponsive,
     Icon,
     size,
-    variant: buttonVariant
+    variant
   } = _ref;
-  return Icon ? {
+  if (!Icon) return null;
+  return {
     IconComponent: (0, _componentUtils.isUTIcon)(Icon) ? _UTIcon.default : Icon,
-    className: "\n          ".concat(_stylesModule.default.baseIcon, "\n          ").concat(className, "\n          ").concat(hasContent ? _stylesModule.default.icon : _stylesModule.default["iconOnly".concat((0, _componentUtils.capitalize)(size))], "\n          ").concat(hideTextOnResponsive ? _stylesModule.default["adaptableIcon".concat((0, _componentUtils.capitalize)(size))] : '', "\n        "),
+    className: "\n      ".concat(_stylesModule.default.baseIcon, "\n      ").concat(className, "\n      ").concat(hasContent ? _stylesModule.default.icon : _stylesModule.default["iconOnly".concat((0, _componentUtils.capitalize)(size))], "\n      ").concat(hideTextOnResponsive ? _stylesModule.default["adaptableIcon".concat((0, _componentUtils.capitalize)(size))] : '', "\n    "),
     ...((0, _componentUtils.isUTIcon)(Icon) ? {
-      colorTheme: getButtonElementColorTheme(buttonColorTheme, buttonVariant),
+      colorTheme: getButtonElementColorTheme(colorTheme, variant),
       name: Icon
     } : {})
-  } : {};
+  };
+};
+const getIconProps = _ref2 => {
+  let {
+    className,
+    colorTheme,
+    hasContent,
+    hideTextOnResponsive,
+    Icon,
+    iconPlacement,
+    LeftIcon,
+    RightIcon,
+    size,
+    variant
+  } = _ref2;
+  const resolvedLeftIcon = LeftIcon || (iconPlacement !== _constants.ICON_PLACEMENTS.right ? Icon : undefined);
+  const resolvedRightIcon = RightIcon || (iconPlacement === _constants.ICON_PLACEMENTS.right ? Icon : undefined);
+  const commonParams = {
+    className,
+    colorTheme,
+    hasContent,
+    hideTextOnResponsive,
+    size,
+    variant
+  };
+  const {
+    IconComponent: LeftIconComponent,
+    ...leftIconProps
+  } = buildSingleIconProps({
+    ...commonParams,
+    Icon: resolvedLeftIcon
+  }) || {};
+  const {
+    IconComponent: RightIconComponent,
+    ...rightIconProps
+  } = buildSingleIconProps({
+    ...commonParams,
+    Icon: resolvedRightIcon
+  }) || {};
+  return {
+    LeftIconComponent: LeftIconComponent || null,
+    leftIconProps,
+    RightIconComponent: RightIconComponent || null,
+    rightIconProps
+  };
 };
 exports.getIconProps = getIconProps;
 const getLabelProps = (buttonColorTheme, buttonVariant, buttonSize) => ({

package/dist/components/UTCheckList/versions/V1/utils.js

@@ -4,14 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.isChecked = exports.getPropValueBasedOnVariant = exports.convertIfIsString = void 0;
-var _lodash = require("lodash");
+var _isString = _interopRequireDefault(require("lodash/isString"));
 var _constants = require("../../../UTCheckbox/versions/V1/constants");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const isChecked = (item, inputValue) => {
   var _inputValue$some;
   return (inputValue === null || inputValue === void 0 || (_inputValue$some = inputValue.some) === null || _inputValue$some === void 0 ? void 0 : _inputValue$some.call(inputValue, elem => elem === item.value)) || item.disabled && item.checked;
 };
 exports.isChecked = isChecked;
-const convertIfIsString = value => (0, _lodash.isString)(value) ? value.length === 0 ? [] : JSON.parse(value.replace(/'/g, '"')) : value;
+const convertIfIsString = value => (0, _isString.default)(value) ? value.length === 0 ? [] : JSON.parse(value.replace(/'/g, '"')) : value;
 exports.convertIfIsString = convertIfIsString;
 const getPropValueBasedOnVariant = (variant, prop, defaultValue) => {
   const defaultButtonProp = prop !== null && prop !== void 0 ? prop : defaultValue;

package/dist/components/UTIcon/UTIcon.stories.js

@@ -15,20 +15,16 @@ const ICON_EXAMPLES = ['IconHome', 'IconBolt', 'IconDroplet', 'IconCar', 'IconRe
 const ICON_FILLED_EXAMPLES = ['IconHomeFilled', 'IconBoltFilled', 'IconDropletFilled', 'IconCarFilled', 'IconReceiptFilled', 'IconArchiveFilled', 'IconUserFilled', 'IconBellFilled', 'IconInfoCircleFilled'];
 const ENERGY_ICON_EXAMPLES = ['EnergyIconBottledGas', 'EnergyIconBottledGasPlus', 'EnergyIconCar', 'EnergyIconCarbonFootprint', 'EnergyIconCart', 'EnergyIconChatSparkFilled', 'EnergyIconEdit', 'EnergyIconHome', 'EnergyIconMessageEdit', 'EnergyIconQuestionFilled', 'EnergyIconSendFilled', 'EnergyIconTruck', 'EnergyIconConsumptionBoxPlusFilled', 'EnergyIconConsumptionBoxRightFilled', 'EnergyIconConsumptionBoxMinusFilled'];
 const FLAG_EXAMPLES = [
-// South America
-'AR', 'BO', 'BR', 'CL', 'CO', 'EC', 'GY', 'PY', 'PE', 'SR', 'UY', 'VE',
-// North & Central America
-'CA', 'CR', 'CU', 'DO', 'GT', 'HN', 'JM', 'MX', 'NI', 'PA', 'PR', 'SV', 'US',
-// Europe
-'AL', 'AT', 'BE', 'BG', 'CH', 'CY', 'CZ', 'DE', 'DK', 'EE', 'ES', 'FI', 'FR', 'GB', 'GR', 'HR', 'HU', 'IE', 'IS', 'IT', 'LT', 'LU', 'LV', 'MT', 'NL', 'NO', 'PL', 'PT', 'RO', 'RS', 'SE', 'SI', 'SK', 'UA',
-// Africa
-'DZ', 'EG', 'ET', 'GH', 'KE', 'MA', 'NG', 'SN', 'ZA', 'TZ', 'UG', 'ZM', 'ZW',
-// Middle East
-'AE', 'IL', 'IQ', 'IR', 'JO', 'KW', 'LB', 'OM', 'QA', 'SA', 'SY', 'TR',
-// Asia
-'BD', 'CN', 'HK', 'ID', 'IN', 'JP', 'KH', 'KR', 'LA', 'MY', 'NP', 'PH', 'PK', 'SG', 'TH', 'TW', 'VN',
-// Oceania
-'AU', 'FJ', 'NZ', 'PG', 'WS'];
+// Sudamérica
+'AR', 'BO', 'BR', 'CL', 'CO', 'EC', 'GF', 'GY', 'PE', 'PY', 'SR', 'UY', 'VE',
+// Norteamérica
+'CA', 'GL', 'MX', 'PM', 'US',
+// Centroamérica
+'BZ', 'CR', 'GT', 'HN', 'NI', 'PA', 'SV',
+// Caribe
+'AG', 'AI', 'AW', 'BB', 'BL', 'BM', 'BS', 'CU', 'CW', 'DM', 'DO', 'GD', 'GP', 'HT', 'JM', 'KY', 'LC', 'MF', 'MQ', 'MS', 'PR', 'SX', 'TC', 'TT', 'VC', 'VG', 'VI',
+// España
+'ES'];
 var _default = exports.default = {
   component: _.default,
   argTypes: {

package/dist/components/UTIcon/components/FlagsIcons/flags/AG.svg

@@ -0,0 +1,15 @@
+<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_270_54945)">
+<rect width="16" height="12" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0H16V12H0V0Z" fill="#1B1B1B"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8 7L6.8874 8.89971L6.91529 6.80194L4.88255 8.12733L6.04542 6.24698L3.49516 6.73554L5.56268 5.44504L3 5L5.56268 4.55496L3.49516 3.26447L6.04542 3.75302L4.88255 1.87267L6.91529 3.19806L6.8874 1.10029L8 3L9.1126 1.10029L9.08471 3.19806L11.1174 1.87267L9.95458 3.75302L12.5048 3.26447L10.4373 4.55496L13 5L10.4373 5.44504L12.5048 6.73554L9.95458 6.24698L11.1174 8.12733L9.08471 6.80194L9.1126 8.89971L8 7Z" fill="#F9D313"/>
+<rect x="3" y="7" width="10" height="5" fill="#F1F9FF"/>
+<rect x="1" y="5" width="14" height="2" fill="#4A80E8"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 3L8 12L16 3V12H0V3Z" fill="#E31D1C"/>
+</g>
+<defs>
+<clipPath id="clip0_270_54945">
+<rect width="16" height="12" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/components/UTIcon/components/FlagsIcons/flags/AI.svg

@@ -0,0 +1,29 @@
+<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_270_54946)">
+<rect width="16" height="12" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V12H16V0H0Z" fill="#2E42A5"/>
+<g clip-path="url(#clip1_270_54946)">
+<rect width="9" height="7" fill="#2E42A5"/>
+<path d="M-1.00208 6.49993L0.9784 7.36853L9.045 0.944391L10.0897 -0.346375L7.97182 -0.636686L4.68165 2.13166L2.0334 3.99688L-1.00208 6.49993Z" fill="#F7FCFF"/>
+<path d="M-0.730957 7.10849L0.278004 7.61255L9.71451 -0.466309H8.29782L-0.730957 7.10849Z" fill="#F50100"/>
+<path d="M10.0022 6.49993L8.02172 7.36853L-0.0448761 0.944391L-1.08953 -0.346375L1.0283 -0.636686L4.31847 2.13166L6.96673 3.99688L10.0022 6.49993Z" fill="#F7FCFF"/>
+<path d="M9.93457 6.93667L8.92561 7.44073L4.90745 3.98176L3.71615 3.59529L-1.1901 -0.341973H0.226597L5.13009 3.50184L6.43256 3.96525L9.93457 6.93667Z" fill="#F50100"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.99226 0H3.99226V3H0V4H3.99226V7H4.99226V4H9V3H4.99226V0Z" fill="#F50100"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3.24226 -0.75H5.74226V2.25H9.75V4.75H5.74226V7.75H3.24226V4.75H-0.75V2.25H3.24226V-0.75ZM3.99226 3H0V4H3.99226V7H4.99226V4H9V3H4.99226V0H3.99226V3Z" fill="#F7FCFF"/>
+</g>
+<path d="M12.3702 10.5623C11.7672 10.5623 11.3617 10.424 11.0789 10.1955C10.7947 9.96593 10.6022 9.61948 10.4769 9.14018C10.3512 8.65895 10.2986 8.06518 10.279 7.36592C10.2652 6.87484 10.2677 6.34276 10.2705 5.77004C10.2713 5.60636 10.272 5.43936 10.2725 5.26904H14.5279C14.603 6.63976 14.6223 7.95176 14.3513 8.93551C14.2093 9.45075 13.9934 9.85343 13.684 10.1273C13.3793 10.397 12.9608 10.5623 12.3702 10.5623Z" fill="white" stroke="#E6E617" stroke-width="0.5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.2418 8.96726C10.2418 9.99832 11.0952 11.0164 12.3581 11.0164C13.6209 11.0164 14.5899 10.078 14.7053 8.93219L10.2418 8.96726Z" fill="#82E5FF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.8671 7.09995C10.8671 7.87408 11.5154 8.49995 12.3131 8.49995C13.1107 8.49995 13.7591 7.87408 13.7591 7.09995C13.7591 6.32582 13.1107 5.69995 12.3131 5.69995C11.5154 5.69995 10.8671 6.32582 10.8671 7.09995ZM13.1591 7.09995C13.1591 7.55098 12.7803 7.91662 12.3131 7.91662C11.8458 7.91662 11.4671 7.55098 11.4671 7.09995C11.4671 6.64892 11.8458 6.28328 12.3131 6.28328C12.7803 6.28328 13.1591 6.64892 13.1591 7.09995Z" fill="#E18600"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.069 5.50494C12.069 5.50494 11.5428 5.73699 11.657 6.17322C11.7712 6.60946 11.9002 6.67161 11.9002 6.67161C11.9002 6.67161 12.0861 5.72721 12.8366 5.72721L12.069 5.50494Z" fill="#E18600"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.1265 7.86197C11.1265 7.86197 11.5592 8.24083 11.9063 7.95296C12.2534 7.66509 12.2551 7.52186 12.2551 7.52186C12.2551 7.52186 11.3207 7.75252 11.0035 7.07234L11.1265 7.86197Z" fill="#E18600"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.7294 7.8044C13.7294 7.8044 13.7515 7.2297 13.3094 7.14112C12.8672 7.05254 12.7548 7.14129 12.7548 7.14129C12.7548 7.14129 13.5221 7.72235 13.1931 8.39689L13.7294 7.8044Z" fill="#E18600"/>
+</g>
+<defs>
+<clipPath id="clip0_270_54946">
+<rect width="16" height="12" fill="white"/>
+</clipPath>
+<clipPath id="clip1_270_54946">
+<rect width="9" height="7" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/components/UTIcon/components/FlagsIcons/flags/AR.svg

@@ -0,0 +1,20 @@
+<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_270_54951)">
+<rect width="16" height="12" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V12H16V0H0Z" fill="#F7FCFF"/>
+<mask id="mask0_270_54951" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="16" height="12">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V12H16V0H0Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_270_54951)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V4H16V0H0Z" fill="#58A5FF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 8V12H16V8H0Z" fill="#58A5FF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.27631 7.24358C8.27631 7.24358 7.76536 8.30294 7.31629 8.52013C7.51013 8.03425 7.58147 7.04288 7.58147 7.04288C7.58147 7.04288 6.41552 7.50515 6.00628 7.4209C6.49837 7.07703 7.18141 6.44012 7.18141 6.44012C7.18141 6.44012 5.6723 5.94675 5.70932 5.73678C6.39056 5.85898 7.32742 5.72577 7.32742 5.72577C7.32742 5.72577 6.26872 4.45615 6.37609 4.36173C6.53746 4.51859 7.80624 5.18135 7.80624 5.18135C7.80624 5.18135 7.89829 4.05175 8.17134 3.6709C8.20409 3.93974 8.58734 5.15692 8.58734 5.15692C8.58734 5.15692 9.35778 4.38603 9.7854 4.38603C9.59757 4.61892 9.15283 5.64189 9.15283 5.64189C9.15283 5.64189 10.2612 5.62444 10.6826 5.8319C10.1722 5.9045 9.27787 6.35346 9.27787 6.35346C9.27787 6.35346 10.4426 7.23697 10.3364 7.4209C9.71106 7.11499 8.98809 7.01254 8.98809 7.01254C8.98809 7.01254 9.18792 8.24207 9.02639 8.52013C8.86885 8.11082 8.27631 7.24358 8.27631 7.24358Z" fill="#FFD018" stroke="#F19900" stroke-opacity="0.98" stroke-width="0.25"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.20935 6.6709C8.48549 6.6709 8.70935 6.44704 8.70935 6.1709C8.70935 5.89476 8.48549 5.6709 8.20935 5.6709C7.93321 5.6709 7.70935 5.89476 7.70935 6.1709C7.70935 6.44704 7.93321 6.6709 8.20935 6.6709Z" fill="#FFD018" stroke="#F19900" stroke-opacity="0.98" stroke-width="0.25"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_270_54951">
+<rect width="16" height="12" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/components/UTIcon/components/FlagsIcons/flags/AW.svg

@@ -0,0 +1,19 @@
+<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_270_54952)">
+<rect width="16" height="12" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V12H16V0H0Z" fill="#5BA3DA"/>
+<mask id="mask0_270_54952" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="16" height="12">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V12H16V0H0Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_270_54952)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2.78037 4.28987L0.24231 3.53564L2.83672 2.79652L3.47009 0.436462L4.20131 2.86862L6.6006 3.51048L4.19422 4.23358L3.47605 6.55789L2.78037 4.28987Z" fill="#EF2929"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2.78037 4.28987L0.24231 3.53564L2.83672 2.79652L3.47009 0.436462L4.20131 2.86862L6.6006 3.51048L4.19422 4.23358L3.47605 6.55789L2.78037 4.28987Z" fill="#FF0000"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16.0002 7H0.00012207V8.00006H16.0002V7ZM16.0002 9.00004H0.00012207V10.0001H16.0002V9.00004Z" fill="#FAD615"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_270_54952">
+<rect width="16" height="12" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/components/UTIcon/components/FlagsIcons/flags/BB.svg

@@ -0,0 +1,14 @@
+<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_270_54979)">
+<rect width="16" height="12" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11 0H16V12H11V0Z" fill="#2E42A5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M5 0H11V12H5V0Z" fill="#FECA00"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0H5V12H0V0Z" fill="#2E42A5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.21711 7.63651C9.53351 6.982 9.8985 5.78766 9.8985 5.78766L10.1754 4.96535L9.07787 5.36279L9.33761 5.51364C9.33761 5.51364 8.88493 6.41853 8.65694 6.86058C8.42894 7.30263 8.40637 7.01059 8.40637 7.01059L8.44538 3.92623L8.69729 3.85793L8.06948 2.65198L7.26852 3.87465L7.62145 3.88416C7.62145 3.88416 7.59211 7.13847 7.54306 7.01059C7.51568 6.93795 7.44284 7.16245 7.40734 7.07549C7.18483 6.53039 6.88051 5.47392 6.88051 5.47392L7.05858 5.30733L5.86444 5.06165L6.22095 5.79578C6.22095 5.79578 6.53533 7.10397 6.88051 7.74287C6.95824 7.945 7.33381 8.03123 7.33381 8.03123C7.33381 8.03123 7.51719 7.84509 7.56262 8.03123C7.60804 8.21737 7.56262 8.96872 7.56262 8.96872H8.40637C8.40637 8.96872 8.34696 8.25991 8.40637 8.03123C8.46578 7.80255 8.64992 8.03123 8.64992 8.03123C8.64992 8.03123 9.13951 7.83864 9.21711 7.63651Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_270_54979">
+<rect width="16" height="12" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/components/UTIcon/components/FlagsIcons/flags/BL.svg

@@ -0,0 +1,13 @@
+<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_270_54958)">
+<rect width="16" height="12" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11 0H16V12H11V0Z" fill="#F50100"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0H6V12H0V0Z" fill="#2E42A5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M5 0H11V12H5V0Z" fill="#F7FCFF"/>
+</g>
+<defs>
+<clipPath id="clip0_270_54958">
+<rect width="16" height="12" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/components/UTIcon/components/FlagsIcons/flags/BM.svg

@@ -0,0 +1,38 @@
+<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_270_54959)">
+<rect width="16" height="12" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V12H16V0H0Z" fill="#AF0100"/>
+<mask id="mask0_270_54959" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="16" height="12">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V12H16V0H0Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_270_54959)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.0038 6C11.0038 8.94339 11.2824 9.96565 12.9599 9.96565C14.6375 9.96565 15.0965 8.48282 14.9548 6H11.0038Z" fill="#F7FCFF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.05 7.70001C13.5195 7.70001 13.9 7.2523 13.9 6.70001C13.9 6.14773 13.5195 5.70001 13.05 5.70001C12.5806 5.70001 12.2 6.14773 12.2 6.70001C12.2 7.2523 12.5806 7.70001 13.05 7.70001Z" fill="#AF0100"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.3967 9.15698C11.6955 9.82365 12.2183 10.157 12.9651 10.157C13.7068 10.157 14.2313 9.8281 14.5385 9.17034L11.3967 9.15698Z" fill="#5EAA22"/>
+<path d="M11.8096 7.51535L11.5305 6.81921C12.0428 6.61384 12.5366 6.50983 13.0111 6.50983C13.4856 6.50983 13.9795 6.61384 14.4917 6.81921L14.2126 7.51535C13.7855 7.34411 13.3853 7.25983 13.0111 7.25983C12.6369 7.25983 12.2367 7.34411 11.8096 7.51535Z" fill="#82B2CB"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5 8C12.7761 8 13 7.77614 13 7.5C13 7.22386 12.7761 7 12.5 7C12.2239 7 12 7.22386 12 7.5C12 7.77614 12.2239 8 12.5 8Z" fill="#FECA00"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.8 8.80005C13.0761 8.80005 13.3 8.57619 13.3 8.30005C13.3 8.02391 13.0761 7.80005 12.8 7.80005C12.5238 7.80005 12.3 8.02391 12.3 8.30005C12.3 8.57619 12.5238 8.80005 12.8 8.80005Z" fill="#8A4E22"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 8.40002C12.2761 8.40002 12.5 8.17617 12.5 7.90002C12.5 7.62388 12.2761 7.40002 12 7.40002C11.7239 7.40002 11.5 7.62388 11.5 7.90002C11.5 8.17617 11.7239 8.40002 12 8.40002Z" fill="#AF0100"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.7 8.40002C13.9762 8.40002 14.2 8.17617 14.2 7.90002C14.2 7.62388 13.9762 7.40002 13.7 7.40002C13.4239 7.40002 13.2 7.62388 13.2 7.90002C13.2 8.17617 13.4239 8.40002 13.7 8.40002Z" fill="#AF0100"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.35 9.5C13.5433 9.5 13.7 9.27614 13.7 9C13.7 8.72386 13.5433 8.5 13.35 8.5C13.1567 8.5 13 8.72386 13 9C13 9.27614 13.1567 9.5 13.35 9.5Z" fill="#AF0100"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.15 9.5C12.3433 9.5 12.5 9.27614 12.5 9C12.5 8.72386 12.3433 8.5 12.15 8.5C11.9567 8.5 11.8 8.72386 11.8 9C11.8 9.27614 11.9567 9.5 12.15 9.5Z" fill="#AF0100"/>
+</g>
+<g clip-path="url(#clip1_270_54959)">
+<rect width="9" height="7" fill="#2E42A5"/>
+<path d="M-1.00214 6.49993L0.978339 7.36853L9.04494 0.944391L10.0896 -0.346375L7.97176 -0.636686L4.68159 2.13166L2.03334 3.99688L-1.00214 6.49993Z" fill="#F7FCFF"/>
+<path d="M-0.731018 7.10849L0.277943 7.61255L9.71445 -0.466309H8.29775L-0.731018 7.10849Z" fill="#F50100"/>
+<path d="M10.0021 6.49993L8.02166 7.36853L-0.0449371 0.944391L-1.08959 -0.346375L1.02824 -0.636686L4.31841 2.13166L6.96666 3.99688L10.0021 6.49993Z" fill="#F7FCFF"/>
+<path d="M9.93457 6.93667L8.92561 7.44073L4.90745 3.98176L3.71615 3.59529L-1.1901 -0.341973H0.226597L5.13009 3.50184L6.43256 3.96525L9.93457 6.93667Z" fill="#F50100"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.99226 0H3.99226V3H0V4H3.99226V7H4.99226V4H9V3H4.99226V0Z" fill="#F50100"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3.24226 -0.75H5.74226V2.25H9.75V4.75H5.74226V7.75H3.24226V4.75H-0.75V2.25H3.24226V-0.75ZM3.99226 3H0V4H3.99226V7H4.99226V4H9V3H4.99226V0H3.99226V3Z" fill="#F7FCFF"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_270_54959">
+<rect width="16" height="12" fill="white"/>
+</clipPath>
+<clipPath id="clip1_270_54959">
+<rect width="9" height="7" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/components/UTIcon/components/FlagsIcons/flags/BO.svg

@@ -0,0 +1,23 @@
+<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_270_54961)">
+<rect width="16" height="12" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V12H16V0H0Z" fill="#FECA00"/>
+<mask id="mask0_270_54961" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="16" height="12">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V12H16V0H0Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_270_54961)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0V4H16V0H0Z" fill="#DB501C"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 8V12H16V8H0Z" fill="#5EAA22"/>
+<path d="M5.8237 5.63C5.8237 5.63 5.63776 7.53456 7.33052 7.53456C9.02327 7.53456 8.59238 7.53456 8.59238 7.53456C8.59238 7.53456 10.3731 7.41839 10.1663 5.63" stroke="#DB501C" stroke-width="0.75"/>
+<path d="M9.125 5.90002C9.125 6.52134 8.62132 7.02502 8 7.02502C7.37868 7.02502 6.875 6.52134 6.875 5.90002C6.875 5.2787 7.37868 4.77502 8 4.77502C8.62132 4.77502 9.125 5.2787 9.125 5.90002Z" fill="#FECA00" stroke="#68B9E8" stroke-width="0.75"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8 6C8.27614 6 8.5 5.77614 8.5 5.5C8.5 5.22386 8.27614 5 8 5C7.72386 5 7.5 5.22386 7.5 5.5C7.5 5.77614 7.72386 6 8 6Z" fill="#DB501C"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.05001 6.8C8.51945 6.8 8.90001 6.62091 8.90001 6.4C8.90001 6.17909 8.51945 6 8.05001 6C7.58057 6 7.20001 6.17909 7.20001 6.4C7.20001 6.62091 7.58057 6.8 8.05001 6.8Z" fill="#5EAA22"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.05004 5.00001C8.71278 5.00001 9.25004 4.82093 9.25004 4.60001C9.25004 4.3791 8.71278 4.20001 8.05004 4.20001C7.38729 4.20001 6.85004 4.3791 6.85004 4.60001C6.85004 4.82093 7.38729 5.00001 8.05004 5.00001Z" fill="#674F28"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_270_54961">
+<rect width="16" height="12" fill="white"/>
+</clipPath>
+</defs>
+</svg>