@widergy/energy-ui 3.138.4 → 3.138.5

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+## [3.138.5](https://github.com/widergy/energy-ui/compare/v3.138.4...v3.138.5) (2026-02-24)
+
+
+### Bug Fixes
+
+* [PDI-677] updated shortcutpanel ([#764](https://github.com/widergy/energy-ui/issues/764)) ([9b69c0f](https://github.com/widergy/energy-ui/commit/9b69c0f349a4a59eaefbae70e38622c9458402a1))
+
 ## [3.138.4](https://github.com/widergy/energy-ui/compare/v3.138.3...v3.138.4) (2026-02-19)
 
 

package/dist/components/UTDataCategory/index.js

@@ -14,10 +14,10 @@ var _UTButton = _interopRequireDefault(require("../UTButton"));
 var _classesUtils = require("../../utils/classesUtils");
 var _testIds = require("../../constants/testIds");
 var _UTIcon = _interopRequireDefault(require("../UTIcon"));
+var _MainAction = _interopRequireDefault(require("../UTDataElement/components/MainAction"));
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 var _theme = require("./theme");
 var _constants = require("./constants");
-var _MainAction = _interopRequireDefault(require("../UTDataElement/components/MainAction"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 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); }
@@ -92,6 +92,7 @@ const UTDataCategory = _ref => {
   }))));
 };
 UTDataCategory.propTypes = {
+  action: _propTypes.object,
   area: _propTypes.bool,
   areaProps: _propTypes.object,
   classes: (0, _propTypes.objectOf)(_propTypes.string),
@@ -101,6 +102,8 @@ UTDataCategory.propTypes = {
   elements: _propTypes.array,
   elementsProps: _propTypes.object,
   expanded: _propTypes.bool,
+  Icon: _propTypes.string,
+  iconProps: _propTypes.object,
   style: _propTypes.object,
   title: _propTypes.string,
   titleProps: _propTypes.object

package/dist/components/UTShortcutPanel/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryHeader/index.js

@@ -20,7 +20,8 @@ const ExpandedPanelContentCategoryHeaderContainer = _ref => {
     handleToggleCollapsedCategory
   } = _ref;
   const {
-    classes
+    classes,
+    disableCollapsibleCategories
   } = (0, _react.useContext)(_context.default);
   const {
     name
@@ -33,16 +34,21 @@ const ExpandedPanelContentCategoryHeaderContainer = _ref => {
   const handleHeaderHover = action => {
     setHoverMode(action === _constants.MOUSE_ENTER);
   };
+  const headerEvents = disableCollapsibleCategories ? {} : {
+    onMouseEnter: () => handleHeaderHover(_constants.MOUSE_ENTER),
+    onMouseLeave: () => handleHeaderHover(_constants.MOUSE_LEAVE)
+  };
   return /*#__PURE__*/_react.default.createElement(_layout.default, {
-    title: name,
-    icon: icon,
-    hoverMode: hoverMode,
-    handleToggleCollapsedCategory: handleToggleCollapsedCategory,
-    handleHeaderHover: handleHeaderHover,
-    dataTestId: dataTestId,
-    collapsedCategory: collapsedCategory,
+    avatarPalette: avatarPalette,
     classes: classes,
-    avatarPalette: avatarPalette
+    collapsedCategory: collapsedCategory,
+    dataTestId: dataTestId,
+    disableCollapsibleCategories: disableCollapsibleCategories,
+    handleToggleCollapsedCategory: handleToggleCollapsedCategory,
+    headerEvents: headerEvents,
+    hoverMode: hoverMode,
+    icon: icon,
+    title: name
   });
 };
 ExpandedPanelContentCategoryHeaderContainer.propTypes = {

package/dist/components/UTShortcutPanel/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryHeader/layout.js

@@ -11,8 +11,8 @@ var _UTIcon = _interopRequireDefault(require("../../../../../../../../../UTIcon"
 var _UTLabel = _interopRequireDefault(require("../../../../../../../../../UTLabel"));
 var _UTTouchableWithoutFeedback = _interopRequireDefault(require("../../../../../../../../../UTTouchableWithoutFeedback"));
 var _testIds = require("../../../../../../../../../../constants/testIds");
-var _constants = require("./constants");
 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 {
   AVATAR,
   COLLAPSE_BUTTON,
@@ -24,17 +24,16 @@ const ExpandedPanelContentCategoryHeader = _ref => {
     classes,
     collapsedCategory,
     dataTestId,
-    handleHeaderHover,
+    disableCollapsibleCategories,
     handleToggleCollapsedCategory,
+    headerEvents,
     hoverMode,
     icon,
     title
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement("header", {
-    className: classes.expandedPanelContentCategoryHeader,
-    onMouseEnter: () => handleHeaderHover(_constants.MOUSE_ENTER),
-    onMouseLeave: () => handleHeaderHover(_constants.MOUSE_LEAVE)
-  }, hoverMode ? /*#__PURE__*/_react.default.createElement(_UTTouchableWithoutFeedback.default, {
+  return /*#__PURE__*/_react.default.createElement("header", _extends({
+    className: "".concat(classes.expandedPanelContentCategoryHeader, " ").concat(disableCollapsibleCategories ? classes.expandedPanelContentCategoryHeaderNoCollapsible : '')
+  }, headerEvents), hoverMode ? /*#__PURE__*/_react.default.createElement(_UTTouchableWithoutFeedback.default, {
     dataTestId: "".concat(dataTestId, ".").concat(COLLAPSE_BUTTON),
     onClick: handleToggleCollapsedCategory
   }, /*#__PURE__*/_react.default.createElement(_UTIcon.default, {
@@ -42,9 +41,9 @@ const ExpandedPanelContentCategoryHeader = _ref => {
     colorTheme: "gray",
     name: "IconChevronDown",
     size: "24"
-  })) : /*#__PURE__*/_react.default.createElement(_UTAvatar.default, {
+  })) : icon ? /*#__PURE__*/_react.default.createElement(_UTAvatar.default, {
     areaShape: "rounded",
-    className: classes.ExpandedPanelContentCategoryHeaderAvatar,
+    className: classes.expandedPanelContentCategoryHeaderAvatar,
     dataTestId: "".concat(dataTestId, ".").concat(AVATAR),
     iconProps: {
       name: icon
@@ -52,8 +51,8 @@ const ExpandedPanelContentCategoryHeader = _ref => {
     palette: avatarPalette,
     size: "small",
     type: "icon"
-  }), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    className: classes.ExpandedPanelContentCategoryHeaderLabel,
+  }) : null, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+    className: classes.expandedPanelContentCategoryHeaderLabel,
     colorTheme: hoverMode ? 'dark' : 'gray',
     dataTestId: "".concat(dataTestId, ".").concat(LABEL),
     variant: "small",
@@ -69,8 +68,9 @@ ExpandedPanelContentCategoryHeader.propTypes = {
   classes: (0, _propTypes.objectOf)(_propTypes.string),
   collapsedCategory: _propTypes.bool,
   dataTestId: _propTypes.string,
-  handleHeaderHover: _propTypes.func,
+  disableCollapsibleCategories: _propTypes.bool,
   handleToggleCollapsedCategory: _propTypes.func,
+  headerEvents: (0, _propTypes.objectOf)(_propTypes.func),
   hoverMode: _propTypes.bool,
   icon: _propTypes.string,
   title: _propTypes.string

package/dist/components/UTShortcutPanel/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryItem/index.js

@@ -22,15 +22,15 @@ const ExpandedPanelContentCategoryItemContainer = _ref => {
     classes,
     closePopper,
     handleSelectFilter,
+    onDeleteFilterGrouping,
+    onEditFilterGrouping,
     openPopper,
     position,
     selectedFilter,
     tooltipsContentMap: {
       editButton,
       deleteButton
-    },
-    handleDeleteFilterGrouping,
-    handleEditFilterGrouping
+    }
   } = (0, _react.useContext)(_context.default);
   const {
     description,
@@ -62,8 +62,8 @@ const ExpandedPanelContentCategoryItemContainer = _ref => {
     deleteButtonTippyRef: deleteButtonTippyRef,
     editButton: editButton,
     editButtonTippyRef: editButtonTippyRef,
-    handleDeleteFilterGrouping: () => handleDeleteFilterGrouping(filter),
-    handleEditFilterGrouping: () => handleEditFilterGrouping(filter),
+    handleDeleteFilterGrouping: onDeleteFilterGrouping ? () => onDeleteFilterGrouping(filter) : undefined,
+    handleEditFilterGrouping: onEditFilterGrouping ? () => onEditFilterGrouping(filter) : undefined,
     handleSelectFilter: handleSelectFilters,
     id: id,
     name: name,

package/dist/components/UTShortcutPanel/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryItem/layout.js

@@ -47,7 +47,7 @@ const ExpandedPanelContentCategoryItem = _ref => {
   }, /*#__PURE__*/_react.default.createElement(_UTTouchableWithoutFeedback.default, {
     className: "".concat(classes.expandedPanelContentCategoryItemTitleContainer, " ").concat(selected ? classes.expandedPanelContentCategoryItemTitleContainerSelected : ''),
     dataTestId: "".concat(dataTestId, ".").concat(_testIds.ID_CONSTANTS.NAME_CONTAINER),
-    onClick: handleSelectFilter
+    onClick: selected ? undefined : handleSelectFilter
   }, pinned && /*#__PURE__*/_react.default.createElement(_UTIcon.default, {
     colorTheme: selected ? 'accent' : undefined,
     dataTestId: "".concat(dataTestId, ".").concat(_testIds.ID_CONSTANTS.PINNED),
@@ -63,10 +63,10 @@ const ExpandedPanelContentCategoryItem = _ref => {
     className: classes.expandedPanelContentCategoryItemTitleLabel,
     colorTheme: selected ? 'accent' : undefined,
     shade: selected ? '05' : undefined
-  }, name))), !pinned && /*#__PURE__*/_react.default.createElement("section", {
+  }, name))), !pinned && (handleEditFilterGrouping || handleDeleteFilterGrouping) && /*#__PURE__*/_react.default.createElement("section", {
     className: classes.expandedPanelContentCategoryItemActionsContainer,
     onAnimationEnd: animationEnd
-  }, /*#__PURE__*/_react.default.createElement(_UTTooltip.default, {
+  }, handleEditFilterGrouping && /*#__PURE__*/_react.default.createElement(_UTTooltip.default, {
     arrow: false,
     content: editButton,
     dataTestId: "".concat(dataTestId, ".").concat(EDIT_BUTTON_TOOLTIP),
@@ -85,7 +85,7 @@ const ExpandedPanelContentCategoryItem = _ref => {
     onClick: handleEditFilterGrouping,
     variant: "text",
     size: "small"
-  }))), /*#__PURE__*/_react.default.createElement(_UTTooltip.default, {
+  }))), handleDeleteFilterGrouping && /*#__PURE__*/_react.default.createElement(_UTTooltip.default, {
     arrow: false,
     content: deleteButton,
     dataTestId: "".concat(dataTestId, ".").concat(DELETE_BUTTON_TOOLTIP),

package/dist/components/UTShortcutPanel/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/layout.js

@@ -35,7 +35,7 @@ const ExpandedPanelContentCategory = _ref => {
   } = _ref;
   return /*#__PURE__*/_react.default.createElement("section", {
     className: classes.expandedPanelContentCategory
-  }, /*#__PURE__*/_react.default.createElement(_ExpandedPanelContentCategoryHeader.default, {
+  }, category.name && /*#__PURE__*/_react.default.createElement(_ExpandedPanelContentCategoryHeader.default, {
     category: category,
     categoryConfig: categoryConfig,
     collapsedCategory: collapsedCategory,

package/dist/components/UTShortcutPanel/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentHeader/index.js

@@ -29,6 +29,7 @@ const ExpandedPanelContentHeaderContainer = _ref => {
     handleAddFilterGroup,
     handleFilterGroupSearch,
     handleTogglePanel,
+    hideAddFilterButton,
     panelTitle,
     position,
     searchValue,
@@ -61,6 +62,7 @@ const ExpandedPanelContentHeaderContainer = _ref => {
     handleFilterGroupSearch: handleFilterGroupSearch,
     handleSearchToggle: handleSearchToggle,
     handleTogglePanel: handleTogglePanel,
+    hideAddFilterButton: hideAddFilterButton,
     panelTitle: panelTitle,
     position: position,
     searchButtonTippyRef: searchButtonTippyRef,

package/dist/components/UTShortcutPanel/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentHeader/layout.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = require("prop-types");
 var _UTButton = _interopRequireDefault(require("../../../../../../../UTButton"));
 var _UTLabel = _interopRequireDefault(require("../../../../../../../UTLabel"));
@@ -14,7 +14,6 @@ var _types = require("../../../../../../types");
 var _testIds = require("../../../../../../../../constants/testIds");
 var _constants = require("./constants");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const {
   filterGrouping
 } = _testIds.TEST_IDS;
@@ -39,6 +38,7 @@ const ExpandedPanelContentHeader = _ref => {
     handleFilterGroupSearch,
     handleSearchToggle,
     handleTogglePanel,
+    hideAddFilterButton,
     panelTitle,
     position,
     searchButtonTippyRef,
@@ -54,7 +54,7 @@ const ExpandedPanelContentHeader = _ref => {
     onChange: handleFilterGroupSearch,
     value: searchValue,
     variant: "white"
-  }) : /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+  }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
     className: classes.expandedPanelContentTitle,
     colorTheme: "dark",
     dataTestId: dataTestId ? "".concat(dataTestId, ".").concat(TITLE) : filterGrouping.groupingPanel.expandedPanelContent.expandedPanelContentHeader.title,
@@ -98,7 +98,7 @@ const ExpandedPanelContentHeader = _ref => {
     Icon: _constants.ICON_BY_POSITION[position],
     onClick: handleTogglePanel,
     variant: "text"
-  })))), /*#__PURE__*/_react.default.createElement(_UTButton.default, {
+  })))), !hideAddFilterButton && /*#__PURE__*/_react.default.createElement(_UTButton.default, {
     colorTheme: "dark",
     dataTestId: dataTestId ? "".concat(dataTestId, ".").concat(ADD_FILTER_BUTTON) : filterGrouping.groupingPanel.expandedPanelContent.expandedPanelContentHeader.addFilterButton,
     Icon: "IconPlus",
@@ -117,6 +117,7 @@ ExpandedPanelContentHeader.propTypes = {
   handleFilterGroupSearch: _propTypes.func,
   handleSearchToggle: _propTypes.func,
   handleTogglePanel: _propTypes.func,
+  hideAddFilterButton: _propTypes.bool,
   panelTitle: _propTypes.string,
   position: _propTypes.string,
   searchButtonTippyRef: _types.refType,

package/dist/components/UTShortcutPanel/components/GroupingPanel/index.js

@@ -28,7 +28,8 @@ const GroupingPanelContainer = _ref => {
     position
   } = _ref;
   const {
-    classes
+    classes,
+    scrollProps
   } = (0, _react.useContext)(_context.default);
   const appendedDataTestId = dataTestId ? "".concat(dataTestId, ".").concat(GROUPING_PANEL) : undefined;
   const drawerRef = (0, _react.useRef)(null);
@@ -42,7 +43,8 @@ const GroupingPanelContainer = _ref => {
     onClose: onClose,
     open: open,
     panelTitle: panelTitle,
-    position: position
+    position: position,
+    scrollProps: scrollProps
   });
 };
 GroupingPanelContainer.propTypes = {

package/dist/components/UTShortcutPanel/components/GroupingPanel/layout.js

@@ -13,6 +13,7 @@ var _CollapsedPanelContent = _interopRequireDefault(require("./components/Collap
 var _ExpandedPanelContent = _interopRequireDefault(require("./components/ExpandedPanelContent"));
 require("react-perfect-scrollbar/dist/css/styles.css");
 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 GroupingPanel = _ref => {
   let {
     appendedDataTestId,
@@ -21,7 +22,8 @@ const GroupingPanel = _ref => {
     drawerRef,
     onClose,
     open,
-    position
+    position,
+    scrollProps
   } = _ref;
   return /*#__PURE__*/_react.default.createElement(_core.Drawer, {
     anchor: position,
@@ -41,12 +43,12 @@ const GroupingPanel = _ref => {
     ref: drawerRef,
     swipeAreaWidth: 0,
     variant: "permanent"
-  }, open ? /*#__PURE__*/_react.default.createElement(_reactPerfectScrollbar.default, {
+  }, open ? /*#__PURE__*/_react.default.createElement(_reactPerfectScrollbar.default, _extends({}, scrollProps, {
     className: classes.perfectScrollbar,
     options: {
       suppressScrollX: true
     }
-  }, /*#__PURE__*/_react.default.createElement(_ExpandedPanelContent.default, {
+  }), /*#__PURE__*/_react.default.createElement(_ExpandedPanelContent.default, {
     dataTestId: appendedDataTestId
   })) : /*#__PURE__*/_react.default.createElement(_CollapsedPanelContent.default, {
     dataTestId: appendedDataTestId
@@ -59,6 +61,7 @@ GroupingPanel.propTypes = {
   drawerRef: _propTypes.refType,
   onClose: _propTypes.func,
   open: _propTypes.bool,
-  position: _propTypes.string
+  position: _propTypes.string,
+  scrollProps: _propTypes.object
 };
 var _default = exports.default = GroupingPanel;

package/dist/components/UTShortcutPanel/index.js

@@ -24,14 +24,18 @@ const UTShortcutPanelContainer = _ref => {
     classNames,
     classes: theme,
     dataTestId,
+    disableCollapsibleCategories = false,
     handleSelectFilter,
+    hideAddFilterButton = false,
     iconProps,
     noFiltersText,
     noFiltersTitle,
     onDeleteFilterGrouping,
     onEditFilterGrouping,
+    onTogglePanel,
     panelTitle,
     position = _constants.PANEL_POSITIONS.LEFT,
+    scrollProps,
     selectedFilter,
     startOpen = false,
     tooltipsContentMap = {}
@@ -42,12 +46,12 @@ const UTShortcutPanelContainer = _ref => {
   const [filteredValues, setFilteredValues] = (0, _react.useState)(false);
   const handleTogglePanel = () => {
     setOpen(!open);
+    onTogglePanel === null || onTogglePanel === void 0 || onTogglePanel(!open);
   };
   const [filteredCategories, setFilteredCategories] = (0, _react.useState)(categories);
-  const handleAddFilterGroup = () => {
-    // TODO: desarrollo en otro PR
-    alert('handleAddFilterGroup');
-  };
+
+  // TODO: desarrollo en otro PR
+  const handleAddFilterGroup = () => {};
   const handleFilterGroupSearch = value => {
     const filteredResults = categories.map(category => {
       const filters = category.filters.filter(filter => filter.name.toLowerCase().includes(value.toLowerCase()));
@@ -59,12 +63,6 @@ const UTShortcutPanelContainer = _ref => {
     setFilteredCategories(filteredResults);
     setFilteredValues(Boolean(value));
   };
-  const handleDeleteFilterGrouping = filter => {
-    onDeleteFilterGrouping(filter);
-  };
-  const handleEditFilterGrouping = filter => {
-    onEditFilterGrouping(filter);
-  };
   const [popperState, setPopperState] = (0, _react.useState)({});
   const openPopper = _ref2 => {
     let {
@@ -92,25 +90,28 @@ const UTShortcutPanelContainer = _ref => {
     classes,
     closePopper,
     containerRef: containerRef.current,
+    disableCollapsibleCategories,
     filteredValues,
     handleAddFilterGroup,
-    handleDeleteFilterGrouping,
-    handleEditFilterGrouping,
     handleFilterGroupSearch,
     handleSelectFilter,
     handleTogglePanel,
+    hideAddFilterButton,
     iconProps,
     noFiltersText,
     noFiltersTitle,
+    onDeleteFilterGrouping,
+    onEditFilterGrouping,
     open,
     openPopper,
     panelTitle,
     popperState,
     position,
+    scrollProps,
     selectedFilter,
     theme,
     tooltipsContentMap
-  }), [categories, categoriesConfig, classes, filteredCategories, filteredValues, iconProps, noFiltersText, noFiltersTitle, open, popperState, position, selectedFilter]);
+  }), [categories, categoriesConfig, classes, disableCollapsibleCategories, filteredCategories, filteredValues, hideAddFilterButton, iconProps, noFiltersText, noFiltersTitle, onDeleteFilterGrouping, onEditFilterGrouping, open, popperState, position, scrollProps, selectedFilter, theme, tooltipsContentMap]);
   return /*#__PURE__*/_react.default.createElement(_context.default.Provider, {
     value: contextValue
   }, /*#__PURE__*/_react.default.createElement("section", {
@@ -156,14 +157,18 @@ UTShortcutPanelContainer.propTypes = {
   classNames: (0, _propTypes.objectOf)(_propTypes.string),
   classes: (0, _propTypes.objectOf)(_propTypes.string),
   dataTestId: _propTypes.string,
+  disableCollapsibleCategories: _propTypes.bool,
   handleSelectFilter: _propTypes.func,
+  hideAddFilterButton: _propTypes.bool,
   iconProps: _iconTypes.iconPropTypes,
   noFiltersText: _propTypes.string,
   noFiltersTitle: _propTypes.string,
   onDeleteFilterGrouping: _propTypes.func,
   onEditFilterGrouping: _propTypes.func,
+  onTogglePanel: _propTypes.func,
   panelTitle: _propTypes.string,
   position: _propTypes.string,
+  scrollProps: _propTypes.object,
   selectedFilter: (0, _propTypes.shape)({
     id: _propTypes.number,
     name: _propTypes.string,

package/dist/components/UTShortcutPanel/layout.js

@@ -4,12 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = require("prop-types");
 var _iconTypes = require("../../types/iconTypes");
 var _GroupingPanel = _interopRequireDefault(require("./components/GroupingPanel"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const UTShortcutPanel = _ref => {
   let {
     children,
@@ -21,7 +20,7 @@ const UTShortcutPanel = _ref => {
     panelTitle,
     position
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_GroupingPanel.default, {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_GroupingPanel.default, {
     containerRef: containerRef,
     dataTestId: dataTestId,
     iconProps: iconProps,

package/dist/components/UTShortcutPanel/stories/UTShortcutPanel.stories.js

@@ -28,15 +28,19 @@ var _default = exports.default = {
     children: undefined,
     classNames: undefined,
     dataTestId: _constants2.default.DATA_TEST_ID,
+    disableCollapsibleCategories: false,
     handleSelectFilter: (0, _test.fn)(),
+    hideAddFilterButton: false,
     iconProps: undefined,
     noFiltersTitle: _constants2.default.NO_FILTERS_TITLE,
     noFiltersText: _constants2.default.NO_FILTERS_TEXT,
     onDeleteFilterGrouping: (0, _test.fn)(),
     onEditFilterGrouping: (0, _test.fn)(),
+    onTogglePanel: (0, _test.fn)(),
     panelTitle: _constants2.default.PANEL_TITLE,
     position: _constants2.default.POSITION,
     selectedFilter: undefined,
+    scrollProps: undefined,
     startOpen: true,
     tooltipsContentMap: _constants2.default.TOOLTIPS_CONTENT_MAP
   },
@@ -115,6 +119,18 @@ var _default = exports.default = {
         }
       }
     },
+    disableCollapsibleCategories: {
+      control: 'boolean',
+      description: 'Si es `true`, las categorías no se pueden colapsar.',
+      table: {
+        defaultValue: {
+          summary: 'false'
+        },
+        type: {
+          summary: 'boolean'
+        }
+      }
+    },
     handleSelectFilter: {
       action: 'hi',
       control: 'none',
@@ -128,6 +144,18 @@ var _default = exports.default = {
         }
       }
     },
+    hideAddFilterButton: {
+      control: 'boolean',
+      description: 'Si es `true`, el botón de agregar filtro no se muestra.',
+      table: {
+        defaultValue: {
+          summary: 'false'
+        },
+        type: {
+          summary: 'boolean'
+        }
+      }
+    },
     iconProps: {
       control: 'select',
       options: ['default', 'IconX, gray, 18', 'IconHome, error, 30'],
@@ -202,6 +230,18 @@ var _default = exports.default = {
         }
       }
     },
+    onTogglePanel: {
+      control: 'none',
+      description: 'Función callback que se ejecuta cuando se presiona el botón de toggle del panel.',
+      table: {
+        defaultValue: {
+          summary: 'undefined'
+        },
+        type: {
+          summary: 'Function'
+        }
+      }
+    },
     panelTitle: {
       control: 'text',
       description: 'Título del panel.',
@@ -227,6 +267,18 @@ var _default = exports.default = {
         }
       }
     },
+    scrollProps: {
+      control: 'none',
+      description: 'Props para el componente de scroll.',
+      table: {
+        defaultValue: {
+          summary: 'undefined'
+        },
+        type: {
+          summary: 'object'
+        }
+      }
+    },
     selectedFilter: {
       control: 'none',
       description: 'Filtro seleccionado.',
@@ -270,7 +322,7 @@ var _default = exports.default = {
       schema: _propsSchema.default
     },
     controls: {
-      exclude: ['categories', 'categoriesConfig', 'children', 'classNames', 'classes', 'handleSelectFilter', 'onDeleteFilterGrouping', 'onEditFilterGrouping', 'selectedFilter', 'tooltipsContentMap']
+      exclude: ['categories', 'categoriesConfig', 'children', 'classNames', 'classes', 'handleSelectFilter', 'onDeleteFilterGrouping', 'onEditFilterGrouping', 'onTogglePanel', 'scrollProps', 'selectedFilter', 'tooltipsContentMap']
     },
     docs: {
       description: {
@@ -289,7 +341,7 @@ const Playground = exports.Playground = {
   },
   render: args => {
     const [selectedFilter, setSelectedFilter] = (0, _react.useState)(args.selectedFilter);
-    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("section", {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("section", {
       className: _stylesModule.default.storyContainer
     }, /*#__PURE__*/_react.default.createElement(_.default, _extends({}, args, {
       handleSelectFilter: filter => {

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

@@ -124,9 +124,17 @@
             transform: rotate(-90deg);
           }
 
-          .ExpandedPanelContentCategoryHeaderAvatar {
+          .expandedPanelContentCategoryHeaderAvatar {
             border-radius: var(--radius-md, 8px);
           }
+
+          .expandedPanelContentCategoryHeaderLabel {
+            text-transform: uppercase;
+          }
+        }
+
+        .expandedPanelContentCategoryHeaderNoCollapsible {
+          pointer-events: none;
         }
 
         .expandedPanelContentUserFiltersExpanded {
@@ -194,6 +202,10 @@
           .expandedPanelContentCategoryItemActionsContainer {
             @extend %actionsContainer;
           }
+
+          .expandedPanelContentCategoryItemTitleContainerSelected {
+            cursor: default;
+          }
           
           &:hover,
         &[data-test-hover="true"] {

package/package.json

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