@widergy/energy-ui 3.63.2 → 3.64.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [3.64.0](https://github.com/widergy/energy-ui/compare/v3.63.2...v3.64.0) (2025-02-24)
+
+
+### Features
+
+* [AUT-500] panel ids ([#578](https://github.com/widergy/energy-ui/issues/578)) ([6d80159](https://github.com/widergy/energy-ui/commit/6d8015945a4653a38c644d29fe3cce98c848c712))
+
 ## [3.63.2](https://github.com/widergy/energy-ui/compare/v3.63.1...v3.63.2) (2025-02-24)
 
 

package/dist/components/UTPanel/versions/V0/index.js

@@ -12,14 +12,20 @@ var _Close = _interopRequireDefault(require("@material-ui/icons/Close"));
 var _propTypes = require("prop-types");
 var _UTButton = _interopRequireDefault(require("../../../UTButton"));
 var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
+var _testIds = require("../../../../constants/testIds");
 var _commonTypes = require("../../../../types/commonTypes");
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const {
+  closeButtonId,
+  titleId
+} = _testIds.COMPONENT_IDS.panelIds;
 const UTPanel = _ref => {
   let {
     children,
     classes = {},
+    closeButtonDataTestId = closeButtonId,
     containerRef,
     disableScrollbar = false,
     modalProps,
@@ -31,6 +37,7 @@ const UTPanel = _ref => {
     perfectScrollbarOptions,
     title,
     TitleComponent,
+    titleDataTestId = titleId,
     TitleIcon,
     ...props
   } = _ref;
@@ -67,13 +74,15 @@ const UTPanel = _ref => {
   }, TitleIcon && /*#__PURE__*/_react.default.createElement(TitleIcon, {
     className: "".concat(_stylesModule.default.titleIcon, " ").concat(titleIconClass)
   }), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    weight: "semibold",
-    className: classes.title
+    className: classes.title,
+    dataTestId: titleDataTestId,
+    weight: "semibold"
   }, title)), /*#__PURE__*/_react.default.createElement(_UTButton.default, {
     classNames: {
       icon: iconCloseClass,
       root: closeButtonClass
     },
+    dataTestId: closeButtonDataTestId,
     Icon: _Close.default,
     onClick: onClose,
     variant: "text"
@@ -88,6 +97,7 @@ const UTPanel = _ref => {
 };
 UTPanel.propTypes = {
   classes: (0, _propTypes.objectOf)(_propTypes.string),
+  closeButtonDataTestId: _propTypes.string,
   containerRef: _commonTypes.refType,
   disableScrollbar: _propTypes.bool,
   modalProps: _propTypes.object,
@@ -99,6 +109,7 @@ UTPanel.propTypes = {
   perfectScrollbarOptions: _propTypes.object,
   title: _propTypes.string,
   TitleComponent: (0, _propTypes.oneOfType)([_propTypes.element, _propTypes.elementType]),
+  titleDataTestId: _propTypes.string,
   TitleIcon: _propTypes.elementType
 };
 var _default = exports.default = UTPanel;

package/dist/components/UTPanel/versions/V1/index.js

@@ -15,8 +15,9 @@ var _UTButton = _interopRequireDefault(require("../../../UTButton"));
 var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
 var _UTMenu = _interopRequireDefault(require("../../../UTMenu"));
 var _index = _interopRequireDefault(require("../../../UTProgressBar/index.js"));
-var _classesUtils = require("../../../../utils/classesUtils.js");
 var _index2 = _interopRequireDefault(require("../../../WithTheme/index.js"));
+var _testIds = require("../../../../constants/testIds.js");
+var _classesUtils = require("../../../../utils/classesUtils.js");
 var _DataItem = _interopRequireDefault(require("./components/DataItem"));
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 var _constants = require("./constants.js");
@@ -25,11 +26,18 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const {
+  closeButtonId,
+  mainActionId,
+  secondaryActionId,
+  titleId
+} = _testIds.COMPONENT_IDS.panelIds;
 const UTPanel = _ref => {
   let {
     children,
-    classes: theme,
     classNames,
+    classes: theme,
+    closeButtonDataTestId = closeButtonId,
     collapsableHeader = false,
     currentStep = 1,
     disableScrollbar = false,
@@ -41,6 +49,7 @@ const UTPanel = _ref => {
     hideHeader = false,
     hideMainButton = false,
     isWorkflow = false,
+    mainActionDataTestId = mainActionId,
     mainButton = {},
     modalProps,
     onClose,
@@ -49,11 +58,13 @@ const UTPanel = _ref => {
     open,
     panelSide,
     perfectScrollbarOptions,
+    secondaryActionDataTestId = secondaryActionId,
     singleHeaderItemsColumn = false,
     size = 'M',
     stepsCount,
     subtitle = '',
     title = '',
+    titleDataTestId = titleId,
     titleProps = {},
     ...props
   } = _ref;
@@ -95,6 +106,7 @@ const UTPanel = _ref => {
       icon: iconCloseClass,
       root: closeButtonClass
     },
+    dataTestId: closeButtonDataTestId,
     Icon: "IconX",
     onClick: onClose,
     variant: "text"
@@ -115,6 +127,7 @@ const UTPanel = _ref => {
     className: _stylesModule.default.titleArea
   }, /*#__PURE__*/_react.default.createElement(_UTLabel.default, _extends({
     className: classes.title,
+    dataTestId: titleDataTestId,
     variant: "title2",
     weight: "medium"
   }, titleProps), title), collapsableHeader && /*#__PURE__*/_react.default.createElement(_UTButton.default, {
@@ -138,10 +151,12 @@ const UTPanel = _ref => {
     withMenuItem: true
   }), /*#__PURE__*/_react.default.createElement(_UTButton.default, _extends({
     colorTheme: "primary",
+    dataTestId: secondaryActionDataTestId,
     onClick: secondaryActionAsMenu ? openMenu : undefined,
     variant: "semitransparent"
   }, !secondaryActionAsMenu && headerSecondaryActionButton), secondaryActionAsMenu ? _constants.MENU_LABEL : headerSecondaryActionButton.text)), !(0, _isEmpty.default)(headerMainActionButton) && /*#__PURE__*/_react.default.createElement(_UTButton.default, _extends({
     colorTheme: "success",
+    dataTestId: mainActionDataTestId,
     variant: "filled"
   }, headerMainActionButton), headerMainActionButton.text)))), !(0, _isEmpty.default)(headerItems) && /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(_stylesModule.default.headerItemsContainer, " \n          ").concat(collapseHeader ? _stylesModule.default.expandedContainer : _stylesModule.default.collapsedContainer, " \n          ").concat(singleHeaderItemsColumn && _stylesModule.default.singleHeaderItemsColumn || '')
@@ -162,8 +177,9 @@ const UTPanel = _ref => {
   }, mainButton), (mainButton === null || mainButton === void 0 ? void 0 : mainButton.text) || _constants.ACCEPT_BUTTON_TEXT));
 };
 UTPanel.propTypes = {
-  classes: (0, _propTypes.objectOf)(_propTypes.string),
   classNames: _propTypes.object,
+  classes: (0, _propTypes.objectOf)(_propTypes.string),
+  closeButtonDataTestId: _propTypes.string,
   collapsableHeader: _propTypes.bool,
   currentStep: _propTypes.number,
   disableScrollbar: _propTypes.bool,
@@ -185,7 +201,11 @@ UTPanel.propTypes = {
     text: _propTypes.string,
     variant: _propTypes.string
   }),
+  hideCloseButton: _propTypes.bool,
+  hideHeader: _propTypes.bool,
+  hideMainButton: _propTypes.bool,
   isWorkflow: _propTypes.bool,
+  mainActionDataTestId: _propTypes.string,
   mainButton: _propTypes.object,
   modalProps: _propTypes.object,
   onClose: _propTypes.func,
@@ -194,14 +214,13 @@ UTPanel.propTypes = {
   open: _propTypes.bool,
   panelSide: _propTypes.string,
   perfectScrollbarOptions: _propTypes.object,
-  hideCloseButton: _propTypes.bool,
-  hideMainButton: _propTypes.bool,
-  hideHeader: _propTypes.bool,
+  secondaryActionDataTestId: _propTypes.string,
   singleHeaderItemsColumn: _propTypes.bool,
   size: _propTypes.string,
   stepsCount: _propTypes.number,
   subtitle: _propTypes.string,
   title: _propTypes.string,
+  titleDataTestId: _propTypes.string,
   titleProps: _propTypes.object
 };
 var _default = exports.default = (0, _index2.default)(_theme.retrieveStyle)(UTPanel);

package/dist/constants/testIds.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TABLE_ROW = exports.TABLE = exports.STATUS_MESSAGE = exports.SELECTION_COMPONENT = exports.HEADER = exports.CREDIT_CARD = exports.COMPONENT_IDS = exports.CELL = exports.ACTIONS = void 0;
+exports.TABLE_ROW = exports.TABLE = exports.STATUS_MESSAGE = exports.SELECTION_COMPONENT = exports.PANEL = exports.HEADER = exports.CREDIT_CARD = exports.COMPONENT_IDS = exports.CELL = exports.ACTIONS = void 0;
 const BOTTOM_NAV = 'bottomNav';
 const DIALOG = 'dialog';
 const WORKFLOW_CONTAINER = 'workflowContainer';
@@ -11,6 +11,7 @@ const ACTIONS = exports.ACTIONS = 'actions';
 const CELL = exports.CELL = 'cell';
 const CREDIT_CARD = exports.CREDIT_CARD = 'creditCard';
 const HEADER = exports.HEADER = 'header';
+const PANEL = exports.PANEL = 'panel';
 const SELECTION_COMPONENT = exports.SELECTION_COMPONENT = 'selectionComponent';
 const STATUS_MESSAGE = exports.STATUS_MESSAGE = 'statusMessage';
 const TABLE = exports.TABLE = 'table';
@@ -38,6 +39,12 @@ const COMPONENT_IDS = exports.COMPONENT_IDS = {
     prevButtonId: 'onboarding.prevButton',
     titleId: 'onboarding.title'
   },
+  panelIds: {
+    closeButtonId: "".concat(PANEL, ".closeButton"),
+    mainActionId: "".concat(PANEL, ".mainAction"),
+    secondaryActionId: "".concat(PANEL, ".secondaryAction"),
+    titleId: "".concat(PANEL, ".title")
+  },
   snackBarIds: {
     closeButtonId: 'snackbar.closeButton',
     labelId: 'snackbar.label'

package/package.json

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