@widergy/energy-ui 3.22.4 → 3.23.0

package/dist/components/UTValidation/index.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.validationDataProptypes = exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _lodash = require("lodash");
+var _propTypes = require("prop-types");
+var _componentUtils = require("../../utils/componentUtils");
+var _UTIcon = _interopRequireDefault(require("../UTIcon"));
+var _UTLabel = _interopRequireDefault(require("../UTLabel"));
+var _WithTheme = _interopRequireDefault(require("../WithTheme"));
+var _constants = require("./constants");
+var _utils = require("./utils");
+var _theme = require("./theme");
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const UTValidation = _ref => {
+  let {
+    classes,
+    className,
+    validationData = []
+  } = _ref;
+  if ((0, _lodash.isEmpty)(validationData)) return null;
+  const showIcon = status => _constants.STATUSES_WITH_ICON.includes(status);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(className, " ").concat(_stylesModule.default.container)
+  }, validationData.map((_ref2, index) => {
+    let {
+      items,
+      status = _constants.STATUSES.default,
+      title
+    } = _ref2;
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: (0, _utils.generateKey)({
+        items,
+        status,
+        title
+      }, index),
+      className: _stylesModule.default.validationContainer
+    }, title && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+      colorTheme: _constants.STATUS_COLOR_MAPPER[status],
+      variant: "small"
+    }, title), /*#__PURE__*/_react.default.createElement("div", {
+      className: _stylesModule.default.itemsContainer
+    }, items.map((_ref3, itemIndex) => {
+      let {
+        text,
+        status: itemStatus = _constants.STATUSES.default,
+        withIcon = true
+      } = _ref3;
+      return /*#__PURE__*/_react.default.createElement("div", {
+        key: (0, _utils.generateItemKey)({
+          text,
+          status: itemStatus
+        }, itemIndex),
+        className: _stylesModule.default.itemContainer
+      }, withIcon && /*#__PURE__*/_react.default.createElement("div", {
+        className: "".concat(_stylesModule.default.iconContainer, " ").concat(classes["icon".concat((0, _componentUtils.capitalize)(itemStatus))])
+      }, showIcon(itemStatus) && /*#__PURE__*/_react.default.createElement(_UTIcon.default, {
+        colorTheme: itemStatus,
+        name: _constants.ICON_MAPPER[itemStatus],
+        size: _constants.ICON_SIZE
+      })), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+        colorTheme: _constants.STATUS_COLOR_MAPPER[itemStatus],
+        variant: "small"
+      }, text));
+    })));
+  }));
+};
+const validationDataProptypes = exports.validationDataProptypes = (0, _propTypes.arrayOf)((0, _propTypes.shape)({
+  items: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
+    status: _propTypes.string,
+    text: _propTypes.string,
+    withIcon: _propTypes.bool
+  })),
+  status: _propTypes.string,
+  title: _propTypes.string
+}));
+UTValidation.propTypes = {
+  classes: (0, _propTypes.objectOf)(_propTypes.string),
+  className: _propTypes.string,
+  validationData: validationDataProptypes
+};
+var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)(UTValidation);

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

@@ -0,0 +1,33 @@
+.container {
+  display: flex;
+  flex-direction: column;
+  grid-gap: 16px;
+}
+
+.iconContainer {
+  align-items: center;
+  border-radius: 100%;
+  display: flex;
+  height: 20px;
+  justify-content: center;
+  width: 20px;
+}
+
+.itemContainer {
+  align-items: center;
+  display: flex;
+  flex-direction: row;
+  grid-gap: 8px;
+}
+
+.itemsContainer {
+  display: flex;
+  flex-direction: column;
+  grid-gap: 8px;
+}
+
+.validationContainer {
+  display: flex;
+  flex-direction: column;
+  grid-gap: 12px;
+}

package/dist/components/UTValidation/theme.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.retrieveStyle = void 0;
+var _constants = require("./constants");
+const variantsColorTheme = (colorTheme, theme) => theme.Palette[colorTheme];
+const retrieveStyle = _ref => {
+  let {
+    theme
+  } = _ref;
+  return {
+    iconSuccess: {
+      backgroundColor: variantsColorTheme(_constants.ICON_STATUS_COLOR_MAPPER[_constants.STATUSES.success], theme)['01']
+    },
+    iconError: {
+      backgroundColor: variantsColorTheme(_constants.ICON_STATUS_COLOR_MAPPER[_constants.STATUSES.error], theme)['01']
+    },
+    iconDefault: {
+      backgroundColor: variantsColorTheme(_constants.ICON_STATUS_COLOR_MAPPER[_constants.STATUSES.default], theme)['04']
+    }
+  };
+};
+exports.retrieveStyle = retrieveStyle;

package/dist/components/UTValidation/utils.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateKey = exports.generateItemKey = exports.formatErrorToValidation = void 0;
+const generateKey = (data, index) => {
+  const titleKey = data.title || '';
+  const statusKey = data.status || '';
+  const itemsKey = data.items.map(item => item.text).join('-');
+  return "".concat(index, "-").concat(titleKey, "-").concat(statusKey, "-").concat(itemsKey);
+};
+exports.generateKey = generateKey;
+const generateItemKey = (item, index) => "".concat(index, "-").concat(item.status, "-").concat(item.text);
+exports.generateItemKey = generateItemKey;
+const formatErrorToValidation = (error, options) => [{
+  items: [{
+    text: error,
+    status: 'error',
+    withIcon: options === null || options === void 0 ? void 0 : options.withIcon
+  }]
+}];
+exports.formatErrorToValidation = formatErrorToValidation;

package/dist/index.js

@@ -381,6 +381,12 @@ Object.defineProperty(exports, "UTTracker", {
     return _UTTracker.default;
   }
 });
+Object.defineProperty(exports, "UTValidation", {
+  enumerable: true,
+  get: function () {
+    return _UTValidation.default;
+  }
+});
 Object.defineProperty(exports, "UTVirtualizedList", {
   enumerable: true,
   get: function () {
@@ -475,6 +481,7 @@ var _UTTooltip = _interopRequireDefault(require("./components/UTTooltip"));
 var _UTTopbar = _interopRequireDefault(require("./components/UTTopbar"));
 var _UTTouchableWithoutFeedback = _interopRequireDefault(require("./components/UTTouchableWithoutFeedback"));
 var _UTTracker = _interopRequireDefault(require("./components/UTTracker"));
+var _UTValidation = _interopRequireDefault(require("./components/UTValidation"));
 var _UTVirtualizedList = _interopRequireDefault(require("./components/UTVirtualizedList"));
 var _UTWorkflowContainer = _interopRequireDefault(require("./components/UTWorkflowContainer"));
 var _WithLoading = _interopRequireDefault(require("./components/WithLoading"));

package/package.json

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

package/dist/components/UTActionCard/components/HeaderActions/constants.js

@@ -1,7 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DEFAULT_MAX_NUMBER_OF_PRIMARY_ACTIONS = void 0;
-const DEFAULT_MAX_NUMBER_OF_PRIMARY_ACTIONS = exports.DEFAULT_MAX_NUMBER_OF_PRIMARY_ACTIONS = 1;