superdesk-ui-framework 3.0.52 → 3.0.54

package/dist/superdesk-ui.bundle.js

@@ -5885,9 +5885,9 @@ var Alert_1 = __webpack_require__(318);
 Object.defineProperty(exports, "Alert", { enumerable: true, get: function () { return Alert_1.Alert; } });
 var avatar_wrapper_1 = __webpack_require__(45);
 Object.defineProperty(exports, "AvatarWrapper", { enumerable: true, get: function () { return avatar_wrapper_1.AvatarWrapper; } });
-var avatar_text_1 = __webpack_require__(91);
+var avatar_text_1 = __webpack_require__(92);
 Object.defineProperty(exports, "AvatarContentText", { enumerable: true, get: function () { return avatar_text_1.AvatarContentText; } });
-var avatar_image_1 = __webpack_require__(92);
+var avatar_image_1 = __webpack_require__(59);
 Object.defineProperty(exports, "AvatarContentImage", { enumerable: true, get: function () { return avatar_image_1.AvatarContentImage; } });
 var avatar_group_1 = __webpack_require__(319);
 Object.defineProperty(exports, "AvatarGroup", { enumerable: true, get: function () { return avatar_group_1.AvatarGroup; } });
@@ -5903,15 +5903,15 @@ var IconLabel_1 = __webpack_require__(344);
 Object.defineProperty(exports, "IconLabel", { enumerable: true, get: function () { return IconLabel_1.IconLabel; } });
 var Tooltip_1 = __webpack_require__(41);
 Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return Tooltip_1.Tooltip; } });
-var DurationInput_1 = __webpack_require__(81);
+var DurationInput_1 = __webpack_require__(82);
 Object.defineProperty(exports, "DurationInput", { enumerable: true, get: function () { return DurationInput_1.DurationInput; } });
-var DurationInput_2 = __webpack_require__(81);
+var DurationInput_2 = __webpack_require__(82);
 Object.defineProperty(exports, "getDurationString", { enumerable: true, get: function () { return DurationInput_2.getDurationString; } });
-var DatePicker_1 = __webpack_require__(69);
+var DatePicker_1 = __webpack_require__(70);
 Object.defineProperty(exports, "DatePicker", { enumerable: true, get: function () { return DatePicker_1.DatePicker; } });
-var DatePicker_2 = __webpack_require__(69);
+var DatePicker_2 = __webpack_require__(70);
 Object.defineProperty(exports, "DatePickerISO", { enumerable: true, get: function () { return DatePicker_2.DatePickerISO; } });
-var DatePicker_3 = __webpack_require__(69);
+var DatePicker_3 = __webpack_require__(70);
 Object.defineProperty(exports, "DatePickerLocaleSettings", { enumerable: true, get: function () { return DatePicker_3.DatePickerLocaleSettings; } });
 var TimePicker_1 = __webpack_require__(278);
 Object.defineProperty(exports, "TimePicker", { enumerable: true, get: function () { return TimePicker_1.TimePicker; } });
@@ -5923,7 +5923,7 @@ var SwitchGroup_1 = __webpack_require__(377);
 Object.defineProperty(exports, "SwitchGroup", { enumerable: true, get: function () { return SwitchGroup_1.SwitchGroup; } });
 var ButtonGroup_1 = __webpack_require__(250);
 Object.defineProperty(exports, "ButtonGroup", { enumerable: true, get: function () { return ButtonGroup_1.ButtonGroup; } });
-var Loader_1 = __webpack_require__(73);
+var Loader_1 = __webpack_require__(74);
 Object.defineProperty(exports, "Loader", { enumerable: true, get: function () { return Loader_1.Loader; } });
 var RadioGroup_1 = __webpack_require__(378);
 Object.defineProperty(exports, "RadioGroup", { enumerable: true, get: function () { return RadioGroup_1.RadioGroup; } });
@@ -5993,7 +5993,7 @@ var Modal_1 = __webpack_require__(434);
 Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return Modal_1.Modal; } });
 var GridList_1 = __webpack_require__(437);
 Object.defineProperty(exports, "GridList", { enumerable: true, get: function () { return GridList_1.GridList; } });
-var GridItem_1 = __webpack_require__(75);
+var GridItem_1 = __webpack_require__(76);
 Object.defineProperty(exports, "GridItem", { enumerable: true, get: function () { return GridItem_1.GridItem; } });
 Object.defineProperty(exports, "GridItemContent", { enumerable: true, get: function () { return GridItem_1.GridItemContent; } });
 Object.defineProperty(exports, "GridItemMedia", { enumerable: true, get: function () { return GridItem_1.GridItemMedia; } });
@@ -6030,7 +6030,7 @@ Object.defineProperty(exports, "WithSizeObserver", { enumerable: true, get: func
 __exportStar(__webpack_require__(16), exports);
 __exportStar(__webpack_require__(13), exports);
 __exportStar(__webpack_require__(52), exports);
-__exportStar(__webpack_require__(82), exports);
+__exportStar(__webpack_require__(83), exports);
 var Skeleton_1 = __webpack_require__(257);
 Object.defineProperty(exports, "Skeleton", { enumerable: true, get: function () { return Skeleton_1.Skeleton; } });
 var ListItemLoader_1 = __webpack_require__(498);
@@ -6048,10 +6048,10 @@ var BottomNav_1 = __webpack_require__(282);
 Object.defineProperty(exports, "BottomNav", { enumerable: true, get: function () { return BottomNav_1.BottomNav; } });
 var TreeSelect_1 = __webpack_require__(283);
 Object.defineProperty(exports, "TreeSelect", { enumerable: true, get: function () { return TreeSelect_1.TreeSelect; } });
-var TableList_1 = __webpack_require__(76);
+var TableList_1 = __webpack_require__(77);
 Object.defineProperty(exports, "TableList", { enumerable: true, get: function () { return TableList_1.TableList; } });
 Object.defineProperty(exports, "TableListItem", { enumerable: true, get: function () { return TableList_1.TableListItem; } });
-var ContentList_1 = __webpack_require__(83);
+var ContentList_1 = __webpack_require__(84);
 Object.defineProperty(exports, "ContentListItem", { enumerable: true, get: function () { return ContentList_1.ContentListItem; } });
 var MultiSelect_1 = __webpack_require__(540);
 Object.defineProperty(exports, "MultiSelect", { enumerable: true, get: function () { return MultiSelect_1.MultiSelect; } });
@@ -6059,7 +6059,7 @@ var ResizablePanels_1 = __webpack_require__(547);
 Object.defineProperty(exports, "ResizablePanels", { enumerable: true, get: function () { return ResizablePanels_1.ResizablePanels; } });
 var WithPopover_1 = __webpack_require__(95);
 Object.defineProperty(exports, "WithPopover", { enumerable: true, get: function () { return WithPopover_1.WithPopover; } });
-var Spacer_1 = __webpack_require__(80);
+var Spacer_1 = __webpack_require__(81);
 Object.defineProperty(exports, "Spacer", { enumerable: true, get: function () { return Spacer_1.Spacer; } });
 Object.defineProperty(exports, "SpacerBlock", { enumerable: true, get: function () { return Spacer_1.SpacerBlock; } });
 var ResizeObserverComponent_1 = __webpack_require__(558);
@@ -7359,7 +7359,7 @@ var FormText_1 = __webpack_require__(298);
 Object.defineProperty(exports, "FormText", { enumerable: true, get: function () { return FormText_1.FormText; } });
 var FormLabel_1 = __webpack_require__(51);
 Object.defineProperty(exports, "FormLabel", { enumerable: true, get: function () { return FormLabel_1.FormLabel; } });
-var InputWrapper_1 = __webpack_require__(85);
+var InputWrapper_1 = __webpack_require__(86);
 Object.defineProperty(exports, "InputWrapper", { enumerable: true, get: function () { return InputWrapper_1.InputWrapper; } });
 var InputBase_1 = __webpack_require__(299);
 Object.defineProperty(exports, "InputBase", { enumerable: true, get: function () { return InputBase_1.InputBase; } });
@@ -25855,11 +25855,11 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ReplaceTransition", function() { return __WEBPACK_IMPORTED_MODULE_1__ReplaceTransition__["a"]; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__SwitchTransition__ = __webpack_require__(315);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SwitchTransition", function() { return __WEBPACK_IMPORTED_MODULE_2__SwitchTransition__["a"]; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__TransitionGroup__ = __webpack_require__(90);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__TransitionGroup__ = __webpack_require__(91);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "TransitionGroup", function() { return __WEBPACK_IMPORTED_MODULE_3__TransitionGroup__["a"]; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__Transition__ = __webpack_require__(57);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "Transition", function() { return __WEBPACK_IMPORTED_MODULE_4__Transition__["d"]; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__config__ = __webpack_require__(87);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__config__ = __webpack_require__(88);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "config", function() { return __WEBPACK_IMPORTED_MODULE_5__config__["a"]; });
 
 
@@ -37504,7 +37504,7 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
 /* harmony namespace reexport (by provided) */ __webpack_require__.d(__webpack_exports__, "offset", function() { return __WEBPACK_IMPORTED_MODULE_1__modifiers_index_js__["g"]; });
 /* harmony namespace reexport (by provided) */ __webpack_require__.d(__webpack_exports__, "popperOffsets", function() { return __WEBPACK_IMPORTED_MODULE_1__modifiers_index_js__["h"]; });
 /* harmony namespace reexport (by provided) */ __webpack_require__.d(__webpack_exports__, "preventOverflow", function() { return __WEBPACK_IMPORTED_MODULE_1__modifiers_index_js__["i"]; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__createPopper_js__ = __webpack_require__(68);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__createPopper_js__ = __webpack_require__(69);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "popperGenerator", function() { return __WEBPACK_IMPORTED_MODULE_2__createPopper_js__["c"]; });
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "detectOverflow", function() { return __WEBPACK_IMPORTED_MODULE_2__createPopper_js__["b"]; });
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "createPopperBase", function() { return __WEBPACK_IMPORTED_MODULE_2__createPopper_js__["a"]; });
@@ -38157,10 +38157,10 @@ exports.Spinner = Spinner;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3_react___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_3_react__);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4_react_dom__ = __webpack_require__(8);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4_react_dom___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_4_react_dom__);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__config__ = __webpack_require__(87);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__utils_PropTypes__ = __webpack_require__(88);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__config__ = __webpack_require__(88);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__utils_PropTypes__ = __webpack_require__(89);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__TransitionGroupContext__ = __webpack_require__(58);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__utils_reflow__ = __webpack_require__(89);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__utils_reflow__ = __webpack_require__(90);
 
 
 
@@ -38800,6 +38800,91 @@ Transition.EXITING = EXITING;
 
 /***/ }),
 /* 59 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AvatarContentImage = void 0;
+var React = __importStar(__webpack_require__(0));
+var AvatarContentImage = /** @class */ (function (_super) {
+    __extends(AvatarContentImage, _super);
+    function AvatarContentImage() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    AvatarContentImage.prototype.render = function () {
+        var _a = this.props, imageUrl = _a.imageUrl, tooltipText = _a.tooltipText, onClick = _a.onClick;
+        var maybeButtonProps = onClick == null ? {} : {
+            role: 'button',
+            onClick: function () { return onClick(); },
+        };
+        if (imageUrl == null) {
+            return (React.createElement("span", __assign({}, maybeButtonProps, { className: "sd-avatar-content sd-avatar-content--dummy-img", title: tooltipText }),
+                React.createElement("svg", { width: "200", height: "200", viewBox: "0 0 200 200", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+                    React.createElement("circle", { cx: "100", cy: "100", r: "100", fill: "white", fillOpacity: "0.01" }),
+                    React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M40 153V145.384C40 141.557 41.16 137.981 43.16 135C49.14 126.057 66.24 119.711 77.14 118C82.74 117.115 90.16 116.538 100 116.538C109.84 116.538 117.26 117.115 122.86 118C133.76 119.711 150.86 126.057 156.84 135C158.84 137.981 160 141.557 160 145.384V153C150 165 130 180 100 180C70 180 50 165 40 153ZM100 30C122.08 30 140 47.2307 140 68.4614C140 89.6922 122.08 106.923 100 106.923C77.92 106.923 60 89.6922 60 68.4614C60 47.2307 77.92 30 100 30Z", fill: "var(--sd-colour-avatar-dummy)", fillOpacity: "1" }))));
+        }
+        else {
+            return (React.createElement("span", __assign({}, maybeButtonProps, { className: "sd-avatar-content", title: tooltipText }),
+                React.createElement("img", { src: imageUrl })));
+        }
+    };
+    return AvatarContentImage;
+}(React.PureComponent));
+exports.AvatarContentImage = AvatarContentImage;
+
+
+/***/ }),
+/* 60 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -38891,7 +38976,7 @@ function effect(_ref2) {
 });
 
 /***/ }),
-/* 60 */
+/* 61 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -38924,7 +39009,7 @@ function getLayoutRect(element) {
 }
 
 /***/ }),
-/* 61 */
+/* 62 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -38934,7 +39019,7 @@ function getMainAxisFromPlacement(placement) {
 }
 
 /***/ }),
-/* 62 */
+/* 63 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -39131,7 +39216,7 @@ function computeStyles(_ref5) {
 /* WEBPACK VAR INJECTION */}.call(__webpack_exports__, __webpack_require__(5)))
 
 /***/ }),
-/* 63 */
+/* 64 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -39187,14 +39272,14 @@ function effect(_ref) {
 });
 
 /***/ }),
-/* 64 */
+/* 65 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 /* harmony export (immutable) */ __webpack_exports__["a"] = getWindowScrollBarX;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__getBoundingClientRect_js__ = __webpack_require__(37);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__getDocumentElement_js__ = __webpack_require__(25);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getWindowScroll_js__ = __webpack_require__(65);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getWindowScroll_js__ = __webpack_require__(66);
 
 
 
@@ -39210,7 +39295,7 @@ function getWindowScrollBarX(element) {
 }
 
 /***/ }),
-/* 65 */
+/* 66 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -39228,7 +39313,7 @@ function getWindowScroll(node) {
 }
 
 /***/ }),
-/* 66 */
+/* 67 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -39246,7 +39331,7 @@ function isScrollParent(element) {
 }
 
 /***/ }),
-/* 67 */
+/* 68 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -39278,14 +39363,14 @@ function popperOffsets(_ref) {
 });
 
 /***/ }),
-/* 68 */
+/* 69 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 /* WEBPACK VAR INJECTION */(function(process) {/* harmony export (immutable) */ __webpack_exports__["c"] = popperGenerator;
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return createPopper; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__dom_utils_getCompositeRect_js__ = __webpack_require__(332);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__dom_utils_getLayoutRect_js__ = __webpack_require__(60);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__dom_utils_getLayoutRect_js__ = __webpack_require__(61);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__dom_utils_listScrollParents_js__ = __webpack_require__(104);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__dom_utils_getOffsetParent_js__ = __webpack_require__(38);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__dom_utils_getComputedStyle_js__ = __webpack_require__(34);
@@ -39561,7 +39646,7 @@ var createPopper = /*#__PURE__*/popperGenerator(); // eslint-disable-next-line i
 /* WEBPACK VAR INJECTION */}.call(__webpack_exports__, __webpack_require__(5)))
 
 /***/ }),
-/* 69 */
+/* 70 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -39762,7 +39847,7 @@ exports.DatePickerISO = DatePickerISO;
 
 
 /***/ }),
-/* 70 */
+/* 71 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -39786,7 +39871,7 @@ function startOfUTCISOWeek(dirtyDate) {
 }
 
 /***/ }),
-/* 71 */
+/* 72 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -39821,7 +39906,7 @@ function startOfUTCWeek(dirtyDate, dirtyOptions) {
 }
 
 /***/ }),
-/* 72 */
+/* 73 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -40001,7 +40086,7 @@ _defineProperty(InputText, "propTypes", {
 });
 
 /***/ }),
-/* 73 */
+/* 74 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -40066,7 +40151,7 @@ exports.Loader = Loader;
 
 
 /***/ }),
-/* 74 */
+/* 75 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -40182,7 +40267,7 @@ exports.SelectPreview = SelectPreview;
 
 
 /***/ }),
-/* 75 */
+/* 76 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -40408,7 +40493,7 @@ exports.default = GridItem;
 
 
 /***/ }),
-/* 76 */
+/* 77 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -40673,7 +40758,7 @@ var PortalItem = /** @class */ (function (_super) {
 
 
 /***/ }),
-/* 77 */
+/* 78 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -40807,7 +40892,7 @@ function createSubscription(store, parentSub) {
 }
 
 /***/ }),
-/* 78 */
+/* 79 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -40826,7 +40911,7 @@ function createSubscription(store, parentSub) {
 var useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? __WEBPACK_IMPORTED_MODULE_0_react__["useLayoutEffect"] : __WEBPACK_IMPORTED_MODULE_0_react__["useEffect"];
 
 /***/ }),
-/* 79 */
+/* 80 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -40850,7 +40935,7 @@ function invariant(condition, message) {
 /* WEBPACK VAR INJECTION */}.call(__webpack_exports__, __webpack_require__(5)))
 
 /***/ }),
-/* 80 */
+/* 81 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -40943,7 +41028,7 @@ exports.SpacerBlock = SpacerBlock;
 
 
 /***/ }),
-/* 81 */
+/* 82 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -41328,7 +41413,7 @@ exports.getDurationString = getDurationString;
 
 
 /***/ }),
-/* 82 */
+/* 83 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -41345,7 +41430,7 @@ Object.defineProperty(exports, "BoxedListContentRow", { enumerable: true, get: f
 
 
 /***/ }),
-/* 83 */
+/* 84 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -41462,14 +41547,14 @@ exports.ContentList = ContentList;
 
 
 /***/ }),
-/* 84 */
+/* 85 */
 /***/ (function(module, exports) {
 
 module.exports = Function.call.bind(Object.prototype.hasOwnProperty);
 
 
 /***/ }),
-/* 85 */
+/* 86 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -41569,7 +41654,7 @@ exports.InputWrapper = InputWrapper;
 
 
 /***/ }),
-/* 86 */
+/* 87 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -41801,7 +41886,7 @@ var FilterUtils = /*#__PURE__*/function () {
 exports.default = FilterUtils;
 
 /***/ }),
-/* 87 */
+/* 88 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -41810,7 +41895,7 @@ exports.default = FilterUtils;
 });
 
 /***/ }),
-/* 88 */
+/* 89 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -41839,7 +41924,7 @@ var classNamesShape = process.env.NODE_ENV !== 'production' ? __WEBPACK_IMPORTED
 /* WEBPACK VAR INJECTION */}.call(__webpack_exports__, __webpack_require__(5)))
 
 /***/ }),
-/* 89 */
+/* 90 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -41849,7 +41934,7 @@ var forceReflow = function forceReflow(node) {
 };
 
 /***/ }),
-/* 90 */
+/* 91 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -42055,7 +42140,7 @@ TransitionGroup.defaultProps = defaultProps;
 /* WEBPACK VAR INJECTION */}.call(__webpack_exports__, __webpack_require__(5)))
 
 /***/ }),
-/* 91 */
+/* 92 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -42115,75 +42200,6 @@ var AvatarContentText = /** @class */ (function (_super) {
 exports.AvatarContentText = AvatarContentText;
 
 
-/***/ }),
-/* 92 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AvatarContentImage = void 0;
-var React = __importStar(__webpack_require__(0));
-var AvatarContentImage = /** @class */ (function (_super) {
-    __extends(AvatarContentImage, _super);
-    function AvatarContentImage() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    AvatarContentImage.prototype.render = function () {
-        if (this.props.imageUrl == null) {
-            return (React.createElement("span", { className: "sd-avatar-content sd-avatar-content--dummy-img", title: this.props.tooltipText },
-                React.createElement("svg", { width: "200", height: "200", viewBox: "0 0 200 200", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-                    React.createElement("circle", { cx: "100", cy: "100", r: "100", fill: "white", "fill-opacity": "0.01" }),
-                    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M40 153V145.384C40 141.557 41.16 137.981 43.16 135C49.14 126.057 66.24 119.711 77.14 118C82.74 117.115 90.16 116.538 100 116.538C109.84 116.538 117.26 117.115 122.86 118C133.76 119.711 150.86 126.057 156.84 135C158.84 137.981 160 141.557 160 145.384V153C150 165 130 180 100 180C70 180 50 165 40 153ZM100 30C122.08 30 140 47.2307 140 68.4614C140 89.6922 122.08 106.923 100 106.923C77.92 106.923 60 89.6922 60 68.4614C60 47.2307 77.92 30 100 30Z", fill: "var(--sd-colour-avatar-dummy)", "fill-opacity": "1" }))));
-        }
-        else {
-            return (React.createElement("span", { className: "sd-avatar-content", title: this.props.tooltipText },
-                React.createElement("img", { src: this.props.imageUrl })));
-        }
-    };
-    return AvatarContentImage;
-}(React.PureComponent));
-exports.AvatarContentImage = AvatarContentImage;
-
-
 /***/ }),
 /* 93 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -42231,19 +42247,28 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Avatar = void 0;
 var React = __importStar(__webpack_require__(0));
-var avatar_image_1 = __webpack_require__(92);
+var avatar_image_1 = __webpack_require__(59);
 var avatar_wrapper_1 = __webpack_require__(45);
-var avatar_text_1 = __webpack_require__(91);
+var avatar_text_1 = __webpack_require__(92);
 var Avatar = /** @class */ (function (_super) {
     __extends(Avatar, _super);
     function Avatar() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     Avatar.prototype.render = function () {
-        var _a = this.props, imageUrl = _a.imageUrl, initials = _a.initials, size = _a.size, statusIndicator = _a.statusIndicator, administratorIndicator = _a.administratorIndicator, icon = _a.icon, displayName = _a.displayName;
-        return (React.createElement(avatar_wrapper_1.AvatarWrapper, { size: size, statusIndicator: statusIndicator ? { status: statusIndicator, tooltipText: '' } : undefined, administratorIndicator: administratorIndicator ? { enabled: true, tooltipText: '' } : undefined, icon: icon, isEmpty: false }, imageUrl != null || initials == null
-            ? (React.createElement(avatar_image_1.AvatarContentImage, { imageUrl: imageUrl, tooltipText: displayName }))
-            : (React.createElement(avatar_text_1.AvatarContentText, { text: initials, tooltipText: displayName }))));
+        var _a = this.props, imageUrl = _a.imageUrl, initials = _a.initials, size = _a.size, statusIndicator = _a.statusIndicator, administratorIndicator = _a.administratorIndicator, icon = _a.icon, displayName = _a.displayName, customContent = _a.customContent;
+        var tooltipCombined = [displayName, this.props.tooltip].filter(function (str) { return (str !== null && str !== void 0 ? str : '').trim().length > 0; }).join('\n');
+        return (React.createElement(avatar_wrapper_1.AvatarWrapper, { size: size, statusIndicator: statusIndicator ? { status: statusIndicator, tooltipText: '' } : undefined, administratorIndicator: administratorIndicator ? { enabled: true, tooltipText: '' } : undefined, icon: icon, isEmpty: false }, (function () {
+            if (customContent != null) {
+                return customContent;
+            }
+            else if (imageUrl != null || initials == null) {
+                return (React.createElement(avatar_image_1.AvatarContentImage, { imageUrl: imageUrl, tooltipText: tooltipCombined }));
+            }
+            else {
+                return (React.createElement(avatar_text_1.AvatarContentText, { text: initials, tooltipText: tooltipCombined }));
+            }
+        })()));
     };
     return Avatar;
 }(React.PureComponent));
@@ -42299,15 +42324,25 @@ exports.AvatarPlaceholder = void 0;
 var React = __importStar(__webpack_require__(0));
 var avatar_wrapper_1 = __webpack_require__(45);
 var avatar_action_add_1 = __webpack_require__(321);
+var avatar_image_1 = __webpack_require__(59);
 var AvatarPlaceholder = /** @class */ (function (_super) {
     __extends(AvatarPlaceholder, _super);
     function AvatarPlaceholder() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     AvatarPlaceholder.prototype.render = function () {
-        var _a = this.props, size = _a.size, tooltip = _a.tooltip, icon = _a.icon;
-        return (React.createElement(avatar_wrapper_1.AvatarWrapper, { size: size, isEmpty: false, icon: icon },
-            React.createElement(avatar_action_add_1.AvatarContentAdd, { tooltipText: tooltip !== null && tooltip !== void 0 ? tooltip : undefined, onClick: this.props.onClick })));
+        var _a = this.props, size = _a.size, tooltip = _a.tooltip, icon = _a.icon, kind = _a.kind, onClick = _a.onClick;
+        return (React.createElement(avatar_wrapper_1.AvatarWrapper, { size: size, isEmpty: false, icon: icon }, (function () {
+            if (kind === 'plus-button') {
+                return (React.createElement(avatar_action_add_1.AvatarContentAdd, { tooltipText: tooltip !== null && tooltip !== void 0 ? tooltip : undefined, onClick: onClick }));
+            }
+            else if (kind === 'user-icon') {
+                return (React.createElement(avatar_image_1.AvatarContentImage, { imageUrl: null, tooltipText: tooltip !== null && tooltip !== void 0 ? tooltip : undefined, onClick: onClick }));
+            }
+            else {
+                return null;
+            }
+        })()));
     };
     return AvatarPlaceholder;
 }(React.PureComponent));
@@ -42396,13 +42431,13 @@ exports.WithPopover = WithPopover;
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__applyStyles_js__ = __webpack_require__(59);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__applyStyles_js__ = __webpack_require__(60);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_0__applyStyles_js__["a"]; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__arrow_js__ = __webpack_require__(97);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__arrow_js__["a"]; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__computeStyles_js__ = __webpack_require__(62);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__computeStyles_js__ = __webpack_require__(63);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return __WEBPACK_IMPORTED_MODULE_2__computeStyles_js__["a"]; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__eventListeners_js__ = __webpack_require__(63);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__eventListeners_js__ = __webpack_require__(64);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "d", function() { return __WEBPACK_IMPORTED_MODULE_3__eventListeners_js__["a"]; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__flip_js__ = __webpack_require__(103);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "e", function() { return __WEBPACK_IMPORTED_MODULE_4__flip_js__["a"]; });
@@ -42410,7 +42445,7 @@ exports.WithPopover = WithPopover;
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "f", function() { return __WEBPACK_IMPORTED_MODULE_5__hide_js__["a"]; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__offset_js__ = __webpack_require__(108);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "g", function() { return __WEBPACK_IMPORTED_MODULE_6__offset_js__["a"]; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__popperOffsets_js__ = __webpack_require__(67);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__popperOffsets_js__ = __webpack_require__(68);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "h", function() { return __WEBPACK_IMPORTED_MODULE_7__popperOffsets_js__["a"]; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__preventOverflow_js__ = __webpack_require__(109);
 /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "i", function() { return __WEBPACK_IMPORTED_MODULE_8__preventOverflow_js__["a"]; });
@@ -42430,10 +42465,10 @@ exports.WithPopover = WithPopover;
 
 "use strict";
 /* WEBPACK VAR INJECTION */(function(process) {/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__utils_getBasePlacement_js__ = __webpack_require__(24);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__dom_utils_getLayoutRect_js__ = __webpack_require__(60);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__dom_utils_getLayoutRect_js__ = __webpack_require__(61);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__dom_utils_contains_js__ = __webpack_require__(98);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__dom_utils_getOffsetParent_js__ = __webpack_require__(38);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__utils_getMainAxisFromPlacement_js__ = __webpack_require__(61);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__utils_getMainAxisFromPlacement_js__ = __webpack_require__(62);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__utils_within_js__ = __webpack_require__(99);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__utils_mergePaddingObject_js__ = __webpack_require__(100);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__utils_expandToHashMap_js__ = __webpack_require__(102);
@@ -42799,7 +42834,7 @@ function flip(_ref) {
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__getScrollParent_js__ = __webpack_require__(329);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__getParentNode_js__ = __webpack_require__(47);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getWindow_js__ = __webpack_require__(20);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__isScrollParent_js__ = __webpack_require__(66);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__isScrollParent_js__ = __webpack_require__(67);
 
 
 
@@ -42850,7 +42885,7 @@ function rectToClientRect(rect) {
 /* harmony export (immutable) */ __webpack_exports__["a"] = computeOffsets;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__getBasePlacement_js__ = __webpack_require__(24);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__getVariation_js__ = __webpack_require__(39);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getMainAxisFromPlacement_js__ = __webpack_require__(61);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getMainAxisFromPlacement_js__ = __webpack_require__(62);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__enums_js__ = __webpack_require__(11);
 
 
@@ -43062,10 +43097,10 @@ function offset(_ref2) {
 "use strict";
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__enums_js__ = __webpack_require__(11);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__utils_getBasePlacement_js__ = __webpack_require__(24);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__utils_getMainAxisFromPlacement_js__ = __webpack_require__(61);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__utils_getMainAxisFromPlacement_js__ = __webpack_require__(62);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__utils_getAltAxis_js__ = __webpack_require__(331);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__utils_within_js__ = __webpack_require__(99);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__dom_utils_getLayoutRect_js__ = __webpack_require__(60);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__dom_utils_getLayoutRect_js__ = __webpack_require__(61);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__dom_utils_getOffsetParent_js__ = __webpack_require__(38);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__utils_detectOverflow_js__ = __webpack_require__(40);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__utils_getVariation_js__ = __webpack_require__(39);
@@ -43221,11 +43256,11 @@ function preventOverflow(_ref) {
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return createPopper; });
 /* unused harmony export defaultModifiers */
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__createPopper_js__ = __webpack_require__(68);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__modifiers_eventListeners_js__ = __webpack_require__(63);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__modifiers_popperOffsets_js__ = __webpack_require__(67);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__modifiers_computeStyles_js__ = __webpack_require__(62);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__modifiers_applyStyles_js__ = __webpack_require__(59);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__createPopper_js__ = __webpack_require__(69);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__modifiers_eventListeners_js__ = __webpack_require__(64);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__modifiers_popperOffsets_js__ = __webpack_require__(68);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__modifiers_computeStyles_js__ = __webpack_require__(63);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__modifiers_applyStyles_js__ = __webpack_require__(60);
 /* unused harmony reexport popperGenerator */
 /* unused harmony reexport detectOverflow */
 
@@ -58453,7 +58488,7 @@ function addLeadingZeros(number, targetLength) {
 "use strict";
 /* harmony export (immutable) */ __webpack_exports__["a"] = getUTCISOWeekYear;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__toDate_index_js__ = __webpack_require__(15);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__startOfUTCISOWeek_index_js__ = __webpack_require__(70);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__startOfUTCISOWeek_index_js__ = __webpack_require__(71);
 
  // This function will be a part of public API when UTC function will be implemented.
 // See issue: https://github.com/date-fns/date-fns/issues/376
@@ -58491,7 +58526,7 @@ function getUTCISOWeekYear(dirtyDate) {
 /* harmony export (immutable) */ __webpack_exports__["a"] = getUTCWeekYear;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__toInteger_index_js__ = __webpack_require__(32);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__toDate_index_js__ = __webpack_require__(15);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__startOfUTCWeek_index_js__ = __webpack_require__(71);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__startOfUTCWeek_index_js__ = __webpack_require__(72);
 
 
  // This function will be a part of public API when UTC function will be implemented.
@@ -59500,7 +59535,7 @@ exports.SelectGrid = void 0;
 var React = __importStar(__webpack_require__(0));
 var react_id_generator_1 = __importDefault(__webpack_require__(9));
 var overlaypanel_1 = __webpack_require__(448);
-var Loader_1 = __webpack_require__(73);
+var Loader_1 = __webpack_require__(74);
 var SelectGrid = /** @class */ (function (_super) {
     __extends(SelectGrid, _super);
     function SelectGrid(props) {
@@ -60028,8 +60063,8 @@ var getBatch = function getBatch() {
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3_react___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_3_react__);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4_react_is__ = __webpack_require__(522);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4_react_is___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_4_react_is__);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__utils_Subscription__ = __webpack_require__(77);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__utils_useIsomorphicLayoutEffect__ = __webpack_require__(78);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__utils_Subscription__ = __webpack_require__(78);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__utils_useIsomorphicLayoutEffect__ = __webpack_require__(79);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__Context__ = __webpack_require__(33);
 
 
@@ -63782,7 +63817,7 @@ var React = __importStar(__webpack_require__(0));
 var chips_1 = __webpack_require__(411);
 var Form_1 = __webpack_require__(13);
 var react_id_generator_1 = __importDefault(__webpack_require__(9));
-var SelectPreview_1 = __webpack_require__(74);
+var SelectPreview_1 = __webpack_require__(75);
 var TagInput = /** @class */ (function (_super) {
     __extends(TagInput, _super);
     function TagInput() {
@@ -64075,14 +64110,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TreeSelect = void 0;
 var React = __importStar(__webpack_require__(0));
 var Icon_1 = __webpack_require__(7);
-var Loader_1 = __webpack_require__(73);
+var Loader_1 = __webpack_require__(74);
 var react_id_generator_1 = __importDefault(__webpack_require__(9));
 var debounce_1 = __importDefault(__webpack_require__(502));
 var Form_1 = __webpack_require__(13);
 var core_1 = __webpack_require__(46);
 var lodash_1 = __webpack_require__(21);
 var Label_1 = __webpack_require__(36);
-var SelectPreview_1 = __webpack_require__(74);
+var SelectPreview_1 = __webpack_require__(75);
 var TreeSelectPill_1 = __webpack_require__(513);
 var TreeSelectItem_1 = __webpack_require__(514);
 var TreeSelect = /** @class */ (function (_super) {
@@ -64937,7 +64972,7 @@ var ReactIs = __webpack_require__(50);
 var assign = __webpack_require__(289);
 
 var ReactPropTypesSecret = __webpack_require__(54);
-var has = __webpack_require__(84);
+var has = __webpack_require__(85);
 var checkPropTypes = __webpack_require__(290);
 
 var printWarning = function() {};
@@ -65653,7 +65688,7 @@ var printWarning = function() {};
 if (process.env.NODE_ENV !== 'production') {
   var ReactPropTypesSecret = __webpack_require__(54);
   var loggedTypeFailures = {};
-  var has = __webpack_require__(84);
+  var has = __webpack_require__(85);
 
   printWarning = function(text) {
     var message = 'Warning: ' + text;
@@ -65929,7 +65964,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Input = void 0;
 var React = __importStar(__webpack_require__(0));
 var react_id_generator_1 = __importDefault(__webpack_require__(9));
-var InputWrapper_1 = __webpack_require__(85);
+var InputWrapper_1 = __webpack_require__(86);
 var Input = /** @class */ (function (_super) {
     __extends(Input, _super);
     function Input(props) {
@@ -66668,6 +66703,7 @@ var SelectWithTemplate = /** @class */ (function (_super) {
         var _this = this;
         var _a;
         var ItemTemplate = this.props.itemTemplate;
+        var ValueTemplate = this.props.valueTemplate;
         var _b = this.state, loading = _b.loading, options = _b.options;
         var _c = this.props, value = _c.value, onChange = _c.onChange, getLabel = _c.getLabel, disabled = _c.disabled, required = _c.required, zIndex = _c.zIndex, autoFocus = _c.autoFocus, areEqual = _c.areEqual, getItems = _c.getItems, emptyFilterMessage = _c.noResultsFoundMessage, filterPlaceholder = _c.filterPlaceholder, width = _c.width;
         // Using another data structure so it is possible to have getLabel function
@@ -66691,7 +66727,12 @@ var SelectWithTemplate = /** @class */ (function (_super) {
         return (React.createElement(Form_1.InputWrapper, { label: this.props.label, error: this.props.error, required: this.props.required, disabled: this.props.disabled, invalid: this.state.invalid, info: this.props.info, inlineLabel: this.props.inlineLabel, labelHidden: this.props.labelHidden, fullWidth: this.props.fullWidth, htmlId: this.htmlId, tabindex: this.props.tabindex },
             React.createElement(dropdown_1.Dropdown, { inputId: this.htmlId, ariaLabelledBy: this.htmlId + 'label', value: valueInternal, options: optionsInternal, onChange: function (e) {
                     onChange(e.value == null ? null : e.value.original);
-                }, placeholder: fakePlaceholderWithNonBreakingSpace, filterPlaceholder: filterPlaceholder, filter: true, filterBy: labelKey, showClear: !required, emptyFilterMessage: emptyFilterMessage, valueTemplate: function (option) { return React.createElement(ItemTemplate, { option: option == null ? null : option.original }); }, itemTemplate: function (option) { return React.createElement(ItemTemplate, { option: option.original }); }, disabled: disabled, required: required, autoFocus: autoFocus, appendTo: document.body, loading: loading, onFilterInputChange: function (searchString) {
+                }, placeholder: fakePlaceholderWithNonBreakingSpace, filterPlaceholder: filterPlaceholder, filter: true, filterBy: labelKey, showClear: !required, emptyFilterMessage: emptyFilterMessage, itemTemplate: function (option) { var _a; return React.createElement(ItemTemplate, { option: (_a = option === null || option === void 0 ? void 0 : option.original) !== null && _a !== void 0 ? _a : null }); }, valueTemplate: function (option) {
+                    var _a, _b;
+                    return ValueTemplate != null
+                        ? (React.createElement(ValueTemplate, { option: (_a = option === null || option === void 0 ? void 0 : option.original) !== null && _a !== void 0 ? _a : null }))
+                        : (React.createElement(ItemTemplate, { option: (_b = option === null || option === void 0 ? void 0 : option.original) !== null && _b !== void 0 ? _b : null }));
+                }, disabled: disabled, required: required, autoFocus: autoFocus, appendTo: document.body, loading: loading, onFilterInputChange: function (searchString) {
                     _this.setState({ loading: true });
                     getItems(searchString).then(function (_options) {
                         _this.setState({ options: _options, loading: false });
@@ -66736,7 +66777,7 @@ var _DomHandler = _interopRequireDefault(__webpack_require__(12));
 
 var _ObjectUtils = _interopRequireDefault(__webpack_require__(17));
 
-var _FilterUtils = _interopRequireDefault(__webpack_require__(86));
+var _FilterUtils = _interopRequireDefault(__webpack_require__(87));
 
 var _ClassNames = __webpack_require__(10);
 
@@ -68105,8 +68146,8 @@ _defineProperty(PrimeReact, "ripple", false);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_6_react__ = __webpack_require__(0);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_6_react___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_6_react__);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__Transition__ = __webpack_require__(57);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__utils_PropTypes__ = __webpack_require__(88);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_9__utils_reflow__ = __webpack_require__(89);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__utils_PropTypes__ = __webpack_require__(89);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_9__utils_reflow__ = __webpack_require__(90);
 
 
 
@@ -68597,7 +68638,7 @@ function removeClass(element, className) {
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3_react___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_3_react__);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4_react_dom__ = __webpack_require__(8);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4_react_dom___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_4_react_dom__);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__TransitionGroup__ = __webpack_require__(90);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__TransitionGroup__ = __webpack_require__(91);
 
 
 
@@ -69612,7 +69653,7 @@ var avatar_1 = __webpack_require__(93);
 var avatar_wrapper_1 = __webpack_require__(45);
 var avatar_number_1 = __webpack_require__(320);
 var avatar_placeholder_1 = __webpack_require__(94);
-var Spacer_1 = __webpack_require__(80);
+var Spacer_1 = __webpack_require__(81);
 var WithPopover_1 = __webpack_require__(95);
 function isAvatar(item) {
     return item['kind'] == null;
@@ -70124,7 +70165,7 @@ function getClippingRect(element, boundary, rootBoundary) {
 /* harmony export (immutable) */ __webpack_exports__["a"] = getViewportRect;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__getWindow_js__ = __webpack_require__(20);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__getDocumentElement_js__ = __webpack_require__(25);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getWindowScrollBarX_js__ = __webpack_require__(64);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getWindowScrollBarX_js__ = __webpack_require__(65);
 
 
 
@@ -70174,8 +70215,8 @@ function getViewportRect(element) {
 /* harmony export (immutable) */ __webpack_exports__["a"] = getDocumentRect;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__getDocumentElement_js__ = __webpack_require__(25);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__getComputedStyle_js__ = __webpack_require__(34);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getWindowScrollBarX_js__ = __webpack_require__(64);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__getWindowScroll_js__ = __webpack_require__(65);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getWindowScrollBarX_js__ = __webpack_require__(65);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__getWindowScroll_js__ = __webpack_require__(66);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__utils_math_js__ = __webpack_require__(31);
 
 
@@ -70214,7 +70255,7 @@ function getDocumentRect(element) {
 "use strict";
 /* harmony export (immutable) */ __webpack_exports__["a"] = getScrollParent;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__getParentNode_js__ = __webpack_require__(47);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__isScrollParent_js__ = __webpack_require__(66);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__isScrollParent_js__ = __webpack_require__(67);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getNodeName_js__ = __webpack_require__(30);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__instanceOf_js__ = __webpack_require__(14);
 
@@ -70313,9 +70354,9 @@ function getAltAxis(axis) {
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__getNodeScroll_js__ = __webpack_require__(333);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__getNodeName_js__ = __webpack_require__(30);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__instanceOf_js__ = __webpack_require__(14);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__getWindowScrollBarX_js__ = __webpack_require__(64);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__getWindowScrollBarX_js__ = __webpack_require__(65);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__getDocumentElement_js__ = __webpack_require__(25);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__isScrollParent_js__ = __webpack_require__(66);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__isScrollParent_js__ = __webpack_require__(67);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__utils_math_js__ = __webpack_require__(31);
 
 
@@ -70382,7 +70423,7 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
 
 "use strict";
 /* harmony export (immutable) */ __webpack_exports__["a"] = getNodeScroll;
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__getWindowScroll_js__ = __webpack_require__(65);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__getWindowScroll_js__ = __webpack_require__(66);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__getWindow_js__ = __webpack_require__(20);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__instanceOf_js__ = __webpack_require__(14);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__getHTMLElementScroll_js__ = __webpack_require__(334);
@@ -70637,11 +70678,11 @@ function mergeByName(modifiers) {
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return createPopper; });
 /* unused harmony export defaultModifiers */
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__createPopper_js__ = __webpack_require__(68);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__modifiers_eventListeners_js__ = __webpack_require__(63);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__modifiers_popperOffsets_js__ = __webpack_require__(67);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__modifiers_computeStyles_js__ = __webpack_require__(62);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__modifiers_applyStyles_js__ = __webpack_require__(59);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__createPopper_js__ = __webpack_require__(69);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__modifiers_eventListeners_js__ = __webpack_require__(64);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__modifiers_popperOffsets_js__ = __webpack_require__(68);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__modifiers_computeStyles_js__ = __webpack_require__(63);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__modifiers_applyStyles_js__ = __webpack_require__(60);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__modifiers_offset_js__ = __webpack_require__(108);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__modifiers_flip_js__ = __webpack_require__(103);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__modifiers_preventOverflow_js__ = __webpack_require__(109);
@@ -73320,7 +73361,7 @@ function getUTCDayOfYear(dirtyDate) {
 "use strict";
 /* harmony export (immutable) */ __webpack_exports__["a"] = getUTCISOWeek;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__toDate_index_js__ = __webpack_require__(15);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__startOfUTCISOWeek_index_js__ = __webpack_require__(70);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__startOfUTCISOWeek_index_js__ = __webpack_require__(71);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__startOfUTCISOWeekYear_index_js__ = __webpack_require__(365);
 
 
@@ -73348,7 +73389,7 @@ function getUTCISOWeek(dirtyDate) {
 "use strict";
 /* harmony export (immutable) */ __webpack_exports__["a"] = startOfUTCISOWeekYear;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__getUTCISOWeekYear_index_js__ = __webpack_require__(247);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__startOfUTCISOWeek_index_js__ = __webpack_require__(70);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__startOfUTCISOWeek_index_js__ = __webpack_require__(71);
 
  // This function will be a part of public API when UTC function will be implemented.
 // See issue: https://github.com/date-fns/date-fns/issues/376
@@ -73373,7 +73414,7 @@ function startOfUTCISOWeekYear(dirtyDate) {
 "use strict";
 /* harmony export (immutable) */ __webpack_exports__["a"] = getUTCWeek;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__toDate_index_js__ = __webpack_require__(15);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__startOfUTCWeek_index_js__ = __webpack_require__(71);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__startOfUTCWeek_index_js__ = __webpack_require__(72);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__startOfUTCWeekYear_index_js__ = __webpack_require__(367);
 
 
@@ -73402,7 +73443,7 @@ function getUTCWeek(dirtyDate, options) {
 /* harmony export (immutable) */ __webpack_exports__["a"] = startOfUTCWeekYear;
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__toInteger_index_js__ = __webpack_require__(32);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__getUTCWeekYear_index_js__ = __webpack_require__(248);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__startOfUTCWeek_index_js__ = __webpack_require__(71);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__startOfUTCWeek_index_js__ = __webpack_require__(72);
 
 
  // This function will be a part of public API when UTC function will be implemented.
@@ -73610,7 +73651,7 @@ var _reactDom = _interopRequireDefault(__webpack_require__(8));
 
 var _propTypes = _interopRequireDefault(__webpack_require__(4));
 
-var _InputText = __webpack_require__(72);
+var _InputText = __webpack_require__(73);
 
 var _Button = __webpack_require__(249);
 
@@ -79982,7 +80023,7 @@ var _propTypes = _interopRequireDefault(__webpack_require__(4));
 
 var _reactDom = _interopRequireDefault(__webpack_require__(8));
 
-var _InputText = __webpack_require__(72);
+var _InputText = __webpack_require__(73);
 
 var _Button = __webpack_require__(249);
 
@@ -115214,8 +115255,8 @@ Object(__WEBPACK_IMPORTED_MODULE_2__utils_batch__["b" /* setBatch */])(__WEBPACK
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_prop_types__ = __webpack_require__(4);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_prop_types___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_1_prop_types__);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Context__ = __webpack_require__(33);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__utils_Subscription__ = __webpack_require__(77);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__utils_useIsomorphicLayoutEffect__ = __webpack_require__(78);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__utils_Subscription__ = __webpack_require__(78);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__utils_useIsomorphicLayoutEffect__ = __webpack_require__(79);
 
 
 
@@ -115989,8 +116030,8 @@ var useDispatch = /*#__PURE__*/createDispatchHook();
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react__ = __webpack_require__(0);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_react__);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__useReduxContext__ = __webpack_require__(268);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__utils_Subscription__ = __webpack_require__(77);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__utils_useIsomorphicLayoutEffect__ = __webpack_require__(78);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__utils_Subscription__ = __webpack_require__(78);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__utils_useIsomorphicLayoutEffect__ = __webpack_require__(79);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__components_Context__ = __webpack_require__(33);
 
 
@@ -116234,7 +116275,7 @@ var useCallback = useCallbackOne;
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "f", function() { return offset; });
 /* unused harmony export shrink */
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "g", function() { return withScroll; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_tiny_invariant__ = __webpack_require__(79);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_tiny_invariant__ = __webpack_require__(80);
 
 
 var getRect = function getRect(_ref) {
@@ -116541,7 +116582,7 @@ var multiselect_1 = __webpack_require__(541);
 var classnames_1 = __importDefault(__webpack_require__(2));
 var react_id_generator_1 = __importDefault(__webpack_require__(9));
 var Form_1 = __webpack_require__(13);
-var SelectPreview_1 = __webpack_require__(74);
+var SelectPreview_1 = __webpack_require__(75);
 var MultiSelect = /** @class */ (function (_super) {
     __extends(MultiSelect, _super);
     function MultiSelect(props) {
@@ -116610,7 +116651,7 @@ var _Tooltip = __webpack_require__(19);
 
 var _DomHandler = _interopRequireDefault(__webpack_require__(12));
 
-var _FilterUtils = _interopRequireDefault(__webpack_require__(86));
+var _FilterUtils = _interopRequireDefault(__webpack_require__(87));
 
 var _ObjectUtils = _interopRequireDefault(__webpack_require__(17));
 
@@ -117546,7 +117587,7 @@ var _react = _interopRequireWildcard(__webpack_require__(0));
 
 var _propTypes = _interopRequireDefault(__webpack_require__(4));
 
-var _InputText = __webpack_require__(72);
+var _InputText = __webpack_require__(73);
 
 var _Checkbox = __webpack_require__(544);