@vitrosoftware/common-ui-ts 1.1.19 → 1.1.20

package/dist/index.js

@@ -20128,6 +20128,7 @@ var EVENT$1;
   EVENT["CLOSE_NODE"] = "close_node.jstree";
   EVENT["SELECT_NODE"] = "select_node.jstree";
   EVENT["LOADED"] = "loaded.jstree";
+  EVENT["MODEL"] = "model.jstree";
 })(EVENT$1 || (EVENT$1 = {}));
 var NODE_TYPE;
 (function (NODE_TYPE) {
@@ -20970,7 +20971,6 @@ var MicroFrontend = function MicroFrontend(props) {
 
 var EVENT$3;
 (function (EVENT) {
-  EVENT["UPLOAD_START"] = "vitro.upload.start";
   EVENT["ADD_FILE"] = "vitro.file.add";
   EVENT["READY_STATE_CHANGE"] = "readystatechange";
 })(EVENT$3 || (EVENT$3 = {}));
@@ -20993,7 +20993,7 @@ var COLOR_GREEN = '#198754';
 var KENDO_UPLOAD = 'kendoUpload';
 var AUTHORIZATION_TOKEN_HEADER = 'AuthorizationToken';
 var TelerikUploaderContextImpl = /*#__PURE__*/function () {
-  function TelerikUploaderContextImpl(uploader, container, dropZone, settings, localeService, onUploadComplete) {
+  function TelerikUploaderContextImpl(uploader, container, dropZone, settings, localeService, toggleButtons) {
     this.token = CTRL.EMPTY;
     this.successCount = 0;
     this.errorCount = 0;
@@ -21005,14 +21005,14 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
     this.container = container[0];
     this.settings = settings;
     this.localeService = localeService;
-    this.onUploadComplete = onUploadComplete;
+    this.toggleButtons = toggleButtons;
     this.id = uploader[0].id;
     var component = this;
     var telerikConfig = {
       async: {
         saveUrl: settings.async.saveUrl,
-        autoUpload: settings.async.autoUpload,
-        batch: settings.async.batch
+        autoUpload: settings.async.isAutoUpload,
+        batch: settings.async.isBatch
       },
       upload: function upload(e) {
         return component.upload(e);
@@ -21038,7 +21038,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
       cancel: function cancel(e) {
         return component.cancel(e);
       },
-      directoryDrop: settings.directoryDrop,
+      directoryDrop: settings.isDirectoryDrop,
       dropZone: dropZone,
       localization: {
         cancel: this.localeService.create(LOCALE.CANCEL),
@@ -21065,6 +21065,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
     this.subtitle.empty();
     this.title.empty();
     this.progressInfo.removeClass('vitro-upload-complete');
+    $$1(this.container).removeClass('vitro-upload-active');
   };
   _proto.initAuthorization = function initAuthorization(e, token) {
     var xhr = e.XMLHttpRequest;
@@ -21077,10 +21078,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
   _proto.upload = function upload(e) {
     this.initAuthorization(e, this.token);
     this.fileList = [].concat(this.fileList, e.files);
-    var event = new CustomEvent(EVENT$3.UPLOAD_START, {
-      detail: this
-    });
-    window.dispatchEvent(event);
+    this.toggleButtons(true);
     if (this.settings.upload) {
       this.settings.upload(e);
     }
@@ -21097,18 +21095,30 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
   _proto.progress = function progress(e) {
     this.progressInfo.show();
     this.setFileProgress(e.files[0].uid, e.percentComplete);
-    if (e.percentComplete == 100 || this.successCount + this.errorCount == 0) {
-      var info = this.getProgressInfo();
-      this.title.text(this.localeService.create(LOCALE.PROGRESS_PERCENT, {
-        percent: info.percent
-      }));
-      this.subtitle.text(this.localeService.create(LOCALE.PROGRESS_COUNT, {
-        count: info.count
-      }));
-      this.setProgressBar(info.percent);
+    var info = {
+      count: 0,
+      percent: 0
+    };
+    if (this.fileList.length === 1) {
+      info = {
+        count: 1,
+        percent: e.percentComplete
+      };
+    } else {
+      if (e.percentComplete == 100 || this.successCount + this.errorCount == 0) {
+        info = this.getProgressInfo();
+      }
     }
+    this.title.text(this.localeService.create(LOCALE.PROGRESS_PERCENT, {
+      percent: info.percent
+    }));
+    this.subtitle.text(this.localeService.create(LOCALE.PROGRESS_COUNT, {
+      count: info.count
+    }));
+    this.setProgressBar(info.percent);
   };
   _proto.complete = function complete(e) {
+    var _this = this;
     this.progressInfo.addClass('vitro-upload-complete');
     this.subtitle.empty();
     this.title.text(this.localeService.create(LOCALE.SUCCESS, {
@@ -21120,7 +21130,12 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
       }));
     }
     this.setProgressBar(100);
-    this.onUploadComplete();
+    if (this.settings.isAutoReset) {
+      window.setTimeout(function () {
+        _this.clearAllFiles();
+        _this.toggleButtons(false);
+      }, this.settings.resetDurationMs || 5000);
+    }
   };
   _proto.select = function select(e) {
     this.container.classList.remove('vitro-dropzone-active');
@@ -21230,7 +21245,7 @@ var TelerikUploader = function TelerikUploader(props) {
       var input = $$2(uploaderRef.current);
       var dropZone = $$2(dropZoneRef.current);
       var container = $$2(containerRef.current);
-      var _kendoUploader = new TelerikUploaderContextImpl(input, container, dropZone, props.settings, localeService, onUploadComplete);
+      var _kendoUploader = new TelerikUploaderContextImpl(input, container, dropZone, props.settings, localeService, toggleButtons);
       setKendoUploader(_kendoUploader);
       if (props.onInit) {
         props.onInit(_kendoUploader);
@@ -21239,7 +21254,6 @@ var TelerikUploader = function TelerikUploader(props) {
   }, [uploaderRef, dropZoneRef]);
   React.useEffect(function () {
     if (kendoUploader) {
-      window.addEventListener(EVENT$3.UPLOAD_START, onUpload);
       window.addEventListener(EVENT$3.ADD_FILE, addFile);
       window.addEventListener(EVENT.DRAGOVER, function (e) {
         return onDragOver(e);
@@ -21249,7 +21263,6 @@ var TelerikUploader = function TelerikUploader(props) {
       });
     }
     return function () {
-      window.removeEventListener(EVENT$3.UPLOAD_START, onUpload);
       window.removeEventListener(EVENT$3.ADD_FILE, addFile);
       window.removeEventListener(EVENT.DRAGOVER, function (e) {
         return onDragOver(e);
@@ -21264,26 +21277,15 @@ var TelerikUploader = function TelerikUploader(props) {
       kendoUploader.addFile();
     }
   };
-  var onUpload = function onUpload(e) {
-    var uploader = e.detail;
-    if (uploader.id === props.id) {
-      setShowClose(true);
-    }
-  };
-  var onUploadComplete = function onUploadComplete() {
-    if (props.isAutoClose) {
-      window.setTimeout(function () {
-        clearUploadResult();
-      }, props.durationMs || 5000);
-    }
+  var toggleButtons = function toggleButtons(show) {
+    setShowClose(show);
+    setHide(false);
   };
   var clearUploadResult = function clearUploadResult() {
     if (kendoUploader) {
       kendoUploader.clearAllFiles();
     }
-    setShowClose(false);
-    setHide(false);
-    containerRef.current.classList.remove('vitro-upload-active');
+    toggleButtons(false);
   };
   var hideUploadResult = function hideUploadResult() {
     setHide(!hide);
@@ -21291,13 +21293,15 @@ var TelerikUploader = function TelerikUploader(props) {
   var onDragOver = function onDragOver(e) {
     var includesFiles = e.dataTransfer.types.includes(TYPE_FILES);
     e.preventDefault();
-    if (!containerRef.current.classList.contains('vitro-dropzone-active') && includesFiles) {
+    if (containerRef.current && !containerRef.current.classList.contains('vitro-dropzone-active') && includesFiles) {
       containerRef.current.classList.add('vitro-dropzone-active');
     }
   };
   var onDragLeave = function onDragLeave(e) {
     e.preventDefault();
-    containerRef.current.classList.remove('vitro-dropzone-active');
+    if (containerRef.current) {
+      containerRef.current.classList.remove('vitro-dropzone-active');
+    }
   };
   return React__default.createElement("div", {
     id: componentName,
@@ -59292,6 +59296,22 @@ function OverlayTrigger({
   });
 }
 
+var Icon = function Icon(props) {
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement("img", {
+    src: props.defaultUrl,
+    className: (props.className || 'vitro-icon') + (!props.hoverUrl || !props.isHover ? CTRL.EMPTY : ' vitro-display-none') + (props.hoverUrl ? ' vitro-icon-default' : CTRL.EMPTY),
+    onClick: function onClick() {
+      return props.onClick && props.onClick();
+    }
+  }), props.hoverUrl && React__default.createElement("img", {
+    src: props.hoverUrl,
+    className: (props.className || 'vitro-icon') + ' vitro-icon-hover' + (props.isHover ? CTRL.EMPTY : ' vitro-display-none'),
+    onClick: function onClick() {
+      return props.onClick && props.onClick();
+    }
+  }));
+};
+
 var styles$5 = {"vitro-button":"_button_vitro-button_hVfBuSO","vitro-animation-ripple":"_button_vitro-animation-ripple_7CFAk_a"};
 
 var PX_UNIT = 'px';
@@ -59347,11 +59367,10 @@ var Button$2 = function Button(props) {
     title: CTRL.EMPTY,
     onClick: onClick,
     onMouseDown: props.isCreateRipple ? createRipple : function () {}
-  }, React__default.createElement("div", null, props.imageUrl && React__default.createElement(commonUi.Icon, {
+  }, React__default.createElement("div", null, props.imageUrl && React__default.createElement(Icon, {
     isHover: isHover,
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
-    alt: CTRL.EMPTY,
     className: "" + (props.imageClassName || CTRL.EMPTY)
   }), React__default.createElement("div", null, props.text)));
   if (props.to) {
@@ -59935,7 +59954,7 @@ var ViewPart = function ViewPart(props) {
     } else {
       setComponent(null);
     }
-  }, [props.component, props.settings]);
+  }, [props.component, props.settings, props.item]);
   return React__default.createElement("div", {
     className: styles$8["vitro-view-part"]
   }, component);
@@ -60002,9 +60021,9 @@ var DropdownButton = function DropdownButton(props) {
       onClick: function onClick(e) {
         return item.onClick(item.value, e);
       }
-    }, item.imageUrl && React__default.createElement(commonUi.Icon, {
-      imageUrl: item.imageUrl,
-      imageHoverUrl: item.imageHoverUrl,
+    }, item.imageUrl && React__default.createElement(Icon, {
+      defaultUrl: item.imageUrl,
+      hoverUrl: item.imageHoverUrl,
       className: styles$a['vitro-icon']
     }), React__default.createElement("span", null, item.text));
   }), dropItemList.length > 0 && React__default.createElement(BootstrapDropdown, {
@@ -60035,9 +60054,9 @@ var DropdownButton = function DropdownButton(props) {
       onClick: function onClick(e) {
         return x.onClick(x.value, e);
       }
-    }, x.imageUrl && React__default.createElement(commonUi.Icon, {
-      imageUrl: x.imageUrl,
-      imageHoverUrl: x.imageHoverUrl,
+    }, x.imageUrl && React__default.createElement(Icon, {
+      defaultUrl: x.imageUrl,
+      hoverUrl: x.imageHoverUrl,
       className: styles$a['vitro-icon']
     }), React__default.createElement("span", null, x.text));
   }))));
@@ -60234,7 +60253,8 @@ var GetGroupControl = function GetGroupControl(props) {
     return React__default.createElement(ViewPart, {
       component: viewPart.component,
       settings: viewPart.settings,
-      props: props
+      props: props,
+      item: props.item
     });
   }));
 };
@@ -60300,7 +60320,8 @@ var Input = function Input(props) {
     }
   }, []);
   React.useEffect(function () {
-    if (props.value && inputValue !== props.value) updateValue(props.value, true);
+    var value = props.value ? props.value : CTRL.EMPTY;
+    if (inputValue !== value) updateValue(value, true);
   }, [props.value]);
   React.useEffect(function () {
     setState(props.errorMessage ? styles$e['vitro-error'] : CTRL.EMPTY);
@@ -61331,6 +61352,9 @@ var LookupPicker = function LookupPicker(props) {
       }));
     }
   }, [selectedValueList]);
+  React.useEffect(function () {
+    setState(props.errorMessage ? styles$p['vitro-error'] : CTRL.EMPTY);
+  }, [props.errorMessage]);
   var updateFilteredValueList = function updateFilteredValueList(valueList) {
     var availableValueList = inputValue ? filteredValueList : valueList;
     if (inputValue && inputValue.length >= (props.charCount || 0)) {
@@ -63346,10 +63370,9 @@ var CommandMenuSubItem = function CommandMenuSubItem(props) {
   return React__default.createElement(DropdownItem$2, {
     onClick: props.onClick,
     toggle: props.toggle === false ? false : true
-  }, props.imageUrl && React__default.createElement(commonUi.Icon, {
+  }, props.imageUrl && React__default.createElement(Icon, {
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
-    alt: props.title,
     className: styles$t['vitro-icon']
   }), props.href ? React__default.createElement(Link, {
     to: props.href
@@ -63369,11 +63392,10 @@ var CommandMenuItemHeader = function CommandMenuItemHeader(props) {
     },
     className: itemStyles['vitro-item'] + CTRL.SPACE + styles$t['vitro-command-menu-dropdown-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
     "data-show": props.isVisibleFunction
-  }, props.imageUrl && React__default.createElement(commonUi.Icon, {
+  }, props.imageUrl && React__default.createElement(Icon, {
     isHover: isHover,
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
-    alt: props.text,
     className: styles$t['vitro-icon']
   }), React__default.createElement("span", null, props.text), !props.isHideChevronDown && React__default.createElement("div", {
     className: styles$t['vitro-button-collapse-bottom']
@@ -63398,10 +63420,10 @@ var CommandMenuDropdownButton = function CommandMenuDropdownButton(props) {
   }), props.children));
 };
 
-var styles$u = {"vitro-active":"_sidebar-item_vitro-active_7p5iOhY","vitro-icon-text":"_sidebar-item_vitro-icon-text_3ROhyLK","vitro-item-text":"_sidebar-item_vitro-item-text_1kK_aIZ","vitro-icon":"_sidebar-item_vitro-icon_2B88tow","vitro-item":"_sidebar-item_vitro-item_1BR_7F0"};
+var styles$u = {"vitro-icon-text":"_sidebar-item_vitro-icon-text_3ROhyLK","vitro-item-text":"_sidebar-item_vitro-item-text_1kK_aIZ","vitro-active":"_sidebar-item_vitro-active_7p5iOhY","vitro-hover":"_sidebar-item_vitro-hover_1mECzme","vitro-icon":"_sidebar-item_vitro-icon_2B88tow","vitro-item":"_sidebar-item_vitro-item_1BR_7F0"};
 
 var Item$1 = function Item(props) {
-  return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", null, React__default.createElement(commonUi.Icon, {
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", null, React__default.createElement(Icon, {
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
     isHover: props.isHover,
@@ -63426,7 +63448,8 @@ var LinkItem$1 = function LinkItem(props) {
   var _useState = React.useState(false),
     isHover = _useState[0],
     setIsHover = _useState[1];
-  var isActive = isHover || props.link === props.currentUrl || props.activeItem === props.id;
+  var isActive = props.link === props.currentUrl || props.activeItem === props.id;
+  var className = isActive ? styles$u['vitro-active'] : isHover ? styles$u['vitro-hover'] : CTRL.EMPTY;
   return React__default.createElement("li", {
     onMouseEnter: function onMouseEnter() {
       return setIsHover(true);
@@ -63440,21 +63463,22 @@ var LinkItem$1 = function LinkItem(props) {
     className: styles$u['vitro-item']
   }, props.link && React__default.createElement(Link, {
     to: props.link,
-    className: isActive ? styles$u['vitro-active'] : CTRL.EMPTY
+    className: className
   }, React__default.createElement(Item$1, Object.assign({}, props, {
-    isHover: isActive
+    isHover: isHover || isActive
   }))), props.onClick && React__default.createElement("a", {
     onClick: function onClick() {
       return w$7[props.onClick || CTRL.EMPTY]();
     },
-    className: isActive ? styles$u['vitro-active'] : CTRL.EMPTY
+    className: className
   }, React__default.createElement(Item$1, Object.assign({}, props, {
-    isHover: isActive
+    isHover: isHover || isActive
   }))), props.href && React__default.createElement("a", {
     href: props.href,
-    target: props.isExternal ? TARGET.BLANK : TARGET.SELF
+    target: props.isExternal ? TARGET.BLANK : TARGET.SELF,
+    className: className
   }, React__default.createElement(Item$1, Object.assign({}, props, {
-    isHover: isActive
+    isHover: isHover || isActive
   }))));
 };
 
@@ -63811,7 +63835,7 @@ var UserProfileMenuItem = function UserProfileMenuItem(props) {
       onClick: onClick
     }, React__default.createElement(Link, {
       to: props.link
-    }, props.imageUrl && React__default.createElement(commonUi.Icon, {
+    }, props.imageUrl && React__default.createElement(Icon, {
       defaultUrl: props.imageUrl,
       hoverUrl: props.hoverImageUrl
     }), props.text));
@@ -63821,7 +63845,7 @@ var UserProfileMenuItem = function UserProfileMenuItem(props) {
       className: styles$C['vitro-dropdown-item'],
       key: props.text,
       onClick: onClick
-    }, props.imageUrl && React__default.createElement(commonUi.Icon, {
+    }, props.imageUrl && React__default.createElement(Icon, {
       defaultUrl: props.imageUrl,
       hoverUrl: props.hoverImageUrl
     }), props.text);
@@ -63876,9 +63900,56 @@ var UserLookupPicker = function UserLookupPicker(props) {
   }));
 };
 
+var styles$D = {"vitro-title":"_activity_vitro-title_1rdvvaa","vitro-dropdown-button":"_activity_vitro-dropdown-button_12258nJ","vitro-activity":"_activity_vitro-activity_1u7YeF3"};
+
+var Activity = function Activity(props) {
+  return React__default.createElement("div", {
+    className: 'vitro-activity'
+  }, React__default.createElement("div", {
+    className: styles$D['vitro-title']
+  }, props.filterDropdownList && React__default.createElement(DropdownButton, {
+    itemList: props.filterDropdownList,
+    className: styles$D['vitro-dropdown-button']
+  }), React__default.createElement("h3", null, props.title)), React__default.createElement("div", {
+    className: 'vitro-content'
+  }, props.children));
+};
+
+var styles$E = {"vitro-item":"_activity-item_vitro-item_3Tprske","vitro-active":"_activity-item_vitro-active_2kENgvf","vitro-title":"_activity-item_vitro-title__QItISm","vitro-due-date":"_activity-item_vitro-due-date_1mBIraY","vitro-content":"_activity-item_vitro-content_3Lt7XRy","vitro-message":"_activity-item_vitro-message_1ndqhgR","vitro-flex":"_activity-item_vitro-flex_37IxBWe","vitro-dropdown-button":"_activity-item_vitro-dropdown-button_1J50ja7","vitro-avatar":"_activity-item_vitro-avatar_218ZqAk"};
+
+var ActivityItem = function ActivityItem(props) {
+  return React__default.createElement("div", {
+    className: styles$E['vitro-item'] + (props.isActive ? CTRL.SPACE + styles$E['vitro-active'] : CTRL.EMPTY)
+  }, React__default.createElement("div", {
+    className: styles$E['vitro-flex']
+  }, React__default.createElement(Avatar, {
+    userName: props.userName,
+    image: props.userImageUrl,
+    className: styles$E['vitro-avatar']
+  }), React__default.createElement("div", {
+    className: styles$E['vitro-content']
+  }, React__default.createElement("div", null, React__default.createElement("div", {
+    className: styles$E['vitro-title']
+  }, React__default.createElement("span", null, props.title || props.userName)), React__default.createElement("div", {
+    className: styles$E['vitro-message'] + (props.variant ? CTRL.SPACE + props.variant : CTRL.EMPTY)
+  }, React__default.createElement("p", {
+    dangerouslySetInnerHTML: {
+      __html: props.message
+    }
+  }), props.children)), props.isShowDetail && React__default.createElement("span", {
+    className: styles$E['vitro-due-date']
+  }, props.date)), props.isShowDetail && props.dropdownItemList && React__default.createElement(DropdownButton, {
+    itemList: props.dropdownItemList,
+    onToggle: props.onDropdownToggle,
+    className: styles$E['vitro-dropdown-button']
+  })));
+};
+
 exports.ACTION_HANDLER = ActionHandlerConstants;
 exports.ALERT = AlertConstants;
 exports.ActionHandler = ActionHandler;
+exports.Activity = Activity;
+exports.ActivityItem = ActivityItem;
 exports.Alert = Alert$1;
 exports.Avatar = Avatar;
 exports.Breadcrumbs = Breadcrumbs;
@@ -63897,6 +63968,7 @@ exports.Dialog = Dialog;
 exports.DialogContent = DialogContent;
 exports.DialogFooter = DialogFooter;
 exports.DropdownButton = DropdownButton;
+exports.Icon = Icon;
 exports.Input = Input;
 exports.IssueTile = IssueTile;
 exports.Label = Label;