@luscii-healthtech/web-ui 0.6.2 → 0.7.2

package/dist/web-ui.esm.js

@@ -362,6 +362,11 @@ var ButtonV2 = function ButtonV2(_ref) {
       className = _ref.className,
       otherAttributes = _objectWithoutPropertiesLoose(_ref, _excluded);
 
+  function handleClick(event) {
+    event.stopPropagation();
+    onClick == null ? void 0 : onClick(event);
+  }
+
   if (!text && !icon) {
     console.error("A text or an icon is required to use this component, please make sure to pass at least one of them as a prop.");
     return /*#__PURE__*/React__default.createElement("span", null, "Invalid props passed to this component.");
@@ -378,7 +383,7 @@ var ButtonV2 = function ButtonV2(_ref) {
   return /*#__PURE__*/React__default.createElement("button", Object.assign({}, otherAttributes, {
     className: buttonClassName,
     type: "button",
-    onClick: onClick,
+    onClick: handleClick,
     disabled: isDisabled,
     "aria-disabled": isDisabled
   }), icon && /*#__PURE__*/React__default.createElement(icon, {
@@ -2085,7 +2090,10 @@ function TableBodyRowDataCell(props) {
     text: content.tag.text,
     colorTheme: content.tag.color
   })), /*#__PURE__*/React__default.createElement(Text, {
-    className: "py-4 text-left leading-5 break-all",
+    className: classNames("py-4 text-left leading-5", {
+      "break-all": content.breakAllWord,
+      "break-words": !content.breakAllWord
+    }),
     text: content.text === "" ? emptyFieldContentText : content.text,
     type: "base"
   })), isTableFieldAction(content) && /*#__PURE__*/React__default.createElement("div", {
@@ -2098,8 +2106,7 @@ function TableBodyRowDataCell(props) {
       className: "ml-2 first:ml-0",
       key: action.key,
       icon: action.icon,
-      onClick: function onClick(event) {
-        event.stopPropagation();
+      onClick: function onClick() {
         action.handleClick(props.item);
       }
     });
@@ -2563,32 +2570,54 @@ Menu.propTypes = {
   children: PropTypes.node.isRequired
 };
 
-var _excluded$9 = ["icon", "subTitle", "title", "accessories", "tooltipId"];
+var _excluded$9 = ["icon", "subtitle", "title", "accessories", "tooltipId", "onAssetLoadError"];
 var ListItem = function ListItem(_ref) {
   var icon = _ref.icon,
-      subTitle = _ref.subTitle,
+      subtitle = _ref.subtitle,
       title = _ref.title,
       accessories = _ref.accessories,
       tooltipId = _ref.tooltipId,
+      onAssetLoadError = _ref.onAssetLoadError,
       restProps = _objectWithoutPropertiesLoose(_ref, _excluded$9);
 
+  function onListItemIconLoadError() {
+    console.error({
+      message: "Url from icon failed to load, please check the props passed to `ListItem`.",
+      icon: icon,
+      title: title,
+      subtitle: subtitle
+    });
+    onAssetLoadError == null ? void 0 : onAssetLoadError({
+      title: title,
+      subtitle: subtitle,
+      itemId: restProps.itemId,
+      icon: icon
+    });
+  }
+
   return /*#__PURE__*/React__default.createElement("li", {
-    className: classNames("flex flex-row items-center space-x-4", "p-4 border-b last:border-b-0 border-slate-200", {
-      "cursor-pointer": restProps.handleItemClick
+    className: classNames("flex flex-row items-center space-x-4 bg-white", "p-4 border-b last:border-b-0 border-slate-200", {
+      "cursor-pointer": restProps.handleItemClick,
+      "hover:bg-blue-50 transition-colors ease-in-out duration-300": restProps.handleItemClick
     }),
     onClick: restProps.handleItemClick,
     "data-tip": restProps.itemId,
     "data-for": tooltipId
-  }, icon && /*#__PURE__*/React__default.createElement(icon, {
+  }, icon && typeof icon === "function" && /*#__PURE__*/React__default.createElement(icon, {
     className: "w-6 h-6"
+  }), icon && typeof icon === "string" && /*#__PURE__*/React__default.createElement("img", {
+    src: icon,
+    alt: "list-item-icon",
+    className: "w-6 h-6 text-sm",
+    onError: onListItemIconLoadError
   }), /*#__PURE__*/React__default.createElement("div", {
     className: classNames({
       "pl-10": icon === null
     })
   }, /*#__PURE__*/React__default.createElement(Text, {
     text: title
-  }), subTitle && /*#__PURE__*/React__default.createElement(Text, {
-    text: subTitle,
+  }), subtitle && /*#__PURE__*/React__default.createElement(Text, {
+    text: subtitle,
     type: "sm"
   })), /*#__PURE__*/React__default.createElement("div", {
     className: "flex-grow"
@@ -2596,12 +2625,14 @@ var ListItem = function ListItem(_ref) {
 };
 
 var List = function List(_ref) {
-  var items = _ref.items;
+  var items = _ref.items,
+      onAssetLoadError = _ref.onAssetLoadError;
   return /*#__PURE__*/React__default.createElement("ul", {
-    className: classNames("list-none")
+    className: classNames("list-none bg-white")
   }, items.map(function (item) {
     return /*#__PURE__*/React__default.createElement(ListItem, Object.assign({}, item, {
-      key: item.itemId
+      key: item.itemId,
+      onAssetLoadError: onAssetLoadError
     }));
   }));
 };