@widergy/energy-ui 2.5.4 → 2.6.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [2.6.0](https://github.com/widergy/energy-ui/compare/v2.5.4...v2.6.0) (2023-08-31)
+
+
+### Features
+
+* added modal component ([#370](https://github.com/widergy/energy-ui/issues/370)) ([0fc94e8](https://github.com/widergy/energy-ui/commit/0fc94e89e9386e874829d8eb0594dc05354374e8))
+
 ## [2.5.4](https://github.com/widergy/energy-ui/compare/v2.5.3...v2.5.4) (2023-08-31)
 
 

package/dist/components/UTModal/assets/alert-triangle.svg

@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="alert-triangle">
+<path id="Vector (Stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M13.9552 3.17864C14.5707 2.81575 15.2722 2.62436 15.9867 2.62436C16.7012 2.62436 17.4027 2.81575 18.0182 3.17864C18.6295 3.53905 19.1339 4.05555 19.4796 4.67506L28.9403 20.9981C28.9717 21.0523 28.9993 21.1086 29.0227 21.1667C29.2675 21.7717 29.3605 22.4274 29.2936 23.0766C29.2268 23.7257 29.0021 24.3487 28.6392 24.8911C28.2762 25.4336 27.7861 25.8789 27.2115 26.1884C26.6369 26.4979 25.9953 26.6621 25.3427 26.6667L25.3334 26.6667H6.66672C6.64235 26.6667 6.61813 26.666 6.59408 26.6648C6.54707 26.6673 6.49947 26.6674 6.4514 26.6649C5.81419 26.6321 5.19409 26.4473 4.64285 26.1259C4.09162 25.8046 3.62526 25.356 3.2827 24.8177C2.94015 24.2794 2.73133 23.667 2.6737 23.0315C2.61607 22.3961 2.71128 21.7561 2.9514 21.1649C2.97473 21.1075 3.00205 21.0517 3.03314 20.9981L12.4938 4.6751C12.8396 4.05556 13.3439 3.53905 13.9552 3.17864ZM6.59306 24.002C6.61744 24.0007 6.642 24 6.66672 24H25.3279C25.5441 23.9979 25.7566 23.9432 25.947 23.8406C26.1385 23.7375 26.3019 23.589 26.4228 23.4082C26.5438 23.2274 26.6187 23.0198 26.641 22.8034C26.6606 22.6129 26.6389 22.4207 26.5778 22.2399L17.1665 6.00197L17.1534 5.97886C17.0381 5.77046 16.8691 5.59675 16.6639 5.47579C16.4587 5.35482 16.2249 5.29103 15.9867 5.29103C15.7485 5.29103 15.5147 5.35482 15.3095 5.47579C15.1044 5.59675 14.9354 5.77046 14.8201 5.97886L14.807 6.00197L5.39506 22.2408C5.33505 22.4172 5.31258 22.6045 5.32947 22.7907C5.34868 23.0025 5.41828 23.2066 5.53247 23.3861C5.64665 23.5655 5.80211 23.715 5.98585 23.8221C6.16959 23.9292 6.37629 23.9908 6.5887 24.0018C6.59015 24.0019 6.5916 24.0019 6.59306 24.002ZM16 10.6667C16.7364 10.6667 17.3334 11.2636 17.3334 12V14.6667C17.3334 15.4031 16.7364 16 16 16C15.2637 16 14.6667 15.4031 14.6667 14.6667V12C14.6667 11.2636 15.2637 10.6667 16 10.6667ZM16 18.6667C16.7364 18.6667 17.3334 19.2636 17.3334 20V20.0133C17.3334 20.7497 16.7364 21.3467 16 21.3467C15.2637 21.3467 14.6667 20.7497 14.6667 20.0133V20C14.6667 19.2636 15.2637 18.6667 16 18.6667Z" fill="#A86600"/>
+</g>
+</svg>

package/dist/components/UTModal/assets/circle-check.svg

@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="circle-check">
+<path id="Vector (Stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M16 5.33334C10.1089 5.33334 5.33329 10.109 5.33329 16C5.33329 21.891 10.1089 26.6667 16 26.6667C21.891 26.6667 26.6666 21.891 26.6666 16C26.6666 10.109 21.891 5.33334 16 5.33334ZM2.66663 16C2.66663 8.63621 8.63616 2.66667 16 2.66667C23.3638 2.66667 29.3333 8.63621 29.3333 16C29.3333 23.3638 23.3638 29.3333 16 29.3333C8.63616 29.3333 2.66663 23.3638 2.66663 16ZM20.9428 12.3905C21.4635 12.9112 21.4635 13.7554 20.9428 14.2761L15.6094 19.6095C15.0887 20.1302 14.2445 20.1302 13.7238 19.6095L11.0572 16.9428C10.5365 16.4221 10.5365 15.5779 11.0572 15.0572C11.5778 14.5365 12.4221 14.5365 12.9428 15.0572L14.6666 16.7811L19.0572 12.3905C19.5779 11.8698 20.4221 11.8698 20.9428 12.3905Z" fill="#118460"/>
+</g>
+</svg>

package/dist/components/UTModal/assets/circle-info.svg

@@ -0,0 +1,3 @@
+<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path id="Vector (Stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M14 3.33332C8.10892 3.33332 3.33329 8.10895 3.33329 14C3.33329 19.891 8.10892 24.6667 14 24.6667C19.891 24.6667 24.6666 19.891 24.6666 14C24.6666 8.10895 19.891 3.33332 14 3.33332ZM0.666626 14C0.666626 6.63619 6.63616 0.666656 14 0.666656C21.3638 0.666656 27.3333 6.63619 27.3333 14C27.3333 21.3638 21.3638 27.3333 14 27.3333C6.63616 27.3333 0.666626 21.3638 0.666626 14ZM12.6666 8.66666C12.6666 7.93028 13.2636 7.33332 14 7.33332H14.0133C14.7497 7.33332 15.3466 7.93028 15.3466 8.66666C15.3466 9.40304 14.7497 9.99999 14.0133 9.99999H14C13.2636 9.99999 12.6666 9.40304 12.6666 8.66666ZM11.3333 14C11.3333 13.2636 11.9302 12.6667 12.6666 12.6667H14C14.7363 12.6667 15.3333 13.2636 15.3333 14V18C16.0697 18 16.6666 18.5969 16.6666 19.3333C16.6666 20.0697 16.0697 20.6667 15.3333 20.6667H14C13.2636 20.6667 12.6666 20.0697 12.6666 19.3333V15.3333C11.9302 15.3333 11.3333 14.7364 11.3333 14Z" fill="#037DB4"/>
+</svg>

package/dist/components/UTModal/assets/circle-x.svg

@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="circle-x">
+<path id="Vector (Stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M16 5.33334C10.1089 5.33334 5.33329 10.109 5.33329 16C5.33329 21.891 10.1089 26.6667 16 26.6667C21.891 26.6667 26.6666 21.891 26.6666 16C26.6666 10.109 21.891 5.33334 16 5.33334ZM2.66663 16C2.66663 8.63621 8.63616 2.66667 16 2.66667C23.3638 2.66667 29.3333 8.63621 29.3333 16C29.3333 23.3638 23.3638 29.3333 16 29.3333C8.63616 29.3333 2.66663 23.3638 2.66663 16ZM12.3905 12.3905C12.9112 11.8698 13.7554 11.8698 14.2761 12.3905L16 14.1144L17.7238 12.3905C18.2445 11.8698 19.0887 11.8698 19.6094 12.3905C20.1301 12.9112 20.1301 13.7554 19.6094 14.2761L17.8856 16L19.6094 17.7239C20.1301 18.2446 20.1301 19.0888 19.6094 19.6095C19.0887 20.1302 18.2445 20.1302 17.7238 19.6095L16 17.8856L14.2761 19.6095C13.7554 20.1302 12.9112 20.1302 12.3905 19.6095C11.8698 19.0888 11.8698 18.2446 12.3905 17.7239L14.1143 16L12.3905 14.2761C11.8698 13.7554 11.8698 12.9112 12.3905 12.3905Z" fill="#E80C2C"/>
+</g>
+</svg>

package/dist/components/UTModal/constants.js

@@ -0,0 +1,86 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.STATUS_ICONS = exports.STATUSES = exports.CANCEL_BUTTON_TEXT = exports.ACCEPT_BUTTON_TEXT = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _STATUS_ICONS;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+var InfoIcon = function InfoIcon(props) {
+  return /*#__PURE__*/_react.default.createElement("svg", props, /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M14 3.333C8.109 3.333 3.333 8.11 3.333 14S8.11 24.667 14 24.667 24.667 19.89 24.667 14 19.89 3.333 14 3.333zM.667 14C.667 6.636 6.637.667 14 .667c7.364 0 13.333 5.97 13.333 13.333 0 7.364-5.97 13.333-13.333 13.333C6.636 27.333.667 21.363.667 14zm12-5.333c0-.737.597-1.334 1.333-1.334h.013a1.333 1.333 0 1 1 0 2.667H14a1.333 1.333 0 0 1-1.333-1.333zM11.333 14c0-.736.597-1.333 1.334-1.333H14c.736 0 1.333.597 1.333 1.333v4a1.333 1.333 0 1 1 0 2.667H14a1.333 1.333 0 0 1-1.333-1.334v-4A1.333 1.333 0 0 1 11.333 14z",
+    fill: "#037DB4"
+  }));
+};
+InfoIcon.defaultProps = {
+  width: "28",
+  height: "28",
+  viewBox: "0 0 28 28",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+var WarningIcon = function WarningIcon(props) {
+  return /*#__PURE__*/_react.default.createElement("svg", props, /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M13.955 3.179a4 4 0 0 1 5.525 1.496l9.46 16.323c.032.054.06.11.083.169a3.999 3.999 0 0 1-3.68 5.5H6.667l-.073-.002a1.358 1.358 0 0 1-.143 0 3.999 3.999 0 0 1-3.5-5.5c.024-.057.051-.113.082-.167l9.46-16.323a4 4 0 0 1 1.462-1.496zM6.593 24.002L6.667 24h18.66a1.332 1.332 0 0 0 1.25-1.76l-9.41-16.238-.014-.023a1.333 1.333 0 0 0-2.333 0l-.013.023-9.412 16.239A1.333 1.333 0 0 0 6.59 24l.004.001zM16 10.667c.736 0 1.333.597 1.333 1.333v2.667a1.333 1.333 0 0 1-2.666 0V12c0-.736.597-1.333 1.333-1.333zm0 8c.736 0 1.333.597 1.333 1.333v.013a1.333 1.333 0 0 1-2.666 0V20c0-.736.597-1.333 1.333-1.333z",
+    fill: "#A86600"
+  }));
+};
+WarningIcon.defaultProps = {
+  width: "32",
+  height: "32",
+  viewBox: "0 0 32 32",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+var SuccessIcon = function SuccessIcon(props) {
+  return /*#__PURE__*/_react.default.createElement("svg", props, /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M16 5.333C10.109 5.333 5.333 10.11 5.333 16S10.11 26.667 16 26.667 26.667 21.89 26.667 16 21.89 5.333 16 5.333zM2.667 16C2.667 8.636 8.637 2.667 16 2.667c7.364 0 13.333 5.97 13.333 13.333 0 7.364-5.97 13.333-13.333 13.333-7.364 0-13.333-5.97-13.333-13.333zm18.276-3.61c.52.521.52 1.365 0 1.886l-5.334 5.334c-.52.52-1.364.52-1.885 0l-2.667-2.667a1.333 1.333 0 1 1 1.886-1.886l1.724 1.724 4.39-4.39c.52-.521 1.365-.521 1.886 0z",
+    fill: "#118460"
+  }));
+};
+SuccessIcon.defaultProps = {
+  width: "32",
+  height: "32",
+  viewBox: "0 0 32 32",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+var ErrorIcon = function ErrorIcon(props) {
+  return /*#__PURE__*/_react.default.createElement("svg", props, /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M16 5.333C10.109 5.333 5.333 10.11 5.333 16S10.11 26.667 16 26.667 26.667 21.89 26.667 16 21.89 5.333 16 5.333zM2.667 16C2.667 8.636 8.637 2.667 16 2.667c7.364 0 13.333 5.97 13.333 13.333 0 7.364-5.97 13.333-13.333 13.333-7.364 0-13.333-5.97-13.333-13.333zm9.723-3.61c.521-.52 1.365-.52 1.886 0L16 14.114l1.724-1.724a1.333 1.333 0 1 1 1.885 1.886L17.886 16l1.723 1.724a1.333 1.333 0 1 1-1.885 1.886L16 17.886l-1.724 1.724a1.333 1.333 0 1 1-1.886-1.886L14.114 16l-1.724-1.724a1.333 1.333 0 0 1 0-1.886z",
+    fill: "#E80C2C"
+  }));
+};
+ErrorIcon.defaultProps = {
+  width: "32",
+  height: "32",
+  viewBox: "0 0 32 32",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+var STATUSES = {
+  INFO: 'info',
+  WARNING: 'warning',
+  SUCCESS: 'success',
+  ERROR: 'error'
+};
+exports.STATUSES = STATUSES;
+var STATUS_ICONS = (_STATUS_ICONS = {}, _defineProperty(_STATUS_ICONS, STATUSES.INFO, InfoIcon), _defineProperty(_STATUS_ICONS, STATUSES.WARNING, WarningIcon), _defineProperty(_STATUS_ICONS, STATUSES.SUCCESS, SuccessIcon), _defineProperty(_STATUS_ICONS, STATUSES.ERROR, ErrorIcon), _STATUS_ICONS);
+exports.STATUS_ICONS = STATUS_ICONS;
+var CANCEL_BUTTON_TEXT = 'Cancelar';
+exports.CANCEL_BUTTON_TEXT = CANCEL_BUTTON_TEXT;
+var ACCEPT_BUTTON_TEXT = 'Aceptar';
+exports.ACCEPT_BUTTON_TEXT = ACCEPT_BUTTON_TEXT;

package/dist/components/UTModal/index.js

@@ -0,0 +1,104 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = require("prop-types");
+var _object = require("@widergy/web-utils/lib/object");
+var _classesUtils = require("../../utils/classesUtils");
+var _WithTheme = _interopRequireDefault(require("../WithTheme"));
+var _UTLabel = _interopRequireDefault(require("../UTLabel"));
+var _UTButton = _interopRequireDefault(require("../UTButton"));
+var _theme = require("./theme");
+var _constants = require("./constants");
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var UTModal = function UTModal(_ref) {
+  var _status$, _status$2;
+  var acceptButton = _ref.acceptButton,
+    cancelButton = _ref.cancelButton,
+    CustomActions = _ref.CustomActions,
+    children = _ref.children,
+    themeClasses = _ref.classes,
+    classNames = _ref.classNames,
+    handleClose = _ref.handleClose,
+    isOpen = _ref.isOpen,
+    size = _ref.size,
+    status = _ref.status,
+    subtitle = _ref.subtitle,
+    title = _ref.title,
+    _ref$useBodyPadding = _ref.useBodyPadding,
+    useBodyPadding = _ref$useBodyPadding === void 0 ? true : _ref$useBodyPadding,
+    _ref$withClickAway = _ref.withClickAway,
+    withClickAway = _ref$withClickAway === void 0 ? true : _ref$withClickAway;
+  var dialogRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(function () {
+    if (isOpen) dialogRef.current.showModal();else dialogRef.current.close();
+  }, [isOpen]);
+  var onClickDialog = function onClickDialog(event) {
+    return withClickAway && handleClose && event.target.tagName === 'DIALOG' && handleClose();
+  };
+  var classes = (0, _react.useMemo)(function () {
+    return (0, _classesUtils.mergeClasses)(themeClasses, classNames);
+  }, [classNames]);
+  var StatusIcon = _constants.STATUS_ICONS[status];
+  var hasDefaultActions = !(0, _object.objectIsEmpty)(acceptButton) || !(0, _object.objectIsEmpty)(cancelButton);
+  var hasActions = hasDefaultActions || CustomActions;
+  return /*#__PURE__*/_react.default.createElement("dialog", {
+    className: "".concat(_stylesModule.default.container, " ").concat(size ? _stylesModule.default["container".concat(size[0].toUpperCase()).concat(size.toLowerCase().slice(1))] : _stylesModule.default.containerM),
+    onClick: onClickDialog,
+    ref: dialogRef
+  }, /*#__PURE__*/_react.default.createElement("div", null, StatusIcon && /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(_stylesModule.default.status, " ").concat(classes["status".concat((_status$ = status[0]) === null || _status$ === void 0 ? void 0 : _status$.toUpperCase()).concat(status === null || status === void 0 ? void 0 : status.toLowerCase().slice(1))])
+  }, /*#__PURE__*/_react.default.createElement(StatusIcon, {
+    className: "".concat(_stylesModule.default.icon, " ").concat(classes["icon".concat((_status$2 = status[0]) === null || _status$2 === void 0 ? void 0 : _status$2.toUpperCase()).concat(status === null || status === void 0 ? void 0 : status.toLowerCase().slice(1))])
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: _stylesModule.default.header
+  }, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+    variant: "title3",
+    className: classes.title
+  }, title), subtitle && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+    className: classes.subtitle
+  }, subtitle)), children && /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(_stylesModule.default.body, " ").concat(useBodyPadding && _stylesModule.default.bodyPadding)
+  }, children), hasActions && /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(_stylesModule.default.actions, " ").concat(CustomActions && _stylesModule.default.withCustomActions, " ").concat(classes.actions)
+  }, CustomActions && /*#__PURE__*/_react.default.createElement(CustomActions, null), hasDefaultActions && /*#__PURE__*/_react.default.createElement("div", {
+    className: _stylesModule.default.defaultActions
+  }, !(0, _object.objectIsEmpty)(cancelButton) && /*#__PURE__*/_react.default.createElement(_UTButton.default, _extends({
+    colorTheme: "secondary",
+    variant: "text"
+  }, cancelButton), cancelButton.label || _constants.CANCEL_BUTTON_TEXT), !(0, _object.objectIsEmpty)(acceptButton) && /*#__PURE__*/_react.default.createElement(_UTButton.default, _extends({
+    colorTheme: "primary",
+    variant: "filled"
+  }, acceptButton), acceptButton.label || _constants.ACCEPT_BUTTON_TEXT)))));
+};
+UTModal.propTypes = {
+  acceptButton: (0, _propTypes.shape)({
+    label: _propTypes.string,
+    onClick: _propTypes.func
+  }),
+  cancelButton: (0, _propTypes.shape)({
+    label: _propTypes.string,
+    onClick: _propTypes.func
+  }),
+  classes: (0, _propTypes.objectOf)(_propTypes.string),
+  classNames: (0, _propTypes.objectOf)(_propTypes.string),
+  CustomActions: _propTypes.node,
+  handleClose: _propTypes.func,
+  isOpen: _propTypes.bool,
+  size: _propTypes.string,
+  status: _propTypes.string,
+  subtitle: _propTypes.string,
+  title: _propTypes.string,
+  useBodyPadding: _propTypes.bool,
+  withClickAway: _propTypes.bool
+};
+var _default = (0, _WithTheme.default)(_theme.retrieveStyle)(UTModal);
+exports.default = _default;

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

@@ -0,0 +1,76 @@
+$icon-size: 56px;
+
+.container {
+  border-radius: 5px;
+  border-width: 0;
+  padding: 0;
+}
+
+.containerS {
+  width: 381px;
+}
+
+.containerM {
+  width: 560px;
+}
+
+.containerL {
+  width: 790px;
+}
+
+.containerXl {
+  width: 1200px;
+}
+
+.status {
+  align-items: center;
+  display: flex;
+  justify-content: center;
+  padding: 32px;
+}
+
+.icon {
+  border-radius: 100%;
+  height: $icon-size;
+  padding: 12px;
+  width: $icon-size;
+}
+
+.header {
+  align-items: flex-start;
+  display: flex;
+  flex-direction: column;
+  grid-gap: 12px;
+  padding: 24px;
+}
+
+.body {
+  padding-bottom: 24px;
+}
+
+.bodyPadding {
+  padding-left: 24px;
+  padding-right: 24px;
+}
+
+.actions {
+  align-items: center;
+  border-top: solid 1px;
+  display: flex;
+  flex-direction: row;
+  grid-gap: 16px;
+  justify-content: flex-end;
+  padding-left: 24px;
+  padding-right: 24px;
+  padding: 16px 24px;
+}
+
+.withCustomActions {
+  justify-content: space-between;
+}
+
+.defaultActions {
+  align-items: center;
+  display: flex;
+  grid-gap: 16px;
+}

package/dist/components/UTModal/theme.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.retrieveStyle = void 0;
+var retrieveStyle = function retrieveStyle(_ref) {
+  var _theme$UTModal$contai;
+  var theme = _ref.theme;
+  return {
+    container: {
+      backgroundColor: theme.Palette.light['01'],
+      boxShadow: ((_theme$UTModal$contai = theme.UTModal.container) === null || _theme$UTModal$contai === void 0 ? void 0 : _theme$UTModal$contai.boxShadow) || '0 3px 6px rgba(228, 230, 234, 0.9)'
+    },
+    statusInfo: {
+      backgroundColor: theme.Palette.information['04']
+    },
+    statusWarning: {
+      backgroundColor: theme.Palette.warning['04']
+    },
+    statusSuccess: {
+      backgroundColor: theme.Palette.success['04']
+    },
+    statusError: {
+      backgroundColor: theme.Palette.error['04']
+    },
+    iconInfo: {
+      backgroundColor: theme.Palette.information['02']
+    },
+    iconWarning: {
+      backgroundColor: theme.Palette.warning['02']
+    },
+    iconSuccess: {
+      backgroundColor: theme.Palette.success['02']
+    },
+    iconError: {
+      backgroundColor: theme.Palette.error['02']
+    },
+    title: {
+      color: theme.Palette.dark['05']
+    },
+    subtitle: {
+      color: theme.Palette.gray['04']
+    },
+    actions: {
+      borderTopColor: theme.Palette.light['04']
+    }
+  };
+};
+exports.retrieveStyle = retrieveStyle;

package/dist/components/UTTable/utils.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.orderRows = exports.getSelectableRowIds = exports.getInitialValidRowsPerPage = exports.getInitialValidPage = exports.getCurrentRows = exports.getColumnsSizes = exports.getColumnDefinition = exports.customSort = exports.createRowStyles = void 0;
 var _object = require("@widergy/web-utils/lib/object");
+var _UTTable = require("../../constants/UTTable");
 var _utils = require("./components/TableFooter/components/PageSizeSelector/utils");
 var _constants = require("./constants");
-var _UTTable = require("../../constants/UTTable");
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

package/dist/components/UTTopbar/components/UserMenu/index.js

@@ -7,9 +7,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = require("prop-types");
-var _energyUi = require("@widergy/energy-ui");
 var _ExpandMore = _interopRequireDefault(require("@material-ui/icons/ExpandMore"));
 var _types = require("../../types.js");
+var _index = _interopRequireDefault(require("../../../UTTouchableWithoutFeedback/index.js"));
+var _index2 = _interopRequireDefault(require("../../../UTLabel/index.js"));
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -24,14 +25,14 @@ var UserMenu = function UserMenu(_ref) {
     menuOpened = _ref.menuOpened,
     subtitle = _ref.subtitle,
     title = _ref.title;
-  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_energyUi.UTTouchableWithoutFeedback, {
+  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_index.default, {
     onClick: handleClick,
     className: "".concat(justAvatar ? _stylesModule.default.justAvatarUserMenu : _stylesModule.default.userMenu, " ").concat(classes.userMenu, " ").concat(!handleClick && _stylesModule.default.disableMenu)
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: "".concat(_stylesModule.default.userMenuAvatar, " ").concat(classes.userMenuAvatar)
   }, avatar), !justAvatar && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.labelWithArrow
-  }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
+  }, /*#__PURE__*/_react.default.createElement(_index2.default, {
     className: "".concat(classes.userMenuTitle, " ").concat(_stylesModule.default.userMenuTitle)
   }, title), handleClick && MenuComponent && /*#__PURE__*/_react.default.createElement(Arrow, {
     className: "\n                ".concat(classes.userMenuArrow, "\n                ").concat(_stylesModule.default.userMenuArrow, "\n                ").concat(!!menuOpened && _stylesModule.default.opened, "\n              ")

package/dist/components/UTTopbar/index.js

@@ -8,8 +8,9 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = require("prop-types");
 var _Menu = _interopRequireDefault(require("@material-ui/icons/Menu"));
-var _energyUi = require("@widergy/energy-ui");
 var _array = require("@widergy/web-utils/lib/array");
+var _UTLabel = _interopRequireDefault(require("../UTLabel"));
+var _UTBreadcrumbs = _interopRequireDefault(require("../UTBreadcrumbs"));
 var _classesUtils = require("../../utils/classesUtils");
 var _WithTheme = _interopRequireDefault(require("../WithTheme"));
 var _UserMenu = _interopRequireDefault(require("./components/UserMenu"));
@@ -51,9 +52,9 @@ var UTTopbar = function UTTopbar(_ref) {
   }, handleMenu && isMobileSize && /*#__PURE__*/_react.default.createElement(_Menu.default, {
     onClick: handleMenu,
     className: classes.menuIcon
-  }), (0, _array.isEmpty)(breadcrumbs) ? /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
+  }), (0, _array.isEmpty)(breadcrumbs) ? /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
     className: "".concat(isMobileSize && _stylesModule.default.mobileTitle, " ").concat(classes.title)
-  }, title) : isMobileSize ? UTMenu : /*#__PURE__*/_react.default.createElement(_energyUi.UTBreadcrumbs, _extends({
+  }, title) : isMobileSize ? UTMenu : /*#__PURE__*/_react.default.createElement(_UTBreadcrumbs.default, _extends({
     breadcrumbs: breadcrumbs
   }, breadcrumbsProps)), /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.rightSection

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@widergy/energy-ui",
-  "version": "2.5.4",
+  "version": "2.6.0",
   "description": "Widergy Web Components",
   "author": "widergy",
   "license": "MIT",