@vitrosoftware/common-ui-ts 1.1.40 → 1.1.41

package/css/std/controls/image-picker/image-picker.css

@@ -35,10 +35,18 @@
     background: var(--grey-grey-sh-50, rgba(228, 230, 236, 0.50));
 }
 
-.vitro-image-picker-icon {
-    width: 50%;
-    height: 50%;
-    margin: 0 auto;
+.vitro-image-picker-icon-wrapper {
+    width: 76px;
+    height: 76px;
+    display: inline-block;
+    border-radius: 50%;
+    overflow: hidden;
+}
+
+.vitro-image-picker-icon-wrapper img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
 }
 
 .vitro-image-picker-input {

package/css/std/controls/lookup-picker/lookup-picker-value-list.css

@@ -12,6 +12,7 @@
 
 .vitro-value-list > :global(.ps) {
     padding-right: 0 !important;
+    max-height: 300px;
 }
 
 .vitro-value-list > :global(.ps) > div:first-child {

package/dist/index.css

@@ -3084,6 +3084,7 @@
 
 ._lookup-picker-value-list_vitro-value-list_LSdCMjq > .ps {
     padding-right: 0 !important;
+    max-height: 300px;
 }
 
 ._lookup-picker-value-list_vitro-value-list_LSdCMjq > .ps > div:first-child {
@@ -4623,10 +4624,19 @@ ul > li:last-child > ul > li:last-child ._sidebar-item_vitro-active_7p5iOhY {
     background: var(--grey-grey-sh-50, rgba(228, 230, 236, 0.50));
 }
 
-._image-picker_vitro-image-picker-icon_1q7KZiW {
-    width: 50%;
-    height: 50%;
-    margin: 0 auto;
+._image-picker_vitro-image-picker-icon-wrapper_3DNyLS0 {
+    width: 76px;
+    height: 76px;
+    display: inline-block;
+    border-radius: 50%;
+    overflow: hidden;
+}
+
+._image-picker_vitro-image-picker-icon-wrapper_3DNyLS0 img {
+    width: 100%;
+    height: 100%;
+    -o-object-fit: cover;
+       object-fit: cover;
 }
 
 ._image-picker_vitro-image-picker-input_12jFFNU {

package/dist/index.js

@@ -60812,7 +60812,7 @@ var Avatar = function Avatar(props) {
   };
   var getBackground = function getBackground() {
     if (props.image) {
-      return props.image;
+      return "url(\"" + props.image + "\")";
     } else if (props.userName) {
       return getBgColor(props.userName);
     }
@@ -60843,9 +60843,10 @@ var Avatar = function Avatar(props) {
   return React__default.createElement("div", {
     className: className,
     style: {
-      background: getBackground()
+      background: getBackground(),
+      backgroundSize: props.image ? "cover" : undefined
     }
-  }, getInitials());
+  }, props.image ? null : getInitials());
 };
 
 var styles$i = {"vitro-issue-tile-header":"_issue-tile-header_vitro-issue-tile-header_jTcaXBE","vitro-link":"_issue-tile-header_vitro-link_9DQ3Bqk","vitro-user-info":"_issue-tile-header_vitro-user-info_16Yhluy","vitro-avatar":"_issue-tile-header_vitro-avatar_3rf1BME","vitro-dropdown-button":"_issue-tile-header_vitro-dropdown-button_1-7nI-k"};
@@ -64033,6 +64034,7 @@ var UserProfile = function UserProfile(props) {
     className: styles$D['vitro-text-color-white']
   }, createSurnameWithInitials(props.userName)), React__default.createElement(Avatar, {
     userName: props.userName,
+    image: props.image,
     isBigSize: true
   }))), React__default.createElement(DropdownMenu$2, {
     right: true
@@ -64203,7 +64205,7 @@ var MessageInput = function MessageInput(props) {
   }));
 };
 
-var styles$J = {"vitro-image-picker-root":"_image-picker_vitro-image-picker-root_AqOYRhP","vitro-image-picker-dropdown-wrapper":"_image-picker_vitro-image-picker-dropdown-wrapper_8Tr_BBS","vitro-image-picker-defaultIcon-wrapper":"_image-picker_vitro-image-picker-defaultIcon-wrapper_1XLKgLW","vitro-image-picker-icon":"_image-picker_vitro-image-picker-icon_1q7KZiW","vitro-image-picker-input":"_image-picker_vitro-image-picker-input_12jFFNU","vitro-icon-default":"_image-picker_vitro-icon-default_2Hdhta2","vitro-image-picker-label-wrapper":"_image-picker_vitro-image-picker-label-wrapper_WRLzUYM","vitro-image-picker-wrapper":"_image-picker_vitro-image-picker-wrapper_dlZyYFL"};
+var styles$J = {"vitro-image-picker-root":"_image-picker_vitro-image-picker-root_AqOYRhP","vitro-image-picker-dropdown-wrapper":"_image-picker_vitro-image-picker-dropdown-wrapper_8Tr_BBS","vitro-image-picker-defaultIcon-wrapper":"_image-picker_vitro-image-picker-defaultIcon-wrapper_1XLKgLW","vitro-image-picker-icon-wrapper":"_image-picker_vitro-image-picker-icon-wrapper_3DNyLS0","vitro-image-picker-input":"_image-picker_vitro-image-picker-input_12jFFNU","vitro-icon-default":"_image-picker_vitro-icon-default_2Hdhta2","vitro-image-picker-label-wrapper":"_image-picker_vitro-image-picker-label-wrapper_WRLzUYM","vitro-image-picker-wrapper":"_image-picker_vitro-image-picker-wrapper_dlZyYFL"};
 
 var ACTION$1;
 (function (ACTION) {
@@ -64218,6 +64220,22 @@ var LOCALE$7;
 
 var ImagePicker = function ImagePicker(props) {
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
+  var renderPrevie = function renderPrevie() {
+    if (props.defaultUrl) {
+      return React__default.createElement("div", {
+        className: props.classNameDefaultIcon ? props.classNameDefaultIcon : styles$J['vitro-image-picker-icon-wrapper']
+      }, React__default.createElement(Icon, {
+        defaultUrl: props.defaultUrl,
+        className: props.classNameIcon ? props.classNameIcon : styles$J['vitro-image-picker-icon']
+      }));
+    } else {
+      return React__default.createElement("div", {
+        className: props.classNameDefaultIcon ? props.classNameDefaultIcon : styles$J['vitro-image-picker-defaultIcon-wrapper']
+      }, React__default.createElement("div", {
+        className: styles$J['vitro-icon-default']
+      }));
+    }
+  };
   var defaultItemList = React.useMemo(function () {
     var _props$itemList;
     var result = [{
@@ -64261,14 +64279,7 @@ var ImagePicker = function ImagePicker(props) {
     className: styles$J['vitro-image-picker-input'],
     ref: props.inputFileRef,
     accept: "image/*"
-  }), props.defaultUrl ? React__default.createElement(Icon, {
-    defaultUrl: props.defaultUrl,
-    className: props.classNameIcon ? props.classNameIcon : styles$J['vitro-image-picker-icon']
-  }) : React__default.createElement("div", {
-    className: props.classNameDefaultIcon ? props.classNameDefaultIcon : styles$J['vitro-image-picker-defaultIcon-wrapper']
-  }, React__default.createElement("div", {
-    className: styles$J['vitro-icon-default']
-  }))));
+  }), renderPrevie()));
 };
 
 var styles$K = {"vitro-criterion-container":"_criterion_vitro-criterion-container_2cYcSkL","vitro-block":"_criterion_vitro-block_3E9-RXM","vitro-control":"_criterion_vitro-control_2JLaybj","vitro-label":"_criterion_vitro-label_3F6a8dj","vitro-operator-select-container":"_criterion_vitro-operator-select-container_3OkjzXG","vitro-operator-select":"_criterion_vitro-operator-select_1guNlk9","vitro-operator-list":"_criterion_vitro-operator-list_3A2VZsd","vitro-button-cancel":"_criterion_vitro-button-cancel_2C2G0sL","vitro-focus":"_criterion_vitro-focus_3FNLsoN","vitro-error":"_criterion_vitro-error_3pvFrlW","vitro-condition-select":"_criterion_vitro-condition-select_1hTBBg-","vitro-icon":"_criterion_vitro-icon_1DmS0jh","vitro-condition-list":"_criterion_vitro-condition-list_10UIxJI"};