@widergy/energy-ui 3.126.0 → 3.128.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [3.128.0](https://github.com/widergy/energy-ui/compare/v3.127.0...v3.128.0) (2026-01-07)
+
+
+### Features
+
+* [AXCH-842] uticon and utselectable card features ([#729](https://github.com/widergy/energy-ui/issues/729)) ([0874a52](https://github.com/widergy/energy-ui/commit/0874a52d6973e0e21245c9a1bc730ceb4232cef7))
+
+# [3.127.0](https://github.com/widergy/energy-ui/compare/v3.126.0...v3.127.0) (2026-01-06)
+
+
+### Features
+
+* [PDI-564] citation chips ([#739](https://github.com/widergy/energy-ui/issues/739)) ([e8259c5](https://github.com/widergy/energy-ui/commit/e8259c56f2b378680bd893fb571984d7fedc2060))
+
 # [3.126.0](https://github.com/widergy/energy-ui/compare/v3.125.1...v3.126.0) (2025-12-17)
 
 

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

@@ -5,6 +5,7 @@
   border-width: 1px;
   display: flex;
   flex-direction: row;
+  flex-shrink: 0;
   grid-gap: 8px;
   transition:
     background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,

package/dist/components/UTIcon/theme.js

@@ -95,6 +95,7 @@ exports.getClassNames = getClassNames;
 const retrieveStyle = _ref4 => {
   var _theme$Palette$action2, _theme$Palette$action3, _theme$Palette$action4;
   let {
+    areaColor,
     color,
     colorTheme,
     shade,
@@ -107,16 +108,16 @@ const retrieveStyle = _ref4 => {
   });
   const border = "2px solid ".concat(borderColor);
   const defaultBackgrounds = {
-    accent: ((_theme$Palette$action2 = theme.Palette.actions) === null || _theme$Palette$action2 === void 0 ? void 0 : _theme$Palette$action2.accent['01']) || theme.Palette.accent['01'],
-    dark: theme.Palette.light['03'],
-    error: theme.Palette.error['01'],
-    gray: theme.Palette.light['03'],
-    information: theme.Palette.information['01'],
-    light: theme.Palette.light['03'],
-    negative: ((_theme$Palette$action3 = theme.Palette.actions) === null || _theme$Palette$action3 === void 0 ? void 0 : _theme$Palette$action3.negative['01']) || theme.Palette.negative['01'],
-    neutral: ((_theme$Palette$action4 = theme.Palette.actions) === null || _theme$Palette$action4 === void 0 ? void 0 : _theme$Palette$action4.neutral['01']) || theme.Palette.neutral['01'],
-    success: theme.Palette.success['01'],
-    warning: theme.Palette.warning['01']
+    accent: areaColor || ((_theme$Palette$action2 = theme.Palette.actions) === null || _theme$Palette$action2 === void 0 ? void 0 : _theme$Palette$action2.accent['01']) || theme.Palette.accent['01'],
+    dark: areaColor || theme.Palette.light['03'],
+    error: areaColor || theme.Palette.error['01'],
+    gray: areaColor || theme.Palette.light['03'],
+    information: areaColor || theme.Palette.information['01'],
+    light: areaColor || theme.Palette.light['03'],
+    negative: areaColor || ((_theme$Palette$action3 = theme.Palette.actions) === null || _theme$Palette$action3 === void 0 ? void 0 : _theme$Palette$action3.negative['01']) || theme.Palette.negative['01'],
+    neutral: areaColor || ((_theme$Palette$action4 = theme.Palette.actions) === null || _theme$Palette$action4 === void 0 ? void 0 : _theme$Palette$action4.neutral['01']) || theme.Palette.neutral['01'],
+    success: areaColor || theme.Palette.success['01'],
+    warning: areaColor || theme.Palette.warning['01']
   };
   const variantStyles = Object.keys(defaultBackgrounds).reduce((acc, type) => {
     acc["".concat(type, "Default")] = {

package/dist/components/UTLabel/components/Markdown/components/BlockQuote/styles.module.scss

@@ -5,6 +5,7 @@
   white-space: pre-line;
 
   &:before {
+    background: var(--gray01);
     border-radius: 3;
     content: '';
     display: block;

package/dist/components/UTLabel/components/Markdown/components/Citation/constants.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EXTENSION_ICON = exports.DEFAULT_ICON = void 0;
+const EXTENSION_ICON = exports.EXTENSION_ICON = {
+  doc: 'IconFileTypeDoc',
+  docx: 'IconFileTypeDocx',
+  jpg: 'IconFileTypeJpg',
+  pdf: 'IconFileTypePdf',
+  txt: 'IconFileTypeTxt',
+  xls: 'IconFileTypeXls',
+  xml: 'IconFileTypeXml',
+  zip: 'IconFileTypeZip'
+};
+const DEFAULT_ICON = exports.DEFAULT_ICON = 'IconFile';

package/dist/components/UTLabel/components/Markdown/components/Citation/index.js

@@ -6,8 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = require("prop-types");
-var _UTButton = _interopRequireDefault(require("../../../../../UTButton"));
+var _UTChip = _interopRequireDefault(require("../../../../../UTChip"));
 var _WithCustomHandler = _interopRequireDefault(require("../WithCustomHandler"));
+var _utils = require("./utils");
 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 Citation = _ref => {
@@ -15,9 +16,16 @@ const Citation = _ref => {
     label,
     url
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_UTButton.default, {
-    colorTheme: "secondary",
-    onClick: () => window.open(url, '_blank', 'noopener,noreferrer'),
+  const onClick = () => window.open(url, '_blank', 'noopener,noreferrer');
+  const icon = (0, _utils.getIcon)(label, url);
+  return /*#__PURE__*/_react.default.createElement(_UTChip.default, {
+    adornment: {
+      props: {
+        name: icon
+      },
+      type: 'icon'
+    },
+    onClick: onClick,
     size: "small"
   }, label);
 };

package/dist/components/UTLabel/components/Markdown/components/Citation/utils.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getIcon = void 0;
+var _constants = require("./constants");
+const getFileExtension = str => {
+  if (!str) return null;
+  const match = str.match(/\.([a-zA-Z0-9]+)(?:\?|$)/);
+  return match ? match[1].toLowerCase() : null;
+};
+const getIcon = (label, url) => {
+  const extension = getFileExtension(label) || getFileExtension(url);
+  const icon = extension && _constants.EXTENSION_ICON[extension] || _constants.DEFAULT_ICON;
+  return icon;
+};
+exports.getIcon = getIcon;

package/dist/components/UTLabel/components/Markdown/components/CitationGroup/index.js

@@ -5,21 +5,19 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _propTypes = require("prop-types");
 var _WithCustomHandler = _interopRequireDefault(require("../WithCustomHandler"));
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 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 CitationGroup = _ref => {
   let {
-    children,
-    classes
+    children
   } = _ref;
+  const [isHovered, setIsHovered] = (0, _react.useState)(false);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "".concat(_stylesModule.default.citationGroup, " ").concat(classes.citationGroup)
+    className: "".concat(_stylesModule.default.citationGroup, " ").concat(isHovered ? _stylesModule.default.isHovered : ''),
+    onMouseEnter: () => setIsHovered(true),
+    onMouseLeave: () => setIsHovered(false)
   }, children);
 };
-CitationGroup.propTypes = {
-  classes: (0, _propTypes.objectOf)(_propTypes.string)
-};
 var _default = exports.default = /*#__PURE__*/(0, _react.memo)((0, _WithCustomHandler.default)(CitationGroup));

package/dist/components/UTLabel/components/Markdown/components/CitationGroup/styles.module.scss

@@ -8,15 +8,22 @@
   scroll-behavior: smooth;
   scroll-snap-type: x mandatory;
 
-  button {
-    flex: 0 0 auto;
-  }
-
   &::-webkit-scrollbar {
     height: 8px;
   }
 
-  &::-webkit-scrollbar * {
+  &::-webkit-scrollbar-track {
     background-color: transparent;
   }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: transparent;
+    border-radius: 4px;
+  }
+
+  &.isHovered {
+    &::-webkit-scrollbar-thumb {
+      background-color: var(--light05);
+    }
+  }
 }

package/dist/components/UTLabel/components/Markdown/components/ListItem/index.js

@@ -8,6 +8,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _propTypes = require("prop-types");
 var _UTIcon = _interopRequireDefault(require("../../../../../UTIcon"));
 var _WithCustomHandler = _interopRequireDefault(require("../WithCustomHandler"));
+var _utils = require("../../utils");
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 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); }
@@ -15,7 +16,6 @@ const ListItem = _ref => {
   var _node$properties;
   let {
     children,
-    classes,
     node,
     ...props
   } = _ref;
@@ -36,18 +36,17 @@ const ListItem = _ref => {
     }), /*#__PURE__*/_react.default.createElement("span", {
       className: _stylesModule.default.itemContentChecked
     }, contentNodes)) : /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
-      className: "".concat(_stylesModule.default.taskItemIconUnchecked, " ").concat(classes === null || classes === void 0 ? void 0 : classes.taskItemIconUnchecked)
+      className: _stylesModule.default.taskItemIconUnchecked
     }), /*#__PURE__*/_react.default.createElement("span", null, contentNodes)));
   }
   const safeChildren = Array.isArray(children) ? children : children ? [children] : [];
   const mergedProps = {
-    ...props,
+    ...(0, _utils.cleanElementProps)(props),
     ...((node === null || node === void 0 ? void 0 : node.properties) || {})
   };
   return /*#__PURE__*/_react.default.createElement('li', mergedProps, safeChildren);
 };
 ListItem.propTypes = {
-  classes: (0, _propTypes.objectOf)(_propTypes.string),
   node: _propTypes.object
 };
 var _default = exports.default = /*#__PURE__*/(0, _react.memo)((0, _WithCustomHandler.default)(ListItem));

package/dist/components/UTLabel/components/Markdown/components/ListItem/styles.module.scss

@@ -7,9 +7,8 @@
 }
 
 .taskItemIconUnchecked {
+  border: 1px solid var(--gray01);
   border-radius: 50%;
-  border-style: solid;
-  border-width: 1px;
   box-sizing: border-box;
   display: inline-block;
   flex-shrink: 0;

package/dist/components/UTLabel/components/Markdown/components/Section/index.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = require("prop-types");
+var _utils = require("../../utils");
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 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); }
@@ -20,7 +21,7 @@ const Section = _ref => {
   } = _ref;
   const isFootnotesSection = (node === null || node === void 0 || (_node$properties = node.properties) === null || _node$properties === void 0 ? void 0 : _node$properties.dataFootnotes) !== undefined;
   if (!isFootnotesSection) {
-    return /*#__PURE__*/_react.default.createElement('section', props, children);
+    return /*#__PURE__*/_react.default.createElement('section', (0, _utils.cleanElementProps)(props), children);
   }
   const reactChildren = _react.default.Children.toArray(children);
   const ol = reactChildren.find(c => (c === null || c === void 0 ? void 0 : c.type) === 'ol');

package/dist/components/UTLabel/components/Markdown/customPlugins/remarkCitations.js

@@ -27,8 +27,7 @@ var _default = () => {
       const getText = n => {
         if (n.type === _constants.NODE_TYPES.TEXT) return n.value || '';
         if (n.type === _constants.NODE_TYPES.LINK) {
-          const inner = Array.isArray(n.children) ? n.children.map(getText).join('') : '';
-          return inner + (n.url || '');
+          return Array.isArray(n.children) ? n.children.map(getText).join('') : '';
         }
         if (Array.isArray(n.children)) return n.children.map(getText).join('');
         return '';

package/dist/components/UTLabel/components/Markdown/utils.js

@@ -3,8 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getMarkdownPlugins = void 0;
+exports.getMarkdownPlugins = exports.cleanElementProps = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
 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); }
@@ -36,4 +37,12 @@ const getMarkdownPlugins = function (classes, markdownExtended) {
     remarkPlugins
   };
 };
-exports.getMarkdownPlugins = getMarkdownPlugins;
+exports.getMarkdownPlugins = getMarkdownPlugins;
+const cleanElementProps = function () {
+  let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  if ((0, _isEmpty.default)(props)) return {};
+  if (props.markdownExtended) delete props.markdownExtended;
+  if (props.customHandler) delete props.customHandler;
+  return props;
+};
+exports.cleanElementProps = cleanElementProps;

package/dist/components/UTLabel/theme.js

@@ -197,23 +197,12 @@ const retrieveStyle = _ref2 => {
       }
     },
     blockquote: {
-      color: grayTextColor,
-      '&::before': {
-        background: theme.Palette[_Palette.COLOR_THEMES.gray][_Palette.COLOR_SHADES.shade01]
-      }
-    },
-    citationGroup: {
-      '&::-webkit-scrollbar-thumb': {
-        backgroundColor: theme.Palette[_Palette.COLOR_THEMES.gray][_Palette.COLOR_SHADES.shade04]
-      }
+      color: grayTextColor
     },
     customFootnotes: {
       '& span': {
         color: grayTextColor
       }
-    },
-    taskItemIconUnchecked: {
-      borderColor: theme.Palette[_Palette.COLOR_THEMES.gray][_Palette.COLOR_SHADES.shade01]
     }
   };
 };

package/dist/components/UTSelectableCard/constants.js

@@ -9,6 +9,8 @@ const APPEARANCES = exports.APPEARANCES = {
   WHITE: 'white'
 };
 const SIZES = exports.SIZES = {
+  XLARGE: 'xlarge',
+  LARGE: 'large',
   MEDIUM: 'medium',
   SMALL: 'small'
 };

package/dist/components/UTSelectableCard/index.js

@@ -12,6 +12,7 @@ var _UTTooltip = _interopRequireDefault(require("../UTTooltip"));
 var _WithTheme = _interopRequireDefault(require("../WithTheme"));
 var _componentUtils = require("../../utils/componentUtils");
 var _UTIcon = _interopRequireDefault(require("../UTIcon"));
+var _UTAvatar = _interopRequireDefault(require("../UTAvatar"));
 var _constants = require("./constants");
 var _theme = require("./theme");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -56,6 +57,8 @@ const UTSelectableCard = _ref => {
     dataTestId,
     description,
     disabled = false,
+    avatar,
+    avatarProps = {},
     Icon,
     iconProps = {},
     onClick,
@@ -71,12 +74,15 @@ const UTSelectableCard = _ref => {
   }, iconProps)) : /*#__PURE__*/_react.default.createElement(Icon, {
     className: "".concat(classes.icon, " ").concat(classNames.icon)
   });
+  const AvatarComponent = avatar ? /*#__PURE__*/_react.default.createElement(_UTAvatar.default, _extends({
+    size: _constants.SIZES.LARGE
+  }, avatarProps)) : null;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "\n      ".concat(classes.item, "\n      ").concat(disabled ? classes["".concat(appearance, "DisabledContainer")] : selected ? classes["".concat(appearance, "SelectedContainer")] : classes["".concat(appearance, "Apareance")], "\n      ").concat(classes["".concat(size, "Size")], "\n    "),
+    className: "\n  ".concat(classes.item, "\n  ").concat(disabled ? "".concat(classes["".concat(appearance, "DisabledContainer")], " ").concat(classNames["".concat(appearance, "DisabledContainer")] || '') : selected ? "".concat(classes["".concat(appearance, "SelectedContainer")], " ").concat(classNames["".concat(appearance, "SelectedContainer")] || '') : "".concat(classes["".concat(appearance, "Apareance")], " ").concat(classNames["".concat(appearance, "Apareance")] || ''), "\n  ").concat(classes["".concat(size, "Size")], "\n"),
     "data-testid": dataTestId,
     onClick: () => !disabled && onClick(),
     role: "button"
-  }, Icon && IconComponent, /*#__PURE__*/_react.default.createElement("div", {
+  }, Icon && !avatar && IconComponent, avatar && !Icon && AvatarComponent, /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(classes.textContainer, " ").concat(checkIcon && classes.textContainerWithCheckedIcon)
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: classes.column
@@ -113,6 +119,8 @@ UTSelectableCard.propTypes = {
     title: _propTypes.string
   }),
   appearance: (0, _propTypes.oneOf)([_constants.APPEARANCES.GRAY, _constants.APPEARANCES.WHITE]),
+  avatar: _propTypes.bool,
+  avatarProps: (0, _propTypes.objectOf)(_propTypes.string),
   checkIcon: _propTypes.bool,
   classes: (0, _propTypes.objectOf)(_propTypes.string),
   classNames: (0, _propTypes.objectOf)(_propTypes.string),

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

@@ -162,7 +162,7 @@ const propTypes = exports.propTypes = {
   classNames: (0, _propTypes.objectOf)(_propTypes.string),
   dataTestId: _propTypes.string,
   disabled: _propTypes.bool,
-  error: _propTypes.bool,
+  error: (0, _propTypes.oneOfType)([_propTypes.bool, _propTypes.string]),
   helpText: _propTypes.string,
   helperTextDataTestId: _propTypes.string,
   id: _propTypes.string,

package/package.json

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