@vitrosoftware/common-ui-ts 1.1.16 → 1.1.19

package/dist/index.js

@@ -129,7 +129,8 @@ var app$1 = {
 			}
 		},
 		actionHandler: {
-			itemCount: "Выбранных объектов: {{itemCount}}"
+			itemCount: "Выбранных объектов: {{itemCount}}",
+			itemName: "Выбран объект: {{itemName}}"
 		},
 		login: {
 			title: "Вход",
@@ -155,6 +156,9 @@ var app$1 = {
 		},
 		dropdown: {
 			empty: "Нет доступных действий"
+		},
+		issueTile: {
+			textareaLabel: "Описание"
 		}
 	}
 };
@@ -174,6 +178,8 @@ CTRL.BRACE_OPEN = '{';
 CTRL.BRACE_CLOSE = '}';
 CTRL.PARENTHESIS_OPEN = '(';
 CTRL.PARENTHESIS_CLOSE = ')';
+CTRL.SQUARE_BRACKET_OPEN = '[';
+CTRL.SQUARE_BRACKET_CLOSE = ']';
 CTRL.EQUAL = '=';
 CTRL.AMPERSAND = '&';
 CTRL.DASH = '-';
@@ -20588,6 +20594,8 @@ var EVENT$2;
   EVENT["ON_START_DRAG"] = "OnStartDrag";
   EVENT["ON_SUGGEST"] = "OnSuggest";
   EVENT["ON_VALUE_CHANGED"] = "OnValueChanged";
+  EVENT["ON_DRAG_OVER"] = "OnDragOver";
+  EVENT["ON_DROP"] = "OnDrop";
 })(EVENT$2 || (EVENT$2 = {}));
 var URL;
 (function (URL) {
@@ -20705,6 +20713,11 @@ var ACTION;
   ACTION["SHOW_POPUP_MENU"] = "ShowPopupMenu";
   ACTION["SHOW_MENU"] = "ShowMenu";
 })(ACTION || (ACTION = {}));
+var SECTION;
+(function (SECTION) {
+  SECTION["HEADER"] = "Header";
+  SECTION["SPACE"] = "Space";
+})(SECTION || (SECTION = {}));
 
 var TableViewConstants = {
     __proto__: null,
@@ -20723,7 +20736,8 @@ var TableViewConstants = {
     get ALIGN () { return ALIGN; },
     get ROW_ID () { return ROW_ID; },
     get NUMBER_FORMAT () { return NUMBER_FORMAT; },
-    get ACTION () { return ACTION; }
+    get ACTION () { return ACTION; },
+    get SECTION () { return SECTION; }
 };
 
 var styles$3 = {"vitro-table-view":"_table-view_vitro-table-view_1tTs32D"};
@@ -20974,23 +20988,24 @@ var LOCALE;
   LOCALE["CANCEL"] = "app.common.uploader.action.cancel";
 })(LOCALE || (LOCALE = {}));
 
-var $ = window.$;
+var $$1 = window.$;
 var COLOR_GREEN = '#198754';
 var KENDO_UPLOAD = 'kendoUpload';
 var AUTHORIZATION_TOKEN_HEADER = 'AuthorizationToken';
 var TelerikUploaderContextImpl = /*#__PURE__*/function () {
-  function TelerikUploaderContextImpl(uploader, container, dropZone, settings, localeService) {
+  function TelerikUploaderContextImpl(uploader, container, dropZone, settings, localeService, onUploadComplete) {
     this.token = CTRL.EMPTY;
     this.successCount = 0;
     this.errorCount = 0;
-    this.progressInfo = $('#vitro-uploader-progress-info');
-    this.progressBar = $('#vitro-progress-bar')[0];
-    this.title = $('#vitro-uploader-title');
-    this.subtitle = $('#vitro-uploader-subtitle');
+    this.progressInfo = $$1('#vitro-uploader-progress-info');
+    this.progressBar = $$1('#vitro-progress-bar')[0];
+    this.title = $$1('#vitro-uploader-title');
+    this.subtitle = $$1('#vitro-uploader-subtitle');
     this.uploader = uploader;
     this.container = container[0];
     this.settings = settings;
     this.localeService = localeService;
+    this.onUploadComplete = onUploadComplete;
     this.id = uploader[0].id;
     var component = this;
     var telerikConfig = {
@@ -21038,7 +21053,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
   }
   var _proto = TelerikUploaderContextImpl.prototype;
   _proto.clearAllFiles = function clearAllFiles() {
-    $("" + CTRL.SHARP + this.id).data(KENDO_UPLOAD).clearAllFiles();
+    $$1("" + CTRL.SHARP + this.id).data(KENDO_UPLOAD).clearAllFiles();
     this.resetUploader();
   };
   _proto.resetUploader = function resetUploader() {
@@ -21105,6 +21120,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
       }));
     }
     this.setProgressBar(100);
+    this.onUploadComplete();
   };
   _proto.select = function select(e) {
     this.container.classList.remove('vitro-dropzone-active');
@@ -21127,7 +21143,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
     };
   };
   _proto.addFile = function addFile() {
-    $("" + CTRL.SHARP + this.id).click();
+    $$1("" + CTRL.SHARP + this.id).click();
   };
   _proto.setAthorizationToken = function setAthorizationToken(token) {
     this.token = token;
@@ -21141,7 +21157,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
     }
   };
   _proto.setFileProgress = function setFileProgress(id, percent) {
-    var progressBar = $("[data-uid=" + id + "]").children('.k-progressbar')[0];
+    var progressBar = $$1("[data-uid=" + id + "]").children('.k-progressbar')[0];
     progressBar.style.background = "conic-gradient(from 90deg, #0D6EFD, #0D6EFD " + percent + "%, white " + percent + "%, white 100%)";
   };
   _proto.initOnDrop = function initOnDrop() {
@@ -21190,7 +21206,7 @@ SERVICE.LOCALE = 'LocaleService';
 
 var styles$4 = {"vitro-uploader":"_uploader_vitro-uploader_237vX7T","vitro-upload-container":"_uploader_vitro-upload-container_2ASGHSS","vitro-drop-zone":"_uploader_vitro-drop-zone_3w2dluc","vitro-progress-info":"_uploader_vitro-progress-info_J4BRjZ0","vitro-button-close":"_uploader_vitro-button-close_30As0AM","vitro-button-show":"_uploader_vitro-button-show_uUmWVJc","vitro-button-hide":"_uploader_vitro-button-hide_LYS1px9","vitro-hidden":"_uploader_vitro-hidden_12825pc","vitro-progress":"_uploader_vitro-progress_2NtaSj2","vitro-dropzone-image":"_uploader_vitro-dropzone-image_ianU_0j","vitro-drop-zone-text":"_uploader_vitro-drop-zone-text_KLjek2K","vitro-progress-bar":"_uploader_vitro-progress-bar_3YXLbbu"};
 
-var $$1 = window.$;
+var $$2 = window.$;
 var TYPE_FILES = 'Files';
 var TelerikUploader = function TelerikUploader(props) {
   var _useState = React.useState(false),
@@ -21211,10 +21227,10 @@ var TelerikUploader = function TelerikUploader(props) {
   var componentName = 'telerikUploader';
   React.useEffect(function () {
     if (uploaderRef && dropZoneRef) {
-      var input = $$1(uploaderRef.current);
-      var dropZone = $$1(dropZoneRef.current);
-      var container = $$1(containerRef.current);
-      var _kendoUploader = new TelerikUploaderContextImpl(input, container, dropZone, props.settings, localeService);
+      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);
       setKendoUploader(_kendoUploader);
       if (props.onInit) {
         props.onInit(_kendoUploader);
@@ -21254,6 +21270,13 @@ var TelerikUploader = function TelerikUploader(props) {
       setShowClose(true);
     }
   };
+  var onUploadComplete = function onUploadComplete() {
+    if (props.isAutoClose) {
+      window.setTimeout(function () {
+        clearUploadResult();
+      }, props.durationMs || 5000);
+    }
+  };
   var clearUploadResult = function clearUploadResult() {
     if (kendoUploader) {
       kendoUploader.clearAllFiles();
@@ -54706,6 +54729,24 @@ function useCallbackRef() {
   return React.useState(null);
 }
 
+/**
+ * Attaches an event handler outside directly to specified DOM element
+ * bypassing the react synthetic event system.
+ *
+ * @param element The target to listen for events on
+ * @param event The DOM event name
+ * @param handler An event handler
+ * @param capture Whether or not to listen during the capture event phase
+ */
+function useEventListener(eventTarget, event, listener, capture = false) {
+  const handler = useEventCallback(listener);
+  React.useEffect(() => {
+    const target = typeof eventTarget === 'function' ? eventTarget() : eventTarget;
+    target.addEventListener(event, handler, capture);
+    return () => target.removeEventListener(event, handler, capture);
+  }, [eventTarget]);
+}
+
 /**
  * Track whether a component is current mounted. Generally less preferable than
  * properlly canceling effects so they don't run after a component is unmounted,
@@ -54738,6 +54779,31 @@ function useMounted() {
   return isMounted.current;
 }
 
+/**
+ * Store the last of some value. Tracked via a `Ref` only updating it
+ * after the component renders.
+ *
+ * Helpful if you need to compare a prop value to it's previous value during render.
+ *
+ * ```ts
+ * function Component(props) {
+ *   const lastProps = usePrevious(props)
+ *
+ *   if (lastProps.foo !== props.foo)
+ *     resetValueFromProps(props.foo)
+ * }
+ * ```
+ *
+ * @param value the value to track
+ */
+function usePrevious(value) {
+  const ref = React.useRef(null);
+  React.useEffect(() => {
+    ref.current = value;
+  });
+  return ref.current;
+}
+
 const isReactNative = typeof global !== 'undefined' &&
 // @ts-ignore
 global.navigator &&
@@ -55163,6 +55229,28 @@ function qsa(element, selector) {
   return toArray(element.querySelectorAll(selector));
 }
 
+function useUncontrolledProp$1(propValue, defaultValue, handler) {
+  const wasPropRef = React.useRef(propValue !== undefined);
+  const [stateValue, setState] = React.useState(defaultValue);
+  const isProp = propValue !== undefined;
+  const wasProp = wasPropRef.current;
+  wasPropRef.current = isProp;
+
+  /**
+   * If a prop switches from controlled to Uncontrolled
+   * reset its value to the defaultValue
+   */
+  if (!isProp && wasProp && stateValue !== defaultValue) {
+    setState(defaultValue);
+  }
+  return [isProp ? propValue : stateValue, React.useCallback((...args) => {
+    const [value, ...rest] = args;
+    let returnValue = handler == null ? void 0 : handler(value, ...rest);
+    setState(value);
+    return returnValue;
+  }, [handler])];
+}
+
 /**
  * Returns a function that triggers a component update. the hook equivalent to
  * `this.forceUpdate()` in a class component. In most cases using a state value directly
@@ -55186,6 +55274,8 @@ function useForceUpdate() {
   return dispatch;
 }
 
+const DropdownContext = /*#__PURE__*/React.createContext(null);
+
 var has$2 = Object.prototype.hasOwnProperty;
 
 function find(iter, tar, key) {
@@ -57382,6 +57472,271 @@ function mergeOptionsWithPopperConfig({
   });
 }
 
+const _excluded$3 = ["children"];
+function _objectWithoutPropertiesLoose$5(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+const noop$2 = () => {};
+
+/**
+ * @memberOf Dropdown
+ * @param {object}  options
+ * @param {boolean} options.flip Automatically adjust the menu `drop` position based on viewport edge detection
+ * @param {[number, number]} options.offset Define an offset distance between the Menu and the Toggle
+ * @param {boolean} options.show Display the menu manually, ignored in the context of a `Dropdown`
+ * @param {boolean} options.usePopper opt in/out of using PopperJS to position menus. When disabled you must position it yourself.
+ * @param {string}  options.rootCloseEvent The pointer event to listen for when determining "clicks outside" the menu for triggering a close.
+ * @param {object}  options.popperConfig Options passed to the [`usePopper`](/api/usePopper) hook.
+ */
+function useDropdownMenu(options = {}) {
+  const context = React.useContext(DropdownContext);
+  const [arrowElement, attachArrowRef] = useCallbackRef();
+  const hasShownRef = React.useRef(false);
+  const {
+    flip,
+    offset,
+    rootCloseEvent,
+    fixed = false,
+    placement: placementOverride,
+    popperConfig = {},
+    enableEventListeners = true,
+    usePopper: shouldUsePopper = !!context
+  } = options;
+  const show = (context == null ? void 0 : context.show) == null ? !!options.show : context.show;
+  if (show && !hasShownRef.current) {
+    hasShownRef.current = true;
+  }
+  const handleClose = e => {
+    context == null ? void 0 : context.toggle(false, e);
+  };
+  const {
+    placement,
+    setMenu,
+    menuElement,
+    toggleElement
+  } = context || {};
+  const popper = usePopper(toggleElement, menuElement, mergeOptionsWithPopperConfig({
+    placement: placementOverride || placement || 'bottom-start',
+    enabled: shouldUsePopper,
+    enableEvents: enableEventListeners == null ? show : enableEventListeners,
+    offset,
+    flip,
+    fixed,
+    arrowElement,
+    popperConfig
+  }));
+  const menuProps = Object.assign({
+    ref: setMenu || noop$2,
+    'aria-labelledby': toggleElement == null ? void 0 : toggleElement.id
+  }, popper.attributes.popper, {
+    style: popper.styles.popper
+  });
+  const metadata = {
+    show,
+    placement,
+    hasShown: hasShownRef.current,
+    toggle: context == null ? void 0 : context.toggle,
+    popper: shouldUsePopper ? popper : null,
+    arrowProps: shouldUsePopper ? Object.assign({
+      ref: attachArrowRef
+    }, popper.attributes.arrow, {
+      style: popper.styles.arrow
+    }) : {}
+  };
+  useClickOutside(menuElement, handleClose, {
+    clickTrigger: rootCloseEvent,
+    disabled: !show
+  });
+  return [menuProps, metadata];
+}
+const defaultProps = {
+  usePopper: true
+};
+/**
+ * Also exported as `<Dropdown.Menu>` from `Dropdown`.
+ *
+ * @displayName DropdownMenu
+ * @memberOf Dropdown
+ */
+function DropdownMenu(_ref) {
+  let {
+      children
+    } = _ref,
+    options = _objectWithoutPropertiesLoose$5(_ref, _excluded$3);
+  const [props, meta] = useDropdownMenu(options);
+  return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: children(props, meta)
+  });
+}
+DropdownMenu.displayName = 'DropdownMenu';
+DropdownMenu.defaultProps = defaultProps;
+
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ /*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ // We must avoid a circular dependency with @react-aria/utils, and this useLayoutEffect is
+// guarded by a check that it only runs on the client side.
+// eslint-disable-next-line rulesdir/useLayoutEffectRule
+
+// Default context value to use in case there is no SSRProvider. This is fine for
+// client-only apps. In order to support multiple copies of React Aria potentially
+// being on the page at once, the prefix is set to a random number. SSRProvider
+// will reset this to zero for consistency between server and client, so in the
+// SSR case multiple copies of React Aria is not supported.
+const $b5e257d569688ac6$var$defaultContext = {
+    prefix: String(Math.round(Math.random() * 10000000000)),
+    current: 0,
+    isSSR: false
+};
+const $b5e257d569688ac6$var$SSRContext = /*#__PURE__*/ (React__default).createContext($b5e257d569688ac6$var$defaultContext);
+let $b5e257d569688ac6$var$canUseDOM = Boolean(typeof window !== "undefined" && window.document && window.document.createElement);
+let $b5e257d569688ac6$var$componentIds = new WeakMap();
+function $b5e257d569688ac6$var$useCounter(isDisabled = false) {
+    let ctx = (React.useContext)($b5e257d569688ac6$var$SSRContext);
+    let ref = (React.useRef)(null);
+    // eslint-disable-next-line rulesdir/pure-render
+    if (ref.current === null && !isDisabled) {
+        var _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED_ReactCurrentOwner;
+        // In strict mode, React renders components twice, and the ref will be reset to null on the second render.
+        // This means our id counter will be incremented twice instead of once. This is a problem because on the
+        // server, components are only rendered once and so ids generated on the server won't match the client.
+        // In React 18, useId was introduced to solve this, but it is not available in older versions. So to solve this
+        // we need to use some React internals to access the underlying Fiber instance, which is stable between renders.
+        // This is exposed as ReactCurrentOwner in development, which is all we need since StrictMode only runs in development.
+        // To ensure that we only increment the global counter once, we store the starting id for this component in
+        // a weak map associated with the Fiber. On the second render, we reset the global counter to this value.
+        // Since React runs the second render immediately after the first, this is safe.
+        // @ts-ignore
+        let currentOwner = (_React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = (React__default).__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED) === null || _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED === void 0 ? void 0 : (_React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED_ReactCurrentOwner = _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner) === null || _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED_ReactCurrentOwner === void 0 ? void 0 : _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED_ReactCurrentOwner.current;
+        if (currentOwner) {
+            let prevComponentValue = $b5e257d569688ac6$var$componentIds.get(currentOwner);
+            if (prevComponentValue == null) // On the first render, and first call to useId, store the id and state in our weak map.
+            $b5e257d569688ac6$var$componentIds.set(currentOwner, {
+                id: ctx.current,
+                state: currentOwner.memoizedState
+            });
+            else if (currentOwner.memoizedState !== prevComponentValue.state) {
+                // On the second render, the memoizedState gets reset by React.
+                // Reset the counter, and remove from the weak map so we don't
+                // do this for subsequent useId calls.
+                ctx.current = prevComponentValue.id;
+                $b5e257d569688ac6$var$componentIds.delete(currentOwner);
+            }
+        }
+        // eslint-disable-next-line rulesdir/pure-render
+        ref.current = ++ctx.current;
+    }
+    // eslint-disable-next-line rulesdir/pure-render
+    return ref.current;
+}
+function $b5e257d569688ac6$var$useLegacySSRSafeId(defaultId) {
+    let ctx = (React.useContext)($b5e257d569688ac6$var$SSRContext);
+    // If we are rendering in a non-DOM environment, and there's no SSRProvider,
+    // provide a warning to hint to the developer to add one.
+    if (ctx === $b5e257d569688ac6$var$defaultContext && !$b5e257d569688ac6$var$canUseDOM) console.warn("When server rendering, you must wrap your application in an <SSRProvider> to ensure consistent ids are generated between the client and server.");
+    let counter = $b5e257d569688ac6$var$useCounter(!!defaultId);
+    let prefix = ctx === $b5e257d569688ac6$var$defaultContext && process.env.NODE_ENV === "test" ? "react-aria" : `react-aria${ctx.prefix}`;
+    return defaultId || `${prefix}-${counter}`;
+}
+function $b5e257d569688ac6$var$useModernSSRSafeId(defaultId) {
+    // @ts-ignore
+    let id = (React__default).useId();
+    let [didSSR] = (React.useState)($b5e257d569688ac6$export$535bd6ca7f90a273());
+    let prefix = didSSR || process.env.NODE_ENV === "test" ? "react-aria" : `react-aria${$b5e257d569688ac6$var$defaultContext.prefix}`;
+    return defaultId || `${prefix}-${id}`;
+}
+const $b5e257d569688ac6$export$619500959fc48b26 = typeof (React__default)["useId"] === "function" ? $b5e257d569688ac6$var$useModernSSRSafeId : $b5e257d569688ac6$var$useLegacySSRSafeId;
+function $b5e257d569688ac6$var$getSnapshot() {
+    return false;
+}
+function $b5e257d569688ac6$var$getServerSnapshot() {
+    return true;
+}
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function $b5e257d569688ac6$var$subscribe(onStoreChange) {
+    // noop
+    return ()=>{};
+}
+function $b5e257d569688ac6$export$535bd6ca7f90a273() {
+    // In React 18, we can use useSyncExternalStore to detect if we're server rendering or hydrating.
+    if (typeof (React__default)["useSyncExternalStore"] === "function") return (React__default)["useSyncExternalStore"]($b5e257d569688ac6$var$subscribe, $b5e257d569688ac6$var$getSnapshot, $b5e257d569688ac6$var$getServerSnapshot);
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    let cur = (React.useContext)($b5e257d569688ac6$var$SSRContext);
+    return cur.isSSR;
+}
+
+const isRoleMenu = el => {
+  var _el$getAttribute;
+  return ((_el$getAttribute = el.getAttribute('role')) == null ? void 0 : _el$getAttribute.toLowerCase()) === 'menu';
+};
+const noop$3 = () => {};
+
+/**
+ * Wires up Dropdown toggle functionality, returning a set a props to attach
+ * to the element that functions as the dropdown toggle (generally a button).
+ *
+ * @memberOf Dropdown
+ */
+function useDropdownToggle() {
+  const id = $b5e257d569688ac6$export$619500959fc48b26();
+  const {
+    show = false,
+    toggle = noop$3,
+    setToggle,
+    menuElement
+  } = React.useContext(DropdownContext) || {};
+  const handleClick = React.useCallback(e => {
+    toggle(!show, e);
+  }, [show, toggle]);
+  const props = {
+    id,
+    ref: setToggle || noop$3,
+    onClick: handleClick,
+    'aria-expanded': !!show
+  };
+
+  // This is maybe better down in an effect, but
+  // the component is going to update anyway when the menu element
+  // is set so might return new props.
+  if (menuElement && isRoleMenu(menuElement)) {
+    props['aria-haspopup'] = true;
+  }
+  return [props, {
+    show,
+    toggle
+  }];
+}
+/**
+ * Also exported as `<Dropdown.Toggle>` from `Dropdown`.
+ *
+ * @displayName DropdownToggle
+ * @memberOf Dropdown
+ */
+function DropdownToggle({
+  children
+}) {
+  const [props, meta] = useDropdownToggle();
+  return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: children(props, meta)
+  });
+}
+DropdownToggle.displayName = 'DropdownToggle';
+
 const SelectableContext = /*#__PURE__*/React.createContext(null);
 const makeEventKey = (eventKey, href = null) => {
   if (eventKey != null) return String(eventKey);
@@ -57400,6 +57755,64 @@ function dataProp(property) {
   return `${PROPERTY_PREFIX}${property}`;
 }
 
+const _excluded$4 = ["eventKey", "disabled", "onClick", "active", "as"];
+function _objectWithoutPropertiesLoose$6(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+/**
+ * Create a dropdown item. Returns a set of props for the dropdown item component
+ * including an `onClick` handler that prevents selection when the item is disabled
+ */
+function useDropdownItem({
+  key,
+  href,
+  active,
+  disabled,
+  onClick
+}) {
+  const onSelectCtx = React.useContext(SelectableContext);
+  const navContext = React.useContext(NavContext);
+  const {
+    activeKey
+  } = navContext || {};
+  const eventKey = makeEventKey(key, href);
+  const isActive = active == null && key != null ? makeEventKey(activeKey) === eventKey : active;
+  const handleClick = useEventCallback(event => {
+    if (disabled) return;
+    onClick == null ? void 0 : onClick(event);
+    if (onSelectCtx && !event.isPropagationStopped()) {
+      onSelectCtx(eventKey, event);
+    }
+  });
+  return [{
+    onClick: handleClick,
+    'aria-disabled': disabled || undefined,
+    'aria-selected': isActive,
+    [dataAttr('dropdown-item')]: ''
+  }, {
+    isActive
+  }];
+}
+const DropdownItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+      eventKey,
+      disabled,
+      onClick,
+      active,
+      as: Component = Button
+    } = _ref,
+    props = _objectWithoutPropertiesLoose$6(_ref, _excluded$4);
+  const [dropdownItemProps] = useDropdownItem({
+    key: eventKey,
+    href: props.href,
+    disabled,
+    onClick,
+    active
+  });
+  return /*#__PURE__*/jsxRuntime.jsx(Component, Object.assign({}, props, {
+    ref: ref
+  }, dropdownItemProps));
+});
+DropdownItem.displayName = 'DropdownItem';
+
 const Context = /*#__PURE__*/React.createContext(canUseDOM ? window : undefined);
 
 /**
@@ -57412,15 +57825,464 @@ function useWindow() {
   return React.useContext(Context);
 }
 
-// TODO: check
+function useRefWithUpdate() {
+  const forceUpdate = useForceUpdate();
+  const ref = React.useRef(null);
+  const attachRef = React.useCallback(element => {
+    ref.current = element;
+    // ensure that a menu set triggers an update for consumers
+    forceUpdate();
+  }, [forceUpdate]);
+  return [ref, attachRef];
+}
+
+/**
+ * @displayName Dropdown
+ * @public
+ */
+function Dropdown({
+  defaultShow,
+  show: rawShow,
+  onSelect,
+  onToggle: rawOnToggle,
+  itemSelector = `* [${dataAttr('dropdown-item')}]`,
+  focusFirstItemOnShow,
+  placement = 'bottom-start',
+  children
+}) {
+  const window = useWindow();
+  const [show, onToggle] = useUncontrolledProp$1(rawShow, defaultShow, rawOnToggle);
+
+  // We use normal refs instead of useCallbackRef in order to populate the
+  // the value as quickly as possible, otherwise the effect to focus the element
+  // may run before the state value is set
+  const [menuRef, setMenu] = useRefWithUpdate();
+  const menuElement = menuRef.current;
+  const [toggleRef, setToggle] = useRefWithUpdate();
+  const toggleElement = toggleRef.current;
+  const lastShow = usePrevious(show);
+  const lastSourceEvent = React.useRef(null);
+  const focusInDropdown = React.useRef(false);
+  const onSelectCtx = React.useContext(SelectableContext);
+  const toggle = React.useCallback((nextShow, event, source = event == null ? void 0 : event.type) => {
+    onToggle(nextShow, {
+      originalEvent: event,
+      source
+    });
+  }, [onToggle]);
+  const handleSelect = useEventCallback((key, event) => {
+    onSelect == null ? void 0 : onSelect(key, event);
+    toggle(false, event, 'select');
+    if (!event.isPropagationStopped()) {
+      onSelectCtx == null ? void 0 : onSelectCtx(key, event);
+    }
+  });
+  const context = React.useMemo(() => ({
+    toggle,
+    placement,
+    show,
+    menuElement,
+    toggleElement,
+    setMenu,
+    setToggle
+  }), [toggle, placement, show, menuElement, toggleElement, setMenu, setToggle]);
+  if (menuElement && lastShow && !show) {
+    focusInDropdown.current = menuElement.contains(menuElement.ownerDocument.activeElement);
+  }
+  const focusToggle = useEventCallback(() => {
+    if (toggleElement && toggleElement.focus) {
+      toggleElement.focus();
+    }
+  });
+  const maybeFocusFirst = useEventCallback(() => {
+    const type = lastSourceEvent.current;
+    let focusType = focusFirstItemOnShow;
+    if (focusType == null) {
+      focusType = menuRef.current && isRoleMenu(menuRef.current) ? 'keyboard' : false;
+    }
+    if (focusType === false || focusType === 'keyboard' && !/^key.+$/.test(type)) {
+      return;
+    }
+    const first = qsa(menuRef.current, itemSelector)[0];
+    if (first && first.focus) first.focus();
+  });
+  React.useEffect(() => {
+    if (show) maybeFocusFirst();else if (focusInDropdown.current) {
+      focusInDropdown.current = false;
+      focusToggle();
+    }
+    // only `show` should be changing
+  }, [show, focusInDropdown, focusToggle, maybeFocusFirst]);
+  React.useEffect(() => {
+    lastSourceEvent.current = null;
+  });
+  const getNextFocusedChild = (current, offset) => {
+    if (!menuRef.current) return null;
+    const items = qsa(menuRef.current, itemSelector);
+    let index = items.indexOf(current) + offset;
+    index = Math.max(0, Math.min(index, items.length));
+    return items[index];
+  };
+  useEventListener(React.useCallback(() => window.document, [window]), 'keydown', event => {
+    var _menuRef$current, _toggleRef$current;
+    const {
+      key
+    } = event;
+    const target = event.target;
+    const fromMenu = (_menuRef$current = menuRef.current) == null ? void 0 : _menuRef$current.contains(target);
+    const fromToggle = (_toggleRef$current = toggleRef.current) == null ? void 0 : _toggleRef$current.contains(target);
+
+    // Second only to https://github.com/twbs/bootstrap/blob/8cfbf6933b8a0146ac3fbc369f19e520bd1ebdac/js/src/dropdown.js#L400
+    // in inscrutability
+    const isInput = /input|textarea/i.test(target.tagName);
+    if (isInput && (key === ' ' || key !== 'Escape' && fromMenu || key === 'Escape' && target.type === 'search')) {
+      return;
+    }
+    if (!fromMenu && !fromToggle) {
+      return;
+    }
+    if (key === 'Tab' && (!menuRef.current || !show)) {
+      return;
+    }
+    lastSourceEvent.current = event.type;
+    const meta = {
+      originalEvent: event,
+      source: event.type
+    };
+    switch (key) {
+      case 'ArrowUp':
+        {
+          const next = getNextFocusedChild(target, -1);
+          if (next && next.focus) next.focus();
+          event.preventDefault();
+          return;
+        }
+      case 'ArrowDown':
+        event.preventDefault();
+        if (!show) {
+          onToggle(true, meta);
+        } else {
+          const next = getNextFocusedChild(target, 1);
+          if (next && next.focus) next.focus();
+        }
+        return;
+      case 'Tab':
+        // on keydown the target is the element being tabbed FROM, we need that
+        // to know if this event is relevant to this dropdown (e.g. in this menu).
+        // On `keyup` the target is the element being tagged TO which we use to check
+        // if focus has left the menu
+        addEventListener(target.ownerDocument, 'keyup', e => {
+          var _menuRef$current2;
+          if (e.key === 'Tab' && !e.target || !((_menuRef$current2 = menuRef.current) != null && _menuRef$current2.contains(e.target))) {
+            onToggle(false, meta);
+          }
+        }, {
+          once: true
+        });
+        break;
+      case 'Escape':
+        if (key === 'Escape') {
+          event.preventDefault();
+          event.stopPropagation();
+        }
+        onToggle(false, meta);
+        break;
+    }
+  });
+  return /*#__PURE__*/jsxRuntime.jsx(SelectableContext.Provider, {
+    value: handleSelect,
+    children: /*#__PURE__*/jsxRuntime.jsx(DropdownContext.Provider, {
+      value: context,
+      children: children
+    })
+  });
+}
+Dropdown.displayName = 'Dropdown';
+Dropdown.Menu = DropdownMenu;
+Dropdown.Toggle = DropdownToggle;
+Dropdown.Item = DropdownItem;
+
+const DropdownContext$1 = /*#__PURE__*/React.createContext({});
+DropdownContext$1.displayName = 'DropdownContext';
+
+const DropdownItem$1 = /*#__PURE__*/React.forwardRef(({
+  bsPrefix,
+  className,
+  eventKey,
+  disabled = false,
+  onClick,
+  active,
+  as: Component = Anchor,
+  ...props
+}, ref) => {
+  const prefix = useBootstrapPrefix(bsPrefix, 'dropdown-item');
+  const [dropdownItemProps, meta] = useDropdownItem({
+    key: eventKey,
+    href: props.href,
+    disabled,
+    onClick,
+    active
+  });
+  return /*#__PURE__*/jsxRuntime.jsx(Component, {
+    ...props,
+    ...dropdownItemProps,
+    ref: ref,
+    className: classnames(className, prefix, meta.isActive && 'active', disabled && 'disabled')
+  });
+});
+DropdownItem$1.displayName = 'DropdownItem';
 
 const context$1 = /*#__PURE__*/React.createContext(null);
-context$1.displayName = 'NavbarContext';
+context$1.displayName = 'InputGroupContext';
+
+// TODO: check
+
+const context$2 = /*#__PURE__*/React.createContext(null);
+context$2.displayName = 'NavbarContext';
+
+function useWrappedRefWithWarning(ref, componentName) {
+  // @ts-ignore
+  if (!(process.env.NODE_ENV !== "production")) return ref;
+
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  const warningRef = React.useCallback(refValue => {
+    !(refValue == null || !refValue.isReactComponent) ? process.env.NODE_ENV !== "production" ? browser(false, `${componentName} injected a ref to a provided \`as\` component that resolved to a component instance instead of a DOM element. ` + 'Use `React.forwardRef` to provide the injected ref to the class component as a prop in order to pass it directly to a DOM element') : browser(false) : void 0;
+  }, [componentName]);
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  return useMergedRefs(warningRef, ref);
+}
+
+function getDropdownMenuPlacement(alignEnd, dropDirection, isRTL) {
+  const topStart = isRTL ? 'top-end' : 'top-start';
+  const topEnd = isRTL ? 'top-start' : 'top-end';
+  const bottomStart = isRTL ? 'bottom-end' : 'bottom-start';
+  const bottomEnd = isRTL ? 'bottom-start' : 'bottom-end';
+  const leftStart = isRTL ? 'right-start' : 'left-start';
+  const leftEnd = isRTL ? 'right-end' : 'left-end';
+  const rightStart = isRTL ? 'left-start' : 'right-start';
+  const rightEnd = isRTL ? 'left-end' : 'right-end';
+  let placement = alignEnd ? bottomEnd : bottomStart;
+  if (dropDirection === 'up') placement = alignEnd ? topEnd : topStart;else if (dropDirection === 'end') placement = alignEnd ? rightEnd : rightStart;else if (dropDirection === 'start') placement = alignEnd ? leftEnd : leftStart;else if (dropDirection === 'down-centered') placement = 'bottom';else if (dropDirection === 'up-centered') placement = 'top';
+  return placement;
+}
+const DropdownMenu$1 = /*#__PURE__*/React.forwardRef(({
+  bsPrefix,
+  className,
+  align,
+  rootCloseEvent,
+  flip = true,
+  show: showProps,
+  renderOnMount,
+  // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+  as: Component = 'div',
+  popperConfig,
+  variant,
+  ...props
+}, ref) => {
+  let alignEnd = false;
+  const isNavbar = React.useContext(context$2);
+  const prefix = useBootstrapPrefix(bsPrefix, 'dropdown-menu');
+  const {
+    align: contextAlign,
+    drop,
+    isRTL
+  } = React.useContext(DropdownContext$1);
+  align = align || contextAlign;
+  const isInputGroup = React.useContext(context$1);
+  const alignClasses = [];
+  if (align) {
+    if (typeof align === 'object') {
+      const keys = Object.keys(align);
+      process.env.NODE_ENV !== "production" ? warning_1(keys.length === 1, 'There should only be 1 breakpoint when passing an object to `align`') : void 0;
+      if (keys.length) {
+        const brkPoint = keys[0];
+        const direction = align[brkPoint];
+
+        // .dropdown-menu-end is required for responsively aligning
+        // left in addition to align left classes.
+        alignEnd = direction === 'start';
+        alignClasses.push(`${prefix}-${brkPoint}-${direction}`);
+      }
+    } else if (align === 'end') {
+      alignEnd = true;
+    }
+  }
+  const placement = getDropdownMenuPlacement(alignEnd, drop, isRTL);
+  const [menuProps, {
+    hasShown,
+    popper,
+    show,
+    toggle
+  }] = useDropdownMenu({
+    flip,
+    rootCloseEvent,
+    show: showProps,
+    usePopper: !isNavbar && alignClasses.length === 0,
+    offset: [0, 2],
+    popperConfig,
+    placement
+  });
+  menuProps.ref = useMergedRefs(useWrappedRefWithWarning(ref, 'DropdownMenu'), menuProps.ref);
+  useIsomorphicEffect(() => {
+    // Popper's initial position for the menu is incorrect when
+    // renderOnMount=true. Need to call update() to correct it.
+    if (show) popper == null ? void 0 : popper.update();
+  }, [show]);
+  if (!hasShown && !renderOnMount && !isInputGroup) return null;
+
+  // For custom components provide additional, non-DOM, props;
+  if (typeof Component !== 'string') {
+    menuProps.show = show;
+    menuProps.close = () => toggle == null ? void 0 : toggle(false);
+    menuProps.align = align;
+  }
+  let style = props.style;
+  if (popper != null && popper.placement) {
+    // we don't need the default popper style,
+    // menus are display: none when not shown.
+    style = {
+      ...props.style,
+      ...menuProps.style
+    };
+    props['x-placement'] = popper.placement;
+  }
+  return /*#__PURE__*/jsxRuntime.jsx(Component, {
+    ...props,
+    ...menuProps,
+    style: style
+    // Bootstrap css requires this data attrib to style responsive menus.
+    ,
+    ...((alignClasses.length || isNavbar) && {
+      'data-bs-popper': 'static'
+    }),
+    className: classnames(className, prefix, show && 'show', alignEnd && `${prefix}-end`, variant && `${prefix}-${variant}`, ...alignClasses)
+  });
+});
+DropdownMenu$1.displayName = 'DropdownMenu';
+
+const DropdownToggle$1 = /*#__PURE__*/React.forwardRef(({
+  bsPrefix,
+  split,
+  className,
+  childBsPrefix,
+  // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+  as: Component = Button$1,
+  ...props
+}, ref) => {
+  const prefix = useBootstrapPrefix(bsPrefix, 'dropdown-toggle');
+  const dropdownContext = React.useContext(DropdownContext);
+  if (childBsPrefix !== undefined) {
+    props.bsPrefix = childBsPrefix;
+  }
+  const [toggleProps] = useDropdownToggle();
+  toggleProps.ref = useMergedRefs(toggleProps.ref, useWrappedRefWithWarning(ref, 'DropdownToggle'));
+
+  // This intentionally forwards size and variant (if set) to the
+  // underlying component, to allow it to render size and style variants.
+  return /*#__PURE__*/jsxRuntime.jsx(Component, {
+    className: classnames(className, prefix, split && `${prefix}-split`, (dropdownContext == null ? void 0 : dropdownContext.show) && 'show'),
+    ...toggleProps,
+    ...props
+  });
+});
+DropdownToggle$1.displayName = 'DropdownToggle';
+
+const DropdownHeader = createWithBsPrefix('dropdown-header', {
+  defaultProps: {
+    role: 'heading'
+  }
+});
+const DropdownDivider = createWithBsPrefix('dropdown-divider', {
+  Component: 'hr',
+  defaultProps: {
+    role: 'separator'
+  }
+});
+const DropdownItemText = createWithBsPrefix('dropdown-item-text', {
+  Component: 'span'
+});
+const Dropdown$1 = /*#__PURE__*/React.forwardRef((pProps, ref) => {
+  const {
+    bsPrefix,
+    drop = 'down',
+    show,
+    className,
+    align = 'start',
+    onSelect,
+    onToggle,
+    focusFirstItemOnShow,
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    as: Component = 'div',
+    navbar: _4,
+    autoClose = true,
+    ...props
+  } = useUncontrolled(pProps, {
+    show: 'onToggle'
+  });
+  const isInputGroup = React.useContext(context$1);
+  const prefix = useBootstrapPrefix(bsPrefix, 'dropdown');
+  const isRTL = useIsRTL();
+  const isClosingPermitted = source => {
+    // autoClose=false only permits close on button click
+    if (autoClose === false) return source === 'click';
+
+    // autoClose=inside doesn't permit close on rootClose
+    if (autoClose === 'inside') return source !== 'rootClose';
+
+    // autoClose=outside doesn't permit close on select
+    if (autoClose === 'outside') return source !== 'select';
+    return true;
+  };
+  const handleToggle = useEventCallback((nextShow, meta) => {
+    if (meta.originalEvent.currentTarget === document && (meta.source !== 'keydown' || meta.originalEvent.key === 'Escape')) meta.source = 'rootClose';
+    if (isClosingPermitted(meta.source)) onToggle == null ? void 0 : onToggle(nextShow, meta);
+  });
+  const alignEnd = align === 'end';
+  const placement = getDropdownMenuPlacement(alignEnd, drop, isRTL);
+  const contextValue = React.useMemo(() => ({
+    align,
+    drop,
+    isRTL
+  }), [align, drop, isRTL]);
+  const directionClasses = {
+    down: prefix,
+    'down-centered': `${prefix}-center`,
+    up: 'dropup',
+    'up-centered': 'dropup-center dropup',
+    end: 'dropend',
+    start: 'dropstart'
+  };
+  return /*#__PURE__*/jsxRuntime.jsx(DropdownContext$1.Provider, {
+    value: contextValue,
+    children: /*#__PURE__*/jsxRuntime.jsx(Dropdown, {
+      placement: placement,
+      show: show,
+      onSelect: onSelect,
+      onToggle: handleToggle,
+      focusFirstItemOnShow: focusFirstItemOnShow,
+      itemSelector: `.${prefix}-item:not(.disabled):not(:disabled)`,
+      children: isInputGroup ? props.children : /*#__PURE__*/jsxRuntime.jsx(Component, {
+        ...props,
+        ref: ref,
+        className: classnames(className, show && 'show', directionClasses[drop])
+      })
+    })
+  });
+});
+Dropdown$1.displayName = 'Dropdown';
+var BootstrapDropdown = Object.assign(Dropdown$1, {
+  Toggle: DropdownToggle$1,
+  Menu: DropdownMenu$1,
+  Item: DropdownItem$1,
+  ItemText: DropdownItemText,
+  Divider: DropdownDivider,
+  Header: DropdownHeader
+});
 
 const TabContext = /*#__PURE__*/React.createContext(null);
 
-const _excluded$3 = ["as", "active", "eventKey"];
-function _objectWithoutPropertiesLoose$5(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+const _excluded$5 = ["as", "active", "eventKey"];
+function _objectWithoutPropertiesLoose$7(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function useNavItem({
   key,
   onClick,
@@ -57487,7 +58349,7 @@ const NavItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       active,
       eventKey
     } = _ref,
-    options = _objectWithoutPropertiesLoose$5(_ref, _excluded$3);
+    options = _objectWithoutPropertiesLoose$7(_ref, _excluded$5);
   const [props, meta] = useNavItem(Object.assign({
     key: makeEventKey(eventKey, options.href),
     active
@@ -57501,10 +58363,10 @@ const NavItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
 });
 NavItem.displayName = 'NavItem';
 
-const _excluded$4 = ["as", "onSelect", "activeKey", "role", "onKeyDown"];
-function _objectWithoutPropertiesLoose$6(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+const _excluded$6 = ["as", "onSelect", "activeKey", "role", "onKeyDown"];
+function _objectWithoutPropertiesLoose$8(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 // eslint-disable-next-line @typescript-eslint/no-empty-function
-const noop$2 = () => {};
+const noop$4 = () => {};
 const EVENT_KEY_ATTR = dataAttr('event-key');
 const Nav = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
@@ -57515,7 +58377,7 @@ const Nav = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       role,
       onKeyDown
     } = _ref,
-    props = _objectWithoutPropertiesLoose$6(_ref, _excluded$4);
+    props = _objectWithoutPropertiesLoose$8(_ref, _excluded$6);
   // A ref and forceUpdate for refocus, b/c we only want to trigger when needed
   // and don't want to reset the set in the effect
   const forceUpdate = useForceUpdate();
@@ -57588,8 +58450,8 @@ const Nav = /*#__PURE__*/React.forwardRef((_ref, ref) => {
         role,
         // used by NavLink to determine it's role
         activeKey: makeEventKey(activeKey),
-        getControlledId: getControlledId || noop$2,
-        getControllerId: getControllerId || noop$2
+        getControlledId: getControlledId || noop$4,
+        getControllerId: getControllerId || noop$4
       },
       children: /*#__PURE__*/jsxRuntime.jsx(Component, Object.assign({}, props, {
         onKeyDown: handleKeyDown,
@@ -57903,7 +58765,7 @@ const Nav$1 = /*#__PURE__*/React.forwardRef((uncontrolledProps, ref) => {
   let navbarBsPrefix;
   let cardHeaderBsPrefix;
   let isNavbar = false;
-  const navbarContext = React.useContext(context$1);
+  const navbarContext = React.useContext(context$2);
   const cardHeaderContext = React.useContext(context);
   if (navbarContext) {
     navbarBsPrefix = navbarContext.bsPrefix;
@@ -57935,7 +58797,7 @@ var Nav$2 = Object.assign(Nav$1, {
   Link: NavLink
 });
 
-const noop$3 = () => {};
+const noop$5 = () => {};
 /**
  * The `useRootClose` hook registers your callback on the document
  * when rendered. Powers the `<Overlay/>` component. This is used achieve modal
@@ -57952,7 +58814,7 @@ function useRootClose(ref, onRootClose, {
   disabled,
   clickTrigger
 } = {}) {
-  const onClose = onRootClose || noop$3;
+  const onClose = onRootClose || noop$5;
   useClickOutside(ref, onClose, {
     disabled,
     clickTrigger
@@ -58502,10 +59364,10 @@ var Button$2 = function Button(props) {
 
 var styles$6 = {"vitro-action-handler":"_action-handler_vitro-action-handler_1wgWRHB","vitro-icon-before":"_action-handler_vitro-icon-before_2OomEjN","vitro-icon-progress":"_action-handler_vitro-icon-progress_2QurHaw","vitro-icon-success":"_action-handler_vitro-icon-success_3Pt7XlJ","vitro-icon-error":"_action-handler_vitro-icon-error_2elcVFa","vitro-icon-warning":"_action-handler_vitro-icon-warning_3X_YncE","vitro-content":"_action-handler_vitro-content_1UEsgWV","vitro-flex":"_action-handler_vitro-flex_ryggQ_S","vitro-interface-blur":"_action-handler_vitro-interface-blur_3p_JKB_","vitro-action-handler-dialog-confirm":"_action-handler_vitro-action-handler-dialog-confirm_30dwuBp","vitro-action-handler-dialog":"_action-handler_vitro-action-handler-dialog_1rRT66e","vitro-content-container":"_action-handler_vitro-content-container_DBST6Nz","vitro-confirm":"_action-handler_vitro-confirm_24pI7Nj","vitro-progress":"_action-handler_vitro-progress_2RheviN","vitro-progress-bar":"_action-handler_vitro-progress-bar_1dwFpsn","vitro-small":"_action-handler_vitro-small_oqifqlS","vitro-button-close":"_action-handler_vitro-button-close_3mRTgQq","vitro-success":"_action-handler_vitro-success_1bfGHQQ","vitro-warning":"_action-handler_vitro-warning_2uE9UfG","vitro-error":"_action-handler_vitro-error_1XXlWG-","vitro-button-cancel":"_action-handler_vitro-button-cancel_GE8JsGp","vitro-button":"_action-handler_vitro-button_1wSNAYT","vitro-button-collapse-up":"_action-handler_vitro-button-collapse-up_2lQ6JWm","vitro-button-collapse-bottom":"_action-handler_vitro-button-collapse-bottom_aocIZUX"};
 
-var _excluded$5 = ["popper", "children", "show"];
+var _excluded$7 = ["popper", "children", "show"];
 var UpdatingPopover = React__default.forwardRef(function (_ref, ref) {
   var children = _ref.children,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
   return React__default.createElement("div", {
     className: styles$6["vitro-action-handler"]
   }, React__default.createElement(Popover$1, Object.assign({
@@ -58543,6 +59405,7 @@ var LOCALE$1;
   LOCALE["CONF_SINGLE"] = "app.common.msg.action.conf.single";
   LOCALE["CONF_MULTI"] = "app.common.msg.action.conf.multi";
   LOCALE["ITEM_COUNT"] = "app.common.actionHandler.itemCount";
+  LOCALE["ITEM_NAME"] = "app.common.actionHandler.itemName";
   LOCALE["SUCCESS_SINGLE"] = "app.common.msg.action.success.single";
   LOCALE["SUCCESS_MULTI"] = "app.common.msg.action.success.multi";
   LOCALE["ERROR_SINGLE"] = "app.common.msg.action.error.single";
@@ -58669,6 +59532,7 @@ var actionMap$1 = {
   progress: 1,
   after: 2
 };
+var ESC_KEY_CODE = 27;
 var ActionHandler = function ActionHandler(props) {
   var _useState = React.useState(CTRL.EMPTY),
     text = _useState[0],
@@ -58680,8 +59544,8 @@ var ActionHandler = function ActionHandler(props) {
     showProgressBar = _useState3[0],
     setShowProgressBar = _useState3[1];
   var _useState4 = React.useState(true),
-    isCloseByOutsideClick = _useState4[0],
-    setIsCloseByOutsideClick = _useState4[1];
+    isCloseEnabled = _useState4[0],
+    setIsCloseEnabled = _useState4[1];
   var _useState5 = React.useState(false),
     show = _useState5[0],
     setShow = _useState5[1];
@@ -58727,7 +59591,7 @@ var ActionHandler = function ActionHandler(props) {
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
   var action = props.actionText || localeService.create(LOCALE$1.ACTION + CTRL.DOT + props.actionCode);
   React.useEffect(function () {
-    setIsCloseByOutsideClick(currentAction !== actionMap$1.progress);
+    setIsCloseEnabled(currentAction !== actionMap$1.progress);
     if (currentAction === actionMap$1.before) {
       setState(styles$6['vitro-confirm']);
       setShowItemCount(true);
@@ -58756,6 +59620,10 @@ var ActionHandler = function ActionHandler(props) {
         }
       }
     }
+    window.addEventListener(EVENT.KEYDOWN, onEscClick, false);
+    return function () {
+      window.removeEventListener(EVENT.KEYDOWN, onEscClick, false);
+    };
   }, []);
   if (!props.item && !props.itemList) return null;
   var init = function init() {
@@ -58799,7 +59667,7 @@ var ActionHandler = function ActionHandler(props) {
     if (props.isAutoClose) {
       window.setTimeout(function () {
         close(error, successResult, failResult);
-      }, props.durationMs || 2000);
+      }, props.durationMs || 5000);
     }
     setActionResult(success, successResult, failResult);
     if (success) {
@@ -58960,31 +59828,38 @@ var ActionHandler = function ActionHandler(props) {
       onStart();
     }
   };
-  var close = function close(error, successResult, failResult) {
-    {
-      if (props.onAfterActionClose) {
-        props.onAfterActionClose(error, successResult, failResult);
-      }
+  var onEscClick = function onEscClick(e) {
+    if (e.keyCode === ESC_KEY_CODE && currentAction === actionMap$1.before) {
+      hideDialog();
     }
+  };
+  var hideDialog = function hideDialog() {
     setShow(false);
     window.document.body.click();
   };
-  var cancel = function cancel() {
-    if (currentAction === actionMap$1.before) {
-      setShow(false);
-      window.document.body.click();
+  var close = function close(error, successResult, failResult) {
+    if (isCloseEnabled) {
+      if ( props.onAfterActionClose) {
+        props.onAfterActionClose(error, successResult, failResult);
+      }
+      hideDialog();
     }
     if (currentAction === actionMap$1.progress) {
       cancellationToken.cancel = true;
     }
   };
-  var onHide = function onHide() {
-    if (isCloseByOutsideClick) {
-      setShow(false);
+  var getSelectedItemText = function getSelectedItemText() {
+    if (data.itemCount === 1 && data.itemList[0].name) {
+      return localeService.create(LOCALE$1.ITEM_NAME, {
+        itemName: data.itemList[0].name
+      });
     }
+    return localeService.create(LOCALE$1.ITEM_COUNT, {
+      itemCount: data.itemCount
+    });
   };
   var showConfirmButtonGroup = props.isConfirm && currentAction === actionMap$1.before;
-  var showCloseButtonGroup = currentAction !== actionMap$1.before && !props.isAutoClose;
+  var showCloseButtonGroup = currentAction !== actionMap$1.before;
   var positionCenter = !props.target && !props.children;
   var content = React__default.createElement("div", {
     className: styles$6['vitro-content'] + CTRL.SPACE + state
@@ -59001,12 +59876,10 @@ var ActionHandler = function ActionHandler(props) {
     }
   }), currentAction != actionMap$1.before && React__default.createElement("div", {
     className: styles$6['vitro-button-close'],
-    onClick: currentAction == actionMap$1.progress ? cancel : close
+    onClick: close
   }))), showItemCount && React__default.createElement("span", {
     className: styles$6['vitro-small']
-  }, localeService.create(LOCALE$1.ITEM_COUNT, {
-    itemCount: data.itemCount
-  })), showInfo && React__default.createElement(ActionInfo, {
+  }, getSelectedItemText()), showInfo && React__default.createElement(ActionInfo, {
     itemList: data.itemList,
     successResult: successResult,
     failResult: failResult,
@@ -59020,7 +59893,7 @@ var ActionHandler = function ActionHandler(props) {
     className: styles$6['vitro-progress-bar'],
     ref: progressBarRef
   })), showConfirmButtonGroup && React__default.createElement(commonUi.ButtonGroup, null, React__default.createElement(Button$2, {
-    onClick: cancel,
+    onClick: close,
     text: localeService.create(LOCALE$1.CANCEL) || props.labelNo || CTRL.EMPTY,
     className: styles$6['vitro-button-cancel']
   }), React__default.createElement(Button$2, {
@@ -59032,14 +59905,14 @@ var ActionHandler = function ActionHandler(props) {
   return React__default.createElement(React__default.Fragment, null, props.children && React__default.createElement(OverlayTrigger, {
     trigger: TRIGGER.CLICK,
     onEnter: onEnter,
-    rootClose: isCloseByOutsideClick,
+    rootClose: isCloseEnabled,
     placement: props.placement || PLACEMENT.TOP,
     overlay: React__default.createElement(UpdatingPopover, null, content)
   }, React__default.createElement("div", null, props.children)), props.target && !props.children && React__default.createElement(Overlay$1, {
     show: show,
     target: props.target,
-    rootClose: isCloseByOutsideClick,
-    onHide: onHide,
+    rootClose: isCloseEnabled,
+    onHide: close,
     placement: props.placement || PLACEMENT.TOP
   }, React__default.createElement(UpdatingPopover, null, content)), positionCenter && show && React__default.createElement("div", {
     className: currentAction === actionMap$1.before ? styles$6['vitro-action-handler-dialog-confirm'] : styles$6['vitro-action-handler-dialog']
@@ -59062,7 +59935,7 @@ var ViewPart = function ViewPart(props) {
     } else {
       setComponent(null);
     }
-  }, [props.component]);
+  }, [props.component, props.settings]);
   return React__default.createElement("div", {
     className: styles$8["vitro-view-part"]
   }, component);
@@ -59070,12 +59943,112 @@ var ViewPart = function ViewPart(props) {
 
 var styles$9 = {"vitro-view":"_view_vitro-view_1NKb-kU"};
 
-var styles$a = {"vitro-tab":"_tab-group_vitro-tab_1Qb50HL","vitro-item":"_tab-group_vitro-item_2YnBcmb","active":"_tab-group_active_3M-IIR2","vitro-dropdown-button":"_tab-group_vitro-dropdown-button_146jv_h"};
+var styles$a = {"vitro-dropdown-button":"_dropdown-button_vitro-dropdown-button_1myvkhB","vitro-dropdown-icon":"_dropdown-button_vitro-dropdown-icon_2aKCNii","vitro-text":"_dropdown-button_vitro-text_1FRiwp0","vitro-dropdown-button-item-overflow":"_dropdown-button_vitro-dropdown-button-item-overflow_2aWEhD4","vitro-icon":"_dropdown-button_vitro-icon_2NCEoeb","dropdown-item":"_dropdown-button_dropdown-item_1c2DhhE"};
+
+var w$3 = window;
+var ALIGN_END = 'end';
+var POSITION_ABSOLUTE = 'absolute';
+var DropdownButton = function DropdownButton(props) {
+  React.useEffect(function () {
+    return function () {
+      w$3.$('body > .dropdown-menu').remove();
+    };
+  }, []);
+  var hideMenu = function hideMenu() {
+    var button = w$3.$('.vitro-dropdown-button-active');
+    if (button.length > 0) {
+      button.removeClass('vitro-dropdown-button-active');
+      if (button.next().length < 1) {
+        button.after(w$3.$('body > .dropdown-menu').css({
+          position: false,
+          left: false,
+          top: false
+        }).detach());
+      }
+    }
+  };
+  var onDropdownToggle = function onDropdownToggle(state, e) {
+    if (props.isIgnoreOverflow) {
+      if (state) {
+        hideMenu();
+        var target = w$3.$(e.currentTarget);
+        var menu = target.next();
+        if (menu.length > 0) {
+          w$3.$('body').append(menu.css({
+            position: POSITION_ABSOLUTE,
+            left: menu.offset().left,
+            top: menu.offset().top
+          }).detach());
+        }
+        target.addClass('vitro-dropdown-button-active');
+      }
+    }
+    if (props.onToggle) {
+      props.onToggle(state, e);
+    }
+  };
+  var overflowItemList = props.itemList.filter(function (x) {
+    return x.isOverflow;
+  });
+  var dropItemList = props.itemList.filter(function (x) {
+    return !x.isOverflow;
+  });
+  return React__default.createElement("div", {
+    className: styles$a['vitro-dropdown-button'] + CTRL.SPACE + (props.className || CTRL.EMPTY)
+  }, overflowItemList.map(function (item) {
+    return React__default.createElement("div", {
+      className: styles$a['vitro-dropdown-button-item-overflow'],
+      key: item.key,
+      onClick: function onClick(e) {
+        return item.onClick(item.value, e);
+      }
+    }, item.imageUrl && React__default.createElement(commonUi.Icon, {
+      imageUrl: item.imageUrl,
+      imageHoverUrl: item.imageHoverUrl,
+      className: styles$a['vitro-icon']
+    }), React__default.createElement("span", null, item.text));
+  }), dropItemList.length > 0 && React__default.createElement(BootstrapDropdown, {
+    align: ALIGN_END,
+    onToggle: onDropdownToggle
+  }, React__default.createElement(BootstrapDropdown.Toggle, null, props.title && React__default.createElement("span", {
+    className: styles$a['vitro-title']
+  }, props.title), React__default.createElement("span", {
+    className: styles$a['vitro-dropdown-icon']
+  }, props.title)), React__default.createElement(BootstrapDropdown.Menu, {
+    renderOnMount: true,
+    flip: false
+  }, dropItemList.map(function (x) {
+    return x.isConfirm && x.actionCode ? React__default.createElement(ActionHandler, {
+      key: x.key,
+      actionCode: x.actionCode,
+      processItem: function processItem() {
+        return x.onClick(x.value);
+      },
+      item: x,
+      isConfirm: true
+    }, React__default.createElement("a", {
+      className: styles$a['dropdown-item'],
+      role: 'button'
+    }, x.text)) : React__default.createElement(BootstrapDropdown.Item, {
+      key: x.key,
+      value: x.value,
+      onClick: function onClick(e) {
+        return x.onClick(x.value, e);
+      }
+    }, x.imageUrl && React__default.createElement(commonUi.Icon, {
+      imageUrl: x.imageUrl,
+      imageHoverUrl: x.imageHoverUrl,
+      className: styles$a['vitro-icon']
+    }), React__default.createElement("span", null, x.text));
+  }))));
+};
+
+var styles$b = {"vitro-tab":"_tab-group_vitro-tab_1Qb50HL","vitro-item":"_tab-group_vitro-item_2YnBcmb","active":"_tab-group_active_3M-IIR2","vitro-dropdown-button":"_tab-group_vitro-dropdown-button_146jv_h"};
 
 var OverflowButton = function OverflowButton(props) {
   if (!props.list || !props.list.length) return null;
-  return React__default.createElement(commonUi.DropdownButton, {
-    className: styles$a['vitro-dropdown-button'],
+  return React__default.createElement(DropdownButton, {
+    className: styles$b['vitro-dropdown-button'],
     itemList: props.list.map(function (x, i) {
       return _extends({}, x, {
         value: props.offset + i,
@@ -59091,9 +60064,9 @@ var OverflowButton = function OverflowButton(props) {
 var Tab = function Tab(props) {
   return React__default.createElement("div", {
     key: props.index,
-    className: styles$a['vitro-item']
+    className: styles$b['vitro-item']
   }, React__default.createElement(Nav$2.Item, {
-    className: props.active ? styles$a['active'] : undefined,
+    className: props.active ? styles$b['active'] : undefined,
     onClick: function onClick() {
       return props.onClick(props.index);
     }
@@ -59128,7 +60101,7 @@ var TabGroupHeader = function TabGroupHeader(props) {
   }));
 };
 
-var w$3 = window;
+var w$4 = window;
 var TabGroupComponent = function TabGroupComponent(props) {
   var _useState = React.useState(0),
     width = _useState[0],
@@ -59150,8 +60123,8 @@ var TabGroupComponent = function TabGroupComponent(props) {
     if (ref.current) {
       setWidth(ref.current.offsetWidth);
       if (props.wrap) {
-        if (w$3.addResizeListener) {
-          w$3.addResizeListener(ref.current, function () {
+        if (w$4.addResizeListener) {
+          w$4.addResizeListener(ref.current, function () {
             return setWidth(ref.current.offsetWidth);
           });
         }
@@ -59171,7 +60144,7 @@ var TabGroupComponent = function TabGroupComponent(props) {
     }
   }, [currentTab, props.itemList]);
   return React__default.createElement("div", {
-    className: styles$a['vitro-tab'],
+    className: styles$b['vitro-tab'],
     ref: ref
   }, React__default.createElement(TabGroupHeader, {
     itemList: props.itemList,
@@ -59192,10 +60165,10 @@ var tabScriptList = [{
   id: 'vitro-script-perfect-scroll'
 }];
 
-var w$4 = window;
+var w$5 = window;
 var TabGroup = function TabGroup(props) {
   var scriptList = [];
-  if (!w$4.addResizeListener) {
+  if (!w$5.addResizeListener) {
     scriptList = tabScriptList;
   }
   return props.wrap ? React__default.createElement(commonUi.ScriptLoader, {
@@ -59209,18 +60182,18 @@ var TabGroup = function TabGroup(props) {
   }, React__default.createElement(TabGroupComponent, Object.assign({}, props))) : React__default.createElement(TabGroupComponent, Object.assign({}, props));
 };
 
-var styles$b = {"vitro-control":"_control-group_vitro-control_2h_sXQv","vitro-control-row":"_control-group_vitro-control-row_6l8m5Wh","vitro-label":"_control-group_vitro-label_3J193Ml"};
+var styles$c = {"vitro-control":"_control-group_vitro-control_2h_sXQv","vitro-control-row":"_control-group_vitro-control-row_6l8m5Wh","vitro-label":"_control-group_vitro-label_3J193Ml"};
 
 var ControlGroup = function ControlGroup(props) {
   if (props.horizontal) {
     return React__default.createElement("div", {
-      className: 'container ' + styles$b['vitro-control']
+      className: 'container ' + styles$c['vitro-control']
     }, React__default.createElement("div", {
       className: props.as
     }, props.children));
   }
   return React__default.createElement("div", {
-    className: styles$b['vitro-control-row']
+    className: styles$c['vitro-control-row']
   }, props.children);
 };
 
@@ -59266,53 +60239,17 @@ var GetGroupControl = function GetGroupControl(props) {
   }));
 };
 
-var w$5 = window;
-var Viewer = function Viewer(props) {
-  var init = function init() {
-    if (w$5.initPdfViewer) {
-      w$5.initPdfViewer(props.context);
-    }
-  };
-  React.useEffect(function () {
-    if (props.context.file) {
-      init();
-    }
-  }, [props.context.file]);
-  return React__default.createElement(React__default.Fragment, null);
-};
-
-var PdfViewer = function PdfViewer(props) {
-  var scriptList = [{
-    "url": "resource/pdfViewer/js/init-viewer-page.js",
-    "id": "vitro-script-init-pdf-viewer"
-  }, {
-    "url": "resource/pdfViewer/js/pdf-viewer.js",
-    "id": "vitro-script-pdf-viewer"
-  }];
-  return React__default.createElement(commonUi.ScriptLoader, {
-    urlList: scriptList.map(function (x) {
-      return x.url;
-    }),
-    idList: scriptList.map(function (x) {
-      return x.id;
-    }),
-    placeholder: React__default.createElement(commonUi.Progress, null)
-  }, React__default.createElement(Viewer, {
-    context: props.context
-  }));
-};
-
-var styles$c = {"vitro-label":"_label_vitro-label_it8WNUE","vitro-required":"_label_vitro-required_2-bSGif"};
+var styles$d = {"vitro-label":"_label_vitro-label_it8WNUE","vitro-required":"_label_vitro-required_2-bSGif"};
 
 var PX_UNIT$1 = 'px';
 var Label = function Label(props) {
   return React__default.createElement("div", {
-    className: styles$c['vitro-label'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    className: styles$d['vitro-label'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
     style: props.width ? {
       width: props.width + PX_UNIT$1
     } : undefined
   }, props.text, props.isRequired && React__default.createElement("span", {
-    className: styles$c['vitro-required']
+    className: styles$d['vitro-required']
   }, CTRL.ASTERISK));
 };
 
@@ -59336,7 +60273,7 @@ var REGEXP;
   REGEXP["INT"] = "^[0-9]+$";
 })(REGEXP || (REGEXP = {}));
 
-var styles$d = {"vitro-control":"_input_vitro-control_1DmPFkF","vitro-focus":"_input_vitro-focus_1txynr8","vitro-label":"_input_vitro-label_2XBESiY","vitro-read-only":"_input_vitro-read-only_3f-cBbK","vitro-error":"_input_vitro-error_1T3dLzB","vitro-left-label":"_input_vitro-left-label_D9Fpvpd","vitro-error-text":"_input_vitro-error-text_QpZK56k","vitro-button-copy":"_input_vitro-button-copy_jjyktjx"};
+var styles$e = {"vitro-control":"_input_vitro-control_1DmPFkF","vitro-focus":"_input_vitro-focus_1txynr8","vitro-label":"_input_vitro-label_2XBESiY","vitro-read-only":"_input_vitro-read-only_3f-cBbK","vitro-error":"_input_vitro-error_1T3dLzB","vitro-left-label":"_input_vitro-left-label_D9Fpvpd","vitro-error-text":"_input_vitro-error-text_QpZK56k","vitro-button-copy":"_input_vitro-button-copy_jjyktjx"};
 
 var PX_UNIT$2 = 'px';
 var Input = function Input(props) {
@@ -59366,7 +60303,7 @@ var Input = function Input(props) {
     if (props.value && inputValue !== props.value) updateValue(props.value, true);
   }, [props.value]);
   React.useEffect(function () {
-    setState(props.errorMessage ? styles$d['vitro-error'] : CTRL.EMPTY);
+    setState(props.errorMessage ? styles$e['vitro-error'] : CTRL.EMPTY);
   }, [props.errorMessage]);
   React.useEffect(function () {
     var jsonStyle = {};
@@ -59407,7 +60344,7 @@ var Input = function Input(props) {
     }
   };
   var onBlur = function onBlur(e) {
-    setState(props.errorMessage ? styles$d['vitro-error'] : CTRL.EMPTY);
+    setState(props.errorMessage ? styles$e['vitro-error'] : CTRL.EMPTY);
     if (props.onBlur) {
       props.onBlur(e);
     }
@@ -59416,7 +60353,7 @@ var Input = function Input(props) {
     }
   };
   var onFocus = function onFocus(e) {
-    setState(styles$d['vitro-focus']);
+    setState(styles$e['vitro-focus']);
     if (props.onFocus) {
       props.onFocus(e);
     }
@@ -59472,19 +60409,19 @@ var Input = function Input(props) {
     });
     if (props.isIcon) {
       control = React__default.createElement("div", {
-        className: styles$d['vitro-icon-control'] + CTRL.SPACE + state
+        className: styles$e['vitro-icon-control'] + CTRL.SPACE + state
       }, input);
     } else {
       control = input;
     }
   }
   var getClassName = function getClassName() {
-    var classList = [styles$d['vitro-control'], props.className];
+    var classList = [styles$e['vitro-control'], props.className];
     if (props.isDisabled || props.isReadOnly) {
-      classList.push(styles$d['vitro-read-only']);
+      classList.push(styles$e['vitro-read-only']);
     }
     if (props.labelPosition === POSITION.LEFT) {
-      classList.push(styles$d['vitro-left-label']);
+      classList.push(styles$e['vitro-left-label']);
     }
     classList.push(state);
     return classList.join(CTRL.SPACE);
@@ -59495,16 +60432,263 @@ var Input = function Input(props) {
     text: props.label,
     isRequired: props.isRequired,
     width: props.labelWidth,
-    className: styles$d['vitro-label']
+    className: styles$e['vitro-label']
   }), control, props.isReadOnly ? React__default.createElement("span", {
-    className: styles$d['vitro-button-copy'],
+    className: styles$e['vitro-button-copy'],
     onClick: copyValue
   }) : null, props.children, props.errorMessage && React__default.createElement("span", {
-    className: styles$d['vitro-error-text']
+    className: styles$e['vitro-error-text']
   }, props.errorMessage));
 };
 
+var styles$f = {"vitro-issue-tile-footer":"_issue-tile-footer_vitro-issue-tile-footer_KtHOieL","vitro-issue-tile-status":"_issue-tile-footer_vitro-issue-tile-status_3OjC56L","vitro-status-color":"_issue-tile-footer_vitro-status-color_hhLb22J","vitro-button-more":"_issue-tile-footer_vitro-button-more_1RyVAeR"};
+
+var IssueTileFooter = function IssueTileFooter(props) {
+  return React__default.createElement("div", {
+    className: styles$f['vitro-issue-tile-footer']
+  }, React__default.createElement("div", {
+    className: styles$f['vitro-issue-tile-status']
+  }, props.statusColor && React__default.createElement("div", {
+    className: styles$f['vitro-status-color'],
+    style: {
+      background: props.statusColor
+    }
+  }), props.status), props.onShowMoreClick && React__default.createElement("div", {
+    onClick: props.onShowMoreClick,
+    className: styles$f['vitro-button-more']
+  }));
+};
+
+var styles$g = {"vitro-avatar":"_avatar_vitro-avatar_P2tU-_r","vitro-avatar-big":"_avatar_vitro-avatar-big_pEmlX3a"};
+
+var Avatar = function Avatar(props) {
+  var getInitials = function getInitials() {
+    var initials = CTRL.EMPTY;
+    if (props.userName) {
+      props.userName.split(CTRL.SPACE).forEach(function (name, i) {
+        initials += i < 2 ? name[0] ? name[0] : CTRL.EMPTY : CTRL.EMPTY;
+      });
+    }
+    return initials;
+  };
+  var getBackground = function getBackground() {
+    if (props.image) {
+      return props.image;
+    } else if (props.userName) {
+      return getBgColor(props.userName);
+    }
+    return CTRL.EMPTY;
+  };
+  var getHashOfString = function getHashOfString(str) {
+    var hash = 0;
+    for (var i = 0; i < str.length; i++) {
+      hash = str.charCodeAt(i) + ((hash << 5) - hash);
+    }
+    hash = Math.abs(hash);
+    return hash;
+  };
+  var normalizeHash = function normalizeHash(hash, min, max) {
+    return Math.floor(hash % (max - min) + min);
+  };
+  var getHue = function getHue(name) {
+    var min = 1000;
+    var max = 360;
+    var hash = getHashOfString(name);
+    var normalizedHash = normalizeHash(hash, min, max);
+    return normalizedHash;
+  };
+  var getBgColor = function getBgColor(name) {
+    return "linear-gradient(0deg, hsla(" + getHue(name) + ", 58%, 55%, 1), hsla(" + (getHue(name) + 50) + ", 100%, 78%, 1))";
+  };
+  var className = styles$g['vitro-avatar'] + (props.isBigSize ? CTRL.SPACE + styles$g['vitro-avatar-big'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY);
+  return React__default.createElement("div", {
+    className: className,
+    style: {
+      background: getBackground()
+    }
+  }, getInitials());
+};
+
+var styles$h = {"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"};
+
+var VERSION = 'V';
+var TARGET_BLANK = '_blank';
+var IssueTileHeader = function IssueTileHeader(props) {
+  return React__default.createElement("div", {
+    className: styles$h['vitro-issue-tile-header']
+  }, React__default.createElement("a", {
+    className: styles$h['vitro-link'],
+    href: props.url,
+    target: TARGET_BLANK
+  }, CTRL.SHARP + props.id), React__default.createElement("div", {
+    className: styles$h['vitro-user-info']
+  }, React__default.createElement(Avatar, {
+    image: props.userImage,
+    userName: props.userName,
+    className: styles$h['vitro-avatar']
+  }), React__default.createElement("div", null, React__default.createElement("span", null, props.userName), React__default.createElement("span", null, props.date))), React__default.createElement("a", {
+    className: styles$h['vitro-link'],
+    href: props.fileVersionUrl,
+    target: TARGET_BLANK
+  }, VERSION + CTRL.SQUARE_BRACKET_OPEN + props.fileVersion + CTRL.SQUARE_BRACKET_CLOSE), props.actionList && props.actionList.length ? React__default.createElement(DropdownButton, {
+    itemList: props.actionList,
+    className: styles$h['vitro-dropdown-button']
+  }) : null);
+};
+
 var LOCALE$2;
+(function (LOCALE) {
+  LOCALE["TEXTAREA_LABEL"] = "app.common.issueTile.textareaLabel";
+})(LOCALE$2 || (LOCALE$2 = {}));
+
+var styles$i = {"vitro-issue-tile":"_issue-tile_vitro-issue-tile_2D7E9Y-","vitro-control":"_issue-tile_vitro-control_3V6_Ze7"};
+
+var IssueTile = function IssueTile(props) {
+  return React__default.createElement("div", {
+    id: 'vitro-issue-tile-' + props.id,
+    className: styles$i['vitro-issue-tile'] + (props.isActive ? CTRL.SPACE + styles$i['vitro-active'] : CTRL.EMPTY),
+    onClick: props.onClick
+  }, React__default.createElement(IssueTileHeader, {
+    id: props.id,
+    url: props.url,
+    userName: props.userName,
+    userImage: props.userImage,
+    date: props.date,
+    fileVersion: props.fileVersion,
+    fileVersionUrl: props.fileVersionUrl,
+    actionList: props.actionList
+  }), React__default.createElement(Input, {
+    isMultiline: true,
+    label: props.createLocale(LOCALE$2.TEXTAREA_LABEL),
+    onBlur: props.onBlur,
+    className: styles$i['vitro-control'],
+    value: props.text,
+    rows: 7
+  }), React__default.createElement(IssueTileFooter, {
+    status: props.status,
+    statusColor: props.statusColor,
+    onShowMoreClick: props.onShowMoreClick
+  }));
+};
+
+var w$6 = window;
+var Viewer = function Viewer(props) {
+  React.useEffect(function () {
+    if (props.context.file) {
+      init();
+    }
+  }, [props.context.file]);
+  var init = function init() {
+    if (w$6.initPdfViewer) {
+      var context = _extends({}, props.context, {
+        initIssueList: initIssueList
+      });
+      w$6.initPdfViewer(context);
+    }
+  };
+  var initIssueList = function initIssueList() {
+    var sidebar = document.getElementsByClassName('body__sidebar-content')[0];
+    $('body__sidebar-content').empty();
+    props.context.getIssueList().then(function (list) {
+      var component = React__default.createElement(React__default.Fragment, null, list.map(function (issue) {
+        return React__default.createElement(IssueTile, Object.assign({}, issue, {
+          onClick: function onClick() {
+            return onIssueTileClick(issue);
+          },
+          createLocale: props.context.createLocale
+        }));
+      }));
+      reactDom.render(component, sidebar);
+    });
+  };
+  var onIssueTileClick = function onIssueTileClick(issue) {
+    var id = issue.id;
+    var markup = JSON.parse(issue.markup);
+    $('.body__sidebar-content').children().removeClass('vitro-active');
+    $(CTRL.SHARP + 'vitro-issue-tile-' + id).addClass('vitro-active');
+    var numPages = w$6.PDFViewerApplication.pagesCount;
+    if (markup && markup.pageNr <= numPages && markup.pageNr >= 1) {
+      if (markup.pageNr != w$6.PDFViewerApplication.pdfViewer.currentPageNumber) {
+        w$6.PDFViewerApplication.page = markup.pageNr;
+      }
+      if ($(CTRL.SHARP + id).length) {
+        scrollToMarkup(id);
+      } else {
+        $(document).on('webViewerPageRendered', function (e, pageNrRendered) {
+          if (markup.pageNr == pageNrRendered) {
+            scrollToMarkup(id);
+          }
+        });
+      }
+    }
+  };
+  var scrollToMarkup = function scrollToMarkup(id) {
+    var markup = $(CTRL.SHARP + id);
+    if (markup) {
+      var _markup$offset;
+      $('#viewerContainer').animate({
+        'scrollTop': $('#viewerContainer')[0].scrollTop + ((markup === null || markup === void 0 ? void 0 : (_markup$offset = markup.offset()) === null || _markup$offset === void 0 ? void 0 : _markup$offset.top) || 0) - 50
+      }, 200);
+    }
+  };
+  return React__default.createElement(React__default.Fragment, null);
+};
+
+var PdfViewer = function PdfViewer(props) {
+  var scriptList = [{
+    "url": "resource/pdfViewer/js/init-viewer-page.js",
+    "id": "vitro-script-init-pdf-viewer"
+  }, {
+    "url": "resource/pdfViewer/js/pdf-viewer.js",
+    "id": "vitro-script-pdf-viewer"
+  }];
+  return React__default.createElement(commonUi.ScriptLoader, {
+    urlList: scriptList.map(function (x) {
+      return x.url;
+    }),
+    idList: scriptList.map(function (x) {
+      return x.id;
+    }),
+    placeholder: React__default.createElement(commonUi.Progress, null)
+  }, React__default.createElement(Viewer, {
+    context: props.context
+  }));
+};
+
+var styles$j = {"vitro-control":"_checkbox_vitro-control_DfB5DDM","vitro-checkbox-content":"_checkbox_vitro-checkbox-content_2fBG1zl","vitro-label":"_checkbox_vitro-label_qZxCbCP","vitro-left-label":"_checkbox_vitro-left-label_Uu1Tp31"};
+
+var Checkbox = function Checkbox(props) {
+  var _useState = React.useState(props.value ? true : false),
+    value = _useState[0],
+    setValue = _useState[1];
+  var onChange = function onChange() {
+    props.onChange && props.onChange(!value);
+    setValue(!value);
+  };
+  React.useEffect(function () {
+    setValue(props.value ? true : false);
+  }, [props.value]);
+  var className = styles$j['vitro-control'] + (props.labelPosition === POSITION.LEFT ? CTRL.SPACE + styles$j['vitro-left-label'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY);
+  return React__default.createElement("div", {
+    className: className
+  }, props.labelPosition === POSITION.LEFT && React__default.createElement(Label, {
+    text: props.label,
+    className: styles$j['vitro-label']
+  }), React__default.createElement("div", {
+    className: styles$j['vitro-checkbox-content']
+  }, React__default.createElement("input", {
+    disabled: props.isDisabled,
+    type: 'checkbox',
+    name: props.name,
+    checked: value,
+    onChange: onChange
+  }), props.labelPosition !== POSITION.LEFT && React__default.createElement(Label, {
+    text: props.label,
+    className: styles$j['vitro-label']
+  })));
+};
+
+var LOCALE$3;
 (function (LOCALE) {
   LOCALE["ERROR_EMPTY"] = "app.common.login.error.empty";
   LOCALE["ERROR_WRONG_DATA"] = "app.common.login.error.wrongData";
@@ -59518,14 +60702,14 @@ var LOCALE$2;
   LOCALE["SEPARATOR_TEXT"] = "app.common.login.separatorText";
   LOCALE["TITLE"] = "app.common.login.title";
   LOCALE["COPYRIGHT"] = "app.common.login.copyright";
-})(LOCALE$2 || (LOCALE$2 = {}));
+})(LOCALE$3 || (LOCALE$3 = {}));
 var INPUT_TYPE;
 (function (INPUT_TYPE) {
   INPUT_TYPE["PASSWORD"] = "password";
   INPUT_TYPE["TEXT"] = "text";
 })(INPUT_TYPE || (INPUT_TYPE = {}));
 
-var styles$e = {"vitro-login-layout":"_login_vitro-login-layout_1C8owlz","vitro-form-login":"_login_vitro-form-login_2nyw95B","vitro-logo":"_login_vitro-logo_3-qTjgy","vitro-title":"_login_vitro-title_nfoHltS","vitro-flex":"_login_vitro-flex_2CffX6W","vitro-link":"_login_vitro-link_az1ZWIc","vitro-separator":"_login_vitro-separator_2jHZJHO","vitro-login-control":"_login_vitro-login-control_cksptcC","vitro-error":"_login_vitro-error_1Nk25em","vitro-control":"_login_vitro-control_3YqxIR2","vitro-button":"_login_vitro-button_2OCqKtD","vitro-button-show-password":"_login_vitro-button-show-password_3NpbpN5","vitro-button-hide-password":"_login_vitro-button-hide-password_27R-yFe","vitro-footer":"_login_vitro-footer_1lceaP0","vitro-link-list":"_login_vitro-link-list_1rQQg9u","vitro-copyright":"_login_vitro-copyright_1gm65Ao","vitro-language":"_login_vitro-language_2T3uktL"};
+var styles$k = {"vitro-login-layout":"_login_vitro-login-layout_1C8owlz","vitro-form-login":"_login_vitro-form-login_2nyw95B","vitro-logo":"_login_vitro-logo_3-qTjgy","vitro-title":"_login_vitro-title_nfoHltS","vitro-flex":"_login_vitro-flex_2CffX6W","vitro-link":"_login_vitro-link_az1ZWIc","vitro-separator":"_login_vitro-separator_2jHZJHO","vitro-login-control":"_login_vitro-login-control_cksptcC","vitro-error":"_login_vitro-error_1Nk25em","vitro-control":"_login_vitro-control_3YqxIR2","vitro-login-checkbox":"_login_vitro-login-checkbox_39NOnZg","vitro-button":"_login_vitro-button_2OCqKtD","vitro-button-show-password":"_login_vitro-button-show-password_3NpbpN5","vitro-button-hide-password":"_login_vitro-button-hide-password_27R-yFe","vitro-footer":"_login_vitro-footer_1lceaP0","vitro-link-list":"_login_vitro-link-list_1rQQg9u","vitro-copyright":"_login_vitro-copyright_1gm65Ao","vitro-language":"_login_vitro-language_2T3uktL"};
 
 var LoginInput = function LoginInput(props) {
   var _useState = React.useState(CTRL.EMPTY),
@@ -59534,7 +60718,7 @@ var LoginInput = function LoginInput(props) {
   var _useState2 = React.useState(props.type || INPUT_TYPE.TEXT),
     type = _useState2[0],
     setType = _useState2[1];
-  var _useState3 = React.useState(styles$e['vitro-button-show-password']),
+  var _useState3 = React.useState(styles$k['vitro-button-show-password']),
     icon = _useState3[0],
     setIcon = _useState3[1];
   var _useState4 = React.useState(CTRL.EMPTY),
@@ -59551,7 +60735,7 @@ var LoginInput = function LoginInput(props) {
   }, [props.isValidate]);
   React.useEffect(function () {
     if (props.error) {
-      setState(styles$e['vitro-error']);
+      setState(styles$k['vitro-error']);
       setError(props.error);
     }
   }, [props.error]);
@@ -59577,27 +60761,27 @@ var LoginInput = function LoginInput(props) {
   var togglePassword = function togglePassword() {
     if (type === INPUT_TYPE.PASSWORD) {
       setType(INPUT_TYPE.TEXT);
-      setIcon(styles$e['vitro-button-hide-password']);
+      setIcon(styles$k['vitro-button-hide-password']);
     } else {
       setType(INPUT_TYPE.PASSWORD);
-      setIcon(styles$e['vitro-button-show-password']);
+      setIcon(styles$k['vitro-button-show-password']);
     }
   };
   var validate = function validate() {
     if (value.trim() === CTRL.EMPTY) {
-      var fieldName = localeService.create(LOCALE$2.PLACEHOLDER + CTRL.DOT + props.name);
-      var text = props.emptyErrorText || localeService.create(LOCALE$2.ERROR_EMPTY, {
+      var fieldName = localeService.create(LOCALE$3.PLACEHOLDER + CTRL.DOT + props.name);
+      var text = props.emptyErrorText || localeService.create(LOCALE$3.ERROR_EMPTY, {
         fieldName: fieldName
       });
       setError(text);
-      setState(styles$e['vitro-error']);
+      setState(styles$k['vitro-error']);
     } else {
       setError(CTRL.EMPTY);
       setState(CTRL.EMPTY);
     }
   };
   return React__default.createElement("div", {
-    className: styles$e['vitro-login-control'] + CTRL.SPACE + state
+    className: styles$k['vitro-login-control'] + CTRL.SPACE + state
   }, React__default.createElement(Input, {
     type: type,
     name: props.name,
@@ -59610,7 +60794,7 @@ var LoginInput = function LoginInput(props) {
     onFocus: onFocus,
     onBlur: onBlur,
     errorMessage: error,
-    className: styles$e['vitro-control']
+    className: styles$k['vitro-control']
   }), props.type === INPUT_TYPE.PASSWORD && React__default.createElement("span", {
     className: icon,
     onClick: togglePassword
@@ -59619,22 +60803,23 @@ var LoginInput = function LoginInput(props) {
 
 var LoginFooter = function LoginFooter(props) {
   return React__default.createElement("div", {
-    className: styles$e['vitro-footer']
+    className: styles$k['vitro-footer']
   }, React__default.createElement("div", {
-    className: styles$e['vitro-language']
+    className: styles$k['vitro-language']
   }), React__default.createElement("ul", {
-    className: styles$e['vitro-link-list']
+    className: styles$k['vitro-link-list']
   }, props.itemList && props.itemList.map(function (item) {
     return React__default.createElement("li", null, React__default.createElement("a", {
       href: item.url
     }, item.text));
   })), React__default.createElement("div", {
-    className: styles$e['vitro-copyright']
+    className: styles$k['vitro-copyright']
   }, props.copyright));
 };
 
 var FIELD_USER_NAME = 'userName';
 var FIELD_PASSWORD = 'password';
+var CHECKBOX_SAVE_DATA = 'saveData';
 var KEY_ENTER = 'Enter';
 var Login = function Login(props) {
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
@@ -59655,8 +60840,8 @@ var Login = function Login(props) {
     setValidateData = _useState5[1];
   var handleError = function handleError(error) {
     var _setError;
-    setError((_setError = {}, _setError[FIELD_USER_NAME] = localeService.create(LOCALE$2.ERROR_WRONG_DATA, {
-      fieldName: localeService.create(LOCALE$2.PLACEHOLDER_NAME).toLowerCase()
+    setError((_setError = {}, _setError[FIELD_USER_NAME] = localeService.create(LOCALE$3.ERROR_WRONG_DATA, {
+      fieldName: localeService.create(LOCALE$3.PLACEHOLDER_NAME).toLowerCase()
     }), _setError));
   };
   var submit = function submit() {
@@ -59684,15 +60869,15 @@ var Login = function Login(props) {
     }
   };
   return React__default.createElement("div", {
-    className: styles$e['vitro-login-layout']
+    className: styles$k['vitro-login-layout']
   }, React__default.createElement("div", {
-    className: styles$e['vitro-form-login']
+    className: styles$k['vitro-form-login']
   }, React__default.createElement("div", {
-    className: styles$e['vitro-logo']
+    className: styles$k['vitro-logo']
   }), React__default.createElement("div", {
-    className: styles$e['vitro-title']
-  }, localeService.create(LOCALE$2.TITLE)), React__default.createElement(LoginInput, {
-    label: localeService.create(LOCALE$2.PLACEHOLDER_NAME),
+    className: styles$k['vitro-title']
+  }, localeService.create(LOCALE$3.TITLE)), React__default.createElement(LoginInput, {
+    label: localeService.create(LOCALE$3.PLACEHOLDER_NAME),
     name: FIELD_USER_NAME,
     onKeyPress: onEnterPress,
     isDisabled: loading,
@@ -59703,7 +60888,7 @@ var Login = function Login(props) {
     error: error[FIELD_USER_NAME]
   }), React__default.createElement(LoginInput, {
     type: INPUT_TYPE.PASSWORD,
-    label: localeService.create(LOCALE$2.PLACEHOLDER_PASSWORD),
+    label: localeService.create(LOCALE$3.PLACEHOLDER_PASSWORD),
     name: FIELD_PASSWORD,
     onKeyPress: onEnterPress,
     isDisabled: loading,
@@ -59713,25 +60898,27 @@ var Login = function Login(props) {
     isValidate: validateData,
     error: error[FIELD_PASSWORD]
   }), React__default.createElement("div", {
-    className: styles$e['vitro-flex']
-  }, React__default.createElement(commonUi.Checkbox, {
-    label: localeService.create(LOCALE$2.ACTION_SAVE_DATA),
-    onChange: props.onSaveData
+    className: styles$k['vitro-flex']
+  }, React__default.createElement(Checkbox, {
+    label: localeService.create(LOCALE$3.ACTION_SAVE_DATA),
+    name: CHECKBOX_SAVE_DATA,
+    onChange: props.onSaveData,
+    className: styles$k['vitro-login-checkbox']
   }), React__default.createElement("a", {
-    className: styles$e['vitro-link'],
+    className: styles$k['vitro-link'],
     onClick: props.onResetPassword
-  }, localeService.create(LOCALE$2.ACTION_RESET_PASSWORD))), React__default.createElement(Button$2, {
-    className: styles$e['vitro-button'],
-    text: localeService.create(LOCALE$2.ACTION_LOGIN),
+  }, localeService.create(LOCALE$3.ACTION_RESET_PASSWORD))), React__default.createElement(Button$2, {
+    className: styles$k['vitro-button'],
+    text: localeService.create(LOCALE$3.ACTION_LOGIN),
     onClick: submit,
     isDisabled: loading
   }), React__default.createElement("div", {
-    className: styles$e['vitro-separator']
-  }, localeService.create(LOCALE$2.SEPARATOR_TEXT)), React__default.createElement("a", {
-    className: styles$e['vitro-link'],
+    className: styles$k['vitro-separator']
+  }, localeService.create(LOCALE$3.SEPARATOR_TEXT)), React__default.createElement("a", {
+    className: styles$k['vitro-link'],
     onClick: props.onRegister
-  }, localeService.create(LOCALE$2.ACTION_REGISTER))), React__default.createElement(LoginFooter, {
-    copyright: props.copyright || localeService.create(LOCALE$2.COPYRIGHT),
+  }, localeService.create(LOCALE$3.ACTION_REGISTER))), React__default.createElement(LoginFooter, {
+    copyright: props.copyright || localeService.create(LOCALE$3.COPYRIGHT),
     itemList: props.linkItemList
   }));
 };
@@ -59752,9 +60939,9 @@ var LABEL_POSITION;
   LABEL_POSITION["LEFT"] = "left";
 })(LABEL_POSITION || (LABEL_POSITION = {}));
 
-var styles$f = {"vitro-control":"_date-picker_vitro-control_2AYXegb","vitro-button-copy":"_date-picker_vitro-button-copy_1cGY1Uu","vitro-control-container":"_date-picker_vitro-control-container_2CVwecs","vitro-focus":"_date-picker_vitro-focus_2cJKcKr","vitro-label":"_date-picker_vitro-label_2jh9qxb","vitro-read-only":"_date-picker_vitro-read-only_2NZoMN5","vitro-error":"_date-picker_vitro-error_3DkgZiN","vitro-left-label":"_date-picker_vitro-left-label_ZFhZFS9","vitro-error-text":"_date-picker_vitro-error-text_15CdrRj"};
+var styles$l = {"vitro-control":"_date-picker_vitro-control_2AYXegb","vitro-button-copy":"_date-picker_vitro-button-copy_1cGY1Uu","vitro-control-container":"_date-picker_vitro-control-container_2CVwecs","vitro-focus":"_date-picker_vitro-focus_2cJKcKr","vitro-label":"_date-picker_vitro-label_2jh9qxb","vitro-read-only":"_date-picker_vitro-read-only_2NZoMN5","vitro-error":"_date-picker_vitro-error_3DkgZiN","vitro-left-label":"_date-picker_vitro-left-label_ZFhZFS9","vitro-error-text":"_date-picker_vitro-error-text_15CdrRj"};
 
-var $$2 = window.$;
+var $$3 = window.$;
 var DatePicker = function DatePicker(props) {
   var _useState = React.useState(CTRL.EMPTY),
     state = _useState[0],
@@ -59779,7 +60966,7 @@ var DatePicker = function DatePicker(props) {
       open: function open(e) {
         onFocus();
         if (props.onOpen) {
-          props.onOpen(e, $$2(container.current));
+          props.onOpen(e, $$3(container.current));
         }
       },
       change: function change(e) {
@@ -59794,7 +60981,7 @@ var DatePicker = function DatePicker(props) {
         }
       },
       popup: {
-        appendTo: $$2(container.current)
+        appendTo: $$3(container.current)
       }
     };
     if (props.minValue) {
@@ -59803,39 +60990,39 @@ var DatePicker = function DatePicker(props) {
     if (props.maxValue) {
       config.max = props.maxValue;
     }
-    $$2(ref.current).kendoDatePicker(config);
-    var picker = $$2(ref.current).data(componentName);
+    $$3(ref.current).kendoDatePicker(config);
+    var picker = $$3(ref.current).data(componentName);
     picker.enable(!props.isDisabled);
     picker.readonly(props.isReadOnly === true);
   }, [ref]);
   React.useEffect(function () {
-    $$2(ref.current).data(componentName).value(props.value);
+    $$3(ref.current).data(componentName).value(props.value);
   }, [props.value]);
   React.useEffect(function () {
-    if (props.minValue) $$2(ref.current).data(componentName).min(props.minValue);
+    if (props.minValue) $$3(ref.current).data(componentName).min(props.minValue);
   }, [props.minValue]);
   React.useEffect(function () {
-    if (props.maxValue) $$2(ref.current).data(componentName).max(props.maxValue);
+    if (props.maxValue) $$3(ref.current).data(componentName).max(props.maxValue);
   }, [props.maxValue]);
   React.useEffect(function () {
-    props.errorMessage ? setState(styles$f['vitro-error']) : setState(CTRL.EMPTY);
+    props.errorMessage ? setState(styles$l['vitro-error']) : setState(CTRL.EMPTY);
   }, [props.errorMessage]);
   var onFocus = function onFocus() {
-    setState(styles$f['vitro-focus']);
+    setState(styles$l['vitro-focus']);
   };
   var onBlur = function onBlur() {
-    setState(props.errorMessage ? styles$f['vitro-error'] : styles$f[CTRL.EMPTY]);
+    setState(props.errorMessage ? styles$l['vitro-error'] : styles$l[CTRL.EMPTY]);
   };
   var copyValue = function copyValue() {
     navigator.clipboard.writeText("" + props.value);
   };
   var getClassName = function getClassName() {
-    var classList = [styles$f['vitro-control'], props.className];
+    var classList = [styles$l['vitro-control'], props.className];
     if (props.isDisabled || props.isReadOnly) {
-      classList.push(styles$f['vitro-read-only']);
+      classList.push(styles$l['vitro-read-only']);
     }
     if (props.labelPosition === POSITION.LEFT) {
-      classList.push(styles$f['vitro-left-label']);
+      classList.push(styles$l['vitro-left-label']);
     }
     classList.push(state);
     return classList.join(CTRL.SPACE);
@@ -59846,20 +61033,20 @@ var DatePicker = function DatePicker(props) {
     text: props.label,
     isRequired: props.isRequired,
     width: props.labelWidth,
-    className: styles$f['vitro-label']
+    className: styles$l['vitro-label']
   }), React__default.createElement("input", {
     ref: ref,
     placeholder: props.placeholder,
     onFocus: onFocus,
     onBlur: onBlur
   }), props.isReadOnly ? React__default.createElement("span", {
-    className: styles$f['vitro-button-copy'],
+    className: styles$l['vitro-button-copy'],
     onClick: copyValue
   }) : null, React__default.createElement("div", {
     ref: container,
-    className: styles$f['vitro-control-container']
+    className: styles$l['vitro-control-container']
   }), props.errorMessage && React__default.createElement("span", {
-    className: styles$f['vitro-error-text']
+    className: styles$l['vitro-error-text']
   }, props.errorMessage));
 };
 
@@ -59880,9 +61067,9 @@ var COMPONENT_TYPE;
   COMPONENT_TYPE["MODERN"] = "modern";
 })(COMPONENT_TYPE || (COMPONENT_TYPE = {}));
 
-var styles$g = {"vitro-control":"_time-picker_vitro-control_1sx07It","vitro-button-copy":"_time-picker_vitro-button-copy_QZg3bTW","vitro-control-container":"_time-picker_vitro-control-container_3ys3rMN","vitro-focus":"_time-picker_vitro-focus_wmhPjvE","vitro-label":"_time-picker_vitro-label_2b97aCy","vitro-error":"_time-picker_vitro-error_2ZmK0I5","vitro-read-only":"_time-picker_vitro-read-only_NlE18Zm","vitro-left-label":"_time-picker_vitro-left-label_3NRmFYH","vitro-error-text":"_time-picker_vitro-error-text_2BNoBKW"};
+var styles$m = {"vitro-control":"_time-picker_vitro-control_1sx07It","vitro-button-copy":"_time-picker_vitro-button-copy_QZg3bTW","vitro-control-container":"_time-picker_vitro-control-container_3ys3rMN","vitro-focus":"_time-picker_vitro-focus_wmhPjvE","vitro-label":"_time-picker_vitro-label_2b97aCy","vitro-error":"_time-picker_vitro-error_2ZmK0I5","vitro-read-only":"_time-picker_vitro-read-only_NlE18Zm","vitro-left-label":"_time-picker_vitro-left-label_3NRmFYH","vitro-error-text":"_time-picker_vitro-error-text_2BNoBKW"};
 
-var $$3 = window.$;
+var $$4 = window.$;
 var TimePicker = function TimePicker(props) {
   var _useState = React.useState(CTRL.EMPTY),
     state = _useState[0],
@@ -59891,7 +61078,7 @@ var TimePicker = function TimePicker(props) {
   var ref = React.useRef(null);
   var componentName = 'kendoTimePicker';
   React.useEffect(function () {
-    $$3(ref.current).kendoTimePicker({
+    $$4(ref.current).kendoTimePicker({
       format: props.format || FORMAT.HH_MM,
       componentType: COMPONENT_TYPE.MODERN,
       culture: props.culture || CULTURE$1.RU,
@@ -59905,42 +61092,42 @@ var TimePicker = function TimePicker(props) {
       open: function open(e) {
         onFocus();
         if (props.onOpen) {
-          props.onOpen(e, $$3(container.current));
+          props.onOpen(e, $$4(container.current));
         }
       },
       close: function close(e) {
         onBlur();
         if (props.onClose) {
-          props.onClose(e, $$3(container.current));
+          props.onClose(e, $$4(container.current));
         }
       },
       popup: {
-        appendTo: $$3(container.current)
+        appendTo: $$4(container.current)
       }
     });
-    var picker = $$3(ref.current).data(componentName);
+    var picker = $$4(ref.current).data(componentName);
     picker.enable(!props.isDisabled);
     picker.readonly(props.isReadOnly === true);
   }, [ref]);
   React.useEffect(function () {
-    $$3(ref.current).data(componentName).value(props.value);
+    $$4(ref.current).data(componentName).value(props.value);
   }, [props.value]);
   var onFocus = function onFocus() {
-    setState(styles$g['vitro-focus']);
+    setState(styles$m['vitro-focus']);
   };
   var onBlur = function onBlur() {
-    setState(props.errorMessage ? styles$g['vitro-error'] : styles$g[CTRL.EMPTY]);
+    setState(props.errorMessage ? styles$m['vitro-error'] : styles$m[CTRL.EMPTY]);
   };
   var copyValue = function copyValue() {
     navigator.clipboard.writeText("" + props.value);
   };
   var getClassName = function getClassName() {
-    var classList = [styles$g['vitro-control'], props.className];
+    var classList = [styles$m['vitro-control'], props.className];
     if (props.isDisabled || props.isReadOnly) {
-      classList.push(styles$g['vitro-read-only']);
+      classList.push(styles$m['vitro-read-only']);
     }
     if (props.labelPosition === POSITION.LEFT) {
-      classList.push(styles$g['vitro-left-label']);
+      classList.push(styles$m['vitro-left-label']);
     }
     classList.push(state);
     return classList.join(CTRL.SPACE);
@@ -59951,24 +61138,24 @@ var TimePicker = function TimePicker(props) {
     text: props.label,
     isRequired: props.isRequired,
     width: props.labelWidth,
-    className: styles$g['vitro-label']
+    className: styles$m['vitro-label']
   }), React__default.createElement("input", {
     ref: ref,
     placeholder: props.placeholder,
     onFocus: onFocus,
     onBlur: onBlur
   }), props.isReadOnly ? React__default.createElement("span", {
-    className: styles$g['vitro-button-copy'],
+    className: styles$m['vitro-button-copy'],
     onClick: copyValue
   }) : null, React__default.createElement("div", {
     ref: container,
-    className: styles$g['vitro-control-container']
+    className: styles$m['vitro-control-container']
   }), props.errorMessage && React__default.createElement("span", {
-    className: styles$g['vitro-error-text']
+    className: styles$m['vitro-error-text']
   }, props.errorMessage));
 };
 
-var styles$h = {"vitro-selected-item":"_lookup-picker-selected-item_vitro-selected-item_hw-euth"};
+var styles$n = {"vitro-selected-item":"_lookup-picker-selected-item_vitro-selected-item_hw-euth"};
 
 var htmlValueStyles = {"vitro-item-html-value":"_lookup-picker-html-value_vitro-item-html-value_2QBoTey"};
 
@@ -59977,7 +61164,7 @@ var SelectedValueList = function SelectedValueList(props) {
     var title = props.selectedValueTemplate(x);
     return React__default.createElement("div", {
       key: x.id,
-      className: styles$h['vitro-selected-item'],
+      className: styles$n['vitro-selected-item'],
       title: title
     }, props.getHtmlValue ? React__default.createElement("div", {
       className: htmlValueStyles['vitro-item-html-value']
@@ -59985,17 +61172,17 @@ var SelectedValueList = function SelectedValueList(props) {
       onClick: function onClick() {
         return props.onOptionValueDelete(x.id);
       },
-      className: styles$h['vitro-button-close']
+      className: styles$n['vitro-button-close']
     }));
   }));
 };
 
-var styles$i = {"vitro-value-list":"_lookup-picker-value-list_vitro-value-list_LSdCMjq","vitro-item":"_lookup-picker-value-list_vitro-item_7yZBz5u","vitro-item-html-value":"_lookup-picker-value-list_vitro-item-html-value_1yl9tXx","vitro-placeholder-empty":"_lookup-picker-value-list_vitro-placeholder-empty_fTVHWwc","vitro-keyword-highlight":"_lookup-picker-value-list_vitro-keyword-highlight_1uESHan","vitro-display-none":"_lookup-picker-value-list_vitro-display-none_2kDzC6K"};
+var styles$o = {"vitro-value-list":"_lookup-picker-value-list_vitro-value-list_LSdCMjq","vitro-item":"_lookup-picker-value-list_vitro-item_7yZBz5u","vitro-item-html-value":"_lookup-picker-value-list_vitro-item-html-value_1yl9tXx","vitro-placeholder-empty":"_lookup-picker-value-list_vitro-placeholder-empty_fTVHWwc","vitro-keyword-highlight":"_lookup-picker-value-list_vitro-keyword-highlight_1uESHan","vitro-display-none":"_lookup-picker-value-list_vitro-display-none_2kDzC6K"};
 
 var ValueListItem = function ValueListItem(props) {
   return React__default.createElement("div", {
     key: props.item.id,
-    className: styles$i['vitro-item'],
+    className: styles$o['vitro-item'],
     onClick: function onClick() {
       return props.onSelect(props.item.id);
     }
@@ -60021,11 +61208,11 @@ var ValueList = function ValueList(props) {
   });
   var createDisplayValue = function createDisplayValue(item) {
     return props.inputValue ? props.filterValueTemplate(item).replace(reg, function (str) {
-      return "<span class=" + styles$i['vitro-keyword-highlight'] + ">" + str + '</span>';
+      return "<span class=" + styles$o['vitro-keyword-highlight'] + ">" + str + '</span>';
     }) : props.filterValueTemplate(item);
   };
   return React__default.createElement("div", {
-    className: styles$i['vitro-value-list'] + (props.isVisible ? CTRL.EMPTY : CTRL.SPACE + styles$i['vitro-display-none'])
+    className: styles$o['vitro-value-list'] + (props.isVisible ? CTRL.EMPTY : CTRL.SPACE + styles$o['vitro-display-none'])
   }, React__default.createElement(commonUi.ScrollBar, {
     onInit: setScrollableElement
   }, props.isPending && React__default.createElement(commonUi.Progress, null), !props.isPending && React__default.createElement(React__default.Fragment, null, props.list.length > 0 ? props.list.map(function (x) {
@@ -60036,18 +61223,18 @@ var ValueList = function ValueList(props) {
       htmlValue: props.getHtmlValue && props.getHtmlValue(x)
     });
   }) : React__default.createElement("div", {
-    className: styles$i['vitro-placeholder-empty']
+    className: styles$o['vitro-placeholder-empty']
   }, props.emptyPlaceholder))));
 };
 
-var LOCALE$3;
+var LOCALE$4;
 (function (LOCALE) {
   LOCALE["PLACEHOLDER_EMPTY"] = "app.common.lookupPicker.empty";
-})(LOCALE$3 || (LOCALE$3 = {}));
+})(LOCALE$4 || (LOCALE$4 = {}));
 
-var styles$j = {"vitro-lookup-picker":"_lookup-picker_vitro-lookup-picker_1aXYQEG","vitro-content":"_lookup-picker_vitro-content_37L0slb","vitro-focus":"_lookup-picker_vitro-focus_2UGpxXD","vitro-label":"_lookup-picker_vitro-label_2QoJkUz","vitro-read-only":"_lookup-picker_vitro-read-only_32NOdGB","vitro-error":"_lookup-picker_vitro-error_dF7iopC","vitro-error-text":"_lookup-picker_vitro-error-text_273lqvD","vitro-button-copy":"_lookup-picker_vitro-button-copy_2UIHHZD","vitro-right":"_lookup-picker_vitro-right_1XFsL1w","vitro-button-close":"_lookup-picker_vitro-button-close_3_Qndrj","vitro-button-collapse-up":"_lookup-picker_vitro-button-collapse-up_3i0OJub","vitro-button-collapse-bottom":"_lookup-picker_vitro-button-collapse-bottom_3o0Pl83"};
+var styles$p = {"vitro-lookup-picker":"_lookup-picker_vitro-lookup-picker_1aXYQEG","vitro-content":"_lookup-picker_vitro-content_37L0slb","vitro-focus":"_lookup-picker_vitro-focus_2UGpxXD","vitro-label":"_lookup-picker_vitro-label_2QoJkUz","vitro-read-only":"_lookup-picker_vitro-read-only_32NOdGB","vitro-error":"_lookup-picker_vitro-error_dF7iopC","vitro-error-text":"_lookup-picker_vitro-error-text_273lqvD","vitro-button-copy":"_lookup-picker_vitro-button-copy_2UIHHZD","vitro-right":"_lookup-picker_vitro-right_1XFsL1w","vitro-button-close":"_lookup-picker_vitro-button-close_3_Qndrj","vitro-button-collapse-up":"_lookup-picker_vitro-button-collapse-up_3i0OJub","vitro-button-collapse-bottom":"_lookup-picker_vitro-button-collapse-bottom_3o0Pl83"};
 
-var $$4 = window.$;
+var $$5 = window.$;
 var LookupPicker = function LookupPicker(props) {
   var createDefaultSelectedValueList = props.selectedValueList ? props.selectedValueList : props.selectedValue ? [props.selectedValue] : [];
   var _useState = React.useState(true),
@@ -60068,7 +61255,7 @@ var LookupPicker = function LookupPicker(props) {
   var _useState6 = React.useState(null),
     valueListRequestToken = _useState6[0],
     setValueListRequestToken = _useState6[1];
-  var _useState7 = React.useState(props.isDisabled || props.isReadOnly ? styles$j['vitro-read-only'] : CTRL.EMPTY),
+  var _useState7 = React.useState(props.isDisabled || props.isReadOnly ? styles$p['vitro-read-only'] : CTRL.EMPTY),
     state = _useState7[0],
     setState = _useState7[1];
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
@@ -60151,7 +61338,7 @@ var LookupPicker = function LookupPicker(props) {
         return filterByText(x);
       });
       if (props.scrollableElement) {
-        var scrollableElement = $$4(props.scrollableElement);
+        var scrollableElement = $$5(props.scrollableElement);
         scrollableElement.scrollTop(Number.MAX_SAFE_INTEGER);
       }
     }
@@ -60216,7 +61403,7 @@ var LookupPicker = function LookupPicker(props) {
   };
   var onFocusOut = function onFocusOut(e) {
     var target = e.currentTarget;
-    setState(props.errorMessage ? styles$j['vitro-error'] : CTRL.EMPTY);
+    setState(props.errorMessage ? styles$p['vitro-error'] : CTRL.EMPTY);
     setTimeout(function () {
       if (!target.contains(document.activeElement)) {
         setValueListVisible(false);
@@ -60230,19 +61417,19 @@ var LookupPicker = function LookupPicker(props) {
     });
   };
   var onFocus = function onFocus() {
-    setState(styles$j['vitro-focus']);
+    setState(styles$p['vitro-focus']);
     setValueListVisible(true);
   };
   var copyValue = function copyValue() {
     navigator.clipboard.writeText(selectedValueList.join(CTRL.COMMA));
   };
   var getClassName = function getClassName() {
-    var classList = [styles$j['vitro-lookup-picker'], props.className];
+    var classList = [styles$p['vitro-lookup-picker'], props.className];
     if (props.isDisabled || props.isReadOnly) {
-      classList.push(styles$j['vitro-read-only']);
+      classList.push(styles$p['vitro-read-only']);
     }
     if (props.isMultiSelect) {
-      classList.push(styles$j['vitro-lookup-picker-multi-select']);
+      classList.push(styles$p['vitro-lookup-picker-multi-select']);
     }
     classList.push(state);
     return classList.join(CTRL.SPACE);
@@ -60261,9 +61448,9 @@ var LookupPicker = function LookupPicker(props) {
     text: props.label,
     isRequired: props.isRequired,
     width: props.labelWidth,
-    className: styles$j['vitro-label']
+    className: styles$p['vitro-label']
   }), React__default.createElement("div", {
-    className: styles$j['vitro-content'],
+    className: styles$p['vitro-content'],
     onClick: onFocus
   }, selectedValueList && selectedValueList.length > 0 && (props.isMultiSelect ? true : inputValue.length === 0) ? React__default.createElement(SelectedValueList, {
     list: selectedValueList,
@@ -60280,19 +61467,19 @@ var LookupPicker = function LookupPicker(props) {
     disabled: props.isDisabled,
     readOnly: props.isReadOnly
   }), !props.isDisabled && props.children, React__default.createElement("div", {
-    className: styles$j['vitro-right']
+    className: styles$p['vitro-right']
   }, !props.isMultiSelect && selectedValueList && selectedValueList.length > 0 && !props.isDisabled && !props.isReadOnly && React__default.createElement("div", {
-    className: styles$j['vitro-button-close'],
+    className: styles$p['vitro-button-close'],
     onClick: function onClick() {
       return onOptionValueDelete();
     }
-  }), !props.isDisabled && React__default.createElement("div", {
+  }), !props.isDisabled && !props.isReadOnly && React__default.createElement("div", {
     onClick: function onClick() {
       return setValueListVisible(!valueListVisible);
     },
-    className: valueListVisible ? styles$j['vitro-button-collapse-up'] : styles$j['vitro-button-collapse-bottom']
+    className: valueListVisible ? styles$p['vitro-button-collapse-up'] : styles$p['vitro-button-collapse-bottom']
   }), props.isReadOnly ? React__default.createElement("span", {
-    className: styles$j['vitro-button-copy'],
+    className: styles$p['vitro-button-copy'],
     onClick: copyValue
   }) : null)), !props.isDisabled && (!props.filterMinLength || props.filterMinLength <= inputValue.length) && React__default.createElement(ValueList, {
     isPending: pending,
@@ -60301,41 +61488,41 @@ var LookupPicker = function LookupPicker(props) {
     filterValueTemplate: filterValueTemplate,
     onOptionValueSelect: onOptionValueSelect,
     isVisible: valueListVisible,
-    emptyPlaceholder: props.emptyPlaceholder || localeService.create(LOCALE$3.PLACEHOLDER_EMPTY),
+    emptyPlaceholder: props.emptyPlaceholder || localeService.create(LOCALE$4.PLACEHOLDER_EMPTY),
     getHtmlValue: getHtmlValue
   }), props.errorMessage && React__default.createElement("span", {
-    className: styles$j['vitro-error-text']
+    className: styles$p['vitro-error-text']
   }, props.errorMessage));
 };
 
-var styles$k = {"vitro-command-menu":"_command-menu_vitro-command-menu_l82vtIh"};
+var styles$q = {"vitro-command-menu":"_command-menu_vitro-command-menu_l82vtIh"};
 
 var CommandMenu = function CommandMenu(props) {
   return React__default.createElement("nav", {
-    className: styles$k['vitro-command-menu'] + CTRL.SPACE + 'navbar'
+    className: styles$q['vitro-command-menu'] + CTRL.SPACE + 'navbar'
   }, React__default.createElement("ul", {
     className: 'nav'
   }, props.children));
 };
 
-var styles$l = {"vitro-command-menu-button":"_command-menu-button_vitro-command-menu-button_2IiXVbP","vitro-icon":"_command-menu-button_vitro-icon_1xB4d09"};
+var styles$r = {"vitro-command-menu-button":"_command-menu-button_vitro-command-menu-button_2IiXVbP","vitro-icon":"_command-menu-button_vitro-icon_1xB4d09"};
 
 var CommandMenuButton = function CommandMenuButton(props) {
   return React__default.createElement("li", null, React__default.createElement(Button$2, Object.assign({
-    className: styles$l['vitro-command-menu-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
-    imageClassName: styles$l['vitro-icon']
+    className: styles$r['vitro-command-menu-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    imageClassName: styles$r['vitro-icon']
   }, props)));
 };
 
 var itemStyles = {"vitro-item":"_command-menu-item_vitro-item_2pVhk23"};
 
-var styles$m = {"vitro-item-lookup-picker":"_command-menu-lookup-picker_vitro-item-lookup-picker_28SsSpP","vitro-command-menu-lookup-picker":"_command-menu-lookup-picker_vitro-command-menu-lookup-picker_1840wlg","vitro-content":"_command-menu-lookup-picker_vitro-content_3fNJUmC","vitro-value-list":"_command-menu-lookup-picker_vitro-value-list_3_OCO0r","ps":"_command-menu-lookup-picker_ps_2nXaPqA","ps--active-y":"_command-menu-lookup-picker_ps--active-y_1PYkoqT","vitro-selected-item":"_command-menu-lookup-picker_vitro-selected-item_2oLYUbH","vitro-item":"_command-menu-lookup-picker_vitro-item_16ocUuf","vitro-right":"_command-menu-lookup-picker_vitro-right_3sBWu8H"};
+var styles$s = {"vitro-item-lookup-picker":"_command-menu-lookup-picker_vitro-item-lookup-picker_28SsSpP","vitro-command-menu-lookup-picker":"_command-menu-lookup-picker_vitro-command-menu-lookup-picker_1840wlg","vitro-content":"_command-menu-lookup-picker_vitro-content_3fNJUmC","vitro-value-list":"_command-menu-lookup-picker_vitro-value-list_3_OCO0r","ps":"_command-menu-lookup-picker_ps_2nXaPqA","ps--active-y":"_command-menu-lookup-picker_ps--active-y_1PYkoqT","vitro-selected-item":"_command-menu-lookup-picker_vitro-selected-item_2oLYUbH","vitro-item":"_command-menu-lookup-picker_vitro-item_16ocUuf","vitro-right":"_command-menu-lookup-picker_vitro-right_3sBWu8H"};
 
 var CommandMenuLookupPicker = function CommandMenuLookupPicker(props) {
   return React__default.createElement("li", {
-    className: itemStyles['vitro-item'] + CTRL.SPACE + 'nav-item ' + styles$m['vitro-item-lookup-picker']
+    className: itemStyles['vitro-item'] + CTRL.SPACE + 'nav-item ' + styles$s['vitro-item-lookup-picker']
   }, React__default.createElement(LookupPicker, Object.assign({}, props, {
-    className: styles$m['vitro-command-menu-lookup-picker'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$s['vitro-command-menu-lookup-picker'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   })));
 };
 
@@ -60731,13 +61918,13 @@ function getTarget(target, allElements) {
   return els;
 }
 
-var _excluded$6 = ["className", "cssModule", "variant", "innerRef"];
+var _excluded$8 = ["className", "cssModule", "variant", "innerRef"];
 function _extends$3() { _extends$3 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _objectWithoutProperties$1(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$7(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose$7(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _objectWithoutProperties$1(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$9(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose$9(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 var propTypes$2 = {
   /** Disable the button if needed */
   active: propTypes.bool,
@@ -60755,7 +61942,7 @@ function CloseButton$1(props) {
   var className = props.className,
     variant = props.variant,
     innerRef = props.innerRef,
-    attributes = _objectWithoutProperties$1(props, _excluded$6);
+    attributes = _objectWithoutProperties$1(props, _excluded$8);
   var classes = mapToCssModules(classnames(className, 'btn-close', variant && "btn-close-".concat(variant)));
   return /*#__PURE__*/React__default.createElement("button", _extends$3({
     ref: innerRef,
@@ -60767,10 +61954,10 @@ function CloseButton$1(props) {
 }
 CloseButton$1.propTypes = propTypes$2;
 
-var _excluded$7 = ["active", "aria-label", "block", "className", "close", "cssModule", "color", "outline", "size", "tag", "innerRef"];
+var _excluded$9 = ["active", "aria-label", "block", "className", "close", "cssModule", "color", "outline", "size", "tag", "innerRef"];
 function _extends$4() { _extends$4 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
-function _objectWithoutProperties$2(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$8(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose$8(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _objectWithoutProperties$2(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$a(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose$a(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 var propTypes$3 = {
   /** Manually set the visual state of the button to active */
   active: propTypes.bool,
@@ -60822,7 +62009,7 @@ function Button$3(props) {
     _props$tag = props.tag,
     Tag = _props$tag === void 0 ? 'button' : _props$tag,
     innerRef = props.innerRef,
-    attributes = _objectWithoutProperties$2(props, _excluded$7);
+    attributes = _objectWithoutProperties$2(props, _excluded$9);
   if (close) {
     return /*#__PURE__*/React__default.createElement(CloseButton$1, attributes);
   }
@@ -61355,16 +62542,16 @@ function Reference(_ref) {
  *  disabled: PropTypes.bool
  * }
  */
-var DropdownContext = /*#__PURE__*/React__default.createContext({});
+var DropdownContext$2 = /*#__PURE__*/React__default.createContext({});
 
 var InputGroupContext = /*#__PURE__*/React__default.createContext({});
 
 function _typeof$1(obj) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$1(obj); }
-var _excluded$8 = ["className", "cssModule", "direction", "isOpen", "group", "size", "nav", "setActiveFromChild", "active", "tag", "menuRole"];
+var _excluded$a = ["className", "cssModule", "direction", "isOpen", "group", "size", "nav", "setActiveFromChild", "active", "tag", "menuRole"];
 function _extends$5() { _extends$5 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$5.apply(this, arguments); }
 function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _objectWithoutProperties$3(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$9(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose$9(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _objectWithoutProperties$3(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$b(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose$b(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties$1(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 function _createClass$1(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$1(Constructor.prototype, protoProps); if (staticProps) _defineProperties$1(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
@@ -61394,7 +62581,7 @@ var propTypes$4 = {
   setActiveFromChild: propTypes.bool,
   menuRole: propTypes.oneOf(['listbox', 'menu'])
 };
-var defaultProps = {
+var defaultProps$1 = {
   a11y: true,
   isOpen: false,
   direction: 'down',
@@ -61404,7 +62591,7 @@ var defaultProps = {
   setActiveFromChild: false
 };
 var preventDefaultKeys = [keyCodes.space, keyCodes.enter, keyCodes.up, keyCodes.down, keyCodes.end, keyCodes.home];
-var Dropdown = /*#__PURE__*/function (_React$Component) {
+var Dropdown$2 = /*#__PURE__*/function (_React$Component) {
   _inherits$1(Dropdown, _React$Component);
   var _super = _createSuper(Dropdown);
   function Dropdown(props) {
@@ -61644,7 +62831,7 @@ var Dropdown = /*#__PURE__*/function (_React$Component) {
         setActiveFromChild = _omit.setActiveFromChild,
         active = _omit.active,
         tag = _omit.tag,
-        attrs = _objectWithoutProperties$3(_omit, _excluded$8);
+        attrs = _objectWithoutProperties$3(_omit, _excluded$a);
       var Tag = tag || (nav ? 'li' : 'div');
       var subItemIsActive = false;
       if (setActiveFromChild) {
@@ -61656,7 +62843,7 @@ var Dropdown = /*#__PURE__*/function (_React$Component) {
         'btn-group': group
       }, _defineProperty$1(_classNames, "btn-group-".concat(size), !!size), _defineProperty$1(_classNames, "dropdown", !group), _defineProperty$1(_classNames, "dropup", direction === 'up'), _defineProperty$1(_classNames, "dropstart", direction === 'start' || direction === 'left'), _defineProperty$1(_classNames, "dropend", direction === 'end' || direction === 'right'), _defineProperty$1(_classNames, "show", isOpen), _defineProperty$1(_classNames, 'nav-item', nav), _classNames)), cssModule);
       if (this.context.insideInputGroup) {
-        return /*#__PURE__*/React__default.createElement(DropdownContext.Provider, {
+        return /*#__PURE__*/React__default.createElement(DropdownContext$2.Provider, {
           value: this.getContextValue()
         }, /*#__PURE__*/React__default.createElement(Manager, null, React__default.Children.map(this.props.children, function (child) {
           return /*#__PURE__*/React__default.cloneElement(child, {
@@ -61664,7 +62851,7 @@ var Dropdown = /*#__PURE__*/function (_React$Component) {
           });
         })));
       }
-      return /*#__PURE__*/React__default.createElement(DropdownContext.Provider, {
+      return /*#__PURE__*/React__default.createElement(DropdownContext$2.Provider, {
         value: this.getContextValue()
       }, /*#__PURE__*/React__default.createElement(Manager, null, /*#__PURE__*/React__default.createElement(Tag, _extends$5({}, attrs, _defineProperty$1({}, typeof Tag === 'string' ? 'ref' : 'innerRef', this.containerRef), {
         onKeyDown: this.handleKeyDown,
@@ -61674,15 +62861,15 @@ var Dropdown = /*#__PURE__*/function (_React$Component) {
   }]);
   return Dropdown;
 }(React__default.Component);
-Dropdown.propTypes = propTypes$4;
-Dropdown.defaultProps = defaultProps;
-Dropdown.contextType = InputGroupContext;
+Dropdown$2.propTypes = propTypes$4;
+Dropdown$2.defaultProps = defaultProps$1;
+Dropdown$2.contextType = InputGroupContext;
 
 function _typeof$2(obj) { "@babel/helpers - typeof"; return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$2(obj); }
-var _excluded$9 = ["className", "cssModule", "divider", "tag", "header", "active", "text"];
+var _excluded$b = ["className", "cssModule", "divider", "tag", "header", "active", "text"];
 function _extends$6() { _extends$6 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$6.apply(this, arguments); }
-function _objectWithoutProperties$4(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$a(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose$a(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _objectWithoutProperties$4(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$c(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose$c(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function _classCallCheck$2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties$2(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 function _createClass$2(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$2(Constructor.prototype, protoProps); if (staticProps) _defineProperties$2(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
@@ -61706,7 +62893,7 @@ var propTypes$5 = {
   toggle: propTypes.bool,
   text: propTypes.bool
 };
-var DropdownItem = /*#__PURE__*/function (_React$Component) {
+var DropdownItem$2 = /*#__PURE__*/function (_React$Component) {
   _inherits$2(DropdownItem, _React$Component);
   var _super = _createSuper$1(DropdownItem);
   function DropdownItem(props) {
@@ -61772,7 +62959,7 @@ var DropdownItem = /*#__PURE__*/function (_React$Component) {
         header = _omit.header,
         active = _omit.active,
         text = _omit.text,
-        props = _objectWithoutProperties$4(_omit, _excluded$9);
+        props = _objectWithoutProperties$4(_omit, _excluded$b);
       var classes = mapToCssModules(classnames(className, {
         disabled: props.disabled,
         'dropdown-item': !divider && !header && !text,
@@ -61804,11 +62991,11 @@ var DropdownItem = /*#__PURE__*/function (_React$Component) {
   }]);
   return DropdownItem;
 }(React__default.Component);
-DropdownItem.propTypes = propTypes$5;
-DropdownItem.contextType = DropdownContext;
+DropdownItem$2.propTypes = propTypes$5;
+DropdownItem$2.contextType = DropdownContext$2;
 
 function _typeof$3(obj) { "@babel/helpers - typeof"; return _typeof$3 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$3(obj); }
-var _excluded$a = ["className", "cssModule", "dark", "end", "right", "tag", "flip", "modifiers", "persist", "strategy", "container", "updateOnSelect"];
+var _excluded$c = ["className", "cssModule", "dark", "end", "right", "tag", "flip", "modifiers", "persist", "strategy", "container", "updateOnSelect"];
 function _extends$7() { _extends$7 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$7.apply(this, arguments); }
 function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -61819,8 +63006,8 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-function _objectWithoutProperties$5(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$b(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose$b(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _objectWithoutProperties$5(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$d(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose$d(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function _classCallCheck$3(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties$3(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 function _createClass$3(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$3(Constructor.prototype, protoProps); if (staticProps) _defineProperties$3(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
@@ -61857,7 +63044,7 @@ var directionPositionMap = {
   end: 'right',
   down: 'bottom'
 };
-var DropdownMenu = /*#__PURE__*/function (_React$Component) {
+var DropdownMenu$2 = /*#__PURE__*/function (_React$Component) {
   _inherits$3(DropdownMenu, _React$Component);
   var _super = _createSuper$2(DropdownMenu);
   function DropdownMenu() {
@@ -61892,7 +63079,7 @@ var DropdownMenu = /*#__PURE__*/function (_React$Component) {
         strategy = _this$props.strategy,
         container = _this$props.container,
         updateOnSelect = _this$props.updateOnSelect,
-        attrs = _objectWithoutProperties$5(_this$props, _excluded$a);
+        attrs = _objectWithoutProperties$5(_this$props, _excluded$c);
       var classes = mapToCssModules(classnames(className, 'dropdown-menu', {
         'dropdown-menu-dark': dark,
         'dropdown-menu-end': end || right,
@@ -61958,15 +63145,15 @@ var DropdownMenu = /*#__PURE__*/function (_React$Component) {
   }]);
   return DropdownMenu;
 }(React__default.Component);
-DropdownMenu.propTypes = propTypes$6;
-DropdownMenu.contextType = DropdownContext;
+DropdownMenu$2.propTypes = propTypes$6;
+DropdownMenu$2.contextType = DropdownContext$2;
 
 function _typeof$4(obj) { "@babel/helpers - typeof"; return _typeof$4 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$4(obj); }
-var _excluded$b = ["className", "color", "cssModule", "caret", "split", "nav", "tag", "innerRef"];
+var _excluded$d = ["className", "color", "cssModule", "caret", "split", "nav", "tag", "innerRef"];
 function _defineProperty$3(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _extends$8() { _extends$8 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$8.apply(this, arguments); }
-function _objectWithoutProperties$6(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$c(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose$c(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _objectWithoutProperties$6(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$e(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose$e(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function _classCallCheck$4(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties$4(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 function _createClass$4(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$4(Constructor.prototype, protoProps); if (staticProps) _defineProperties$4(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
@@ -61991,11 +63178,11 @@ var propTypes$7 = {
   nav: propTypes.bool,
   innerRef: propTypes.oneOfType([propTypes.object, propTypes.string, propTypes.func])
 };
-var defaultProps$1 = {
+var defaultProps$2 = {
   color: 'secondary',
   'aria-haspopup': true
 };
-var DropdownToggle = /*#__PURE__*/function (_React$Component) {
+var DropdownToggle$2 = /*#__PURE__*/function (_React$Component) {
   _inherits$4(DropdownToggle, _React$Component);
   var _super = _createSuper$3(DropdownToggle);
   function DropdownToggle(props) {
@@ -62038,7 +63225,7 @@ var DropdownToggle = /*#__PURE__*/function (_React$Component) {
         nav = _this$props.nav,
         tag = _this$props.tag,
         innerRef = _this$props.innerRef,
-        props = _objectWithoutProperties$6(_this$props, _excluded$b);
+        props = _objectWithoutProperties$6(_this$props, _excluded$d);
       var ariaLabel = props['aria-label'] || 'Toggle Dropdown';
       var classes = mapToCssModules(classnames(className, {
         'dropdown-toggle': caret || split,
@@ -62090,9 +63277,9 @@ var DropdownToggle = /*#__PURE__*/function (_React$Component) {
   }]);
   return DropdownToggle;
 }(React__default.Component);
-DropdownToggle.propTypes = propTypes$7;
-DropdownToggle.defaultProps = defaultProps$1;
-DropdownToggle.contextType = DropdownContext;
+DropdownToggle$2.propTypes = propTypes$7;
+DropdownToggle$2.defaultProps = defaultProps$2;
+DropdownToggle$2.contextType = DropdownContext$2;
 
 function _typeof$5(obj) { "@babel/helpers - typeof"; return _typeof$5 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$5(obj); }
 function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -62140,7 +63327,7 @@ var UncontrolledDropdown = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      return /*#__PURE__*/React__default.createElement(Dropdown, _extends$9({
+      return /*#__PURE__*/React__default.createElement(Dropdown$2, _extends$9({
         isOpen: this.state.isOpen,
         toggle: this.toggle
       }, omit(this.props, omitKeys)));
@@ -62151,19 +63338,19 @@ var UncontrolledDropdown = /*#__PURE__*/function (_Component) {
 UncontrolledDropdown.propTypes = _objectSpread$2({
   defaultOpen: propTypes.bool,
   onToggle: propTypes.func
-}, Dropdown.propTypes);
+}, Dropdown$2.propTypes);
 
-var styles$n = {"vitro-command-menu-dropdown-button":"_command-menu-dropdown-button_vitro-command-menu-dropdown-button_2ImIuc3","vitro-dropdown-button-container":"_command-menu-dropdown-button_vitro-dropdown-button-container_29qd-_O","vitro-icon":"_command-menu-dropdown-button_vitro-icon_36InzPx","vitro-button-collapse-bottom":"_command-menu-dropdown-button_vitro-button-collapse-bottom_1OS_X_a"};
+var styles$t = {"vitro-command-menu-dropdown-button":"_command-menu-dropdown-button_vitro-command-menu-dropdown-button_2ImIuc3","vitro-dropdown-button-container":"_command-menu-dropdown-button_vitro-dropdown-button-container_29qd-_O","vitro-icon":"_command-menu-dropdown-button_vitro-icon_36InzPx","vitro-button-collapse-bottom":"_command-menu-dropdown-button_vitro-button-collapse-bottom_1OS_X_a"};
 
 var CommandMenuSubItem = function CommandMenuSubItem(props) {
-  return React__default.createElement(DropdownItem, {
+  return React__default.createElement(DropdownItem$2, {
     onClick: props.onClick,
-    toggle: props.toggle
+    toggle: props.toggle === false ? false : true
   }, props.imageUrl && React__default.createElement(commonUi.Icon, {
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
     alt: props.title,
-    className: styles$n['vitro-icon']
+    className: styles$t['vitro-icon']
   }), props.href ? React__default.createElement(Link, {
     to: props.href
   }, props.text) : React__default.createElement("span", null, props.text));
@@ -62180,16 +63367,16 @@ var CommandMenuItemHeader = function CommandMenuItemHeader(props) {
     onMouseLeave: function onMouseLeave() {
       return setIsHover(false);
     },
-    className: itemStyles['vitro-item'] + CTRL.SPACE + styles$n['vitro-command-menu-dropdown-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    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, {
     isHover: isHover,
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
     alt: props.text,
-    className: styles$n['vitro-icon']
+    className: styles$t['vitro-icon']
   }), React__default.createElement("span", null, props.text), !props.isHideChevronDown && React__default.createElement("div", {
-    className: styles$n['vitro-button-collapse-bottom']
+    className: styles$t['vitro-button-collapse-bottom']
   }));
 };
 
@@ -62197,13 +63384,13 @@ var CommandMenuDropdownButton = function CommandMenuDropdownButton(props) {
   return React__default.createElement(UncontrolledDropdown, {
     nav: true,
     inNavbar: true,
-    className: styles$n['vitro-dropdown-button-container']
-  }, React__default.createElement(DropdownToggle, {
+    className: styles$t['vitro-dropdown-button-container']
+  }, React__default.createElement(DropdownToggle$2, {
     nav: true,
     caret: true
   }, React__default.createElement(CommandMenuItemHeader, Object.assign({}, props, {
     className: props.className
-  }))), React__default.createElement(DropdownMenu, null, props.itemList && props.itemList.map(function (i) {
+  }))), React__default.createElement(DropdownMenu$2, null, props.itemList && props.itemList.map(function (i) {
     return React__default.createElement(CommandMenuSubItem, Object.assign({
       toggle: props.toggle,
       key: i.text
@@ -62211,18 +63398,18 @@ var CommandMenuDropdownButton = function CommandMenuDropdownButton(props) {
   }), props.children));
 };
 
-var styles$o = {"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-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 Item$1 = function Item(props) {
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", null, React__default.createElement(commonUi.Icon, {
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
     isHover: props.isHover,
-    className: styles$o['vitro-icon']
+    className: styles$u['vitro-icon']
   }), React__default.createElement("span", {
-    className: styles$o['vitro-icon-text']
+    className: styles$u['vitro-icon-text']
   }, props.text)), React__default.createElement("span", {
-    className: styles$o['vitro-item-text']
+    className: styles$u['vitro-item-text']
   }, props.text));
 };
 
@@ -62232,7 +63419,7 @@ var TARGET;
   TARGET["SELF"] = "_self";
 })(TARGET || (TARGET = {}));
 
-var w$6 = window;
+var w$7 = window;
 var PX_UNIT$3 = 'px';
 var WIDTH_AUTO = 'auto';
 var LinkItem$1 = function LinkItem(props) {
@@ -62250,17 +63437,17 @@ var LinkItem$1 = function LinkItem(props) {
     style: {
       width: props.linkItemWidth ? props.linkItemWidth + PX_UNIT$3 : WIDTH_AUTO
     },
-    className: styles$o['vitro-item']
+    className: styles$u['vitro-item']
   }, props.link && React__default.createElement(Link, {
     to: props.link,
-    className: isActive ? styles$o['vitro-active'] : CTRL.EMPTY
+    className: isActive ? styles$u['vitro-active'] : CTRL.EMPTY
   }, React__default.createElement(Item$1, Object.assign({}, props, {
     isHover: isActive
   }))), props.onClick && React__default.createElement("a", {
     onClick: function onClick() {
-      return w$6[props.onClick || CTRL.EMPTY]();
+      return w$7[props.onClick || CTRL.EMPTY]();
     },
-    className: isActive ? styles$o['vitro-active'] : CTRL.EMPTY
+    className: isActive ? styles$u['vitro-active'] : CTRL.EMPTY
   }, React__default.createElement(Item$1, Object.assign({}, props, {
     isHover: isActive
   }))), props.href && React__default.createElement("a", {
@@ -62297,7 +63484,7 @@ var SectionList = React.forwardRef(function (props, ref) {
   }));
 });
 
-var styles$p = {"vitro-sidebar":"_sidebar_vitro-sidebar_1IxGYiU","vitro-scroll-container":"_sidebar_vitro-scroll-container_3K-iJy8","vitro-button-more":"_sidebar_vitro-button-more_3s9oZY9"};
+var styles$v = {"vitro-sidebar":"_sidebar_vitro-sidebar_1IxGYiU","vitro-scroll-container":"_sidebar_vitro-scroll-container_3K-iJy8","vitro-button-more":"_sidebar_vitro-button-more_3s9oZY9"};
 
 var Sidebar = function Sidebar(props) {
   var _useState = React.useState(props.history.location.pathname),
@@ -62370,7 +63557,7 @@ var Sidebar = function Sidebar(props) {
     var width = containerWidth / count;
     setLinkItemWidth(width);
   };
-  var className = styles$p['vitro-sidebar'] + (props.theme ? CTRL.SPACE + props.theme : CTRL.EMPTY) + CTRL.SPACE + (isMobileView ? 'vitro-bottom-menu' : CTRL.EMPTY);
+  var className = styles$v['vitro-sidebar'] + (props.theme ? CTRL.SPACE + props.theme : CTRL.EMPTY) + CTRL.SPACE + (isMobileView ? 'vitro-bottom-menu' : CTRL.EMPTY);
   return React__default.createElement("div", {
     className: className,
     id: 'vitro-sidebar'
@@ -62383,7 +63570,7 @@ var Sidebar = function Sidebar(props) {
     currentUrl: currentUrl,
     activeItem: props.activeItem
   })) : React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
-    className: styles$p['vitro-scroll-container'],
+    className: styles$v['vitro-scroll-container'],
     ref: menuRef
   }, React__default.createElement(SectionList, {
     itemList: itemList,
@@ -62393,40 +63580,40 @@ var Sidebar = function Sidebar(props) {
     linkItemWidth: linkItemWidth
   })), React__default.createElement("button", {
     onClick: scroll,
-    className: styles$p['vitro-button-more']
+    className: styles$v['vitro-button-more']
   })));
 };
 
-var styles$q = {"vitro-task-tile":"_task-tile_vitro-task-tile_35bZu48","vitro-active":"_task-tile_vitro-active_11W9nJz","vitro-content":"_task-tile_vitro-content_rl2ERCQ","vitro-description":"_task-tile_vitro-description_qtyUbLy","vitro-comment":"_task-tile_vitro-comment_2im2AJj","vitro-title":"_task-tile_vitro-title_1pXrIrB","vitro-top-right":"_task-tile_vitro-top-right_19tbPX4","vitro-dropdown-button":"_task-tile_vitro-dropdown-button_2YgEUdg","vitro-bottom-right":"_task-tile_vitro-bottom-right_2E9WAle","vitro-button-cancel":"_task-tile_vitro-button-cancel_1lgja1K"};
+var styles$w = {"vitro-task-tile":"_task-tile_vitro-task-tile_35bZu48","vitro-active":"_task-tile_vitro-active_11W9nJz","vitro-content":"_task-tile_vitro-content_rl2ERCQ","vitro-description":"_task-tile_vitro-description_qtyUbLy","vitro-comment":"_task-tile_vitro-comment_2im2AJj","vitro-title":"_task-tile_vitro-title_1pXrIrB","vitro-top-right":"_task-tile_vitro-top-right_19tbPX4","vitro-dropdown-button":"_task-tile_vitro-dropdown-button_2YgEUdg","vitro-bottom-right":"_task-tile_vitro-bottom-right_2E9WAle","vitro-button-cancel":"_task-tile_vitro-button-cancel_1lgja1K"};
 
 var TaskTile = function TaskTile(props) {
   return React__default.createElement("div", {
-    className: styles$q['vitro-task-tile'] + (props.isActive ? CTRL.SPACE + styles$q['vitro-active'] : CTRL.EMPTY),
+    className: styles$w['vitro-task-tile'] + (props.isActive ? CTRL.SPACE + styles$w['vitro-active'] : CTRL.EMPTY),
     onClick: props.onClick
   }, props.dropdownItemList && React__default.createElement("div", {
-    className: styles$q['vitro-top-right']
-  }, React__default.createElement(commonUi.DropdownButton, {
+    className: styles$w['vitro-top-right']
+  }, React__default.createElement(DropdownButton, {
     itemList: props.dropdownItemList,
-    className: styles$q['vitro-dropdown-button']
+    className: styles$w['vitro-dropdown-button']
   })), props.isShowDeleteButton && React__default.createElement("div", {
-    className: styles$q['vitro-button-cancel'],
+    className: styles$w['vitro-button-cancel'],
     onClick: props.onDeleteClick
   }), props.description && React__default.createElement("div", {
-    className: styles$q['vitro-description']
+    className: styles$w['vitro-description']
   }, props.description), React__default.createElement("div", {
-    className: styles$q['vitro-title']
+    className: styles$w['vitro-title']
   }, props.title), props.comment && React__default.createElement("div", {
-    className: styles$q['vitro-comment']
+    className: styles$w['vitro-comment']
   }, props.comment), React__default.createElement("div", {
-    className: styles$q['vitro-content']
+    className: styles$w['vitro-content']
   }, props.userList && React__default.createElement(commonUi.TaskUserList, {
     itemList: props.userList
   })), React__default.createElement("div", {
-    className: styles$q['vitro-bottom-right']
+    className: styles$w['vitro-bottom-right']
   }, props.dateComment, " \xA0 ", props.date), props.children);
 };
 
-var styles$r = {"vitro-alert":"_alert_vitro-alert_3sPAkJb","vitro-alert-content":"_alert_vitro-alert-content_10fW1n4","vitro-button-close":"_alert_vitro-button-close_39K9cqW","vitro-icon":"_alert_vitro-icon_pK385gF","vitro-text":"_alert_vitro-text_37Erxqj","vitro-alert-action-list":"_alert_vitro-alert-action-list_2XzbaCO","vitro-position-center":"_alert_vitro-position-center_1r_lK_e"};
+var styles$x = {"vitro-alert":"_alert_vitro-alert_3sPAkJb","vitro-alert-content":"_alert_vitro-alert-content_10fW1n4","vitro-button-close":"_alert_vitro-button-close_39K9cqW","vitro-icon":"_alert_vitro-icon_pK385gF","vitro-text":"_alert_vitro-text_37Erxqj","vitro-alert-action-list":"_alert_vitro-alert-action-list_2XzbaCO","vitro-position-center":"_alert_vitro-position-center_1r_lK_e"};
 
 var Alert$1 = function Alert(props) {
   var ref = React.useRef(null);
@@ -62458,7 +63645,7 @@ var Alert$1 = function Alert(props) {
     }
   };
   var actionList = props.actionList && React__default.createElement("div", {
-    className: styles$r['vitro-alert-action-list']
+    className: styles$x['vitro-alert-action-list']
   }, props.actionList.map(function (a) {
     return React__default.createElement(Button$1, {
       key: a.text,
@@ -62467,7 +63654,7 @@ var Alert$1 = function Alert(props) {
       }
     }, a.text);
   }));
-  var className = styles$r['vitro-alert'] + CTRL.SPACE + (props.isPositionCenter && styles$r['vitro-position-center']) + CTRL.SPACE + (props.className ? props.className : CTRL.EMPTY);
+  var className = styles$x['vitro-alert'] + CTRL.SPACE + (props.isPositionCenter && styles$x['vitro-position-center']) + CTRL.SPACE + (props.className ? props.className : CTRL.EMPTY);
   return React__default.createElement("div", {
     tabIndex: 1,
     onBlur: onFocusOut,
@@ -62477,13 +63664,13 @@ var Alert$1 = function Alert(props) {
     variant: props.type,
     onClose: props.onClose
   }, React__default.createElement("div", {
-    className: styles$r['vitro-alert-content']
+    className: styles$x['vitro-alert-content']
   }, React__default.createElement("div", {
-    className: styles$r['vitro-icon']
+    className: styles$x['vitro-icon']
   }), React__default.createElement("div", {
-    className: styles$r['vitro-text']
+    className: styles$x['vitro-text']
   }, props.title && React__default.createElement("strong", null, props.title), props.text, !props.text && props.children), !props.isMultiline && actionList, props.isDismissible && React__default.createElement("div", {
-    className: styles$r['vitro-button-close'],
+    className: styles$x['vitro-button-close'],
     onClick: onClose
   })), props.text && props.children, props.isMultiline && actionList));
 };
@@ -62519,7 +63706,7 @@ var DialogHeader = function DialogHeader(props) {
 
 var dialogStyles = {"vitro-dialog":"_dialog_vitro-dialog_2NzcRZg"};
 
-var styles$s = {"vitro-dialog-button-close":"_dialog-button-close_vitro-dialog-button-close_1p27cEz","vitro-button-close":"_dialog-button-close_vitro-button-close_2BpzTR0"};
+var styles$y = {"vitro-dialog-button-close":"_dialog-button-close_vitro-dialog-button-close_1p27cEz","vitro-button-close":"_dialog-button-close_vitro-button-close_2BpzTR0"};
 
 var Dialog = function Dialog(props) {
   var className = dialogStyles['vitro-dialog'];
@@ -62540,7 +63727,7 @@ var Dialog = function Dialog(props) {
     width: props.width,
     height: props.height
   }, props.isDismissible && React__default.createElement("button", {
-    className: styles$s['vitro-dialog-button-close'],
+    className: styles$y['vitro-dialog-button-close'],
     onClick: onClose
   }), React__default.createElement(DialogHeader, {
     title: props.title
@@ -62549,19 +63736,19 @@ var Dialog = function Dialog(props) {
   }) : React__default.cloneElement(props.children, _extends({}, props))));
 };
 
-var styles$t = {"vitro-dialog-content":"_dialog-content_vitro-dialog-content_qQNWu6x"};
+var styles$z = {"vitro-dialog-content":"_dialog-content_vitro-dialog-content_qQNWu6x"};
 
 var DialogContent = function DialogContent(props) {
   return React__default.createElement("div", {
-    className: styles$t['vitro-dialog-content']
+    className: styles$z['vitro-dialog-content']
   }, props.children);
 };
 
-var styles$u = {"vitro-dialog-button":"_dialog-button_vitro-dialog-button_1fQ5l22"};
+var styles$A = {"vitro-dialog-button":"_dialog-button_vitro-dialog-button_1fQ5l22"};
 
 var DialogButton = function DialogButton(props) {
   return React__default.createElement(Button$2, Object.assign({}, props, {
-    className: styles$u['vitro-dialog-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$A['vitro-dialog-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }));
 };
 
@@ -62581,25 +63768,25 @@ var DialogCloseButton = function DialogCloseButton(props) {
     onClick: props.onClose,
     text: props.text,
     isDisabled: props.isDisabled,
-    className: styles$s['vitro-button-close']
+    className: styles$y['vitro-button-close']
   });
 };
 
-var LOCALE$4;
+var LOCALE$5;
 (function (LOCALE) {
   LOCALE["ACTION_CANCEL"] = "app.common.action.cancel";
   LOCALE["ACTION_CLOSE"] = "app.common.action.close";
   LOCALE["ACTION_SAVE"] = "app.common.action.save";
-})(LOCALE$4 || (LOCALE$4 = {}));
+})(LOCALE$5 || (LOCALE$5 = {}));
 
-var styles$v = {"vitro-dialog-footer":"_dialog-footer_vitro-dialog-footer_2vUQ3aG"};
+var styles$B = {"vitro-dialog-footer":"_dialog-footer_vitro-dialog-footer_2vUQ3aG"};
 
 var DialogFooter = function DialogFooter(props) {
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
-  var labelClose = props.labelClose || localeService.create(props.onActionClick ? LOCALE$4.ACTION_CANCEL : LOCALE$4.ACTION_CLOSE);
-  var labelAction = props.labelAction || localeService.create(LOCALE$4.ACTION_SAVE);
+  var labelClose = props.labelClose || localeService.create(props.onActionClick ? LOCALE$5.ACTION_CANCEL : LOCALE$5.ACTION_CLOSE);
+  var labelAction = props.labelAction || localeService.create(LOCALE$5.ACTION_SAVE);
   return React__default.createElement("div", {
-    className: styles$v['vitro-dialog-footer']
+    className: styles$B['vitro-dialog-footer']
   }, props.children, props.onActionClick && React__default.createElement(DialogButton, {
     text: labelAction,
     onClick: props.onActionClick
@@ -62609,57 +63796,7 @@ var DialogFooter = function DialogFooter(props) {
   }));
 };
 
-var styles$w = {"vitro-avatar":"_avatar_vitro-avatar_P2tU-_r","vitro-avatar-big":"_avatar_vitro-avatar-big_pEmlX3a"};
-
-var Avatar = function Avatar(props) {
-  var getInitials = function getInitials() {
-    var initials = CTRL.EMPTY;
-    if (props.userName) {
-      props.userName.split(CTRL.SPACE).forEach(function (name, i) {
-        initials += i < 2 ? name[0] ? name[0] : CTRL.EMPTY : CTRL.EMPTY;
-      });
-    }
-    return initials;
-  };
-  var getBackground = function getBackground() {
-    if (props.image) {
-      return props.image;
-    } else if (props.userName) {
-      return getBgColor(props.userName);
-    }
-    return CTRL.EMPTY;
-  };
-  var getHashOfString = function getHashOfString(str) {
-    var hash = 0;
-    for (var i = 0; i < str.length; i++) {
-      hash = str.charCodeAt(i) + ((hash << 5) - hash);
-    }
-    hash = Math.abs(hash);
-    return hash;
-  };
-  var normalizeHash = function normalizeHash(hash, min, max) {
-    return Math.floor(hash % (max - min) + min);
-  };
-  var getHue = function getHue(name) {
-    var min = 1000;
-    var max = 360;
-    var hash = getHashOfString(name);
-    var normalizedHash = normalizeHash(hash, min, max);
-    return normalizedHash;
-  };
-  var getBgColor = function getBgColor(name) {
-    return "linear-gradient(0deg, hsla(" + getHue(name) + ", 58%, 55%, 1), hsla(" + (getHue(name) + 50) + ", 100%, 78%, 1))";
-  };
-  var className = styles$w['vitro-avatar'] + (props.isBigSize ? CTRL.SPACE + styles$w['vitro-avatar-big'] : CTRL.EMPTY);
-  return React__default.createElement("div", {
-    className: className,
-    style: {
-      background: getBackground()
-    }
-  }, getInitials());
-};
-
-var styles$x = {"vitro-user-profile":"_user-profile_vitro-user-profile_11XpBoQ","vitro-dropdown-item":"_user-profile_vitro-dropdown-item_dSErsta"};
+var styles$C = {"vitro-user-profile":"_user-profile_vitro-user-profile_11XpBoQ","vitro-dropdown-item":"_user-profile_vitro-dropdown-item_dSErsta"};
 
 var UserProfileMenuItem = function UserProfileMenuItem(props) {
   var onClick = function onClick() {
@@ -62670,7 +63807,7 @@ var UserProfileMenuItem = function UserProfileMenuItem(props) {
   };
   if (props.link) {
     return React__default.createElement("div", {
-      className: styles$x['vitro-dropdown-item'],
+      className: styles$C['vitro-dropdown-item'],
       onClick: onClick
     }, React__default.createElement(Link, {
       to: props.link
@@ -62681,7 +63818,7 @@ var UserProfileMenuItem = function UserProfileMenuItem(props) {
   }
   if (props.onClick) {
     return React__default.createElement("div", {
-      className: styles$x['vitro-dropdown-item'],
+      className: styles$C['vitro-dropdown-item'],
       key: props.text,
       onClick: onClick
     }, props.imageUrl && React__default.createElement(commonUi.Icon, {
@@ -62712,18 +63849,18 @@ var UserProfile = function UserProfile(props) {
     }
     return username;
   };
-  return React__default.createElement(Dropdown, {
+  return React__default.createElement(Dropdown$2, {
     isOpen: dropdownOpen,
     toggle: toggle,
-    className: styles$x['vitro-user-profile']
-  }, React__default.createElement(DropdownToggle, {
+    className: styles$C['vitro-user-profile']
+  }, React__default.createElement(DropdownToggle$2, {
     caret: true
   }, React__default.createElement("div", null, React__default.createElement("span", {
-    className: styles$x['vitro-text-color-white']
+    className: styles$C['vitro-text-color-white']
   }, createSurnameWithInitials(props.userName)), React__default.createElement(Avatar, {
     userName: props.userName,
     isBigSize: true
-  }))), React__default.createElement(DropdownMenu, {
+  }))), React__default.createElement(DropdownMenu$2, {
     right: true
   }, props.dropdownMenuItemList && props.dropdownMenuItemList.length > 0 && props.dropdownMenuItemList.map(function (item) {
     return React__default.createElement(UserProfileMenuItem, Object.assign({
@@ -62746,6 +63883,7 @@ exports.Alert = Alert$1;
 exports.Avatar = Avatar;
 exports.Breadcrumbs = Breadcrumbs;
 exports.Button = Button$2;
+exports.Checkbox = Checkbox;
 exports.CommandMenu = CommandMenu;
 exports.CommandMenuButton = CommandMenuButton;
 exports.CommandMenuDropdownButton = CommandMenuDropdownButton;
@@ -62758,7 +63896,9 @@ exports.DatePicker = DatePicker;
 exports.Dialog = Dialog;
 exports.DialogContent = DialogContent;
 exports.DialogFooter = DialogFooter;
+exports.DropdownButton = DropdownButton;
 exports.Input = Input;
+exports.IssueTile = IssueTile;
 exports.Label = Label;
 exports.Login = Login;
 exports.LookupPicker = LookupPicker;