@vitrosoftware/common-ui-ts 1.1.210 → 1.1.211

package/dist/index.js

@@ -22526,7 +22526,7 @@ var MicroFrontend = React.forwardRef(function (props, ref) {
     ref: rootRef,
     id: id,
     "data-type": 'app',
-    className: props.isDockFill === false ? undefined : styles$6['vitro-micro-frontend']
+    className: (props.isDockFill === false ? undefined : styles$6['vitro-micro-frontend']) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   });
 });
 
@@ -23289,54 +23289,6 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
-/**
- * Copyright (c) 2013-present, Facebook, Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/**
- * Use invariant() to assert state which your program assumes to be true.
- *
- * Provide sprintf-style format (only %s is supported) and arguments
- * to provide information about what broke and what you were
- * expecting.
- *
- * The invariant message will be stripped in production, but the invariant
- * will remain to ensure logic does not differ in production.
- */
-
-var invariant = function(condition, format, a, b, c, d, e, f) {
-  if (process.env.NODE_ENV !== 'production') {
-    if (format === undefined) {
-      throw new Error('invariant requires an error message argument');
-    }
-  }
-
-  if (!condition) {
-    var error;
-    if (format === undefined) {
-      error = new Error(
-        'Minified exception occurred; use the non-minified dev environment ' +
-        'for the full error message and additional helpful warnings.'
-      );
-    } else {
-      var args = [a, b, c, d, e, f];
-      var argIndex = 0;
-      error = new Error(
-        format.replace(/%s/g, function() { return args[argIndex++]; })
-      );
-      error.name = 'Invariant Violation';
-    }
-
-    error.framesToPop = 1; // we don't care about invariant's own frame
-    throw error;
-  }
-};
-
-var browser = invariant;
-
 function defaultKey(key) {
   return 'default' + key.charAt(0).toUpperCase() + key.substr(1);
 }
@@ -56395,24 +56347,6 @@ 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,
@@ -56445,31 +56379,6 @@ 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 &&
@@ -56862,28 +56771,6 @@ 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
@@ -56907,8 +56794,6 @@ function useForceUpdate() {
   return dispatch;
 }
 
-const DropdownContext = /*#__PURE__*/React.createContext(null);
-
 var has$2 = Object.prototype.hasOwnProperty;
 
 function find(iter, tar, key) {
@@ -59105,270 +58990,6 @@ function mergeOptionsWithPopperConfig({
   });
 }
 
-const _excluded$3 = ["children"];
-function _objectWithoutPropertiesLoose$4(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$4(_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
-};
-const $b5e257d569688ac6$var$SSRContext = /*#__PURE__*/ (React__default).createContext($b5e257d569688ac6$var$defaultContext);
-const $b5e257d569688ac6$var$IsSSRContext = /*#__PURE__*/ (React__default).createContext(false);
-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_ReactCurrentOwner, _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
-        // 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
-    return (React.useContext)($b5e257d569688ac6$var$IsSSRContext);
-}
-
-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);
@@ -59387,64 +59008,6 @@ function dataProp(property) {
   return `${PROPERTY_PREFIX}${property}`;
 }
 
-const _excluded$4 = ["eventKey", "disabled", "onClick", "active", "as"];
-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; }
-/**
- * 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$5(_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);
 
 /**
@@ -59457,499 +59020,15 @@ function useWindow() {
   return React.useContext(Context);
 }
 
-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 DropdownDivider = /*#__PURE__*/React.forwardRef(({
-  className,
-  bsPrefix,
-  as: Component = 'hr',
-  role = 'separator',
-  ...props
-}, ref) => {
-  bsPrefix = useBootstrapPrefix(bsPrefix, 'dropdown-divider');
-  return /*#__PURE__*/jsxRuntime.jsx(Component, {
-    ref: ref,
-    className: classnames(className, bsPrefix),
-    role: role,
-    ...props
-  });
-});
-DropdownDivider.displayName = 'DropdownDivider';
-
-const DropdownHeader = /*#__PURE__*/React.forwardRef(({
-  className,
-  bsPrefix,
-  as: Component = 'div',
-  role = 'heading',
-  ...props
-}, ref) => {
-  bsPrefix = useBootstrapPrefix(bsPrefix, 'dropdown-header');
-  return /*#__PURE__*/jsxRuntime.jsx(Component, {
-    ref: ref,
-    className: classnames(className, bsPrefix),
-    role: role,
-    ...props
-  });
-});
-DropdownHeader.displayName = 'DropdownHeader';
-
-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 DropdownItemText = /*#__PURE__*/React.forwardRef(({
-  className,
-  bsPrefix,
-  as: Component = 'span',
-  ...props
-}, ref) => {
-  bsPrefix = useBootstrapPrefix(bsPrefix, 'dropdown-item-text');
-  return /*#__PURE__*/jsxRuntime.jsx(Component, {
-    ref: ref,
-    className: classnames(className, bsPrefix),
-    ...props
-  });
-});
-DropdownItemText.displayName = 'DropdownItemText';
-
-const context$1 = /*#__PURE__*/React.createContext(null);
-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 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 context$1 = /*#__PURE__*/React.createContext(null);
+context$1.displayName = 'NavbarContext';
 
 const TabContext = /*#__PURE__*/React.createContext(null);
 
-const _excluded$5 = ["as", "active", "eventKey"];
-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$3 = ["as", "active", "eventKey"];
+function _objectWithoutPropertiesLoose$4(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,
@@ -60016,7 +59095,7 @@ const NavItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       active,
       eventKey
     } = _ref,
-    options = _objectWithoutPropertiesLoose$6(_ref, _excluded$5);
+    options = _objectWithoutPropertiesLoose$4(_ref, _excluded$3);
   const [props, meta] = useNavItem(Object.assign({
     key: makeEventKey(eventKey, options.href),
     active
@@ -60030,10 +59109,10 @@ const NavItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
 });
 NavItem.displayName = 'NavItem';
 
-const _excluded$6 = ["as", "onSelect", "activeKey", "role", "onKeyDown"];
-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; }
+const _excluded$4 = ["as", "onSelect", "activeKey", "role", "onKeyDown"];
+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; }
 // eslint-disable-next-line @typescript-eslint/no-empty-function
-const noop$4 = () => {};
+const noop$2 = () => {};
 const EVENT_KEY_ATTR = dataAttr('event-key');
 const Nav = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
@@ -60044,7 +59123,7 @@ const Nav = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       role,
       onKeyDown
     } = _ref,
-    props = _objectWithoutPropertiesLoose$7(_ref, _excluded$6);
+    props = _objectWithoutPropertiesLoose$5(_ref, _excluded$4);
   // 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();
@@ -60117,8 +59196,8 @@ const Nav = /*#__PURE__*/React.forwardRef((_ref, ref) => {
         role,
         // used by NavLink to determine it's role
         activeKey: makeEventKey(activeKey),
-        getControlledId: getControlledId || noop$4,
-        getControllerId: getControllerId || noop$4
+        getControlledId: getControlledId || noop$2,
+        getControllerId: getControllerId || noop$2
       },
       children: /*#__PURE__*/jsxRuntime.jsx(Component, Object.assign({}, props, {
         onKeyDown: handleKeyDown,
@@ -60445,7 +59524,7 @@ const Nav$1 = /*#__PURE__*/React.forwardRef((uncontrolledProps, ref) => {
   let navbarBsPrefix;
   let cardHeaderBsPrefix;
   let isNavbar = false;
-  const navbarContext = React.useContext(context$2);
+  const navbarContext = React.useContext(context$1);
   const cardHeaderContext = React.useContext(context);
   if (navbarContext) {
     navbarBsPrefix = navbarContext.bsPrefix;
@@ -60477,7 +59556,7 @@ var Nav$2 = Object.assign(Nav$1, {
   Link: NavLink
 });
 
-const noop$5 = () => {};
+const noop$3 = () => {};
 /**
  * The `useRootClose` hook registers your callback on the document
  * when rendered. Powers the `<Overlay/>` component. This is used achieve modal
@@ -60494,7 +59573,7 @@ function useRootClose(ref, onRootClose, {
   disabled,
   clickTrigger
 } = {}) {
-  const onClose = onRootClose || noop$5;
+  const onClose = onRootClose || noop$3;
   useClickOutside(ref, onClose, {
     disabled,
     clickTrigger
@@ -61284,7 +60363,7 @@ var ExpandCollapseButton = function ExpandCollapseButton(props) {
     className: styles$j['vitro-expand-collapse-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }, props.expandImage && props.collapseImage ? React__default.createElement(React__default.Fragment, null, isExpanded ? props.collapseImage : props.expandImage) : React__default.createElement("div", {
     className: isExpanded ? styles$j['vitro-expanded'] : styles$j['vitro-collapsed']
-  }), isExpanded ? props.collapseText : props.expandText);
+  }), props.collapseText || props.expandText ? React__default.createElement("span", null, isExpanded ? props.collapseText : props.expandText) : null, props.children);
 };
 
 var LOCALE$1;
@@ -62043,124 +61122,234 @@ var ActionHandler = function ActionHandler(props) {
   }));
 };
 
-var styles$q = {"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-image":"_dropdown-button_vitro-image_3bX1quk","dropdown-item":"_dropdown-button_dropdown-item_1c2DhhE"};
+var styles$q = {"vitro-dropdown-button-container":"_dropdown-button_vitro-dropdown-button-container_zx8iZtY","vitro-dropdown-toggle":"_dropdown-button_vitro-dropdown-toggle_-Nj8qLe","vitro-dropdown-menu":"_dropdown-button_vitro-dropdown-menu_2B1Wr1Y","vitro-right":"_dropdown-button_vitro-right_gHoXO9n","vitro-dropdown-button-item":"_dropdown-button_vitro-dropdown-button-item_2XZNxoG","vitro-dropdown-button-dropdown-item":"_dropdown-button_vitro-dropdown-button-dropdown-item_3Nwnp_-","vitro-image-container":"_dropdown-button_vitro-image-container_3Kf-a2A","vitro-button-collapse-bottom":"_dropdown-button_vitro-button-collapse-bottom_Ivm3AkU","vitro-image":"_dropdown-button_vitro-image_3bX1quk","vitro-scrollbar":"_dropdown-button_vitro-scrollbar_2DCwQvu","vitro-dropdown-button-dropdown-item-menu":"_dropdown-button_vitro-dropdown-button-dropdown-item-menu_39eSYtN"};
 
-var w$4 = window;
-var ALIGN_END = 'end';
-var DROP_DOWN = 'down';
-var POSITION_ABSOLUTE = 'absolute';
-var DropdownButton = function DropdownButton(props) {
-  var _useState = React.useState([]),
-    itemList = _useState[0],
-    setItemList = _useState[1];
-  var buttonRef = React.useRef(null);
-  React.useEffect(function () {
-    return function () {
-      w$4.$('body > .dropdown-menu').remove();
-    };
-  }, []);
-  React.useEffect(function () {
-    setItemList(props.itemList.filter(function (x) {
-      return !x.isOverflow;
-    }));
-  }, [props.itemList]);
-  var hideMenu = function hideMenu() {
-    var button = w$4.$('.vitro-dropdown-button-active');
-    if (button.length > 0) {
-      button.removeClass('vitro-dropdown-button-active');
-      if (button.next().length < 1) {
-        button.after(w$4.$('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$4.$(e.currentTarget);
-        var menu = target.next();
-        if (menu.length > 0) {
-          w$4.$('body').append(menu.css({
-            position: POSITION_ABSOLUTE,
-            left: menu.offset().left,
-            top: menu.offset().top
-          }).detach());
+var DropdownButtonItem = function DropdownButtonItem(props) {
+  var onClick = function onClick(e) {
+    if (props.onClick) {
+      props.onClick(e);
+    } else if (props.href) {
+      var event = new CustomEvent(exports.EVENT.HISTORY_UPDATE, {
+        detail: {
+          pathname: props.href
+        }
+      });
+      window.dispatchEvent(event);
+    }
+  };
+  return React__default.createElement(reactstrap.DropdownItem, {
+    onClick: onClick,
+    toggle: props.isToggle === false ? false : true,
+    divider: props.isShowSeparator,
+    className: styles$q['vitro-dropdown-button-item']
+  }, (props.isShowImage || props.imageUrl) && React__default.createElement("div", {
+    className: styles$q['vitro-image-container']
+  }, props.imageUrl && React__default.createElement(Image, {
+    defaultUrl: props.imageUrl,
+    hoverUrl: props.imageHoverUrl
+  })), React__default.createElement("span", null, props.text));
+};
+
+var Dropdown = React.forwardRef(function (props, ref) {
+  var toggleRef = React.useRef();
+  var dropdownRef = React.useRef();
+  React.useImperativeHandle(ref, function () {
+    return {
+      click: function click() {
+        if (toggleRef.current) {
+          toggleRef.current.click();
+        }
+      },
+      toggle: function toggle() {
+        if (dropdownRef.current) {
+          dropdownRef.current.toggle();
         }
-        target.addClass('vitro-dropdown-button-active');
       }
+    };
+  });
+  var toggle = function toggle() {
+    if (props.isExpandOnHover) {
+      var _dropdownRef$current;
+      (_dropdownRef$current = dropdownRef.current) === null || _dropdownRef$current === void 0 ? void 0 : _dropdownRef$current.toggle();
     }
-    if (props.onToggle) {
-      props.onToggle(state, e);
+  };
+  var onClick = function onClick(e) {
+    if (props.isExpandOnHover) {
+      var _dropdownRef$current2;
+      (_dropdownRef$current2 = dropdownRef.current) === null || _dropdownRef$current2 === void 0 ? void 0 : _dropdownRef$current2.toggle();
     }
-    if (!state && buttonRef.current) {
-      buttonRef.current.blur();
+    if (props.onClick) {
+      props.onClick(e);
     }
   };
-  var overflowItemList = itemList.filter(function (x) {
-    return x.isOverflow;
-  });
-  var isShowImage = itemList.find(function (item) {
-    return !!item.imageUrl;
-  }) ? true : false;
-  return React__default.createElement("div", {
-    className: styles$q['vitro-dropdown-button'] + CTRL.SPACE + (props.className || CTRL.EMPTY)
-  }, overflowItemList.map(function (item) {
-    return React__default.createElement("div", {
-      className: styles$q['vitro-dropdown-button-item-overflow'],
-      key: item.key,
-      onClick: function onClick(e) {
-        return item.onClick(item.value, e);
-      }
-    }, item.imageUrl && React__default.createElement(Image, {
-      defaultUrl: item.imageUrl,
-      hoverUrl: item.imageHoverUrl,
-      className: styles$q['vitro-image']
-    }), React__default.createElement("span", null, item.text));
-  }), React__default.createElement(BootstrapDropdown, {
-    align: ALIGN_END,
-    onToggle: onDropdownToggle,
-    drop: DROP_DOWN,
-    show: props.isShow
-  }, React__default.createElement(BootstrapDropdown.Toggle, {
-    ref: buttonRef
-  }, props.title && React__default.createElement("span", {
-    className: styles$q['vitro-title']
-  }, props.title), props.imageUrl ? React__default.createElement(Image, {
+  var onGetMenuRef = function onGetMenuRef(e) {
+    if (props.onGetMenuRef) {
+      props.onGetMenuRef(e);
+    }
+  };
+  var className = [styles$q['vitro-dropdown'], props.className || CTRL.EMPTY].join(CTRL.SPACE);
+  var menuClassName = [styles$q['vitro-dropdown-menu'], props.menuClassName || CTRL.EMPTY, props.isRight ? styles$q['vitro-right'] : CTRL.EMPTY].join(CTRL.SPACE);
+  return React__default.createElement(reactstrap.UncontrolledDropdown, {
+    ref: dropdownRef,
+    isNav: props.isNav,
+    inNavbar: props.isInNavbar,
+    className: className,
+    direction: props.placement,
+    onMouseEnter: function onMouseEnter() {
+      return toggle();
+    },
+    onMouseLeave: function onMouseLeave() {
+      return toggle();
+    }
+  }, React__default.createElement(reactstrap.DropdownToggle, {
+    nav: false,
+    caret: false,
+    onClick: onClick,
+    innerRef: toggleRef,
+    className: styles$q['vitro-dropdown-toggle'] + (props.toggleClassName ? CTRL.SPACE + props.toggleClassName : CTRL.EMPTY)
+  }, props.button), React__default.createElement(reactstrap.DropdownMenu, {
+    innerRef: onGetMenuRef,
+    container: props.menuContainer ? props.menuContainer : 'body',
+    className: menuClassName
+  }, React__default.createElement(ScrollBar, {
+    className: styles$q['vitro-scrollbar'],
+    isHideScrollX: true
+  }, props.children)));
+});
+
+(function (PLACEMENT) {
+  PLACEMENT["TOP"] = "top";
+  PLACEMENT["BOTTOM"] = "bottom";
+  PLACEMENT["LEFT"] = "left";
+  PLACEMENT["RIGHT"] = "right";
+  PLACEMENT["AUTO"] = "auto";
+  PLACEMENT["START"] = "start";
+  PLACEMENT["END"] = "end";
+})(exports.PLACEMENT || (exports.PLACEMENT = {}));
+
+var DropdownButtonDropdownItem = function DropdownButtonDropdownItem(props) {
+  return React__default.createElement(Dropdown, {
+    className: styles$q['vitro-dropdown-button-dropdown-item'],
+    isExpandOnHover: true,
+    placement: exports.PLACEMENT.END,
+    menuClassName: styles$q['vitro-dropdown-button-dropdown-item-menu'],
+    button: React__default.createElement(DropdownButtonItem, Object.assign({}, props, {
+      isToggle: false
+    }))
+  }, props.itemList && props.itemList.length !== 0 && props.itemList.map(function (item) {
+    if (item.itemList) {
+      return React__default.createElement(DropdownButtonDropdownItem, Object.assign({}, item));
+    }
+    return React__default.createElement(DropdownButtonItem, Object.assign({
+      isToggle: props.isToggle
+    }, item));
+  }), props.children);
+};
+
+var DropdownToggleContent = function DropdownToggleContent(props) {
+  var _useState = React.useState(false),
+    isHover = _useState[0],
+    setIsHover = _useState[1];
+  var ref = React.useRef(null);
+  React.useEffect(function () {
+    updateIsRight();
+  }, [ref.current]);
+  var updateIsRight = function updateIsRight() {
+    var isRight = false;
+    if (ref.current) {
+      var windowWidth = window.innerWidth;
+      var left = ref.current.getBoundingClientRect().left;
+      if (left + 241 > windowWidth) {
+        isRight = true;
+      }
+    }
+    props.setIsRight(isRight);
+  };
+  return React__default.createElement(FlexBox, {
+    ref: ref,
+    onMouseEnter: function onMouseEnter() {
+      return setIsHover(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return setIsHover(false);
+    },
+    className: styles$q['vitro-dropdown-button-toggle-content'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    "data-show": props.isVisibleFunction
+  }, props.imageUrl && React__default.createElement(Image, {
+    isHover: isHover,
     defaultUrl: props.imageUrl,
-    hoverUrl: props.imageHoverUrl
-  }) : React__default.createElement("span", {
-    className: styles$q['vitro-dropdown-icon']
-  })), React__default.createElement(BootstrapDropdown.Menu, {
-    renderOnMount: props.isRenderOnMount,
-    flip: props.isFlip !== false,
-    style: props.menuStyle || {},
-    popperConfig: props.popperConfig || {},
-    ref: props.onGetMenuRef
-  }, React__default.createElement(ScrollBar, null, itemList.length > 0 && itemList.map(function (x) {
-    return React__default.createElement(BootstrapDropdown.Item, {
-      key: x.key,
-      onClick: function onClick(e) {
-        return x.onClick(x.value, e);
-      }
-    }, isShowImage && React__default.createElement("div", {
-      className: styles$q['vitro-image']
-    }, x.imageUrl && React__default.createElement(Image, {
-      defaultUrl: x.imageUrl,
-      hoverUrl: x.imageHoverUrl
-    })), React__default.createElement("span", null, x.text));
-  })))));
+    hoverUrl: props.imageHoverUrl,
+    className: styles$q['vitro-image']
+  }), props.text && React__default.createElement("span", null, props.text));
 };
 
-var styles$r = {"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 DropdownButton = React.forwardRef(function (props, ref) {
+  var _props$itemList;
+  var _useState = React.useState(false),
+    isShow = _useState[0],
+    setIsShow = _useState[1];
+  var _useState2 = React.useState(false),
+    isRight = _useState2[0],
+    setIsRight = _useState2[1];
+  var isShowImage = (_props$itemList = props.itemList) !== null && _props$itemList !== void 0 && _props$itemList.find(function (item) {
+    return item.imageUrl;
+  }) ? true : false;
+  var onClick = function onClick(e) {
+    var value = !isShow;
+    setIsShow(value);
+    if (props.onClick) {
+      props.onClick(e, value);
+    } else {
+      var event = new CustomEvent(exports.EVENT.COMMAND_MENU_TOGGLE, {
+        detail: {
+          isToggle: true
+        }
+      });
+      window.dispatchEvent(event);
+    }
+  };
+  return React__default.createElement(Dropdown, {
+    ref: ref,
+    onClick: onClick,
+    isRight: isRight,
+    isInNavbar: props.isInNavbar,
+    className: styles$q['vitro-dropdown-button-container'] + (props.containerClassName ? CTRL.SPACE + props.containerClassName : CTRL.EMPTY),
+    toggleClassName: props.className,
+    menuClassName: props.menuClassName,
+    menuContainer: props.menuContainer,
+    onGetMenuRef: props.onGetMenuRef,
+    placement: props.placement,
+    button: React__default.createElement(DropdownToggleContent, Object.assign({}, props, {
+      className: undefined,
+      setIsRight: setIsRight
+    }))
+  }, props.itemList && props.itemList.length !== 0 && props.itemList.map(function (item) {
+    if (item.itemList) {
+      return React__default.createElement(DropdownButtonDropdownItem, Object.assign({}, item));
+    }
+    return React__default.createElement(DropdownButtonItem, Object.assign({
+      isToggle: props.isToggle
+    }, item, {
+      isShowImage: isShowImage
+    }));
+  }), props.children);
+});
+
+var STYLE$1;
+(function (STYLE) {
+  STYLE["ADDON"] = "vitro-addon-button";
+  STYLE["CONTEXT"] = "vitro-context-button";
+})(STYLE$1 || (STYLE$1 = {}));
+
+var DropdownButtonConstants = {
+    __proto__: null,
+    get STYLE () { return STYLE$1; }
+};
 
 var OverflowButton = function OverflowButton(props) {
   if (!props.list || !props.list.length) return null;
   return React__default.createElement(DropdownButton, {
-    className: styles$r['vitro-dropdown-button'],
+    className: STYLE$1.CONTEXT,
     itemList: props.list.map(function (x, i) {
       return _extends({}, x, {
         value: x.index,
@@ -62169,13 +61358,12 @@ var OverflowButton = function OverflowButton(props) {
           return props.onSelect(x.index);
         }
       });
-    }),
-    menuStyle: {
-      maxWidth: props.width - 32 + UNIT.PX
-    }
+    })
   });
 };
 
+var styles$r = {"vitro-tab":"_tab-group_vitro-tab_1Qb50HL","vitro-item":"_tab-group_vitro-item_2YnBcmb","active":"_tab-group_active_3M-IIR2"};
+
 var Tab = function Tab(props) {
   if (!props.icon && !props.title) {
     return null;
@@ -62347,10 +61535,10 @@ var tabScriptList = [{
   id: 'vitro-script-perfect-scroll'
 }];
 
-var w$5 = window;
+var w$4 = window;
 var TabGroup = React.forwardRef(function (props, ref) {
   var scriptList = [];
-  if (!w$5.addResizeListener) {
+  if (!w$4.addResizeListener) {
     scriptList = tabScriptList;
   }
   return props.wrap ? React__default.createElement(ScriptLoader, {
@@ -62855,7 +62043,8 @@ var IssueTileHeader = function IssueTileHeader(props) {
     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$z['vitro-dropdown-button']
+    containerClassName: styles$z['vitro-dropdown-button'],
+    className: STYLE$1.CONTEXT
   }) : null);
 };
 
@@ -62872,6 +62061,7 @@ var ExpandControlGroup = function ExpandControlGroup(props) {
     isExpanded = _useState[0],
     setIsExpanded = _useState[1];
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
+  var contentRef = React.useRef(null);
   React.useEffect(function () {
     setIsExpanded(props.isExpanded || false);
   }, [props.isExpanded]);
@@ -62887,12 +62077,13 @@ var ExpandControlGroup = function ExpandControlGroup(props) {
   }, React__default.createElement(ExpandCollapseButton, {
     expandImage: props.expandImage,
     collapseImage: props.collapseImage,
-    expandText: props.expandText || localeService.create(LOCALE$3.EXPAND_TEXT),
-    collapseText: props.collapseText || localeService.create(LOCALE$3.COLLAPSE_TEXT),
+    expandText: props.expandText !== undefined ? props.expandText : localeService.create(LOCALE$3.EXPAND_TEXT),
+    collapseText: props.collapseText !== undefined ? props.collapseText : localeService.create(LOCALE$3.COLLAPSE_TEXT),
     onClick: onClick,
     isExpanded: isExpanded,
     className: props.buttonClassName
-  }), React__default.createElement("div", {
+  }, props.buttonContent), React__default.createElement("div", {
+    ref: contentRef,
     className: 'vitro-content' + (isExpanded ? CTRL.EMPTY : CTRL.SPACE + styles$A['vitro-display-none'])
   }, props.children));
 };
@@ -63164,7 +62355,7 @@ var LOCALE$4;
 var styles$D = {"vitro-search-input":"_search-input_vitro-search-input_3M9i4Gi","vitro-search-value-list":"_search-input_vitro-search-value-list_1Gqj4bm","vitro-button-cancel":"_search-input_vitro-button-cancel_xqdMNLo","vitro-search-value":"_search-input_vitro-search-value_TJm1BCf","vitro-search-input-mobile":"_search-input_vitro-search-input-mobile_1H1USnO"};
 
 var NEW_LINE = '\n';
-var SearchInput = function SearchInput(props) {
+var SearchInput = React.forwardRef(function (props, ref) {
   var _props$searchCriterio2;
   var _useState = React.useState(CTRL.EMPTY),
     value = _useState[0],
@@ -63174,6 +62365,9 @@ var SearchInput = function SearchInput(props) {
     setState = _useState2[1];
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
   var inputRef = React.useRef(null);
+  React.useImperativeHandle(ref, function () {
+    return inputRef.current;
+  });
   React.useEffect(function () {
     var _props$searchCriterio;
     if (!((_props$searchCriterio = props.searchCriterionList) !== null && _props$searchCriterio !== void 0 && _props$searchCriterio.length)) {
@@ -63187,6 +62381,7 @@ var SearchInput = function SearchInput(props) {
     }
   };
   var onSubmit = function onSubmit() {
+    onBlur();
     if (value && props.onSubmit) {
       props.onSubmit(value);
       resetValue();
@@ -63306,17 +62501,7 @@ var SearchInput = function SearchInput(props) {
     onClick: onCancel,
     className: styles$D['vitro-button-cancel']
   }) : null));
-};
-
-(function (PLACEMENT) {
-  PLACEMENT["TOP"] = "top";
-  PLACEMENT["BOTTOM"] = "bottom";
-  PLACEMENT["LEFT"] = "left";
-  PLACEMENT["RIGHT"] = "right";
-  PLACEMENT["AUTO"] = "auto";
-  PLACEMENT["START"] = "start";
-  PLACEMENT["END"] = "end";
-})(exports.PLACEMENT || (exports.PLACEMENT = {}));
+});
 
 var MODIFIER;
 (function (MODIFIER) {
@@ -67345,6 +66530,7 @@ var Search = function Search(props) {
   var _useState6 = React.useState([]),
     sendedSearchCriterionList = _useState6[0],
     setSendedSearchCriterionList = _useState6[1];
+  var searchInputRef = React.useRef(null);
   var searchRef = React.useRef(null);
   var eventService = inversifyReact.useInjection(SERVICE.EVENT);
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
@@ -67453,10 +66639,19 @@ var Search = function Search(props) {
     }
   };
   var onSearch = function onSearch(value, criterionList) {
-    var list = criterionList ? criterionList : searchCriterionList;
+    var _searchInputRef$curre;
+    var inputList;
+    if ((_searchInputRef$curre = searchInputRef.current) !== null && _searchInputRef$curre !== void 0 && _searchInputRef$curre.value) {
+      var _searchInputRef$curre2;
+      inputList = getInputCriterionList((_searchInputRef$curre2 = searchInputRef.current) === null || _searchInputRef$curre2 === void 0 ? void 0 : _searchInputRef$curre2.value);
+      setSearchCriterionList(inputList);
+    }
+    var list = criterionList ? criterionList : inputList ? inputList : searchCriterionList;
     doSearch(getSearchCriterionListWithoutKey(list));
     setSelectedSearchCriterionList(getSelectedCriterionList(list));
-    closeSettings();
+    if (isShowDialog) {
+      closeSettings();
+    }
   };
   var getSearchCriterionListWithoutKey = function getSearchCriterionListWithoutKey(criterionList) {
     var list = [];
@@ -67494,7 +66689,7 @@ var Search = function Search(props) {
       destination: props.destination
     });
   };
-  var onInputChange = function onInputChange(value) {
+  var getInputCriterionList = function getInputCriterionList(value) {
     var _defaultSearchField$;
     var defaultSearchField = visibleFieldList === null || visibleFieldList === void 0 ? void 0 : visibleFieldList.filter(function (field) {
       return field.internalName === defaultSearchFieldName;
@@ -67507,7 +66702,7 @@ var Search = function Search(props) {
       valueList: [value],
       key: key
     };
-    setSearchCriterionList([criterion]);
+    return [criterion];
   };
   var onEscClick = function onEscClick(e) {
     if (e.keyCode === KEY_CODE.ESC) {
@@ -67519,6 +66714,9 @@ var Search = function Search(props) {
   };
   var onRemoveValue = function onRemoveValue(valueList) {
     setSearchCriterionList(valueList);
+    if (!valueList.length) {
+      setState(CTRL.EMPTY);
+    }
     onSearch(CTRL.EMPTY, valueList);
   };
   var onCancel = function onCancel() {
@@ -67553,12 +66751,12 @@ var Search = function Search(props) {
     onSubmit: onSearch,
     onSearchClick: props.isMobileView || props.isMinifiedInput ? onSettingsClick : undefined,
     onRemoveValue: onRemoveValue,
-    onChange: onInputChange,
     placeholder: inputPlaceholder,
     onFocus: onFocusInput,
     isActive: state || isShowDialog ? true : false,
     isMobileView: props.isMobileView ? true : props.isMinifiedInput,
-    className: styles$W['vitro-control']
+    className: styles$W['vitro-control'],
+    ref: searchInputRef
   }, (state || isShowDialog) && React__default.createElement(ImageButton, {
     onClick: onSettingsClick,
     className: styles$W['vitro-button-settings'] + (isShowDialog ? CTRL.SPACE + styles$W[CSS_CLASS_ACTIVE$1] : CTRL.EMPTY)
@@ -67586,7 +66784,7 @@ var CSS_CLASS_SEARCH = 'vitro-search-wrap';
 var CSS_CLASS_ISSUE_LIST = 'vitro-issue-list-wrap';
 var EVENT_SEARCH_ISSUE_LIST = 'vitro.search.issue.list';
 var ISSUE_ID_PREFIX = 'vitro-issue-tile-';
-var w$6 = window;
+var w$5 = window;
 var ViewerIssueList = function ViewerIssueList(props) {
   var _useState = React.useState([]),
     issueList = _useState[0],
@@ -67602,7 +66800,7 @@ var ViewerIssueList = function ViewerIssueList(props) {
     window.addEventListener(exports.EVENT.ISSUE_LIST_REFRESH, onRefresh);
     window.addEventListener(exports.EVENT.ISSUE_LIST_SELECT_ITEM, onSelectItemMarkup);
     var criterionList = props.searchCriterionList ? getPredefinedSearchCriterionList(props.searchCriterionList) : [];
-    w$6.searchCriterionList = criterionList;
+    w$5.searchCriterionList = criterionList;
     props.getIssueList(criterionList).then(function (list) {
       setIssueList(list);
     });
@@ -67652,7 +66850,7 @@ var ViewerIssueList = function ViewerIssueList(props) {
     var _e$detail;
     var searchCriterionList = e === null || e === void 0 ? void 0 : (_e$detail = e.detail) === null || _e$detail === void 0 ? void 0 : _e$detail.searchCriterionList;
     setSearchCriterionList(searchCriterionList);
-    w$6.searchCriterionList = searchCriterionList;
+    w$5.searchCriterionList = searchCriterionList;
     props.getIssueList(searchCriterionList).then(function (list) {
       setIssueList(list);
       var event = new CustomEvent(EVENT_SEARCH_ISSUE_LIST, {
@@ -67702,7 +66900,7 @@ var ViewerIssueList = function ViewerIssueList(props) {
   }))));
 };
 
-var w$7 = window;
+var w$6 = window;
 var CSS_CLASS_SIDEBAR_CONTENT = 'body__sidebar-content';
 var ID_VIEWER_CONTAINER = 'viewerContainer';
 var ID_FILE_VERSION_SELECT = 'fileVersionSelect';
@@ -67715,12 +66913,12 @@ var Viewer = function Viewer(props) {
   }, [props.context.file]);
   var init = function init() {
     var initViewer = function initViewer() {
-      if (w$7.initPdfViewer) {
+      if (w$6.initPdfViewer) {
         initSearchCriterionList();
         var context = _extends({}, props.context, {
           initIssueList: initIssueList
         });
-        w$7.initPdfViewer(context);
+        w$6.initPdfViewer(context);
         initFileVersionSelect();
       } else {
         setTimeout(initViewer, 100);
@@ -67746,7 +66944,7 @@ var Viewer = function Viewer(props) {
   };
   var initSearchCriterionList = function initSearchCriterionList() {
     if (props.context.searchCriterionList) {
-      w$7.searchCriterionList = getPredefinedSearchCriterionList(props.context.searchCriterionList);
+      w$6.searchCriterionList = getPredefinedSearchCriterionList(props.context.searchCriterionList);
     }
   };
   var getPredefinedSearchCriterionList = function getPredefinedSearchCriterionList(searchCriterionList) {
@@ -67770,10 +66968,10 @@ var Viewer = function Viewer(props) {
   var onIssueTileClick = function onIssueTileClick(issue) {
     var id = issue.id;
     var markup = JSON.parse(issue.markup);
-    var numPages = w$7.PDFViewerApplication.pagesCount;
+    var numPages = w$6.PDFViewerApplication.pagesCount;
     if (markup && markup.pageNr <= numPages && markup.pageNr >= 1) {
-      if (markup.pageNr != w$7.PDFViewerApplication.pdfViewer.currentPageNumber) {
-        w$7.PDFViewerApplication.page = markup.pageNr;
+      if (markup.pageNr != w$6.PDFViewerApplication.pdfViewer.currentPageNumber) {
+        w$6.PDFViewerApplication.page = markup.pageNr;
       }
       if ($(CTRL.SHARP + id).length) {
         scrollToMarkup(id);
@@ -67812,7 +67010,7 @@ var Viewer = function Viewer(props) {
 };
 
 var name = "@vitrosoftware/common-ui-ts";
-var version$1 = "1.1.210";
+var version$1 = "1.1.211";
 var description = "vitro software common ui ts";
 var author = "";
 var license = "MIT";
@@ -68464,13 +67662,14 @@ var LoginKerberosForm = React.forwardRef(function (props, ref) {
 
 var styles$18 = {"vitro-command-menu":"_command-menu_vitro-command-menu_l82vtIh"};
 
-var CommandMenu = function CommandMenu(props) {
+var CommandMenu = React.forwardRef(function (props, ref) {
   return React__default.createElement("nav", {
+    ref: ref,
     className: styles$18['vitro-command-menu'] + CTRL.SPACE + 'navbar'
   }, React__default.createElement("ul", {
     className: 'nav'
   }, props.children));
-};
+});
 
 var styles$19 = {"vitro-command-menu-button":"_command-menu-button_vitro-command-menu-button_2IiXVbP","vitro-image":"_command-menu-button_vitro-image_27yILgG"};
 
@@ -68492,135 +67691,14 @@ var CommandMenuLookupPicker = function CommandMenuLookupPicker(props) {
   })));
 };
 
-var styles$1b = {"vitro-dropdown-button-container":"_command-menu-dropdown-button_vitro-dropdown-button-container_29qd-_O","vitro-command-menu-dropdown-button":"_command-menu-dropdown-button_vitro-command-menu-dropdown-button_2ImIuc3","vitro-right":"_command-menu-dropdown-button_vitro-right_uTzkzdJ","vitro-image":"_command-menu-dropdown-button_vitro-image_2VNGo-H","vitro-button-collapse-bottom":"_command-menu-dropdown-button_vitro-button-collapse-bottom_1OS_X_a","vitro-scrollbar":"_command-menu-dropdown-button_vitro-scrollbar_1J6dT6q"};
-
-var CommandMenuSubItem = function CommandMenuSubItem(props) {
-  var onClick = function onClick(e) {
-    if (props.onClick) {
-      props.onClick(e);
-    } else if (props.href) {
-      var event = new CustomEvent(exports.EVENT.HISTORY_UPDATE, {
-        detail: {
-          pathname: props.href
-        }
-      });
-      window.dispatchEvent(event);
-    }
-  };
-  return React__default.createElement(reactstrap.DropdownItem, {
-    onClick: onClick,
-    toggle: props.toggle === false ? false : true
-  }, props.isShowImage && React__default.createElement("div", {
-    className: styles$1b['vitro-image']
-  }, props.imageUrl && React__default.createElement(Image, {
-    defaultUrl: props.imageUrl,
-    hoverUrl: props.imageHoverUrl
-  })), React__default.createElement("span", null, props.text));
-};
-
-var CommandMenuItemHeader = function CommandMenuItemHeader(props) {
-  var _useState = React.useState(false),
-    isHover = _useState[0],
-    setIsHover = _useState[1];
-  var ref = React.useRef(null);
-  React.useEffect(function () {
-    updateIsRight();
-  }, [ref.current]);
-  var updateIsRight = function updateIsRight() {
-    var isRight = false;
-    if (ref.current) {
-      var windowWidth = window.innerWidth;
-      var left = ref.current.getBoundingClientRect().left;
-      if (left + 241 > windowWidth) {
-        isRight = true;
-      }
-    }
-    props.setIsRight(isRight);
-  };
-  return React__default.createElement("div", {
-    ref: ref,
-    onMouseEnter: function onMouseEnter() {
-      return setIsHover(true);
-    },
-    onMouseLeave: function onMouseLeave() {
-      return setIsHover(false);
-    },
-    className: itemStyles['vitro-item'] + CTRL.SPACE + styles$1b['vitro-command-menu-dropdown-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
-    "data-show": props.isVisibleFunction
-  }, props.imageUrl && React__default.createElement(Image, {
-    isHover: isHover,
-    defaultUrl: props.imageUrl,
-    hoverUrl: props.imageHoverUrl,
-    className: styles$1b['vitro-image']
-  }), React__default.createElement("span", null, props.text), !props.isHideChevronDown && React__default.createElement("div", {
-    className: styles$1b['vitro-button-collapse-bottom']
-  }));
-};
-
 var CommandMenuDropdownButton = function CommandMenuDropdownButton(props) {
-  var _props$itemList;
-  var _useState = React.useState(false),
-    isRight = _useState[0],
-    setIsRight = _useState[1];
-  var isShowImage = (_props$itemList = props.itemList) !== null && _props$itemList !== void 0 && _props$itemList.find(function (item) {
-    return item.imageUrl;
-  }) ? true : false;
-  var contentRef = React.useRef(null);
-  React.useEffect(function () {
-    var observer = new IntersectionObserver(function (_ref) {
-      var entry = _ref[0];
-      if (contentRef.current && contentRef.current.parentElement && entry.isIntersecting) {
-        contentRef.current.parentElement.scrollTop = 1;
-        contentRef.current.parentElement.scrollTop = 0;
-      }
-    });
-    if (contentRef.current) {
-      observer.observe(contentRef.current);
-    }
-    return function () {
-      observer.disconnect();
-    };
-  }, [contentRef]);
-  var onClick = function onClick(e) {
-    if (props.onClick) {
-      props.onClick(e);
-    } else {
-      var event = new CustomEvent(exports.EVENT.COMMAND_MENU_TOGGLE, {
-        detail: {
-          isToggle: true
-        }
-      });
-      window.dispatchEvent(event);
-    }
-  };
-  return React__default.createElement(reactstrap.UncontrolledDropdown, {
-    nav: true,
-    inNavbar: true,
-    className: styles$1b['vitro-dropdown-button-container'] + (isRight ? CTRL.SPACE + styles$1b['vitro-right'] : CTRL.EMPTY)
-  }, React__default.createElement(reactstrap.DropdownToggle, {
-    nav: true,
-    caret: true,
-    onClick: onClick
-  }, React__default.createElement(CommandMenuItemHeader, Object.assign({}, props, {
-    className: props.className,
-    setIsRight: setIsRight
-  }))), React__default.createElement(reactstrap.DropdownMenu, {
-    container: 'body'
-  }, React__default.createElement(ScrollBar, {
-    className: styles$1b['vitro-scrollbar'],
-    isHideScrollX: true,
-    contentRef: contentRef
-  }, props.itemList && props.itemList.map(function (i) {
-    return React__default.createElement(CommandMenuSubItem, Object.assign({
-      toggle: props.toggle,
-      key: i.text
-    }, i, {
-      isShowImage: isShowImage
-    }));
-  }), props.children)));
+  return React__default.createElement("li", null, React__default.createElement(DropdownButton, Object.assign({}, props, {
+    isInNavbar: true,
+    isNav: true
+  }), props.children));
 };
 
-var styles$1c = {"vitro-item":"_sidebar-item_vitro-item_1BR_7F0","vitro-image":"_sidebar-item_vitro-image_2A82YI0","vitro-item-text":"_sidebar-item_vitro-item-text_1kK_aIZ","vitro-active":"_sidebar-item_vitro-active_7p5iOhY","vitro-hover":"_sidebar-item_vitro-hover_1mECzme","vitro-group-item":"_sidebar-item_vitro-group-item_ZADCctV","vitro-item-list":"_sidebar-item_vitro-item-list_17dWov1","vitro-arrow":"_sidebar-item_vitro-arrow_NaAiOHu","vitro-expanded":"_sidebar-item_vitro-expanded_3qb1vOx","vitro-collapsed":"_sidebar-item_vitro-collapsed_2EhVmXL","vitro-display-none":"_sidebar-item_vitro-display-none_2WwKi5v","vitro-scrollbar":"_sidebar-item_vitro-scrollbar___xylIx","vitro-button-close":"_sidebar-item_vitro-button-close_2Kdf-ob","vitro-sidebar-group-slideup-panel":"_sidebar-item_vitro-sidebar-group-slideup-panel_15tkxuO"};
+var styles$1b = {"vitro-item":"_sidebar-item_vitro-item_1BR_7F0","vitro-image":"_sidebar-item_vitro-image_2A82YI0","vitro-item-text":"_sidebar-item_vitro-item-text_1kK_aIZ","vitro-active":"_sidebar-item_vitro-active_7p5iOhY","vitro-hover":"_sidebar-item_vitro-hover_1mECzme","vitro-group-item":"_sidebar-item_vitro-group-item_ZADCctV","vitro-item-list":"_sidebar-item_vitro-item-list_17dWov1","vitro-arrow":"_sidebar-item_vitro-arrow_NaAiOHu","vitro-expanded":"_sidebar-item_vitro-expanded_3qb1vOx","vitro-collapsed":"_sidebar-item_vitro-collapsed_2EhVmXL","vitro-display-none":"_sidebar-item_vitro-display-none_2WwKi5v","vitro-scrollbar":"_sidebar-item_vitro-scrollbar___xylIx","vitro-button-close":"_sidebar-item_vitro-button-close_2Kdf-ob","vitro-sidebar-group-slideup-panel":"_sidebar-item_vitro-sidebar-group-slideup-panel_15tkxuO"};
 
 var Item$2 = function Item(props) {
   var _useState = React.useState(false),
@@ -68657,10 +67735,10 @@ var Item$2 = function Item(props) {
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
     isHover: props.isHover,
-    className: styles$1c['vitro-image']
+    className: styles$1b['vitro-image']
   })), React__default.createElement("span", {
     ref: textRef,
-    className: styles$1c['vitro-item-text'] + (!(props.isSidebarExpanded || props.isMobileView) ? CTRL.SPACE + styles$1c['vitro-display-none'] : CTRL.EMPTY)
+    className: styles$1b['vitro-item-text'] + (!(props.isSidebarExpanded || props.isMobileView) ? CTRL.SPACE + styles$1b['vitro-display-none'] : CTRL.EMPTY)
   }, props.text)));
 };
 
@@ -68688,7 +67766,7 @@ var LinkItem$1 = function LinkItem(props) {
     isHover = _useState[0],
     setIsHover = _useState[1];
   var isActive = !!props.link && (props.link === props.currentUrl && (!props.activeItem || props.activeItem === props.id) || props.altUrlList && props.altUrlList.includes(props.currentUrl));
-  var className = isActive ? styles$1c['vitro-active'] : isHover ? styles$1c['vitro-hover'] : CTRL.EMPTY;
+  var className = isActive ? styles$1b['vitro-active'] : isHover ? styles$1b['vitro-hover'] : CTRL.EMPTY;
   var onClick = function onClick(e) {
     if (!props.isDisabled) {
       if (props.onClick) {
@@ -68713,7 +67791,7 @@ var LinkItem$1 = function LinkItem(props) {
     style: {
       width: props.linkItemWidth ? props.linkItemWidth + UNIT.PX : WIDTH_AUTO
     },
-    className: styles$1c['vitro-item']
+    className: styles$1b['vitro-item']
   }, (props.link || props.onClick) && React__default.createElement("button", {
     onMouseEnter: function onMouseEnter() {
       return setIsHover(true);
@@ -68753,7 +67831,7 @@ var LinkItem$1 = function LinkItem(props) {
   }))));
 };
 
-var styles$1d = {"vitro-slide-up-panel":"_slide-up-panel_vitro-slide-up-panel_2EOSLHK","vitro-content":"_slide-up-panel_vitro-content_1er6bcv","vitro-expanded":"_slide-up-panel_vitro-expanded_2f2dYt6","vitro-button-close":"_slide-up-panel_vitro-button-close_2iM7SFL"};
+var styles$1c = {"vitro-slide-up-panel":"_slide-up-panel_vitro-slide-up-panel_2EOSLHK","vitro-content":"_slide-up-panel_vitro-content_1er6bcv","vitro-expanded":"_slide-up-panel_vitro-expanded_2f2dYt6","vitro-button-close":"_slide-up-panel_vitro-button-close_2iM7SFL"};
 
 var SlideUpPanel = function SlideUpPanel(props) {
   var _useState = React.useState(props.isShow),
@@ -68829,13 +67907,13 @@ var SlideUpPanel = function SlideUpPanel(props) {
     target: props.container,
     placement: exports.PLACEMENT.TOP
   }, React__default.createElement("div", {
-    className: styles$1d['vitro-slide-up-panel'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$1c['vitro-slide-up-panel'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }, React__default.createElement("div", {
-    className: styles$1d['vitro-content'] + (isExpanded ? CTRL.SPACE + styles$1d['vitro-expanded'] : CTRL.EMPTY),
+    className: styles$1c['vitro-content'] + (isExpanded ? CTRL.SPACE + styles$1c['vitro-expanded'] : CTRL.EMPTY),
     ref: contentRef
   }, React__default.createElement("button", {
     ref: buttonRef,
-    className: styles$1d['vitro-button-close'],
+    className: styles$1c['vitro-button-close'],
     onTouchStart: onTouchStart,
     onTouchEnd: onTouchEnd,
     onTouchMove: onTouchMove,
@@ -68925,7 +68003,7 @@ var GroupItem = function GroupItem(props) {
       setIsHover(focus);
     }
   };
-  var className = isActive ? styles$1c['vitro-active'] : isHover ? styles$1c['vitro-hover'] : CTRL.EMPTY;
+  var className = isActive ? styles$1b['vitro-active'] : isHover ? styles$1b['vitro-hover'] : CTRL.EMPTY;
   var content = React__default.createElement(React__default.Fragment, null, props.itemList && props.itemList.map(function (i) {
     return i.link || i.onClick ? React__default.createElement(LinkItem$1, Object.assign({
       link: i.link,
@@ -68960,7 +68038,7 @@ var GroupItem = function GroupItem(props) {
     style: {
       width: props.linkItemWidth ? props.linkItemWidth + UNIT.PX : WIDTH_AUTO$1
     },
-    className: styles$1c['vitro-item'] + CTRL.SPACE + styles$1c['vitro-group-item']
+    className: styles$1b['vitro-item'] + CTRL.SPACE + styles$1b['vitro-group-item']
   }, React__default.createElement("button", {
     onMouseEnter: function onMouseEnter() {
       return _onFocus(true);
@@ -68979,18 +68057,18 @@ var GroupItem = function GroupItem(props) {
   }, React__default.createElement(Item$2, Object.assign({}, props, {
     isHover: isHover || isActive
   })), props.isSidebarExpanded && !props.isMobileView && React__default.createElement("span", {
-    className: isExpanded ? styles$1c['vitro-expanded'] : styles$1c['vitro-collapsed']
+    className: isExpanded ? styles$1b['vitro-expanded'] : styles$1b['vitro-collapsed']
   })), props.isMobileView ? React__default.createElement(SlideUpPanel, {
     isShow: isExpanded,
     container: props.container,
     onClose: onCloseSlideUpPanel,
-    className: styles$1c[CSS_CLASS_SLIDE_UP_PANEL]
+    className: styles$1b[CSS_CLASS_SLIDE_UP_PANEL]
   }, React__default.createElement(ScrollBar, {
-    className: styles$1c['vitro-scrollbar']
+    className: styles$1b['vitro-scrollbar']
   }, React__default.createElement("ul", {
-    className: styles$1c[CSS_CLASS_ITEM_LIST_MOBILE]
+    className: styles$1b[CSS_CLASS_ITEM_LIST_MOBILE]
   }, content))) : React__default.createElement("ul", {
-    className: styles$1c['vitro-item-list'] + CTRL.SPACE + (props.isSidebarExpanded ? !isExpanded ? styles$1c['vitro-display-none'] : CTRL.EMPTY : styles$1c['vitro-display-none'])
+    className: styles$1b['vitro-item-list'] + CTRL.SPACE + (props.isSidebarExpanded ? !isExpanded ? styles$1b['vitro-display-none'] : CTRL.EMPTY : styles$1b['vitro-display-none'])
   }, content)));
 };
 
@@ -69029,7 +68107,7 @@ var CustomItem = function CustomItem(props) {
     style: {
       width: props.linkItemWidth ? props.linkItemWidth + UNIT.PX : WIDTH_AUTO$2
     },
-    className: styles$1c['vitro-item']
+    className: styles$1b['vitro-item']
   }, React__default.createElement("button", {
     onMouseEnter: function onMouseEnter() {
       return setIsHover(true);
@@ -69045,11 +68123,11 @@ var CustomItem = function CustomItem(props) {
     },
     onClick: onClick,
     onMouseDown: onMouseDown,
-    className: isActive ? styles$1c['vitro-active'] : isHover ? styles$1c['vitro-hover'] : CTRL.EMPTY
+    className: isActive ? styles$1b['vitro-active'] : isHover ? styles$1b['vitro-hover'] : CTRL.EMPTY
   }, React__default.createElement(Item$2, Object.assign({}, props, {
     isHover: isHover || isActive
   })), props.isSidebarExpanded && !props.isMobileView && React__default.createElement("span", {
-    className: styles$1c['vitro-arrow']
+    className: styles$1b['vitro-arrow']
   })));
 };
 
@@ -69095,7 +68173,7 @@ var Section = function Section(props) {
   })) : React__default.createElement(React__default.Fragment, null));
 };
 
-var styles$1e = {"vitro-sidebar":"_sidebar_vitro-sidebar_1IxGYiU","vitro-scrollbar":"_sidebar_vitro-scrollbar_2PtQGQD","vitro-sidebar-section-list":"_sidebar_vitro-sidebar-section-list_1nGto5m","vitro-scroll-container":"_sidebar_vitro-scroll-container_3K-iJy8","vitro-button-more":"_sidebar_vitro-button-more_3s9oZY9","vitro-logo-container":"_sidebar_vitro-logo-container_31O5Ly-","vitro-logo":"_sidebar_vitro-logo_1qxi8L_","vitro-scroll-content":"_sidebar_vitro-scroll-content_2RUBhZd"};
+var styles$1d = {"vitro-sidebar":"_sidebar_vitro-sidebar_1IxGYiU","vitro-scrollbar":"_sidebar_vitro-scrollbar_2PtQGQD","vitro-sidebar-section-list":"_sidebar_vitro-sidebar-section-list_1nGto5m","vitro-scroll-container":"_sidebar_vitro-scroll-container_3K-iJy8","vitro-button-more":"_sidebar_vitro-button-more_3s9oZY9","vitro-logo-container":"_sidebar_vitro-logo-container_31O5Ly-","vitro-logo":"_sidebar_vitro-logo_1qxi8L_","vitro-scroll-content":"_sidebar_vitro-scroll-content_2RUBhZd"};
 
 var SectionList = React.forwardRef(function (props, ref) {
   if (!props.itemList || props.itemList.length === 0) {
@@ -69103,7 +68181,7 @@ var SectionList = React.forwardRef(function (props, ref) {
   }
   return React__default.createElement("ul", {
     ref: ref,
-    className: styles$1e['vitro-sidebar-section-list']
+    className: styles$1d['vitro-sidebar-section-list']
   }, props.itemList.map(function (section) {
     return React__default.createElement(Section, Object.assign({
       isExpanded: props.isExpanded,
@@ -69199,12 +68277,12 @@ var Sidebar = function Sidebar(props) {
     var width = containerWidth / count;
     setLinkItemWidth(width);
   };
-  var className = styles$1e['vitro-sidebar'] + (props.theme ? CTRL.SPACE + props.theme : CTRL.EMPTY) + CTRL.SPACE + (isMobileView ? 'vitro-bottom-menu' : CTRL.EMPTY);
+  var className = styles$1d['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'
   }, !isMobileView ? React__default.createElement(React__default.Fragment, null, React__default.createElement(ScrollBar, {
-    className: styles$1e['vitro-scrollbar']
+    className: styles$1d['vitro-scrollbar']
   }, React__default.createElement(SectionList, {
     itemList: itemList,
     currentUrl: currentUrl,
@@ -69222,18 +68300,18 @@ var Sidebar = function Sidebar(props) {
     isMobileView: isMobileView,
     isDisabled: props.isDisabled
   })), React__default.createElement("div", {
-    className: styles$1e['vitro-logo-container']
+    className: styles$1d['vitro-logo-container']
   }, React__default.createElement(Item$2, {
     text: props.logoText,
     imageUrl: props.logo,
     isSidebarExpanded: !props.sidebar,
     isMobileView: isMobileView,
-    className: styles$1e['vitro-logo']
+    className: styles$1d['vitro-logo']
   }))) : React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
-    className: styles$1e['vitro-scroll-container'],
+    className: styles$1d['vitro-scroll-container'],
     ref: menuRef
   }, React__default.createElement("div", {
-    className: styles$1e['vitro-scroll-content'],
+    className: styles$1d['vitro-scroll-content'],
     ref: scrollContentRef
   }, React__default.createElement(SectionList, {
     container: menuRef.current,
@@ -69252,36 +68330,35 @@ var Sidebar = function Sidebar(props) {
     width: linkItemWidth,
     isSidebarExpanded: !props.sidebar,
     isMobileView: isMobileView,
-    className: styles$1e['vitro-logo']
+    className: styles$1d['vitro-logo']
   }))), React__default.createElement("button", {
     onClick: scroll,
-    className: styles$1e['vitro-button-more']
+    className: styles$1d['vitro-button-more']
   })));
 };
 
-var styles$1f = {"vitro-item":"_activity-item_vitro-item_3Tprske","vitro-active":"_activity-item_vitro-active_2kENgvf","vitro-title":"_activity-item_vitro-title__QItISm","vitro-due-date":"_activity-item_vitro-due-date_1mBIraY","vitro-content":"_activity-item_vitro-content_3Lt7XRy","vitro-message":"_activity-item_vitro-message_1ndqhgR","vitro-flex":"_activity-item_vitro-flex_37IxBWe","vitro-dropdown-button":"_activity-item_vitro-dropdown-button_1J50ja7","vitro-avatar":"_activity-item_vitro-avatar_218ZqAk"};
+var styles$1e = {"vitro-item":"_activity-item_vitro-item_3Tprske","vitro-active":"_activity-item_vitro-active_2kENgvf","vitro-title":"_activity-item_vitro-title__QItISm","vitro-due-date":"_activity-item_vitro-due-date_1mBIraY","vitro-content":"_activity-item_vitro-content_3Lt7XRy","vitro-message":"_activity-item_vitro-message_1ndqhgR","vitro-flex":"_activity-item_vitro-flex_37IxBWe","vitro-dropdown-button":"_activity-item_vitro-dropdown-button_1J50ja7","vitro-avatar":"_activity-item_vitro-avatar_218ZqAk"};
 
 var ActivityItem = function ActivityItem(props) {
   return React__default.createElement("div", {
-    className: styles$1f['vitro-item'] + (props.isActive ? CTRL.SPACE + styles$1f['vitro-active'] : CTRL.EMPTY)
+    className: styles$1e['vitro-item'] + (props.isActive ? CTRL.SPACE + styles$1e['vitro-active'] : CTRL.EMPTY)
   }, React__default.createElement("div", {
-    className: styles$1f['vitro-flex']
+    className: styles$1e['vitro-flex']
   }, React__default.createElement(Avatar, {
     userName: props.userName,
     image: props.userImageUrl,
-    className: styles$1f['vitro-avatar']
+    className: styles$1e['vitro-avatar']
   }), React__default.createElement("div", {
-    className: styles$1f['vitro-content']
+    className: styles$1e['vitro-content']
   }, React__default.createElement("div", null, React__default.createElement("div", {
-    className: styles$1f['vitro-title']
+    className: styles$1e['vitro-title']
   }, React__default.createElement("span", null, props.title || props.userName), props.isShowDetail && React__default.createElement("span", {
-    className: styles$1f['vitro-due-date']
+    className: styles$1e['vitro-due-date']
   }, props.date), props.isShowDetail && props.dropdownItemList && props.dropdownItemList.length > 0 && React__default.createElement(DropdownButton, {
     itemList: props.dropdownItemList,
-    onToggle: props.onDropdownToggle,
-    className: styles$1f['vitro-dropdown-button']
+    className: styles$1e['vitro-dropdown-button']
   })), React__default.createElement("div", {
-    className: styles$1f['vitro-message'] + (props.variant ? CTRL.SPACE + props.variant : CTRL.EMPTY)
+    className: styles$1e['vitro-message'] + (props.variant ? CTRL.SPACE + props.variant : CTRL.EMPTY)
   }, React__default.createElement("p", {
     dangerouslySetInnerHTML: {
       __html: props.message
@@ -69289,42 +68366,42 @@ var ActivityItem = function ActivityItem(props) {
   }), props.children)))));
 };
 
-var styles$1g = {"vitro-task-user-list":"_task-user-list_vitro-task-user-list_3GBJVjt"};
+var styles$1f = {"vitro-task-user-list":"_task-user-list_vitro-task-user-list_3GBJVjt"};
 
 var TaskUserList = function TaskUserList(props) {
   return React__default.createElement("div", {
-    className: styles$1g['vitro-task-user-list']
+    className: styles$1f['vitro-task-user-list']
   }, props.itemList && props.itemList.map(function (x) {
     return React__default.createElement(ActivityItem, Object.assign({}, x));
   }));
 };
 
-var styles$1h = {"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$1g = {"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$1h['vitro-task-tile'] + (props.isActive ? CTRL.SPACE + styles$1h['vitro-active'] : CTRL.EMPTY),
+    className: styles$1g['vitro-task-tile'] + (props.isActive ? CTRL.SPACE + styles$1g['vitro-active'] : CTRL.EMPTY),
     onClick: props.onClick
   }, props.dropdownItemList && React__default.createElement("div", {
-    className: styles$1h['vitro-top-right']
+    className: styles$1g['vitro-top-right']
   }, React__default.createElement(DropdownButton, {
     itemList: props.dropdownItemList,
-    className: styles$1h['vitro-dropdown-button']
+    className: styles$1g['vitro-dropdown-button']
   })), props.isShowDeleteButton && React__default.createElement("div", {
-    className: styles$1h['vitro-button-cancel'],
+    className: styles$1g['vitro-button-cancel'],
     onClick: props.onDeleteClick
   }), props.description && React__default.createElement("div", {
-    className: styles$1h['vitro-description']
+    className: styles$1g['vitro-description']
   }, props.description), React__default.createElement("div", {
-    className: styles$1h['vitro-title']
+    className: styles$1g['vitro-title']
   }, props.title), props.comment && React__default.createElement("div", {
-    className: styles$1h['vitro-comment']
+    className: styles$1g['vitro-comment']
   }, props.comment), React__default.createElement("div", {
-    className: styles$1h['vitro-content']
+    className: styles$1g['vitro-content']
   }, props.userList && React__default.createElement(TaskUserList, {
     itemList: props.userList
   })), React__default.createElement("div", {
-    className: styles$1h['vitro-bottom-right']
+    className: styles$1g['vitro-bottom-right']
   }, props.dateComment, " \xA0 ", props.date), props.children);
 };
 
@@ -69340,7 +68417,7 @@ var AlertConstants = {
     get TYPE () { return TYPE$2; }
 };
 
-var styles$1i = {"vitro-alert":"_alert_vitro-alert_3sPAkJb","vitro-position-absolute":"_alert_vitro-position-absolute_2A33Lq4","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$1h = {"vitro-alert":"_alert_vitro-alert_3sPAkJb","vitro-position-absolute":"_alert_vitro-position-absolute_2A33Lq4","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 TYPE_DANGER = 'danger';
 var Alert$1 = function Alert(props) {
@@ -69373,7 +68450,7 @@ var Alert$1 = function Alert(props) {
     }
   };
   var actionList = props.actionList && React__default.createElement("div", {
-    className: styles$1i['vitro-alert-action-list']
+    className: styles$1h['vitro-alert-action-list']
   }, props.actionList.map(function (a) {
     return React__default.createElement(Button$1, {
       key: a.text,
@@ -69382,7 +68459,7 @@ var Alert$1 = function Alert(props) {
       }
     }, a.text);
   }));
-  var className = [styles$1i['vitro-alert'], props.isPositionCenter ? styles$1i['vitro-position-center'] : CTRL.EMPTY, props.isPositionAbsolute ? styles$1i['vitro-position-absolute'] : CTRL.EMPTY, props.className || CTRL.EMPTY].join(CTRL.SPACE);
+  var className = [styles$1h['vitro-alert'], props.isPositionCenter ? styles$1h['vitro-position-center'] : CTRL.EMPTY, props.isPositionAbsolute ? styles$1h['vitro-position-absolute'] : CTRL.EMPTY, props.className || CTRL.EMPTY].join(CTRL.SPACE);
   return React__default.createElement("div", {
     tabIndex: 1,
     onBlur: onFocusOut,
@@ -69392,18 +68469,18 @@ var Alert$1 = function Alert(props) {
     variant: props.type === TYPE$2.ERROR ? TYPE_DANGER : props.type,
     onClose: props.onClose
   }, React__default.createElement("div", {
-    className: styles$1i['vitro-alert-content']
+    className: styles$1h['vitro-alert-content']
   }, React__default.createElement("div", {
-    className: styles$1i['vitro-icon']
+    className: styles$1h['vitro-icon']
   }), React__default.createElement("div", {
-    className: styles$1i['vitro-text']
+    className: styles$1h['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$1i['vitro-button-close'],
+    className: styles$1h['vitro-button-close'],
     onClick: onClose
   })), props.text && props.children, props.isMultiline && actionList));
 };
 
-var styles$1j = {"vitro-user-profile":"_user-profile_vitro-user-profile_11XpBoQ","vitro-dropdown-item":"_user-profile_vitro-dropdown-item_dSErsta","vitro-avatar":"_user-profile_vitro-avatar_3SzDPAi"};
+var styles$1i = {"vitro-user-profile":"_user-profile_vitro-user-profile_11XpBoQ","vitro-dropdown-item":"_user-profile_vitro-dropdown-item_dSErsta","vitro-avatar":"_user-profile_vitro-avatar_3SzDPAi"};
 
 var UserProfileMenuItem = function UserProfileMenuItem(props) {
   var onClick = function onClick() {
@@ -69414,7 +68491,7 @@ var UserProfileMenuItem = function UserProfileMenuItem(props) {
   };
   if (props.link) {
     return React__default.createElement("div", {
-      className: styles$1j['vitro-dropdown-item'],
+      className: styles$1i['vitro-dropdown-item'],
       onClick: onClick
     }, React__default.createElement("a", {
       href: props.link
@@ -69425,7 +68502,7 @@ var UserProfileMenuItem = function UserProfileMenuItem(props) {
   }
   if (props.onClick) {
     return React__default.createElement("div", {
-      className: styles$1j['vitro-dropdown-item'],
+      className: styles$1i['vitro-dropdown-item'],
       key: props.text,
       onClick: onClick
     }, props.imageUrl && React__default.createElement(Image, {
@@ -69459,15 +68536,15 @@ var UserProfile = function UserProfile(props) {
   return React__default.createElement(reactstrap.Dropdown, {
     isOpen: dropdownOpen,
     toggle: toggle,
-    className: styles$1j['vitro-user-profile']
+    className: styles$1i['vitro-user-profile']
   }, React__default.createElement(reactstrap.DropdownToggle, {
     caret: true
   }, React__default.createElement("div", null, React__default.createElement("span", {
-    className: styles$1j['vitro-text-color-white']
+    className: styles$1i['vitro-text-color-white']
   }, createSurnameWithInitials(props.userName)), React__default.createElement(Avatar, {
     userName: props.userName,
     image: props.image,
-    className: styles$1j['vitro-avatar']
+    className: styles$1i['vitro-avatar']
   }))), React__default.createElement(reactstrap.DropdownMenu, {
     right: true
   }, props.dropdownMenuItemList && props.dropdownMenuItemList.length > 0 && props.dropdownMenuItemList.map(function (item) {
@@ -69477,7 +68554,7 @@ var UserProfile = function UserProfile(props) {
   })));
 };
 
-var styles$1k = {"vitro-title":"_activity_vitro-title_1rdvvaa","vitro-dropdown-button":"_activity_vitro-dropdown-button_12258nJ","vitro-activity":"_activity_vitro-activity_1u7YeF3"};
+var styles$1j = {"vitro-title":"_activity_vitro-title_1rdvvaa","vitro-dropdown-button":"_activity_vitro-dropdown-button_12258nJ","vitro-activity":"_activity_vitro-activity_1u7YeF3"};
 
 var Activity = function Activity(props) {
   var onDrop = function onDrop(e) {
@@ -69490,10 +68567,10 @@ var Activity = function Activity(props) {
     className: 'vitro-activity',
     onDrop: onDrop
   }, (props.filterDropdownList || props.title) && React__default.createElement("div", {
-    className: styles$1k['vitro-title']
+    className: styles$1j['vitro-title']
   }, props.filterDropdownList && React__default.createElement(DropdownButton, {
     itemList: props.filterDropdownList,
-    className: styles$1k['vitro-dropdown-button']
+    className: styles$1j['vitro-dropdown-button']
   }), props.title && React__default.createElement("h3", null, props.title)), React__default.createElement("div", {
     className: 'vitro-content'
   }, props.children));
@@ -69510,8 +68587,8 @@ la$1);t$1[b]=new r$1(b,1,!1,a,null,!1,!1);});"xlink:actuate xlink:arcrole xlink:
 t$1.xlinkHref=new r$1("xlinkHref",1,!1,"xlink:href","http://www.w3.org/1999/xlink",!0,!1);["src","href","action","formAction"].forEach(function(a){t$1[a]=new r$1(a,1,!1,a.toLowerCase(),null,!0,!0);});
 var u={animationIterationCount:!0,aspectRatio:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridArea:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,
 fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},ma$1=["Webkit","ms","Moz","O"];Object.keys(u).forEach(function(a){ma$1.forEach(function(b){b=b+a.charAt(0).toUpperCase()+a.substring(1);u[b]=u[a];});});var na=/["'&<>]/;
-function v$2(a){if("boolean"===typeof a||"number"===typeof a)return ""+a;a=""+a;var b=na.exec(a);if(b){var c="",d,f=0;for(d=b.index;d<a.length;d++){switch(a.charCodeAt(d)){case 34:b="&quot;";break;case 38:b="&amp;";break;case 39:b="&#x27;";break;case 60:b="&lt;";break;case 62:b="&gt;";break;default:continue}f!==d&&(c+=a.substring(f,d));f=d+1;c+=b;}a=f!==d?c+a.substring(f,d):c;}return a}var oa$1=/([A-Z])/g,pa$1=/^ms-/,qa$1=Array.isArray;function w$8(a,b){return {insertionMode:a,selectedValue:b}}
-function ra$1(a,b,c){switch(b){case "select":return w$8(1,null!=c.value?c.value:c.defaultValue);case "svg":return w$8(2,null);case "math":return w$8(3,null);case "foreignObject":return w$8(1,null);case "table":return w$8(4,null);case "thead":case "tbody":case "tfoot":return w$8(5,null);case "colgroup":return w$8(7,null);case "tr":return w$8(6,null)}return 4<=a.insertionMode||0===a.insertionMode?w$8(1,null):a}var sa$1=new Map;
+function v$2(a){if("boolean"===typeof a||"number"===typeof a)return ""+a;a=""+a;var b=na.exec(a);if(b){var c="",d,f=0;for(d=b.index;d<a.length;d++){switch(a.charCodeAt(d)){case 34:b="&quot;";break;case 38:b="&amp;";break;case 39:b="&#x27;";break;case 60:b="&lt;";break;case 62:b="&gt;";break;default:continue}f!==d&&(c+=a.substring(f,d));f=d+1;c+=b;}a=f!==d?c+a.substring(f,d):c;}return a}var oa$1=/([A-Z])/g,pa$1=/^ms-/,qa$1=Array.isArray;function w$7(a,b){return {insertionMode:a,selectedValue:b}}
+function ra$1(a,b,c){switch(b){case "select":return w$7(1,null!=c.value?c.value:c.defaultValue);case "svg":return w$7(2,null);case "math":return w$7(3,null);case "foreignObject":return w$7(1,null);case "table":return w$7(4,null);case "thead":case "tbody":case "tfoot":return w$7(5,null);case "colgroup":return w$7(7,null);case "tr":return w$7(6,null)}return 4<=a.insertionMode||0===a.insertionMode?w$7(1,null):a}var sa$1=new Map;
 function ta$1(a,b,c){if("object"!==typeof c)throw Error(l$1(62));b=!0;for(var d in c)if(p$2.call(c,d)){var f=c[d];if(null!=f&&"boolean"!==typeof f&&""!==f){if(0===d.indexOf("--")){var e=v$2(d);f=v$2((""+f).trim());}else {e=d;var g=sa$1.get(e);void 0!==g?e=g:(g=v$2(e.replace(oa$1,"-$1").toLowerCase().replace(pa$1,"-ms-")),sa$1.set(e,g),e=g);f="number"===typeof f?0===f||p$2.call(u,d)?""+f:f+"px":v$2((""+f).trim());}b?(b=!1,a.push(' style="',e,":",f)):a.push(";",e,":",f);}}b||a.push('"');}
 function x$1(a,b,c,d){switch(c){case "style":ta$1(a,b,d);return;case "defaultValue":case "defaultChecked":case "innerHTML":case "suppressContentEditableWarning":case "suppressHydrationWarning":return}if(!(2<c.length)||"o"!==c[0]&&"O"!==c[0]||"n"!==c[1]&&"N"!==c[1])if(b=t$1.hasOwnProperty(c)?t$1[c]:null,null!==b){switch(typeof d){case "function":case "symbol":return;case "boolean":if(!b.acceptsBooleans)return}c=b.attributeName;switch(b.type){case 3:d&&a.push(" ",c,'=""');break;case 4:!0===d?a.push(" ",c,'=""'):
 !1!==d&&a.push(" ",c,'="',v$2(d),'"');break;case 5:isNaN(d)||a.push(" ",c,'="',v$2(d),'"');break;case 6:!isNaN(d)&&1<=d&&a.push(" ",c,'="',v$2(d),'"');break;default:b.sanitizeURL&&(d=""+d),a.push(" ",c,'="',v$2(d),'"');}}else if(ja$1(c)){switch(typeof d){case "function":case "symbol":return;case "boolean":if(b=c.toLowerCase().slice(0,5),"data-"!==b&&"aria-"!==b)return}a.push(" ",c,'="',v$2(d),'"');}}
@@ -69593,7 +68670,7 @@ var reactDomServerLegacy_browser_production_min = {
 };
 
 function k$1(a){for(var b="https://reactjs.org/docs/error-decoder.html?invariant="+a,c=1;c<arguments.length;c++)b+="&args[]="+encodeURIComponent(arguments[c]);return "Minified React error #"+a+"; visit "+b+" for the full message or use the non-minified dev environment for full errors and additional helpful warnings."}var l$2=null,n$1=0;
-function p$3(a,b){if(0!==b.length)if(512<b.length)0<n$1&&(a.enqueue(new Uint8Array(l$2.buffer,0,n$1)),l$2=new Uint8Array(512),n$1=0),a.enqueue(b);else {var c=l$2.length-n$1;c<b.length&&(0===c?a.enqueue(l$2):(l$2.set(b.subarray(0,c),n$1),a.enqueue(l$2),b=b.subarray(c)),l$2=new Uint8Array(512),n$1=0);l$2.set(b,n$1);n$1+=b.length;}}function t$2(a,b){p$3(a,b);return !0}function ba(a){l$2&&0<n$1&&(a.enqueue(new Uint8Array(l$2.buffer,0,n$1)),l$2=null,n$1=0);}var ca=new TextEncoder;function u$1(a){return ca.encode(a)}function w$9(a){return ca.encode(a)}
+function p$3(a,b){if(0!==b.length)if(512<b.length)0<n$1&&(a.enqueue(new Uint8Array(l$2.buffer,0,n$1)),l$2=new Uint8Array(512),n$1=0),a.enqueue(b);else {var c=l$2.length-n$1;c<b.length&&(0===c?a.enqueue(l$2):(l$2.set(b.subarray(0,c),n$1),a.enqueue(l$2),b=b.subarray(c)),l$2=new Uint8Array(512),n$1=0);l$2.set(b,n$1);n$1+=b.length;}}function t$2(a,b){p$3(a,b);return !0}function ba(a){l$2&&0<n$1&&(a.enqueue(new Uint8Array(l$2.buffer,0,n$1)),l$2=null,n$1=0);}var ca=new TextEncoder;function u$1(a){return ca.encode(a)}function w$8(a){return ca.encode(a)}
 function da$1(a,b){"function"===typeof a.error?a.error(b):a.close();}var x$2=Object.prototype.hasOwnProperty,ea$1=/^[:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD][:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD\-.0-9\u00B7\u0300-\u036F\u203F-\u2040]*$/,fa$2={},ha$2={};
 function ia$2(a){if(x$2.call(ha$2,a))return !0;if(x$2.call(fa$2,a))return !1;if(ea$1.test(a))return ha$2[a]=!0;fa$2[a]=!0;return !1}function y$2(a,b,c,d,f,e,g){this.acceptsBooleans=2===b||3===b||4===b;this.attributeName=d;this.attributeNamespace=f;this.mustUseProperty=c;this.propertyName=a;this.type=b;this.sanitizeURL=e;this.removeEmptyString=g;}var z$2={};
 "children dangerouslySetInnerHTML defaultValue defaultChecked innerHTML suppressContentEditableWarning suppressHydrationWarning style".split(" ").forEach(function(a){z$2[a]=new y$2(a,0,!1,a,null,!1,!1);});[["acceptCharset","accept-charset"],["className","class"],["htmlFor","for"],["httpEquiv","http-equiv"]].forEach(function(a){var b=a[0];z$2[b]=new y$2(b,1,!1,a[1],null,!1,!1);});["contentEditable","draggable","spellCheck","value"].forEach(function(a){z$2[a]=new y$2(a,2,!1,a.toLowerCase(),null,!1,!1);});
@@ -69605,17 +68682,17 @@ z$2.xlinkHref=new y$2("xlinkHref",1,!1,"xlink:href","http://www.w3.org/1999/xlin
 var B$2={animationIterationCount:!0,aspectRatio:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridArea:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,
 fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},la$2=["Webkit","ms","Moz","O"];Object.keys(B$2).forEach(function(a){la$2.forEach(function(b){b=b+a.charAt(0).toUpperCase()+a.substring(1);B$2[b]=B$2[a];});});var oa$2=/["'&<>]/;
 function C$1(a){if("boolean"===typeof a||"number"===typeof a)return ""+a;a=""+a;var b=oa$2.exec(a);if(b){var c="",d,f=0;for(d=b.index;d<a.length;d++){switch(a.charCodeAt(d)){case 34:b="&quot;";break;case 38:b="&amp;";break;case 39:b="&#x27;";break;case 60:b="&lt;";break;case 62:b="&gt;";break;default:continue}f!==d&&(c+=a.substring(f,d));f=d+1;c+=b;}a=f!==d?c+a.substring(f,d):c;}return a}
-var pa$2=/([A-Z])/g,qa$2=/^ms-/,ra$2=Array.isArray,sa$2=w$9("<script>"),ta$2=w$9("\x3c/script>"),ua$2=w$9('<script src="'),va$2=w$9('<script type="module" src="'),wa$2=w$9('" async="">\x3c/script>'),xa$1=/(<\/|<)(s)(cript)/gi;function ya$2(a,b,c,d){return ""+b+("s"===c?"\\u0073":"\\u0053")+d}
-function za$2(a,b,c,d,f){a=void 0===a?"":a;b=void 0===b?sa$2:w$9('<script nonce="'+C$1(b)+'">');var e=[];void 0!==c&&e.push(b,u$1((""+c).replace(xa$1,ya$2)),ta$2);if(void 0!==d)for(c=0;c<d.length;c++)e.push(ua$2,u$1(C$1(d[c])),wa$2);if(void 0!==f)for(d=0;d<f.length;d++)e.push(va$2,u$1(C$1(f[d])),wa$2);return {bootstrapChunks:e,startInlineScript:b,placeholderPrefix:w$9(a+"P:"),segmentPrefix:w$9(a+"S:"),boundaryPrefix:a+"B:",idPrefix:a,nextSuspenseID:0,sentCompleteSegmentFunction:!1,sentCompleteBoundaryFunction:!1,sentClientRenderFunction:!1}}
+var pa$2=/([A-Z])/g,qa$2=/^ms-/,ra$2=Array.isArray,sa$2=w$8("<script>"),ta$2=w$8("\x3c/script>"),ua$2=w$8('<script src="'),va$2=w$8('<script type="module" src="'),wa$2=w$8('" async="">\x3c/script>'),xa$1=/(<\/|<)(s)(cript)/gi;function ya$2(a,b,c,d){return ""+b+("s"===c?"\\u0073":"\\u0053")+d}
+function za$2(a,b,c,d,f){a=void 0===a?"":a;b=void 0===b?sa$2:w$8('<script nonce="'+C$1(b)+'">');var e=[];void 0!==c&&e.push(b,u$1((""+c).replace(xa$1,ya$2)),ta$2);if(void 0!==d)for(c=0;c<d.length;c++)e.push(ua$2,u$1(C$1(d[c])),wa$2);if(void 0!==f)for(d=0;d<f.length;d++)e.push(va$2,u$1(C$1(f[d])),wa$2);return {bootstrapChunks:e,startInlineScript:b,placeholderPrefix:w$8(a+"P:"),segmentPrefix:w$8(a+"S:"),boundaryPrefix:a+"B:",idPrefix:a,nextSuspenseID:0,sentCompleteSegmentFunction:!1,sentCompleteBoundaryFunction:!1,sentClientRenderFunction:!1}}
 function D$1(a,b){return {insertionMode:a,selectedValue:b}}function Aa$2(a){return D$1("http://www.w3.org/2000/svg"===a?2:"http://www.w3.org/1998/Math/MathML"===a?3:0,null)}
-function Ba$2(a,b,c){switch(b){case "select":return D$1(1,null!=c.value?c.value:c.defaultValue);case "svg":return D$1(2,null);case "math":return D$1(3,null);case "foreignObject":return D$1(1,null);case "table":return D$1(4,null);case "thead":case "tbody":case "tfoot":return D$1(5,null);case "colgroup":return D$1(7,null);case "tr":return D$1(6,null)}return 4<=a.insertionMode||0===a.insertionMode?D$1(1,null):a}var Ca$2=w$9("\x3c!-- --\x3e");function Da$2(a,b,c,d){if(""===b)return d;d&&a.push(Ca$2);a.push(u$1(C$1(b)));return !0}
-var Ea$2=new Map,Fa$2=w$9(' style="'),Ga$2=w$9(":"),Ha$2=w$9(";");
-function Ia$2(a,b,c){if("object"!==typeof c)throw Error(k$1(62));b=!0;for(var d in c)if(x$2.call(c,d)){var f=c[d];if(null!=f&&"boolean"!==typeof f&&""!==f){if(0===d.indexOf("--")){var e=u$1(C$1(d));f=u$1(C$1((""+f).trim()));}else {e=d;var g=Ea$2.get(e);void 0!==g?e=g:(g=w$9(C$1(e.replace(pa$2,"-$1").toLowerCase().replace(qa$2,"-ms-"))),Ea$2.set(e,g),e=g);f="number"===typeof f?0===f||x$2.call(B$2,d)?u$1(""+f):u$1(f+"px"):u$1(C$1((""+f).trim()));}b?(b=!1,a.push(Fa$2,e,Ga$2,f)):a.push(Ha$2,e,Ga$2,f);}}b||a.push(E$2);}
-var H$2=w$9(" "),I$2=w$9('="'),E$2=w$9('"'),Ja$2=w$9('=""');
+function Ba$2(a,b,c){switch(b){case "select":return D$1(1,null!=c.value?c.value:c.defaultValue);case "svg":return D$1(2,null);case "math":return D$1(3,null);case "foreignObject":return D$1(1,null);case "table":return D$1(4,null);case "thead":case "tbody":case "tfoot":return D$1(5,null);case "colgroup":return D$1(7,null);case "tr":return D$1(6,null)}return 4<=a.insertionMode||0===a.insertionMode?D$1(1,null):a}var Ca$2=w$8("\x3c!-- --\x3e");function Da$2(a,b,c,d){if(""===b)return d;d&&a.push(Ca$2);a.push(u$1(C$1(b)));return !0}
+var Ea$2=new Map,Fa$2=w$8(' style="'),Ga$2=w$8(":"),Ha$2=w$8(";");
+function Ia$2(a,b,c){if("object"!==typeof c)throw Error(k$1(62));b=!0;for(var d in c)if(x$2.call(c,d)){var f=c[d];if(null!=f&&"boolean"!==typeof f&&""!==f){if(0===d.indexOf("--")){var e=u$1(C$1(d));f=u$1(C$1((""+f).trim()));}else {e=d;var g=Ea$2.get(e);void 0!==g?e=g:(g=w$8(C$1(e.replace(pa$2,"-$1").toLowerCase().replace(qa$2,"-ms-"))),Ea$2.set(e,g),e=g);f="number"===typeof f?0===f||x$2.call(B$2,d)?u$1(""+f):u$1(f+"px"):u$1(C$1((""+f).trim()));}b?(b=!1,a.push(Fa$2,e,Ga$2,f)):a.push(Ha$2,e,Ga$2,f);}}b||a.push(E$2);}
+var H$2=w$8(" "),I$2=w$8('="'),E$2=w$8('"'),Ja$2=w$8('=""');
 function J$1(a,b,c,d){switch(c){case "style":Ia$2(a,b,d);return;case "defaultValue":case "defaultChecked":case "innerHTML":case "suppressContentEditableWarning":case "suppressHydrationWarning":return}if(!(2<c.length)||"o"!==c[0]&&"O"!==c[0]||"n"!==c[1]&&"N"!==c[1])if(b=z$2.hasOwnProperty(c)?z$2[c]:null,null!==b){switch(typeof d){case "function":case "symbol":return;case "boolean":if(!b.acceptsBooleans)return}c=u$1(b.attributeName);switch(b.type){case 3:d&&a.push(H$2,c,Ja$2);break;case 4:!0===d?a.push(H$2,c,Ja$2):!1!==
-d&&a.push(H$2,c,I$2,u$1(C$1(d)),E$2);break;case 5:isNaN(d)||a.push(H$2,c,I$2,u$1(C$1(d)),E$2);break;case 6:!isNaN(d)&&1<=d&&a.push(H$2,c,I$2,u$1(C$1(d)),E$2);break;default:b.sanitizeURL&&(d=""+d),a.push(H$2,c,I$2,u$1(C$1(d)),E$2);}}else if(ia$2(c)){switch(typeof d){case "function":case "symbol":return;case "boolean":if(b=c.toLowerCase().slice(0,5),"data-"!==b&&"aria-"!==b)return}a.push(H$2,u$1(c),I$2,u$1(C$1(d)),E$2);}}var K$2=w$9(">"),Ka$2=w$9("/>");
-function L$2(a,b,c){if(null!=b){if(null!=c)throw Error(k$1(60));if("object"!==typeof b||!("__html"in b))throw Error(k$1(61));b=b.__html;null!==b&&void 0!==b&&a.push(u$1(""+b));}}function La$2(a){var b="";React__default.Children.forEach(a,function(a){null!=a&&(b+=a);});return b}var Ma$2=w$9(' selected=""');
-function Na$2(a,b,c,d){a.push(M$2(c));var f=c=null,e;for(e in b)if(x$2.call(b,e)){var g=b[e];if(null!=g)switch(e){case "children":c=g;break;case "dangerouslySetInnerHTML":f=g;break;default:J$1(a,d,e,g);}}a.push(K$2);L$2(a,f,c);return "string"===typeof c?(a.push(u$1(C$1(c))),null):c}var Oa$2=w$9("\n"),Pa$2=/^[a-zA-Z][a-zA-Z:_\.\-\d]*$/,Qa$2=new Map;function M$2(a){var b=Qa$2.get(a);if(void 0===b){if(!Pa$2.test(a))throw Error(k$1(65,a));b=w$9("<"+a);Qa$2.set(a,b);}return b}var Ra$2=w$9("<!DOCTYPE html>");
+d&&a.push(H$2,c,I$2,u$1(C$1(d)),E$2);break;case 5:isNaN(d)||a.push(H$2,c,I$2,u$1(C$1(d)),E$2);break;case 6:!isNaN(d)&&1<=d&&a.push(H$2,c,I$2,u$1(C$1(d)),E$2);break;default:b.sanitizeURL&&(d=""+d),a.push(H$2,c,I$2,u$1(C$1(d)),E$2);}}else if(ia$2(c)){switch(typeof d){case "function":case "symbol":return;case "boolean":if(b=c.toLowerCase().slice(0,5),"data-"!==b&&"aria-"!==b)return}a.push(H$2,u$1(c),I$2,u$1(C$1(d)),E$2);}}var K$2=w$8(">"),Ka$2=w$8("/>");
+function L$2(a,b,c){if(null!=b){if(null!=c)throw Error(k$1(60));if("object"!==typeof b||!("__html"in b))throw Error(k$1(61));b=b.__html;null!==b&&void 0!==b&&a.push(u$1(""+b));}}function La$2(a){var b="";React__default.Children.forEach(a,function(a){null!=a&&(b+=a);});return b}var Ma$2=w$8(' selected=""');
+function Na$2(a,b,c,d){a.push(M$2(c));var f=c=null,e;for(e in b)if(x$2.call(b,e)){var g=b[e];if(null!=g)switch(e){case "children":c=g;break;case "dangerouslySetInnerHTML":f=g;break;default:J$1(a,d,e,g);}}a.push(K$2);L$2(a,f,c);return "string"===typeof c?(a.push(u$1(C$1(c))),null):c}var Oa$2=w$8("\n"),Pa$2=/^[a-zA-Z][a-zA-Z:_\.\-\d]*$/,Qa$2=new Map;function M$2(a){var b=Qa$2.get(a);if(void 0===b){if(!Pa$2.test(a))throw Error(k$1(65,a));b=w$8("<"+a);Qa$2.set(a,b);}return b}var Ra$2=w$8("<!DOCTYPE html>");
 function Sa$2(a,b,c,d,f){switch(b){case "select":a.push(M$2("select"));var e=null,g=null;for(r in c)if(x$2.call(c,r)){var h=c[r];if(null!=h)switch(r){case "children":e=h;break;case "dangerouslySetInnerHTML":g=h;break;case "defaultValue":case "value":break;default:J$1(a,d,r,h);}}a.push(K$2);L$2(a,g,e);return e;case "option":g=f.selectedValue;a.push(M$2("option"));var m=h=null,q=null;var r=null;for(e in c)if(x$2.call(c,e)){var v=c[e];if(null!=v)switch(e){case "children":h=v;break;case "selected":q=v;break;case "dangerouslySetInnerHTML":r=
 v;break;case "value":m=v;default:J$1(a,d,e,v);}}if(null!=g)if(c=null!==m?""+m:La$2(h),ra$2(g))for(d=0;d<g.length;d++){if(""+g[d]===c){a.push(Ma$2);break}}else ""+g===c&&a.push(Ma$2);else q&&a.push(Ma$2);a.push(K$2);L$2(a,r,h);return h;case "textarea":a.push(M$2("textarea"));r=g=e=null;for(h in c)if(x$2.call(c,h)&&(m=c[h],null!=m))switch(h){case "children":r=m;break;case "value":e=m;break;case "defaultValue":g=m;break;case "dangerouslySetInnerHTML":throw Error(k$1(91));default:J$1(a,d,h,m);}null===e&&null!==g&&(e=g);a.push(K$2);
 if(null!=r){if(null!=e)throw Error(k$1(92));if(ra$2(r)&&1<r.length)throw Error(k$1(93));e=""+r;}"string"===typeof e&&"\n"===e[0]&&a.push(Oa$2);null!==e&&a.push(u$1(C$1(""+e)));return null;case "input":a.push(M$2("input"));m=r=h=e=null;for(g in c)if(x$2.call(c,g)&&(q=c[g],null!=q))switch(g){case "children":case "dangerouslySetInnerHTML":throw Error(k$1(399,"input"));case "defaultChecked":m=q;break;case "defaultValue":h=q;break;case "checked":r=q;break;case "value":e=q;break;default:J$1(a,d,g,q);}null!==r?J$1(a,d,"checked",
@@ -69623,12 +68700,12 @@ r):null!==m&&J$1(a,d,"checked",m);null!==e?J$1(a,d,"value",e):null!==h&&J$1(a,d,
 return e;case "listing":case "pre":a.push(M$2(b));g=e=null;for(m in c)if(x$2.call(c,m)&&(h=c[m],null!=h))switch(m){case "children":e=h;break;case "dangerouslySetInnerHTML":g=h;break;default:J$1(a,d,m,h);}a.push(K$2);if(null!=g){if(null!=e)throw Error(k$1(60));if("object"!==typeof g||!("__html"in g))throw Error(k$1(61));c=g.__html;null!==c&&void 0!==c&&("string"===typeof c&&0<c.length&&"\n"===c[0]?a.push(Oa$2,u$1(c)):a.push(u$1(""+c)));}"string"===typeof e&&"\n"===e[0]&&a.push(Oa$2);return e;case "area":case "base":case "br":case "col":case "embed":case "hr":case "img":case "keygen":case "link":case "meta":case "param":case "source":case "track":case "wbr":a.push(M$2(b));
 for(var F in c)if(x$2.call(c,F)&&(e=c[F],null!=e))switch(F){case "children":case "dangerouslySetInnerHTML":throw Error(k$1(399,b));default:J$1(a,d,F,e);}a.push(Ka$2);return null;case "annotation-xml":case "color-profile":case "font-face":case "font-face-src":case "font-face-uri":case "font-face-format":case "font-face-name":case "missing-glyph":return Na$2(a,c,b,d);case "html":return 0===f.insertionMode&&a.push(Ra$2),Na$2(a,c,b,d);default:if(-1===b.indexOf("-")&&"string"!==typeof c.is)return Na$2(a,c,b,d);a.push(M$2(b));
 g=e=null;for(q in c)if(x$2.call(c,q)&&(h=c[q],null!=h))switch(q){case "children":e=h;break;case "dangerouslySetInnerHTML":g=h;break;case "style":Ia$2(a,d,h);break;case "suppressContentEditableWarning":case "suppressHydrationWarning":break;default:ia$2(q)&&"function"!==typeof h&&"symbol"!==typeof h&&a.push(H$2,u$1(q),I$2,u$1(C$1(h)),E$2);}a.push(K$2);L$2(a,g,e);return e}}
-var Ta$2=w$9("</"),Ua$2=w$9(">"),Va$2=w$9('<template id="'),Wa$2=w$9('"></template>'),Xa$2=w$9("\x3c!--$--\x3e"),Ya$2=w$9('\x3c!--$?--\x3e<template id="'),Za$2=w$9('"></template>'),$a$1=w$9("\x3c!--$!--\x3e"),ab$2=w$9("\x3c!--/$--\x3e"),bb$2=w$9("<template"),cb$2=w$9('"'),db$2=w$9(' data-dgst="');w$9(' data-msg="');w$9(' data-stck="');var eb$2=w$9("></template>");function fb$2(a,b,c){p$3(a,Ya$2);if(null===c)throw Error(k$1(395));p$3(a,c);return t$2(a,Za$2)}
-var gb$2=w$9('<div hidden id="'),hb$2=w$9('">'),ib$2=w$9("</div>"),jb$2=w$9('<svg aria-hidden="true" style="display:none" id="'),kb$2=w$9('">'),lb$2=w$9("</svg>"),mb$1=w$9('<math aria-hidden="true" style="display:none" id="'),nb$1=w$9('">'),ob$2=w$9("</math>"),pb$2=w$9('<table hidden id="'),qb$2=w$9('">'),rb$2=w$9("</table>"),sb$2=w$9('<table hidden><tbody id="'),tb$2=w$9('">'),ub$2=w$9("</tbody></table>"),vb$2=w$9('<table hidden><tr id="'),wb$2=w$9('">'),xb$2=w$9("</tr></table>"),yb$2=w$9('<table hidden><colgroup id="'),zb$2=w$9('">'),Ab$2=w$9("</colgroup></table>");
+var Ta$2=w$8("</"),Ua$2=w$8(">"),Va$2=w$8('<template id="'),Wa$2=w$8('"></template>'),Xa$2=w$8("\x3c!--$--\x3e"),Ya$2=w$8('\x3c!--$?--\x3e<template id="'),Za$2=w$8('"></template>'),$a$1=w$8("\x3c!--$!--\x3e"),ab$2=w$8("\x3c!--/$--\x3e"),bb$2=w$8("<template"),cb$2=w$8('"'),db$2=w$8(' data-dgst="');w$8(' data-msg="');w$8(' data-stck="');var eb$2=w$8("></template>");function fb$2(a,b,c){p$3(a,Ya$2);if(null===c)throw Error(k$1(395));p$3(a,c);return t$2(a,Za$2)}
+var gb$2=w$8('<div hidden id="'),hb$2=w$8('">'),ib$2=w$8("</div>"),jb$2=w$8('<svg aria-hidden="true" style="display:none" id="'),kb$2=w$8('">'),lb$2=w$8("</svg>"),mb$1=w$8('<math aria-hidden="true" style="display:none" id="'),nb$1=w$8('">'),ob$2=w$8("</math>"),pb$2=w$8('<table hidden id="'),qb$2=w$8('">'),rb$2=w$8("</table>"),sb$2=w$8('<table hidden><tbody id="'),tb$2=w$8('">'),ub$2=w$8("</tbody></table>"),vb$2=w$8('<table hidden><tr id="'),wb$2=w$8('">'),xb$2=w$8("</tr></table>"),yb$2=w$8('<table hidden><colgroup id="'),zb$2=w$8('">'),Ab$2=w$8("</colgroup></table>");
 function Bb$2(a,b,c,d){switch(c.insertionMode){case 0:case 1:return p$3(a,gb$2),p$3(a,b.segmentPrefix),p$3(a,u$1(d.toString(16))),t$2(a,hb$2);case 2:return p$3(a,jb$2),p$3(a,b.segmentPrefix),p$3(a,u$1(d.toString(16))),t$2(a,kb$2);case 3:return p$3(a,mb$1),p$3(a,b.segmentPrefix),p$3(a,u$1(d.toString(16))),t$2(a,nb$1);case 4:return p$3(a,pb$2),p$3(a,b.segmentPrefix),p$3(a,u$1(d.toString(16))),t$2(a,qb$2);case 5:return p$3(a,sb$2),p$3(a,b.segmentPrefix),p$3(a,u$1(d.toString(16))),t$2(a,tb$2);case 6:return p$3(a,vb$2),p$3(a,b.segmentPrefix),p$3(a,u$1(d.toString(16))),t$2(a,wb$2);case 7:return p$3(a,
 yb$2),p$3(a,b.segmentPrefix),p$3(a,u$1(d.toString(16))),t$2(a,zb$2);default:throw Error(k$1(397));}}function Cb$2(a,b){switch(b.insertionMode){case 0:case 1:return t$2(a,ib$2);case 2:return t$2(a,lb$2);case 3:return t$2(a,ob$2);case 4:return t$2(a,rb$2);case 5:return t$2(a,ub$2);case 6:return t$2(a,xb$2);case 7:return t$2(a,Ab$2);default:throw Error(k$1(397));}}
-var Db$2=w$9('function $RS(a,b){a=document.getElementById(a);b=document.getElementById(b);for(a.parentNode.removeChild(a);a.firstChild;)b.parentNode.insertBefore(a.firstChild,b);b.parentNode.removeChild(b)};$RS("'),Eb$2=w$9('$RS("'),Gb$2=w$9('","'),Hb$2=w$9('")\x3c/script>'),Ib$2=w$9('function $RC(a,b){a=document.getElementById(a);b=document.getElementById(b);b.parentNode.removeChild(b);if(a){a=a.previousSibling;var f=a.parentNode,c=a.nextSibling,e=0;do{if(c&&8===c.nodeType){var d=c.data;if("/$"===d)if(0===e)break;else e--;else"$"!==d&&"$?"!==d&&"$!"!==d||e++}d=c.nextSibling;f.removeChild(c);c=d}while(c);for(;b.firstChild;)f.insertBefore(b.firstChild,c);a.data="$";a._reactRetry&&a._reactRetry()}};$RC("'),
-Jb$2=w$9('$RC("'),Kb$2=w$9('","'),Lb$2=w$9('")\x3c/script>'),Mb$2=w$9('function $RX(b,c,d,e){var a=document.getElementById(b);a&&(b=a.previousSibling,b.data="$!",a=a.dataset,c&&(a.dgst=c),d&&(a.msg=d),e&&(a.stck=e),b._reactRetry&&b._reactRetry())};$RX("'),Nb$2=w$9('$RX("'),Ob$2=w$9('"'),Pb$2=w$9(")\x3c/script>"),Qb$2=w$9(","),Rb$2=/[<\u2028\u2029]/g;
+var Db$2=w$8('function $RS(a,b){a=document.getElementById(a);b=document.getElementById(b);for(a.parentNode.removeChild(a);a.firstChild;)b.parentNode.insertBefore(a.firstChild,b);b.parentNode.removeChild(b)};$RS("'),Eb$2=w$8('$RS("'),Gb$2=w$8('","'),Hb$2=w$8('")\x3c/script>'),Ib$2=w$8('function $RC(a,b){a=document.getElementById(a);b=document.getElementById(b);b.parentNode.removeChild(b);if(a){a=a.previousSibling;var f=a.parentNode,c=a.nextSibling,e=0;do{if(c&&8===c.nodeType){var d=c.data;if("/$"===d)if(0===e)break;else e--;else"$"!==d&&"$?"!==d&&"$!"!==d||e++}d=c.nextSibling;f.removeChild(c);c=d}while(c);for(;b.firstChild;)f.insertBefore(b.firstChild,c);a.data="$";a._reactRetry&&a._reactRetry()}};$RC("'),
+Jb$2=w$8('$RC("'),Kb$2=w$8('","'),Lb$2=w$8('")\x3c/script>'),Mb$2=w$8('function $RX(b,c,d,e){var a=document.getElementById(b);a&&(b=a.previousSibling,b.data="$!",a=a.dataset,c&&(a.dgst=c),d&&(a.msg=d),e&&(a.stck=e),b._reactRetry&&b._reactRetry())};$RX("'),Nb$2=w$8('$RX("'),Ob$2=w$8('"'),Pb$2=w$8(")\x3c/script>"),Qb$2=w$8(","),Rb$2=/[<\u2028\u2029]/g;
 function Sb$2(a){return JSON.stringify(a).replace(Rb$2,function(a){switch(a){case "<":return "\\u003c";case "\u2028":return "\\u2028";case "\u2029":return "\\u2029";default:throw Error("escapeJSStringsForInstructionScripts encountered a match it does not know how to replace. this means the match regex and the replacement characters are no longer in sync. This is a bug in React");}})}
 var N$2=Object.assign,Tb$2=Symbol.for("react.element"),Ub$1=Symbol.for("react.portal"),Vb$1=Symbol.for("react.fragment"),Wb$1=Symbol.for("react.strict_mode"),Xb$1=Symbol.for("react.profiler"),Yb$1=Symbol.for("react.provider"),Zb$1=Symbol.for("react.context"),$b$1=Symbol.for("react.forward_ref"),ac$1=Symbol.for("react.suspense"),bc$1=Symbol.for("react.suspense_list"),cc$1=Symbol.for("react.memo"),dc$1=Symbol.for("react.lazy"),ec$1=Symbol.for("react.scope"),fc$1=Symbol.for("react.debug_trace_mode"),gc$1=Symbol.for("react.legacy_hidden"),
 hc$1=Symbol.for("react.default_value"),ic$1=Symbol.iterator;
@@ -69669,7 +68746,7 @@ b.parentFlushed&&a.partialBoundaries.push(b)));a.allPendingTasks--;0===a.allPend
 function Uc$1(a){if(2!==a.status){var b=O$2,c=Pc$1.current;Pc$1.current=Oc$1;var d=Nc$1;Nc$1=a.responseState;try{var f=a.pingedTasks,e;for(e=0;e<f.length;e++){var g=f[e];var h=a,m=g.blockedSegment;if(0===m.status){Q$2(g.context);try{Z$2(h,g,g.node),m.lastPushedText&&m.textEmbedded&&m.chunks.push(Ca$2),g.abortSet.delete(g),m.status=1,dd$1(h,g.blockedBoundary,m);}catch(G){if(Gc$1(),"object"===typeof G&&null!==G&&"function"===typeof G.then){var q=g.ping;G.then(q,q);}else {g.abortSet.delete(g);m.status=4;var r=g.blockedBoundary,
 v=G,A=Y$2(h,v);null===r?Vc$1(h,v):(r.pendingTasks--,r.forceClientRender||(r.forceClientRender=!0,r.errorDigest=A,r.parentFlushed&&h.clientRenderedBoundaries.push(r)));h.allPendingTasks--;if(0===h.allPendingTasks){var F=h.onAllReady;F();}}}finally{}}}f.splice(0,e);null!==a.destination&&fd$1(a,a.destination);}catch(G){Y$2(a,G),Vc$1(a,G);}finally{Nc$1=d,Pc$1.current=c,c===Oc$1&&Q$2(b);}}}
 function gd$1(a,b,c){c.parentFlushed=!0;switch(c.status){case 0:var d=c.id=a.nextSegmentId++;c.lastPushedText=!1;c.textEmbedded=!1;a=a.responseState;p$3(b,Va$2);p$3(b,a.placeholderPrefix);a=u$1(d.toString(16));p$3(b,a);return t$2(b,Wa$2);case 1:c.status=2;var f=!0;d=c.chunks;var e=0;c=c.children;for(var g=0;g<c.length;g++){for(f=c[g];e<f.index;e++)p$3(b,d[e]);f=hd$1(a,b,f);}for(;e<d.length-1;e++)p$3(b,d[e]);e<d.length&&(f=t$2(b,d[e]));return f;default:throw Error(k$1(390));}}
-function hd$1(a,b,c){var d=c.boundary;if(null===d)return gd$1(a,b,c);d.parentFlushed=!0;if(d.forceClientRender)d=d.errorDigest,t$2(b,$a$1),p$3(b,bb$2),d&&(p$3(b,db$2),p$3(b,u$1(C$1(d))),p$3(b,cb$2)),t$2(b,eb$2),gd$1(a,b,c);else if(0<d.pendingTasks){d.rootSegmentID=a.nextSegmentId++;0<d.completedSegments.length&&a.partialBoundaries.push(d);var f=a.responseState;var e=f.nextSuspenseID++;f=w$9(f.boundaryPrefix+e.toString(16));d=d.id=f;fb$2(b,a.responseState,d);gd$1(a,b,c);}else if(d.byteSize>a.progressiveChunkSize)d.rootSegmentID=a.nextSegmentId++,
+function hd$1(a,b,c){var d=c.boundary;if(null===d)return gd$1(a,b,c);d.parentFlushed=!0;if(d.forceClientRender)d=d.errorDigest,t$2(b,$a$1),p$3(b,bb$2),d&&(p$3(b,db$2),p$3(b,u$1(C$1(d))),p$3(b,cb$2)),t$2(b,eb$2),gd$1(a,b,c);else if(0<d.pendingTasks){d.rootSegmentID=a.nextSegmentId++;0<d.completedSegments.length&&a.partialBoundaries.push(d);var f=a.responseState;var e=f.nextSuspenseID++;f=w$8(f.boundaryPrefix+e.toString(16));d=d.id=f;fb$2(b,a.responseState,d);gd$1(a,b,c);}else if(d.byteSize>a.progressiveChunkSize)d.rootSegmentID=a.nextSegmentId++,
 a.completedBoundaries.push(d),fb$2(b,a.responseState,d.id),gd$1(a,b,c);else {t$2(b,Xa$2);c=d.completedSegments;if(1!==c.length)throw Error(k$1(391));hd$1(a,b,c[0]);}return t$2(b,ab$2)}function id$1(a,b,c){Bb$2(b,a.responseState,c.formatContext,c.id);hd$1(a,b,c);return Cb$2(b,c.formatContext)}
 function jd$1(a,b,c){for(var d=c.completedSegments,f=0;f<d.length;f++)kd$1(a,b,c,d[f]);d.length=0;a=a.responseState;d=c.id;c=c.rootSegmentID;p$3(b,a.startInlineScript);a.sentCompleteBoundaryFunction?p$3(b,Jb$2):(a.sentCompleteBoundaryFunction=!0,p$3(b,Ib$2));if(null===d)throw Error(k$1(395));c=u$1(c.toString(16));p$3(b,d);p$3(b,Kb$2);p$3(b,a.segmentPrefix);p$3(b,c);return t$2(b,Lb$2)}
 function kd$1(a,b,c,d){if(2===d.status)return !0;var f=d.id;if(-1===f){if(-1===(d.id=c.rootSegmentID))throw Error(k$1(392));return id$1(a,b,d)}id$1(a,b,d);a=a.responseState;p$3(b,a.startInlineScript);a.sentCompleteSegmentFunction?p$3(b,Eb$2):(a.sentCompleteSegmentFunction=!0,p$3(b,Db$2));p$3(b,a.segmentPrefix);f=u$1(f.toString(16));p$3(b,f);p$3(b,Gb$2);p$3(b,a.placeholderPrefix);p$3(b,f);return t$2(b,Hb$2)}
@@ -83713,7 +82790,7 @@ var server_browser = {
 	renderToReadableStream: renderToReadableStream$1
 };
 
-var styles$1l = {"vitro-file":"_file_vitro-file_2xkXgkS","vitro-preview":"_file_vitro-preview_2RVdrbm","vitro-preview-container":"_file_vitro-preview-container_2dmbDD7","vitro-flex":"_file_vitro-flex_3nGTlWX","vitro-image":"_file_vitro-image_2Bt3otk","vitro-file-name":"_file_vitro-file-name_2t9Y643","vitro-file-size":"_file_vitro-file-size_15f_E_0","vitro-dropdown-button":"_file_vitro-dropdown-button_3MgI2n9"};
+var styles$1k = {"vitro-file":"_file_vitro-file_2xkXgkS","vitro-preview":"_file_vitro-preview_2RVdrbm","vitro-preview-container":"_file_vitro-preview-container_2dmbDD7","vitro-flex":"_file_vitro-flex_3nGTlWX","vitro-image":"_file_vitro-image_2Bt3otk","vitro-file-name":"_file_vitro-file-name_2t9Y643","vitro-file-size":"_file_vitro-file-size_15f_E_0","vitro-dropdown-button":"_file_vitro-dropdown-button_3MgI2n9"};
 
 var File = function File(props) {
   var onClick = function onClick() {
@@ -83721,36 +82798,36 @@ var File = function File(props) {
       props.onClick(props.id);
     }
   };
-  var className = [styles$1l['vitro-file'], props.className || CTRL.EMPTY, props.isImage ? styles$1l['vitro-preview'] : CTRL.EMPTY].join(CTRL.SPACE);
+  var className = [styles$1k['vitro-file'], props.className || CTRL.EMPTY, props.isImage ? styles$1k['vitro-preview'] : CTRL.EMPTY].join(CTRL.SPACE);
   return React__default.createElement(FlexBox, {
     className: className,
     isColumn: true
   }, props.actionList && props.actionList.length ? React__default.createElement(DropdownButton, {
     itemList: props.actionList,
-    className: styles$1l['vitro-dropdown-button']
+    className: styles$1k['vitro-dropdown-button']
   }) : null, props.preview && React__default.createElement(Tooltip$1, {
     placement: PLACEMENT.TOP,
     text: props.tooltip || CTRL.EMPTY
   }, React__default.createElement("div", {
-    className: styles$1l['vitro-preview-container'],
+    className: styles$1k['vitro-preview-container'],
     onClick: onClick
   }, React__default.createElement("img", {
     src: props.preview
   }))), !props.isImage && React__default.createElement(FlexBox, {
-    className: styles$1l['vitro-flex'] + (props.contentClassName ? CTRL.SPACE + props.contentClassName : CTRL.EMPTY)
+    className: styles$1k['vitro-flex'] + (props.contentClassName ? CTRL.SPACE + props.contentClassName : CTRL.EMPTY)
   }, props.image && React__default.createElement("img", {
     src: props.image,
-    className: styles$1l['vitro-image']
+    className: styles$1k['vitro-image']
   }), React__default.createElement(FlexBox, {
     isColumn: true
   }, React__default.createElement("span", {
-    className: styles$1l['vitro-file-name']
+    className: styles$1k['vitro-file-name']
   }, props.name), React__default.createElement("span", {
-    className: styles$1l['vitro-file-size']
+    className: styles$1k['vitro-file-size']
   }, props.size))), props.children);
 };
 
-var styles$1m = {"vitro-file-list-container":"_attached-file-list_vitro-file-list-container_5PIFyI7","vitro-overflow-button":"_attached-file-list_vitro-overflow-button_39QxX1m","vitro-item-count":"_attached-file-list_vitro-item-count_35PIT1U","vitro-file":"_attached-file-list_vitro-file_2mPE3Rq"};
+var styles$1l = {"vitro-file-list-container":"_attached-file-list_vitro-file-list-container_5PIFyI7","vitro-overflow-button":"_attached-file-list_vitro-overflow-button_39QxX1m","vitro-item-count":"_attached-file-list_vitro-item-count_35PIT1U","vitro-file":"_attached-file-list_vitro-file_2mPE3Rq"};
 
 var AttachedFileListItem = function AttachedFileListItem(props) {
   var _useState = React.useState(null),
@@ -83766,14 +82843,14 @@ var AttachedFileListItem = function AttachedFileListItem(props) {
   return React__default.createElement(React__default.Fragment, null, props.fileList.map(function (file, index) {
     if (index < props.maxVisibleFileCount) {
       return React__default.createElement(File, Object.assign({}, file, {
-        className: styles$1m['vitro-file']
+        className: styles$1l['vitro-file']
       }));
     }
     return React__default.createElement(React__default.Fragment, null);
   }), props.fileList.length > props.maxVisibleFileCount && !hiddenFileList ? React__default.createElement("div", {
-    className: styles$1m['vitro-overflow-button']
+    className: styles$1l['vitro-overflow-button']
   }, React__default.createElement("div", {
-    className: styles$1m['vitro-item-count'],
+    className: styles$1l['vitro-item-count'],
     onClick: function onClick() {
       return onHiddenFileListClick(props.fileList.slice(props.maxVisibleFileCount));
     }
@@ -83782,10 +82859,10 @@ var AttachedFileListItem = function AttachedFileListItem(props) {
     text: props.hiddenFileCountTooltip || CTRL.EMPTY
   }, React__default.createElement("div", null, CTRL.PLUS + (props.fileList.length - props.maxVisibleFileCount)))), React__default.createElement(File, Object.assign({}, props.fileList[props.maxVisibleFileCount], {
     actionList: [],
-    className: styles$1m['vitro-file']
+    className: styles$1l['vitro-file']
   }))) : null, hiddenFileList && hiddenFileList.map(function (file) {
     return React__default.createElement(File, Object.assign({}, file, {
-      className: styles$1m['vitro-file']
+      className: styles$1l['vitro-file']
     }));
   }));
 };
@@ -83821,7 +82898,7 @@ var AttachedFileList = function AttachedFileList(props) {
     }
   };
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
-    className: styles$1m['vitro-file-list-container']
+    className: styles$1l['vitro-file-list-container']
   }, imageList && React__default.createElement(AttachedFileListItem, {
     fileList: imageList,
     maxVisibleFileCount: maxImageCount,
@@ -83835,48 +82912,48 @@ var AttachedFileList = function AttachedFileList(props) {
   })));
 };
 
-var styles$1n = {"vitro-activity-message":"_activity-message_vitro-activity-message_3GdyQuC","vitro-item":"_activity-message_vitro-item_3Q-7zX3","vitro-value":"_activity-message_vitro-value_O4DpuTR","vitro-message":"_activity-message_vitro-message_25otUOy","vitro-field-name":"_activity-message_vitro-field-name_hdjdQbg","vitro-ellipsis":"_activity-message_vitro-ellipsis_1fIRwiW","vitro-value-content":"_activity-message_vitro-value-content_1fdGuBJ","vitro-value-tooltip":"_activity-message_vitro-value-tooltip_3oYwdFU"};
+var styles$1m = {"vitro-activity-message":"_activity-message_vitro-activity-message_3GdyQuC","vitro-item":"_activity-message_vitro-item_3Q-7zX3","vitro-value":"_activity-message_vitro-value_O4DpuTR","vitro-message":"_activity-message_vitro-message_25otUOy","vitro-field-name":"_activity-message_vitro-field-name_hdjdQbg","vitro-ellipsis":"_activity-message_vitro-ellipsis_1fIRwiW","vitro-value-content":"_activity-message_vitro-value-content_1fdGuBJ","vitro-value-tooltip":"_activity-message_vitro-value-tooltip_3oYwdFU"};
 
 var ActivityMessage = function ActivityMessage(props) {
   var onUpdateTooltip = function onUpdateTooltip(isEnabled, element) {
     if (element) {
       if (isEnabled) {
-        element.classList.add(styles$1n['vitro-ellipsis']);
+        element.classList.add(styles$1m['vitro-ellipsis']);
       } else {
-        element.classList.remove(styles$1n['vitro-ellipsis']);
+        element.classList.remove(styles$1m['vitro-ellipsis']);
       }
     }
   };
   return React__default.createElement(React__default.Fragment, null, props.changedValueList.length ? React__default.createElement("div", {
-    className: styles$1n['vitro-activity-message']
+    className: styles$1m['vitro-activity-message']
   }, props.changedValueList.map(function (item) {
     var value = React__default.createElement("div", {
-      className: styles$1n['vitro-value-content']
+      className: styles$1m['vitro-value-content']
     }, item.oldValue && React__default.createElement(React__default.Fragment, null, React__default.createElement("span", {
-      className: styles$1n['vitro-value'],
+      className: styles$1m['vitro-value'],
       dangerouslySetInnerHTML: item.isRichText ? {
         __html: item.oldValue
       } : undefined
     }, item.isRichText ? undefined : item.oldValue), React__default.createElement("div", {
       className: 'vitro-arrow-separator'
     })), item.newValue && React__default.createElement("span", {
-      className: item.isMessage ? styles$1n['vitro-message'] : styles$1n['vitro-value'],
+      className: item.isMessage ? styles$1m['vitro-message'] : styles$1m['vitro-value'],
       dangerouslySetInnerHTML: item.isRichText ? {
         __html: item.newValue
       } : undefined
     }, item.isRichText ? undefined : item.newValue));
     var containerRef = React__default.createRef();
     return React__default.createElement("div", {
-      className: styles$1n['vitro-item'],
+      className: styles$1m['vitro-item'],
       ref: containerRef
     }, item.fieldName && React__default.createElement("span", {
-      className: styles$1n['vitro-field-name']
+      className: styles$1m['vitro-field-name']
     }, "" + item.fieldName + CTRL.COLON), React__default.createElement(ValueTooltip, {
       text: renderToString$1(value),
       isRichText: true,
       containerRef: containerRef,
       isMultiline: true,
-      className: styles$1n['vitro-value-tooltip'],
+      className: styles$1m['vitro-value-tooltip'],
       onUpdate: function onUpdate(isEnabled) {
         return onUpdateTooltip(isEnabled, containerRef.current);
       }
@@ -83893,7 +82970,7 @@ var LOCALE$a;
   LOCALE["ADD_FILE"] = "app.common.messageInput.action.addFile";
 })(LOCALE$a || (LOCALE$a = {}));
 
-var styles$1o = {"vitro-attached-file-container":"_attached-file_vitro-attached-file-container_3AhHHlm","vitro-attached-file":"_attached-file_vitro-attached-file_1R6PPQN","vitro-button-remove":"_attached-file_vitro-button-remove_3ehToHf"};
+var styles$1n = {"vitro-attached-file-container":"_attached-file_vitro-attached-file-container_3AhHHlm","vitro-attached-file":"_attached-file_vitro-attached-file_1R6PPQN","vitro-button-remove":"_attached-file_vitro-button-remove_3ehToHf"};
 
 var AttachedFile = function AttachedFile(props) {
   var _useState = React.useState(null),
@@ -83931,23 +83008,23 @@ var AttachedFile = function AttachedFile(props) {
     return null;
   }
   return React__default.createElement("div", {
-    className: styles$1o['vitro-attached-file-container']
+    className: styles$1n['vitro-attached-file-container']
   }, React__default.createElement(Tooltip$1, {
     placement: PLACEMENT.TOP,
     text: localeService.create(LOCALE$a.DELETE_FILE)
   }, React__default.createElement("button", {
-    className: styles$1o['vitro-button-remove'],
+    className: styles$1n['vitro-button-remove'],
     onClick: function onClick() {
       return props.onDelete(props.index);
     }
   })), React__default.createElement(File, Object.assign({
     id: "" + props.index
   }, file, {
-    className: styles$1o['vitro-attached-file']
+    className: styles$1n['vitro-attached-file']
   })));
 };
 
-var styles$1p = {"vitro-message-input":"_message-input_vitro-message-input_3MkcjWD","vitro-control":"_message-input_vitro-control_1PUSjq9","vitro-message":"_message-input_vitro-message_2EJSy-9","vitro-placeholder":"_message-input_vitro-placeholder_1FBfIqN","vitro-button-add-file":"_message-input_vitro-button-add-file_1qdtHHq","vitro-button-send":"_message-input_vitro-button-send_1vktQrZ","vitro-display-none":"_message-input_vitro-display-none_2dYTZ22","vitro-attached-file-list":"_message-input_vitro-attached-file-list_l95S4VR","vitro-flex":"_message-input_vitro-flex_18M_7xU"};
+var styles$1o = {"vitro-message-input":"_message-input_vitro-message-input_3MkcjWD","vitro-control":"_message-input_vitro-control_1PUSjq9","vitro-message":"_message-input_vitro-message_2EJSy-9","vitro-placeholder":"_message-input_vitro-placeholder_1FBfIqN","vitro-button-add-file":"_message-input_vitro-button-add-file_1qdtHHq","vitro-button-send":"_message-input_vitro-button-send_1vktQrZ","vitro-display-none":"_message-input_vitro-display-none_2dYTZ22","vitro-attached-file-list":"_message-input_vitro-attached-file-list_l95S4VR","vitro-flex":"_message-input_vitro-flex_18M_7xU"};
 
 var MessageInput = React.forwardRef(function (props, ref) {
   var _useState = React.useState(true),
@@ -84060,12 +83137,12 @@ var MessageInput = React.forwardRef(function (props, ref) {
     }
   };
   return React__default.createElement("div", {
-    className: styles$1p['vitro-message-input'],
+    className: styles$1o['vitro-message-input'],
     onDrop: props.onDrop
   }, React__default.createElement("div", {
-    className: styles$1p['vitro-control']
+    className: styles$1o['vitro-control']
   }, fileList.length ? React__default.createElement("div", {
-    className: styles$1p['vitro-attached-file-list']
+    className: styles$1o['vitro-attached-file-list']
   }, React__default.createElement(ScrollBar, null, fileList.map(function (file, index) {
     return React__default.createElement(AttachedFile, {
       key: index,
@@ -84076,11 +83153,11 @@ var MessageInput = React.forwardRef(function (props, ref) {
       getFileSize: props.getFileSize
     });
   }))) : null, React__default.createElement(FlexBox, {
-    className: styles$1p['vitro-flex']
+    className: styles$1o['vitro-flex']
   }, !props.isDisabled && React__default.createElement(ScrollBar, {
     isHideScrollX: true
   }, React__default.createElement("div", {
-    className: styles$1p['vitro-message'],
+    className: styles$1o['vitro-message'],
     ref: inputRef,
     onInput: onChange,
     onKeyDown: onKeyDown,
@@ -84090,20 +83167,20 @@ var MessageInput = React.forwardRef(function (props, ref) {
     onDrop: onDrop,
     contentEditable: true
   }, isShowPlaceholder && React__default.createElement("span", {
-    className: styles$1p['vitro-placeholder']
+    className: styles$1o['vitro-placeholder']
   }, props.placeholder || localeService.create(LOCALE$a.PLACEHOLDER)))), props.children, props.onSelectFiles && React__default.createElement(React__default.Fragment, null, React__default.createElement(ImageButton, {
     onClick: selectFile,
     tooltipText: localeService.create(LOCALE$a.ADD_FILE),
-    className: styles$1p['vitro-button-add-file']
+    className: styles$1o['vitro-button-add-file']
   }), React__default.createElement("input", {
     type: 'file',
     onChange: onSelectFile,
     ref: fileInputRef,
-    className: styles$1p['vitro-display-none'],
+    className: styles$1o['vitro-display-none'],
     multiple: true
   })))), React__default.createElement(ImageButton, {
     onClick: onEnter,
-    className: styles$1p['vitro-button-send']
+    className: styles$1o['vitro-button-send']
   }));
 });
 
@@ -84118,7 +83195,7 @@ var LOCALE$b;
   LOCALE["ACTION_DELETE"] = "app.common.action.delete";
 })(LOCALE$b || (LOCALE$b = {}));
 
-var styles$1q = {"vitro-image-picker-root":"_image-picker_vitro-image-picker-root_AqOYRhP","vitro-image-picker-dropdown-wrapper":"_image-picker_vitro-image-picker-dropdown-wrapper_8Tr_BBS","vitro-image-picker-defaultImage-wrapper":"_image-picker_vitro-image-picker-defaultImage-wrapper_1BHZ1he","vitro-image-picker-image-wrapper":"_image-picker_vitro-image-picker-image-wrapper_328OVLU","vitro-image-picker-input":"_image-picker_vitro-image-picker-input_12jFFNU","vitro-image-default":"_image-picker_vitro-image-default_LhN4iy6","vitro-image-picker-label-wrapper":"_image-picker_vitro-image-picker-label-wrapper_WRLzUYM","vitro-image-picker-wrapper":"_image-picker_vitro-image-picker-wrapper_dlZyYFL","vitro-required":"_image-picker_vitro-required_2lpwlb0"};
+var styles$1p = {"vitro-image-picker-root":"_image-picker_vitro-image-picker-root_AqOYRhP","vitro-image-picker-dropdown-wrapper":"_image-picker_vitro-image-picker-dropdown-wrapper_8Tr_BBS","vitro-image-picker-defaultImage-wrapper":"_image-picker_vitro-image-picker-defaultImage-wrapper_1BHZ1he","vitro-image-picker-image-wrapper":"_image-picker_vitro-image-picker-image-wrapper_328OVLU","vitro-image-picker-input":"_image-picker_vitro-image-picker-input_12jFFNU","vitro-image-default":"_image-picker_vitro-image-default_LhN4iy6","vitro-image-picker-label-wrapper":"_image-picker_vitro-image-picker-label-wrapper_WRLzUYM","vitro-image-picker-wrapper":"_image-picker_vitro-image-picker-wrapper_dlZyYFL","vitro-required":"_image-picker_vitro-required_2lpwlb0"};
 
 var ImagePicker = function ImagePicker(props) {
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
@@ -84126,16 +83203,16 @@ var ImagePicker = function ImagePicker(props) {
   var renderPreview = function renderPreview() {
     if (props.defaultUrl) {
       return React__default.createElement("div", {
-        className: props.classNameDefaultImage ? props.classNameDefaultImage : styles$1q['vitro-image-picker-image-wrapper']
+        className: props.classNameDefaultImage ? props.classNameDefaultImage : styles$1p['vitro-image-picker-image-wrapper']
       }, React__default.createElement(Image, {
         defaultUrl: props.defaultUrl,
-        className: props.classNameImage ? props.classNameImage : styles$1q['vitro-image-picker-image']
+        className: props.classNameImage ? props.classNameImage : styles$1p['vitro-image-picker-image']
       }));
     } else {
       return React__default.createElement("div", {
-        className: props.classNameDefaultImage ? props.classNameDefaultImage : styles$1q['vitro-image-picker-defaultImage-wrapper']
+        className: props.classNameDefaultImage ? props.classNameDefaultImage : styles$1p['vitro-image-picker-defaultImage-wrapper']
       }, React__default.createElement("div", {
-        className: styles$1q['vitro-image-default']
+        className: styles$1p['vitro-image-default']
       }));
     }
   };
@@ -84151,11 +83228,7 @@ var ImagePicker = function ImagePicker(props) {
         return inputFileRef === null || inputFileRef === void 0 ? void 0 : (_inputFileRef$current = inputFileRef.current) === null || _inputFileRef$current === void 0 ? void 0 : _inputFileRef$current.click();
       },
       text: localeService.create(LOCALE$b.ACTION_UPLOAD),
-      value: ACTION$3.UPLOAD,
       key: ACTION$3.UPLOAD,
-      actionCode: ACTION$3.UPLOAD,
-      isConfirm: false,
-      isOverflow: false,
       imageUrl: props.imgUrlUpload
     }];
     if (props.defaultUrl) {
@@ -84164,30 +83237,27 @@ var ImagePicker = function ImagePicker(props) {
           return onChange(null);
         },
         text: localeService.create(LOCALE$b.ACTION_DELETE),
-        value: ACTION$3.DELETE,
         key: ACTION$3.DELETE,
-        actionCode: ACTION$3.DELETE,
-        isConfirm: false,
-        isOverflow: false,
         imageUrl: props.imgUrlDelete
       });
     }
     return (_props$itemList = props.itemList) !== null && _props$itemList !== void 0 && _props$itemList.length ? result.concat(props.itemList) : result;
   }, [props.itemList, props.defaultUrl]);
   return React__default.createElement("div", {
-    className: styles$1q['vitro-image-picker-wrapper']
+    className: styles$1p['vitro-image-picker-wrapper']
   }, React__default.createElement("div", {
-    className: styles$1q['vitro-image-picker-label-wrapper']
+    className: styles$1p['vitro-image-picker-label-wrapper']
   }, props.label ? props.label : '', props.isRequired && React__default.createElement("span", {
-    className: styles$1q['vitro-required']
+    className: styles$1p['vitro-required']
   }, CTRL.ASTERISK)), React__default.createElement("div", {
-    className: props.classNameRoot ? props.classNameRoot : styles$1q['vitro-image-picker-root']
+    className: props.classNameRoot ? props.classNameRoot : styles$1p['vitro-image-picker-root']
   }, !props.isReadOnly && React__default.createElement(DropdownButton, {
     itemList: defaultItemList,
-    className: styles$1q['vitro-image-picker-dropdown-wrapper']
+    containerClassName: styles$1p['vitro-image-picker-dropdown-wrapper'],
+    className: STYLE$1.CONTEXT
   }), React__default.createElement("input", {
     type: 'file',
-    className: styles$1q['vitro-image-picker-input'],
+    className: styles$1p['vitro-image-picker-input'],
     ref: inputFileRef,
     onChange: onChange,
     accept: 'image/*'
@@ -84196,7 +83266,7 @@ var ImagePicker = function ImagePicker(props) {
   }));
 };
 
-var styles$1r = {"vitro-criterion-container":"_item_vitro-criterion-container_3cAvpK0","vitro-control":"_item_vitro-control_2yXKeQZ","vitro-label":"_item_vitro-label_1UoRViU","vitro-button-cancel":"_item_vitro-button-cancel_3FPRPrk","vitro-focus":"_item_vitro-focus_1VqbeO1","vitro-error":"_item_vitro-error_2VnXFaz","vitro-image":"_item_vitro-image_24giw0o"};
+var styles$1q = {"vitro-criterion-container":"_item_vitro-criterion-container_3cAvpK0","vitro-control":"_item_vitro-control_2yXKeQZ","vitro-label":"_item_vitro-label_1UoRViU","vitro-button-cancel":"_item_vitro-button-cancel_3FPRPrk","vitro-focus":"_item_vitro-focus_1VqbeO1","vitro-error":"_item_vitro-error_2VnXFaz","vitro-image":"_item_vitro-image_24giw0o"};
 
 var Item$3 = function Item(props) {
   var _useState = React.useState(CTRL.EMPTY),
@@ -84211,13 +83281,13 @@ var Item$3 = function Item(props) {
   }, []);
   var labelRef = React.useRef(null);
   var onFocus = function onFocus(e) {
-    setState(styles$1r['vitro-focus']);
+    setState(styles$1q['vitro-focus']);
     if (componentProps.onFocus) {
       componentProps.onFocus(e);
     }
   };
   var onBlur = function onBlur(e) {
-    setState(componentProps.errorMessage ? styles$1r['vitro-error'] : CTRL.EMPTY);
+    setState(componentProps.errorMessage ? styles$1q['vitro-error'] : CTRL.EMPTY);
     if (componentProps.onBlur) {
       componentProps.onBlur(e);
     }
@@ -84232,15 +83302,15 @@ var Item$3 = function Item(props) {
     onChange(value);
   };
   return React__default.createElement(FlexBox, {
-    className: props.isMobileView ? styles$1r['vitro-criterion-container-mobile'] : styles$1r['vitro-criterion-container']
+    className: props.isMobileView ? styles$1q['vitro-criterion-container-mobile'] : styles$1q['vitro-criterion-container']
   }, React__default.createElement("div", {
-    className: styles$1r['vitro-control'] + CTRL.SPACE + state
+    className: styles$1q['vitro-control'] + CTRL.SPACE + state
   }, React__default.createElement(Label, {
     ref: labelRef,
     text: props.label,
-    className: styles$1r['vitro-label']
+    className: styles$1q['vitro-label']
   }), React__default.createElement(props.content.component, _extends({}, componentProps, {
-    className: styles$1r['vitro-control'],
+    className: styles$1q['vitro-control'],
     onBlur: onBlur,
     onFocus: onFocus,
     onChange: onControlChange,
@@ -84252,11 +83322,11 @@ var Item$3 = function Item(props) {
     onClick: function onClick() {
       return props.onDelete(componentProps.id);
     },
-    className: styles$1r['vitro-button-cancel']
+    className: styles$1q['vitro-button-cancel']
   }));
 };
 
-var styles$1s = {"vitro-field-iterator":"_editable-field-iterator_vitro-field-iterator_myx5yu3"};
+var styles$1r = {"vitro-field-iterator":"_editable-field-iterator_vitro-field-iterator_myx5yu3"};
 
 var EditableFieldIterator = function EditableFieldIterator(props) {
   var _useState = React.useState(null),
@@ -84316,7 +83386,7 @@ var EditableFieldIterator = function EditableFieldIterator(props) {
     props.onChange(changedFieldValueMap);
   };
   return React__default.createElement("div", {
-    className: styles$1s['vitro-filter']
+    className: styles$1r['vitro-filter']
   }, props.isNoScrollBar ? componentMap && React__default.createElement(FieldIterator, {
     fieldList: props.fieldList,
     fieldValueMap: fieldValueMap,
@@ -84324,9 +83394,9 @@ var EditableFieldIterator = function EditableFieldIterator(props) {
     componentMap: componentMap,
     onChange: onChange,
     isVisibleOverflow: true,
-    className: styles$1s['vitro-field-iterator']
+    className: styles$1r['vitro-field-iterator']
   }) : React__default.createElement(ScrollBar, {
-    className: styles$1s['vitro-scrollbar']
+    className: styles$1r['vitro-scrollbar']
   }, componentMap && React__default.createElement(FieldIterator, {
     fieldList: props.fieldList,
     fieldValueMap: fieldValueMap,
@@ -84334,7 +83404,7 @@ var EditableFieldIterator = function EditableFieldIterator(props) {
     componentMap: componentMap,
     onChange: onChange,
     isVisibleOverflow: true,
-    className: styles$1s['vitro-field-iterator']
+    className: styles$1r['vitro-field-iterator']
   })));
 };
 
@@ -84400,7 +83470,7 @@ var Splitter = function Splitter(props) {
   }, props.children);
 };
 
-var styles$1t = {"vitro-route-item":"_route-item_vitro-route-item_bBCgBZG","vitro-route-item-body":"_route-item_vitro-route-item-body_1_1fjOZ","vitro-route-item-content":"_route-item_vitro-route-item-content_2CcLogk","vitro-button-collapse":"_route-item_vitro-button-collapse_1kVB5Vo","vitro-button-expand":"_route-item_vitro-button-expand_3IuABa1","vitro-button-hide-comment":"_route-item_vitro-button-hide-comment_2CiY-Ch","vitro-button-show-comment":"_route-item_vitro-button-show-comment_DJt2SLC","vitro-avatar":"_route-item_vitro-avatar_3Dypnmz","vitro-date":"_route-item_vitro-date_3ojnKSb","vitro-route-item-header":"_route-item_vitro-route-item-header_y69bLwZ","vitro-flex":"_route-item_vitro-flex_3ebkqZ9","vitro-comment":"_route-item_vitro-comment_2K7RwrZ","vitro-status-color":"_route-item_vitro-status-color_VgXzXKD"};
+var styles$1s = {"vitro-route-item":"_route-item_vitro-route-item_bBCgBZG","vitro-route-item-body":"_route-item_vitro-route-item-body_1_1fjOZ","vitro-route-item-content":"_route-item_vitro-route-item-content_2CcLogk","vitro-button-collapse":"_route-item_vitro-button-collapse_1kVB5Vo","vitro-button-expand":"_route-item_vitro-button-expand_3IuABa1","vitro-button-hide-comment":"_route-item_vitro-button-hide-comment_2CiY-Ch","vitro-button-show-comment":"_route-item_vitro-button-show-comment_DJt2SLC","vitro-avatar":"_route-item_vitro-avatar_3Dypnmz","vitro-date":"_route-item_vitro-date_3ojnKSb","vitro-route-item-header":"_route-item_vitro-route-item-header_y69bLwZ","vitro-flex":"_route-item_vitro-flex_3ebkqZ9","vitro-comment":"_route-item_vitro-comment_2K7RwrZ","vitro-status-color":"_route-item_vitro-status-color_VgXzXKD"};
 
 var RouteItem = function RouteItem(props) {
   var _useState = React.useState(true),
@@ -84410,46 +83480,46 @@ var RouteItem = function RouteItem(props) {
     isShowComment = _useState2[0],
     setIsShowComment = _useState2[1];
   return React__default.createElement("div", {
-    className: styles$1t['vitro-route-item']
+    className: styles$1s['vitro-route-item']
   }, props.children ? React__default.createElement("button", {
-    className: isExpanded ? styles$1t['vitro-button-collapse'] : styles$1t['vitro-button-expand'],
+    className: isExpanded ? styles$1s['vitro-button-collapse'] : styles$1s['vitro-button-expand'],
     onClick: function onClick() {
       return setIsExpanded(!isExpanded);
     }
   }) : null, React__default.createElement("div", {
-    className: styles$1t['vitro-route-item-content']
+    className: styles$1s['vitro-route-item-content']
   }, props.userName && props.status && React__default.createElement("div", {
-    className: styles$1t['vitro-route-item-header']
+    className: styles$1s['vitro-route-item-header']
   }, React__default.createElement("div", null, React__default.createElement("div", null, React__default.createElement(Avatar, {
     userName: props.userName,
     image: props.userImage,
-    className: styles$1t['vitro-avatar']
+    className: styles$1s['vitro-avatar']
   }), props.userName), React__default.createElement("div", {
-    className: styles$1t['vitro-date']
+    className: styles$1s['vitro-date']
   }, props.date)), React__default.createElement("div", null, React__default.createElement("div", null, props.statusColor && React__default.createElement("div", {
-    className: styles$1t['vitro-status-color'],
+    className: styles$1s['vitro-status-color'],
     style: {
       background: props.statusColor
     }
   }), props.status), React__default.createElement("div", null, React__default.createElement("a", {
     href: props.itemUrl
   }, CTRL.SHARP + props.itemId)))), React__default.createElement("div", {
-    className: styles$1t['vitro-route-item-body']
+    className: styles$1s['vitro-route-item-body']
   }, React__default.createElement("div", {
-    className: styles$1t['vitro-flex']
+    className: styles$1s['vitro-flex']
   }, React__default.createElement("span", null, props.name), props.comment && React__default.createElement("button", {
-    className: isShowComment ? styles$1t['vitro-button-hide-comment'] : styles$1t['vitro-button-show-comment'],
+    className: isShowComment ? styles$1s['vitro-button-hide-comment'] : styles$1s['vitro-button-show-comment'],
     onClick: function onClick() {
       return setIsShowComment(!isShowComment);
     }
   })), isShowComment && props.comment && React__default.createElement("div", {
-    className: styles$1t['vitro-comment']
+    className: styles$1s['vitro-comment']
   }, props.comment)), isExpanded && React__default.createElement("div", {
-    className: styles$1t['vitro-route-item-child']
+    className: styles$1s['vitro-route-item-child']
   }, props.children)));
 };
 
-var w$a = window;
+var w$9 = window;
 var ID_FILE_VERSION_SELECT$1 = 'fileVersionSelect';
 var Viewer$1 = function Viewer(props) {
   React.useEffect(function () {
@@ -84460,11 +83530,11 @@ var Viewer$1 = function Viewer(props) {
   var init = function init() {
     initSearchCriterionList();
     var initViewer = function initViewer() {
-      if (w$a.initBimViewer) {
+      if (w$9.initBimViewer) {
         var context = _extends({}, props.context, {
           initIssueList: initIssueList
         });
-        w$a.initBimViewer(context);
+        w$9.initBimViewer(context);
         initFileVersionSelect();
       } else {
         setTimeout(initViewer, 100);
@@ -84504,7 +83574,7 @@ var Viewer$1 = function Viewer(props) {
   };
   var initSearchCriterionList = function initSearchCriterionList() {
     if (props.context.searchCriterionList) {
-      w$a.searchCriterionList = getPredefinedSearchCriterionList(props.context.searchCriterionList);
+      w$9.searchCriterionList = getPredefinedSearchCriterionList(props.context.searchCriterionList);
     }
   };
   var getPredefinedSearchCriterionList = function getPredefinedSearchCriterionList(searchCriterionList) {
@@ -84576,7 +83646,7 @@ var BimViewer = function BimViewer(props) {
   });
 };
 
-var styles$1u = {"vitro-scroll-view":"_scroll-view_vitro-scroll-view_TXQ8QQh"};
+var styles$1t = {"vitro-scroll-view":"_scroll-view_vitro-scroll-view_TXQ8QQh"};
 
 var COMPONENT_NAME = 'kendoScrollView';
 var CONTENT_HEIGHT = 100;
@@ -84621,27 +83691,27 @@ var ScrollView = function ScrollView(props) {
   };
   return React__default.createElement("div", {
     ref: scrollViewRef,
-    className: styles$1u['vitro-scroll-view'] + CTRL.SPACE + (props.className || CTRL.EMPTY),
+    className: styles$1t['vitro-scroll-view'] + CTRL.SPACE + (props.className || CTRL.EMPTY),
     tabIndex: 0
   }, props.itemList.map(function (item) {
     return React__default.createElement(item.component, item.props);
   }));
 };
 
-var styles$1v = {"vitro-image-container":"_page_vitro-image-container_QEXhGHE"};
+var styles$1u = {"vitro-image-container":"_page_vitro-image-container_QEXhGHE"};
 
 var Page = function Page(props) {
   return React__default.createElement("div", {
-    className: styles$1v['vitro-page'],
+    className: styles$1u['vitro-page'],
     "data-role": "page"
   }, React__default.createElement("div", {
-    className: styles$1v['vitro-image-container']
+    className: styles$1u['vitro-image-container']
   }, React__default.createElement("img", {
     src: props.url
   })));
 };
 
-var styles$1w = {"vitro-image-viewer":"_image-viewer_vitro-image-viewer_19T7Auc","vitro-header":"_image-viewer_vitro-header_1KIbDWk","vitro-button-close":"_image-viewer_vitro-button-close_36TY-iY","vitro-scroll-view":"_image-viewer_vitro-scroll-view_3nuGD7c","vitro-dropdown-button":"_image-viewer_vitro-dropdown-button_2TOT1pw","vitro-pager":"_image-viewer_vitro-pager_1FiaoGR"};
+var styles$1v = {"vitro-image-viewer":"_image-viewer_vitro-image-viewer_19T7Auc","vitro-header":"_image-viewer_vitro-header_1KIbDWk","vitro-button-close":"_image-viewer_vitro-button-close_36TY-iY","vitro-scroll-view":"_image-viewer_vitro-scroll-view_3nuGD7c","vitro-dropdown-button":"_image-viewer_vitro-dropdown-button_2TOT1pw","vitro-pager":"_image-viewer_vitro-pager_1FiaoGR"};
 
 var ImageViewer = React.forwardRef(function (props, ref) {
   var _props$itemList$;
@@ -84699,25 +83769,25 @@ var ImageViewer = React.forwardRef(function (props, ref) {
     }
   };
   return React__default.createElement(React__default.Fragment, null, itemList.length ? React__default.createElement("div", {
-    className: styles$1w['vitro-image-viewer']
+    className: styles$1v['vitro-image-viewer']
   }, React__default.createElement("div", {
-    className: styles$1w['vitro-header']
+    className: styles$1v['vitro-header']
   }, actionList.length ? React__default.createElement(DropdownButton, {
     itemList: actionList,
-    className: styles$1w['vitro-dropdown-button']
+    className: styles$1v['vitro-dropdown-button']
   }) : null, React__default.createElement("button", {
-    className: styles$1w['vitro-button-close'],
+    className: styles$1v['vitro-button-close'],
     onClick: props.onCloseClick
   })), React__default.createElement(ScrollView, {
     itemList: itemList,
     onChange: onChange,
-    className: styles$1w['vitro-scroll-view'],
+    className: styles$1v['vitro-scroll-view'],
     isEnablePager: true,
     activePage: props.activePage
   })) : null);
 });
 
-var styles$1x = {"vitro-page":"_page-layout_vitro-page_GzZ3agH"};
+var styles$1w = {"vitro-page":"_page-layout_vitro-page_GzZ3agH"};
 
 var PageLayout = function PageLayout(props) {
   var getClassName = function getClassName(sidebar) {
@@ -84731,7 +83801,7 @@ var PageLayout = function PageLayout(props) {
     return CTRL.SPACE + classNameArr.join(CTRL.SPACE);
   };
   return React__default.createElement("div", {
-    className: styles$1x['vitro-page'] + getClassName(props.sidebar) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    className: styles$1w['vitro-page'] + getClassName(props.sidebar) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
     id: 'vitro-page'
   }, props.children);
 };
@@ -84746,7 +83816,7 @@ var HeaderConstants = {
     get LOCAL_STORAGE_KEY () { return LOCAL_STORAGE_KEY; }
 };
 
-var styles$1y = {"vitro-header":"_header_vitro-header_ta9aLJn"};
+var styles$1x = {"vitro-header":"_header_vitro-header_ta9aLJn"};
 
 var onChangeSidebarMode = function onChangeSidebarMode() {};
 var Header = function Header(props) {
@@ -84789,44 +83859,44 @@ var Header = function Header(props) {
     }
   }, [props.sidebar]);
   return React__default.createElement("div", {
-    className: styles$1y['vitro-header'],
+    className: styles$1x['vitro-header'],
     id: 'vitro-header',
     ref: ref
   }, props.children);
 };
 
-var styles$1z = {"vitro-nav-bar-sidebar-button":"_header-nav-bar-sidebar-button_vitro-nav-bar-sidebar-button_3IZcIOc"};
+var styles$1y = {"vitro-nav-bar-sidebar-button":"_header-nav-bar-sidebar-button_vitro-nav-bar-sidebar-button_3IZcIOc"};
 
 var SidebarButton = function SidebarButton(props) {
   return React__default.createElement("button", {
-    className: styles$1z['vitro-nav-bar-sidebar-button'],
+    className: styles$1y['vitro-nav-bar-sidebar-button'],
     onClick: props.onClick
   });
 };
 
-var styles$1A = {"vitro-nav-bar":"_header-nav-bar_vitro-nav-bar_EuyFIk8"};
+var styles$1z = {"vitro-nav-bar":"_header-nav-bar_vitro-nav-bar_EuyFIk8"};
 
 var HeaderNavBar = function HeaderNavBar(props) {
   return React__default.createElement("nav", {
-    className: styles$1A['vitro-nav-bar'] + CTRL.SPACE + ['navbar', 'navbar-expand-lg', 'navbar-light'].join(CTRL.SPACE)
+    className: styles$1z['vitro-nav-bar'] + CTRL.SPACE + ['navbar', 'navbar-expand-lg', 'navbar-light'].join(CTRL.SPACE)
   }, React__default.createElement(SidebarButton, {
     onClick: onChangeSidebarMode
   }), props.children);
 };
 
-var styles$1B = {"vitro-nav-service":"_header-nav-service_vitro-nav-service_1-i4GOh"};
+var styles$1A = {"vitro-nav-service":"_header-nav-service_vitro-nav-service_1-i4GOh"};
 
 var logoStyles = {"vitro-customer-logo":"_header-customer-logo_vitro-customer-logo_2htY4zG"};
 
 var HeaderNavService = function HeaderNavService(props) {
   return React__default.createElement("div", {
-    className: styles$1B['vitro-nav-service']
+    className: styles$1A['vitro-nav-service']
   }, React__default.createElement("div", {
     className: logoStyles['vitro-customer-logo']
   }), props.children);
 };
 
-var styles$1C = {"vitro-product-title":"_product-title_vitro-product-title_2gZcA5j"};
+var styles$1B = {"vitro-product-title":"_product-title_vitro-product-title_2gZcA5j"};
 
 var ProductTitle = function ProductTitle(props) {
   var content = React__default.createElement(React__default.Fragment, null, React__default.createElement(Image, {
@@ -84848,22 +83918,22 @@ var ProductTitle = function ProductTitle(props) {
   if (props.href) {
     return React__default.createElement("a", {
       href: props.href,
-      className: styles$1C['vitro-product-title'],
+      className: styles$1B['vitro-product-title'],
       title: props.imageCaption
     }, content);
   }
   return React__default.createElement("a", {
     onClick: onClick,
-    className: styles$1C['vitro-product-title'],
+    className: styles$1B['vitro-product-title'],
     title: props.imageCaption
   }, content);
 };
 
-var styles$1D = {"vitro-right":"_right-align-control-group_vitro-right_2vnd6R7"};
+var styles$1C = {"vitro-right":"_right-align-control-group_vitro-right_2vnd6R7"};
 
 var RightAlignControlGroup = function RightAlignControlGroup(props) {
   return React__default.createElement("div", {
-    className: styles$1D['vitro-right']
+    className: styles$1C['vitro-right']
   }, props.children);
 };
 
@@ -84873,32 +83943,32 @@ var LeftAlignControlGroup = function LeftAlignControlGroup(props) {
   }, props.children);
 };
 
-var styles$1E = {"vitro-center":"_center-align-control-group_vitro-center_3SHmVN-"};
+var styles$1D = {"vitro-center":"_center-align-control-group_vitro-center_3SHmVN-"};
 
 var CenterAlignControlGroup = function CenterAlignControlGroup(props) {
   return React__default.createElement("div", {
-    className: styles$1E['vitro-center']
+    className: styles$1D['vitro-center']
   }, props.children);
 };
 
-var styles$1F = {"vitro-main":"_main_vitro-main_Kk2JMBF"};
+var styles$1E = {"vitro-main":"_main_vitro-main_Kk2JMBF"};
 
 var Main = function Main(props) {
   return React__default.createElement("div", {
-    className: styles$1F['vitro-main'],
+    className: styles$1E['vitro-main'],
     id: 'vitro-main'
   }, props.children);
 };
 
-var styles$1G = {"vitro-table-view-detail":"_table-view-detail_vitro-table-view-detail_zxwp4XX"};
+var styles$1F = {"vitro-table-view-detail":"_table-view-detail_vitro-table-view-detail_zxwp4XX"};
 
 var TableViewDetail = function TableViewDetail(props) {
   return React__default.createElement("div", {
-    className: styles$1G['vitro-table-view-detail']
+    className: styles$1F['vitro-table-view-detail']
   }, props.children);
 };
 
-var styles$1H = {"vitro-control":"_radio_vitro-control_1pRRp6K","vitro-radio-content":"_radio_vitro-radio-content_2iXhEPK","vitro-disabled":"_radio_vitro-disabled_2JSpn9-","vitro-label":"_radio_vitro-label_21dXFJN","vitro-left-label":"_radio_vitro-left-label_3BbOjIR"};
+var styles$1G = {"vitro-control":"_radio_vitro-control_1pRRp6K","vitro-radio-content":"_radio_vitro-radio-content_2iXhEPK","vitro-disabled":"_radio_vitro-disabled_2JSpn9-","vitro-label":"_radio_vitro-label_21dXFJN","vitro-left-label":"_radio_vitro-left-label_3BbOjIR"};
 
 var Radio = React.forwardRef(function (props, ref) {
   var radioRef = React.useRef(null);
@@ -84922,14 +83992,14 @@ var Radio = React.forwardRef(function (props, ref) {
       props.onChange(props.value, e);
     }
   };
-  var className = styles$1H['vitro-control'] + (props.labelPosition === POSITION.LEFT ? CTRL.SPACE + styles$1H['vitro-left-label'] : CTRL.EMPTY) + CTRL.SPACE + (props.isDisabled ? styles$1H['vitro-disabled'] : CTRL.EMPTY) + CTRL.SPACE + (props.className || CTRL.EMPTY);
+  var className = styles$1G['vitro-control'] + (props.labelPosition === POSITION.LEFT ? CTRL.SPACE + styles$1G['vitro-left-label'] : CTRL.EMPTY) + CTRL.SPACE + (props.isDisabled ? styles$1G['vitro-disabled'] : CTRL.EMPTY) + 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$1H['vitro-label']
+    className: styles$1G['vitro-label']
   }), React__default.createElement("div", {
-    className: styles$1H['vitro-radio-content']
+    className: styles$1G['vitro-radio-content']
   }, React__default.createElement("input", {
     ref: radioRef,
     type: 'radio',
@@ -84941,7 +84011,7 @@ var Radio = React.forwardRef(function (props, ref) {
     onChange: onChange
   }), props.labelPosition !== POSITION.LEFT && React__default.createElement(Label, {
     text: props.label,
-    className: styles$1H['vitro-label']
+    className: styles$1G['vitro-label']
   })));
 });
 
@@ -84951,7 +84021,7 @@ var LOCALE$c;
   LOCALE["TOOLTIP_OPEN"] = "app.common.linkInput.tooltip.open";
 })(LOCALE$c || (LOCALE$c = {}));
 
-var styles$1I = {"vitro-link-input":"_link-input_vitro-link-input_1FBo8kO","vitro-edit-mode":"_link-input_vitro-edit-mode_2HhUoeO","vitro-control":"_link-input_vitro-control_1MGkxWi","vitro-read-only":"_link-input_vitro-read-only_AG9_cYJ","vitro-edit-button":"_link-input_vitro-edit-button_1PMQnWv","vitro-copy-button":"_link-input_vitro-copy-button_1uv79Zr"};
+var styles$1H = {"vitro-link-input":"_link-input_vitro-link-input_1FBo8kO","vitro-edit-mode":"_link-input_vitro-edit-mode_2HhUoeO","vitro-control":"_link-input_vitro-control_1MGkxWi","vitro-read-only":"_link-input_vitro-read-only_AG9_cYJ","vitro-edit-button":"_link-input_vitro-edit-button_1PMQnWv","vitro-copy-button":"_link-input_vitro-copy-button_1uv79Zr"};
 
 var LinkInput = React.forwardRef(function (props, ref) {
   var _useState = React.useState(false),
@@ -85028,7 +84098,7 @@ var LinkInput = React.forwardRef(function (props, ref) {
     }
     return value.uri;
   };
-  var className = styles$1I['vitro-link-input'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY) + (props.isReadOnly ? CTRL.SPACE + styles$1I['vitro-read-only'] : CTRL.EMPTY) + (isEditMode ? CTRL.SPACE + styles$1I['vitro-edit-mode'] : CTRL.EMPTY);
+  var className = styles$1H['vitro-link-input'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY) + (props.isReadOnly ? CTRL.SPACE + styles$1H['vitro-read-only'] : CTRL.EMPTY) + (isEditMode ? CTRL.SPACE + styles$1H['vitro-edit-mode'] : CTRL.EMPTY);
   return React__default.createElement("div", {
     className: className
   }, React__default.createElement(Tooltip$1, {
@@ -85047,14 +84117,14 @@ var LinkInput = React.forwardRef(function (props, ref) {
     isRequired: props.isRequired,
     isError: props.isError,
     isReadOnly: props.isReadOnly ? true : !isEditMode,
-    className: styles$1I['vitro-control']
+    className: styles$1H['vitro-control']
   }))), !props.isReadOnly && !isEditMode && React__default.createElement(ImageButton, {
     onClick: onClickEditButton,
     tooltipText: localeService.create(LOCALE$c.TOOLTIP_EDIT),
-    className: styles$1I['vitro-edit-button']
+    className: styles$1H['vitro-edit-button']
   }), props.isReadOnly && React__default.createElement(CopyButton, {
     value: getCopyValue(value),
-    className: styles$1I['vitro-copy-button']
+    className: styles$1H['vitro-copy-button']
   }));
 });
 
@@ -85071,7 +84141,7 @@ var LOCALE$d;
   LOCALE["SETTING_SYSTEM_INFO"] = "systemInformation";
 })(LOCALE$d || (LOCALE$d = {}));
 
-var styles$1J = {"vitro-system-exception-dialog":"_system-exception-dialog_vitro-system-exception-dialog_2UVdbuB","vitro-image":"_system-exception-dialog_vitro-image_XG5PD8h","vitro-exception":"_system-exception-dialog_vitro-exception_2bLGF01","vitro-exception-message":"_system-exception-dialog_vitro-exception-message_2S8ZwQP","vitro-label":"_system-exception-dialog_vitro-label_1Nbb_It","vitro-input":"_system-exception-dialog_vitro-input_262484M","vitro-flex":"_system-exception-dialog_vitro-flex_EHka5VC","vitro-settings-list":"_system-exception-dialog_vitro-settings-list_6N3QiPa","vitro-checkbox":"_system-exception-dialog_vitro-checkbox_354NjHR"};
+var styles$1I = {"vitro-system-exception-dialog":"_system-exception-dialog_vitro-system-exception-dialog_2UVdbuB","vitro-image":"_system-exception-dialog_vitro-image_XG5PD8h","vitro-exception":"_system-exception-dialog_vitro-exception_2bLGF01","vitro-exception-message":"_system-exception-dialog_vitro-exception-message_2S8ZwQP","vitro-label":"_system-exception-dialog_vitro-label_1Nbb_It","vitro-input":"_system-exception-dialog_vitro-input_262484M","vitro-flex":"_system-exception-dialog_vitro-flex_EHka5VC","vitro-settings-list":"_system-exception-dialog_vitro-settings-list_6N3QiPa","vitro-checkbox":"_system-exception-dialog_vitro-checkbox_354NjHR"};
 
 var settingsList = [LOCALE$d.SETTING_SCREENSHOT, LOCALE$d.SETTING_EXCEPTION_TEXT, LOCALE$d.SETTING_USER_NAME, LOCALE$d.SETTING_SYSTEM_INFO];
 var SystemExceptionDialog = function SystemExceptionDialog(props) {
@@ -85121,52 +84191,52 @@ var SystemExceptionDialog = function SystemExceptionDialog(props) {
     text: props.labelConfirm || localeService.create(LOCALE$d.ACTION_SEND)
   }];
   var hiddenContent = React__default.createElement("div", {
-    className: styles$1J['vitro-settings-list']
+    className: styles$1I['vitro-settings-list']
   }, settingsList.map(function (name, index) {
     return React__default.createElement("div", {
       key: index,
-      className: styles$1J['vitro-flex']
+      className: styles$1I['vitro-flex']
     }, React__default.createElement(Checkbox, {
       label: CTRL.EMPTY,
       name: name,
       value: true,
       onChange: onChangeSetting,
-      className: styles$1J['vitro-checkbox']
+      className: styles$1I['vitro-checkbox']
     }), getCheckboxLabel(name));
   }));
   return React__default.createElement(Dialog, {
     title: localeService.create(LOCALE$d.TITLE),
     subtitle: isMobileView ? CTRL.EMPTY : localeService.create(LOCALE$d.SUBTITLE),
     image: React__default.createElement("div", {
-      className: styles$1J['vitro-image']
+      className: styles$1I['vitro-image']
     }),
     onClose: props.onCancel,
     buttonList: buttonList,
     labelClose: props.labelClose,
-    className: styles$1J['vitro-system-exception-dialog'],
+    className: styles$1I['vitro-system-exception-dialog'],
     hiddenContent: hiddenContent,
     zIndex: props.zIndex,
     isDismissible: true
   }, React__default.createElement(DialogContent, null, isMobileView && React__default.createElement(Label, {
     text: localeService.create(LOCALE$d.SUBTITLE),
-    className: styles$1J['vitro-label']
+    className: styles$1I['vitro-label']
   }), React__default.createElement(Input, {
     ref: inputRef,
-    className: styles$1J['vitro-input'],
+    className: styles$1I['vitro-input'],
     isMultiline: true
   }), props.message && React__default.createElement("div", {
-    className: styles$1J['vitro-exception']
+    className: styles$1I['vitro-exception']
   }, React__default.createElement(ScrollBar, null, React__default.createElement("div", {
     onCut: blockAction,
     onPaste: blockAction,
     onBeforeInput: blockAction,
     spellCheck: false,
     contentEditable: true,
-    className: styles$1J['vitro-exception-message']
+    className: styles$1I['vitro-exception-message']
   }, props.message)))));
 };
 
-var styles$1K = {"vitro-star-button":"_star-button_vitro-star-button_1_mQ_Gq","vitro-hidden":"_star-button_vitro-hidden_oRKUkzt","vitro-active":"_star-button_vitro-active_2UV6u5C"};
+var styles$1J = {"vitro-star-button":"_star-button_vitro-star-button_1_mQ_Gq","vitro-hidden":"_star-button_vitro-hidden_oRKUkzt","vitro-active":"_star-button_vitro-active_2UV6u5C"};
 
 var StarButton = function StarButton(props) {
   var _useState = React.useState(props.isActive || false),
@@ -85183,11 +84253,11 @@ var StarButton = function StarButton(props) {
   };
   return React__default.createElement("button", {
     onClick: onClick,
-    className: styles$1K['vitro-star-button'] + (isActive ? CTRL.SPACE + styles$1K['vitro-active'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$1J['vitro-star-button'] + (isActive ? CTRL.SPACE + styles$1J['vitro-active'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   });
 };
 
-var styles$1L = {"vitro-item":"_site-item_vitro-item_1eSpRGl","vitro-active":"_site-item_vitro-active_1d0nDLb","vitro-name":"_site-item_vitro-name_141-LTn","vitro-image":"_site-item_vitro-image_3wrW9q4","vitro-default-image":"_site-item_vitro-default-image_fcWWNwv","vitro-hidden":"_site-item_vitro-hidden_d6n2ocz","vitro-mobile-view":"_site-item_vitro-mobile-view_3bXuBr6"};
+var styles$1K = {"vitro-item":"_site-item_vitro-item_1eSpRGl","vitro-active":"_site-item_vitro-active_1d0nDLb","vitro-name":"_site-item_vitro-name_141-LTn","vitro-image":"_site-item_vitro-image_3wrW9q4","vitro-default-image":"_site-item_vitro-default-image_fcWWNwv","vitro-hidden":"_site-item_vitro-hidden_d6n2ocz","vitro-mobile-view":"_site-item_vitro-mobile-view_3bXuBr6"};
 
 var SiteSelectItem = function SiteSelectItem(props) {
   var _useState = React.useState(props.isStarActive || false),
@@ -85213,7 +84283,7 @@ var SiteSelectItem = function SiteSelectItem(props) {
       props.onMouseDown(e);
     }
   };
-  var className = [styles$1L['vitro-item'], props.className || CTRL.EMPTY, props.isActive ? styles$1L['vitro-active'] : CTRL.EMPTY, props.isMobileView && styles$1L['vitro-mobile-view']].join(CTRL.SPACE);
+  var className = [styles$1K['vitro-item'], props.className || CTRL.EMPTY, props.isActive ? styles$1K['vitro-active'] : CTRL.EMPTY, props.isMobileView && styles$1K['vitro-mobile-view']].join(CTRL.SPACE);
   return React__default.createElement(FlexBox, {
     onClick: props.onClick,
     onMouseDown: onMouseDown,
@@ -85222,19 +84292,19 @@ var SiteSelectItem = function SiteSelectItem(props) {
     className: className
   }, props.imageUrl ? React__default.createElement(Image, {
     defaultUrl: props.imageUrl,
-    className: styles$1L['vitro-image']
+    className: styles$1K['vitro-image']
   }) : React__default.createElement("div", {
-    className: styles$1L['vitro-default-image']
+    className: styles$1K['vitro-default-image']
   }), React__default.createElement("div", {
-    className: styles$1L['vitro-name']
+    className: styles$1K['vitro-name']
   }, props.name), props.onStar && React__default.createElement(StarButton, {
     onChange: props.onStar,
     isActive: props.isStarActive,
-    className: isShowStar || props.isStarActive ? CTRL.EMPTY : styles$1L['vitro-hidden']
+    className: isShowStar || props.isStarActive ? CTRL.EMPTY : styles$1K['vitro-hidden']
   }));
 };
 
-var styles$1M = {"vitro-site-select":"_site-select_vitro-site-select_2irDOFZ","vitro-flex":"_site-select_vitro-flex_15EJnju","vitro-expand":"_site-select_vitro-expand_KKfRtc8","vitro-collapse":"_site-select_vitro-collapse_B0ZjAm-","vitro-site-list":"_site-select_vitro-site-list_1Yt4nLj","vitro-title":"_site-select_vitro-title_2vfT7F5","vitro-search-input":"_site-select_vitro-search-input_UMmv9PP","vitro-root-item":"_site-select_vitro-root-item_f1rGcQ4","vitro-slide-up-panel":"_site-select_vitro-slide-up-panel_U3Xn-UQ","vitro-search-value-list":"_site-select_vitro-search-value-list_3XlFSA6"};
+var styles$1L = {"vitro-site-select":"_site-select_vitro-site-select_2irDOFZ","vitro-flex":"_site-select_vitro-flex_15EJnju","vitro-expand":"_site-select_vitro-expand_KKfRtc8","vitro-collapse":"_site-select_vitro-collapse_B0ZjAm-","vitro-site-list":"_site-select_vitro-site-list_1Yt4nLj","vitro-title":"_site-select_vitro-title_2vfT7F5","vitro-search-input":"_site-select_vitro-search-input_UMmv9PP","vitro-root-item":"_site-select_vitro-root-item_f1rGcQ4","vitro-slide-up-panel":"_site-select_vitro-slide-up-panel_U3Xn-UQ","vitro-search-value-list":"_site-select_vitro-search-value-list_3XlFSA6"};
 
 var SiteSelect = function SiteSelect(props) {
   var _props$activeItem;
@@ -85338,8 +84408,8 @@ var SiteSelect = function SiteSelect(props) {
     itemList: visibleItemList,
     valueTemplate: getItem,
     filterValueTemplate: filterValueTemplate,
-    className: styles$1M['vitro-search-value-list'],
-    inputClassName: styles$1M['vitro-search-input']
+    className: styles$1L['vitro-search-value-list'],
+    inputClassName: styles$1L['vitro-search-input']
   }, props.rootItem && React__default.createElement(SiteSelectItem, Object.assign({}, props.rootItem, {
     isMobileView: isMobileView,
     onClick: function onClick() {
@@ -85348,49 +84418,49 @@ var SiteSelect = function SiteSelect(props) {
     onMouseDown: function onMouseDown(e) {
       return props.rootItem && onItemMouseDown(props.rootItem, e);
     },
-    className: styles$1M['vitro-root-item']
+    className: styles$1L['vitro-root-item']
   })), (props.title || props.onStarChange) && React__default.createElement(FlexBox, {
-    className: styles$1M['vitro-title']
+    className: styles$1L['vitro-title']
   }, props.title, props.onStarChange && React__default.createElement(StarButton, {
     onChange: filterStarActive
   })));
   return React__default.createElement("div", {
-    className: styles$1M['vitro-site-select']
+    className: styles$1L['vitro-site-select']
   }, React__default.createElement(FlexBox, {
-    className: styles$1M['vitro-flex'],
+    className: styles$1L['vitro-flex'],
     ref: flexBoxRef
   }, React__default.createElement("h2", {
     onClick: onClick
   }, (_props$activeItem = props.activeItem) === null || _props$activeItem === void 0 ? void 0 : _props$activeItem.name), React__default.createElement(ImageButton, {
-    className: isExpanded ? styles$1M['vitro-collapse'] : styles$1M['vitro-expand'],
+    className: isExpanded ? styles$1L['vitro-collapse'] : styles$1L['vitro-expand'],
     onClick: onClick
   })), isMobileView && React__default.createElement(SlideUpPanel, {
-    className: styles$1M['vitro-slide-up-panel'],
+    className: styles$1L['vitro-slide-up-panel'],
     isShow: isExpanded,
     onClose: function onClose() {
       return setIsExpanded(false);
     }
   }, content), !isMobileView && isExpanded && React__default.createElement("div", {
-    className: styles$1M['vitro-site-list'],
+    className: styles$1L['vitro-site-list'],
     ref: listRef
   }, content));
 };
 
-var styles$1N = {"vitro-bottom":"_bottom-align-control-group_vitro-bottom_3-a5nWD"};
+var styles$1M = {"vitro-bottom":"_bottom-align-control-group_vitro-bottom_3-a5nWD"};
 
 var BottomAlignControlGroup = function BottomAlignControlGroup(props) {
   return React__default.createElement("div", {
-    className: styles$1N['vitro-bottom']
+    className: styles$1M['vitro-bottom']
   }, props.children);
 };
 
-var styles$1O = {"vitro-linear-progress":"_linear-progress_vitro-linear-progress_1i4VVyb","vitro-bar":"_linear-progress_vitro-bar_2rwmbp3","progress":"_linear-progress_progress_11DTdlB"};
+var styles$1N = {"vitro-linear-progress":"_linear-progress_vitro-linear-progress_1i4VVyb","vitro-bar":"_linear-progress_vitro-bar_2rwmbp3","progress":"_linear-progress_progress_11DTdlB"};
 
 var LinearProgress = function LinearProgress(props) {
   return React__default.createElement("div", {
-    className: styles$1O['vitro-linear-progress'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$1N['vitro-linear-progress'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }, React__default.createElement("div", {
-    className: styles$1O['vitro-bar']
+    className: styles$1N['vitro-bar']
   }));
 };
 
@@ -85524,7 +84594,7 @@ var Thumbnail = function Thumbnail(props) {
   })), React__default.createElement("span", null, props.name)));
 };
 
-var w$b = window;
+var w$a = window;
 var CSS_CLASS_SIDEBAR_CONTENT$1 = 'sidebar-content';
 var ID_FILE_VERSION_SELECT$2 = 'fileVersionSelect';
 var ID_SIDEBAR_CONTENT = 'sidebarContent';
@@ -85539,7 +84609,7 @@ var Viewer$2 = function Viewer(props) {
   }, [props.context.file]);
   var init = function init() {
     var initViewer = function initViewer() {
-      if (w$b.initDxfViewer) {
+      if (w$a.initDxfViewer) {
         initSearchCriterionList();
         var context = _extends({}, props.context, {
           selectIssue: selectIssue,
@@ -85552,7 +84622,7 @@ var Viewer$2 = function Viewer(props) {
           initThumbnail: initThumbnail,
           searchIssueListEvent: EVENT_SEARCH_ISSUE_LIST$1
         });
-        w$b.initDxfViewer(context);
+        w$a.initDxfViewer(context);
         initFileVersionSelect();
         initThumbnailList(context);
       } else {
@@ -85569,7 +84639,7 @@ var Viewer$2 = function Viewer(props) {
   };
   var initSearchCriterionList = function initSearchCriterionList() {
     if (props.context.searchCriterionList) {
-      w$b.searchCriterionList = props.context.searchCriterionList;
+      w$a.searchCriterionList = props.context.searchCriterionList;
     }
   };
   var renderIssueList = function renderIssueList(context, sidebar, searchCriterionList) {
@@ -85715,7 +84785,7 @@ var DxfViewer = function DxfViewer(props) {
   });
 };
 
-var styles$1P = {"vitro-select":"_select_vitro-select_EObExkL","vitro-active":"_select_vitro-active_3I2oZ9Y","vitro-label":"_select_vitro-label_1sD79dR","vitro-list-container":"_select_vitro-list-container_1iaPtG5","vitro-item":"_select_vitro-item_3Q88bWt"};
+var styles$1O = {"vitro-select":"_select_vitro-select_EObExkL","vitro-active":"_select_vitro-active_3I2oZ9Y","vitro-label":"_select_vitro-label_1sD79dR","vitro-list-container":"_select_vitro-list-container_1iaPtG5","vitro-item":"_select_vitro-item_3Q88bWt"};
 
 var Select = function Select(props) {
   var _useState = React.useState(null),
@@ -85760,11 +84830,11 @@ var Select = function Select(props) {
   };
   var defaultItemTemplate = function defaultItemTemplate(props) {
     return React__default.createElement("div", {
-      className: styles$1P['vitro-item']
+      className: styles$1O['vitro-item']
     }, props.text);
   };
   var itemTemplate = props.itemTemplate ? props.itemTemplate : defaultItemTemplate;
-  var className = [styles$1P['vitro-select'], isExpanded ? styles$1P['vitro-active'] : CTRL.EMPTY, props.className || CTRL.EMPTY].join(CTRL.SPACE);
+  var className = [styles$1O['vitro-select'], isExpanded ? styles$1O['vitro-active'] : CTRL.EMPTY, props.className || CTRL.EMPTY].join(CTRL.SPACE);
   if (!props.itemList.length || !value) {
     return null;
   }
@@ -85777,9 +84847,9 @@ var Select = function Select(props) {
     ref: flexBoxRef
   }, props.label && React__default.createElement(Label, {
     text: props.label,
-    className: styles$1P['vitro-label']
+    className: styles$1O['vitro-label']
   }), React__default.createElement(itemTemplate, value), React__default.createElement("div", {
-    className: styles$1P['vitro-list-container'],
+    className: styles$1O['vitro-list-container'],
     ref: listRef
   }, React__default.createElement(List$1, {
     itemList: props.itemList,
@@ -85788,7 +84858,7 @@ var Select = function Select(props) {
   })));
 };
 
-var styles$1Q = {"vitro-switch":"_switch_vitro-switch_1noCcra","vitro-slider":"_switch_vitro-slider_3wesxda","vitro-active":"_switch_vitro-active_3LJI9TW"};
+var styles$1P = {"vitro-switch":"_switch_vitro-switch_1noCcra","vitro-slider":"_switch_vitro-slider_3wesxda","vitro-active":"_switch_vitro-active_3LJI9TW"};
 
 var Switch = function Switch(props) {
   var _useState = React.useState(props.value ? true : false),
@@ -85802,7 +84872,7 @@ var Switch = function Switch(props) {
     setValue(!value);
   };
   return React__default.createElement("label", {
-    className: styles$1Q['vitro-switch'] + (value ? CTRL.SPACE + styles$1Q['vitro-active'] : CTRL.EMPTY)
+    className: styles$1P['vitro-switch'] + (value ? CTRL.SPACE + styles$1P['vitro-active'] : CTRL.EMPTY)
   }, React__default.createElement("input", {
     checked: value,
     type: 'checkbox',
@@ -85810,11 +84880,11 @@ var Switch = function Switch(props) {
     onChange: onChange,
     disabled: props.isDisabled
   }), React__default.createElement("span", {
-    className: styles$1Q['vitro-slider']
+    className: styles$1P['vitro-slider']
   }));
 };
 
-var styles$1R = {"vitro-editable-list":"_editable-list_vitro-editable-list_2y8aXbO","vitro-header":"_editable-list_vitro-header_3ilVZhe","vitro-create-button":"_editable-list_vitro-create-button_3E1aQDB","vitro-editable-item":"_editable-list_vitro-editable-item_cWSWi1n","vitro-active":"_editable-list_vitro-active_39PUrSM","vitro-button-container":"_editable-list_vitro-button-container_1okfn08","vitro-editable-list-mobile":"_editable-list_vitro-editable-list-mobile_z1t_hAF","vitro-dropdown-button":"_editable-list_vitro-dropdown-button_vPtNQxA","vitro-dropdown-menu-top":"_editable-list_vitro-dropdown-menu-top_1miFWtX","vitro-display-none":"_editable-list_vitro-display-none_1nqU_hD","vitro-mobile":"_editable-list_vitro-mobile_2IDiwft","vitro-editable-item-icon":"_editable-list_vitro-editable-item-icon_29jFw_f","vitro-readonly":"_editable-list_vitro-readonly_2pK9bq5","vitro-editable-item-label":"_editable-list_vitro-editable-item-label_3ViAKDq","vitro-header-mobile":"_editable-list_vitro-header-mobile_2EMihKc"};
+var styles$1Q = {"vitro-editable-list":"_editable-list_vitro-editable-list_2y8aXbO","vitro-header":"_editable-list_vitro-header_3ilVZhe","vitro-create-button":"_editable-list_vitro-create-button_3E1aQDB","vitro-editable-item":"_editable-list_vitro-editable-item_cWSWi1n","vitro-active":"_editable-list_vitro-active_39PUrSM","vitro-button-container":"_editable-list_vitro-button-container_1okfn08","vitro-dropdown-menu-top":"_editable-list_vitro-dropdown-menu-top_1miFWtX","vitro-display-none":"_editable-list_vitro-display-none_1nqU_hD","vitro-mobile":"_editable-list_vitro-mobile_2IDiwft","vitro-editable-item-icon":"_editable-list_vitro-editable-item-icon_29jFw_f","vitro-readonly":"_editable-list_vitro-readonly_2pK9bq5","vitro-editable-item-label":"_editable-list_vitro-editable-item-label_3ViAKDq","vitro-dropdown-button":"_editable-list_vitro-dropdown-button_vPtNQxA","vitro-header-mobile":"_editable-list_vitro-header-mobile_2EMihKc"};
 
 var CSS_CLASS_MOBILE = 'vitro-mobile';
 var CSS_DROPDOWN_MENU_TOP = 'vitro-dropdown-menu-top';
@@ -85830,6 +84900,12 @@ var EditableItem = function EditableItem(props) {
   var _useState3 = React.useState([]),
     dropdownItemList = _useState3[0],
     setDropdownItemList = _useState3[1];
+  var dropdownButtonRef = React.useRef(null);
+  React.useEffect(function () {
+    if (props.isActive && props.isDropdownActive && dropdownButtonRef.current) {
+      dropdownButtonRef.current.toggle();
+    }
+  }, [props.isDropdownActive, props.isActive]);
   React.useEffect(function () {
     setText(props.text);
   }, [props.text]);
@@ -85837,7 +84913,7 @@ var EditableItem = function EditableItem(props) {
     if (props.isDropdownActive) {
       if (props.dropdownItemList) {
         setDropdownItemList(props.dropdownItemList);
-      } else if (props.getDropdownItemList) {
+      } else if (props.getDropdownItemList && !dropdownItemList.length) {
         props.getDropdownItemList(props.id).then(function (itemList) {
           setDropdownItemList(itemList);
         });
@@ -85851,8 +84927,8 @@ var EditableItem = function EditableItem(props) {
   var onBlur = function onBlur(e) {
     props.onBlur(e.target.value);
   };
-  var onToggleDropdownButton = function onToggleDropdownButton(state, e) {
-    e.originalEvent.stopPropagation();
+  var onToggleDropdownButton = function onToggleDropdownButton(e, state) {
+    e.stopPropagation();
     if (props.onToggleDropdown) {
       props.onToggleDropdown(state);
     }
@@ -85862,7 +84938,7 @@ var EditableItem = function EditableItem(props) {
       var rect = element.getBoundingClientRect();
       if (!isDropdownMenuTop(element.classList) || isDropdownMenuTop(element.classList) && rect.y > window.innerHeight) {
         if (rect.y > window.innerHeight) {
-          element.classList.add(styles$1R[CSS_DROPDOWN_MENU_TOP]);
+          element.classList.add(styles$1Q[CSS_DROPDOWN_MENU_TOP]);
           element.style.transform = "translate(calc(100% - " + (TRANSLATE_X + UNIT.PX) + "), calc(-" + (props.scrollTop + UNIT.PX) + " - 100% - " + (TRANSLATE_Y + UNIT.PX) + "))";
         } else {
           element.style.transform = "translate(calc(100% - " + (TRANSLATE_X + UNIT.PX) + "), -" + (props.scrollTop + UNIT.PX) + ")";
@@ -85886,14 +84962,14 @@ var EditableItem = function EditableItem(props) {
     onMouseLeave: function onMouseLeave() {
       return setIsHover(false);
     },
-    className: styles$1R['vitro-editable-item'] + (props.isActive ? CTRL.SPACE + styles$1R['vitro-active'] : CTRL.EMPTY) + (props.isMobileView ? CTRL.SPACE + styles$1R[CSS_CLASS_MOBILE] : CTRL.EMPTY)
+    className: styles$1Q['vitro-editable-item'] + (props.isActive ? CTRL.SPACE + styles$1Q['vitro-active'] : CTRL.EMPTY) + (props.isMobileView ? CTRL.SPACE + styles$1Q[CSS_CLASS_MOBILE] : CTRL.EMPTY)
   }, props.isMobileView && props.button ? props.button : null, props.isMobileView && props.icon ? React__default.createElement("span", {
-    className: styles$1R['vitro-editable-item-icon']
+    className: styles$1Q['vitro-editable-item-icon']
   }, React__default.createElement("img", {
     src: props.icon
   })) : null, props.isMobileView ? React__default.createElement(Label, {
     text: props.text || text,
-    className: styles$1R['vitro-editable-item-label']
+    className: styles$1Q['vitro-editable-item-label']
   }) : props.isEditMode ? React__default.createElement("input", {
     value: text,
     onChange: onChange,
@@ -85902,17 +84978,15 @@ var EditableItem = function EditableItem(props) {
   }) : React__default.createElement(Label, {
     text: props.text || text
   }), React__default.createElement("div", {
-    className: styles$1R['vitro-button-container']
+    className: styles$1Q['vitro-button-container']
   }, !props.isReadOnly && (props.dropdownItemList || props.getDropdownItemList) ? React__default.createElement(DropdownButton, {
+    ref: dropdownButtonRef,
     itemList: dropdownItemList,
-    onToggle: onToggleDropdownButton,
-    isShow: props.isDropdownActive,
-    className: styles$1R['vitro-dropdown-button'] + (!props.isMobileView ? props.isActive || isHover ? CTRL.EMPTY : CTRL.SPACE + styles$1R['vitro-display-none'] : CTRL.EMPTY),
-    isFlip: props.isMobileView,
-    popperConfig: props.popperConfig,
-    onGetMenuRef: props.isMobileView ? undefined : initDropdownMenuPosition
+    className: STYLE$1.CONTEXT + (!props.isMobileView ? props.isActive || isHover ? CTRL.EMPTY : CTRL.SPACE + styles$1Q['vitro-display-none'] : CTRL.EMPTY),
+    onGetMenuRef: props.isMobileView ? undefined : initDropdownMenuPosition,
+    onClick: onToggleDropdownButton
   }) : null, !props.isMobileView && props.button && React__default.createElement(FlexBox, {
-    className: !props.isReadOnly && (props.isActive || isHover) && (props.dropdownItemList || props.getDropdownItemList) ? styles$1R['vitro-display-none'] : props.isReadOnly ? styles$1R['vitro-readonly'] : CTRL.EMPTY
+    className: !props.isReadOnly && (props.isActive || isHover) && (props.dropdownItemList || props.getDropdownItemList) ? styles$1Q['vitro-display-none'] : props.isReadOnly ? styles$1Q['vitro-readonly'] : CTRL.EMPTY
   }, props.button)));
 };
 
@@ -86000,9 +85074,9 @@ var EditableList = function EditableList(props) {
     }
   };
   return React__default.createElement(FlexBox, {
-    className: styles$1R[CSS_CLASS_EDITABLE_LIST] + (props.isMobileView ? CTRL.SPACE + styles$1R[CSS_CLASS_EDITABLE_LIST_MOBILE] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$1Q[CSS_CLASS_EDITABLE_LIST] + (props.isMobileView ? CTRL.SPACE + styles$1Q[CSS_CLASS_EDITABLE_LIST_MOBILE] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }, React__default.createElement(FlexBox, {
-    className: styles$1R[CSS_CLASS_HEADER] + (props.isMobileView ? CTRL.SPACE + styles$1R[CSS_CLASS_HEADER_MOBILE] : CTRL.EMPTY)
+    className: styles$1Q[CSS_CLASS_HEADER] + (props.isMobileView ? CTRL.SPACE + styles$1Q[CSS_CLASS_HEADER_MOBILE] : CTRL.EMPTY)
   }, props.title && React__default.createElement(Heading, {
     tag: TAG.H3,
     text: props.title
@@ -86010,7 +85084,7 @@ var EditableList = function EditableList(props) {
     text: props.createButtonTooltip || CTRL.EMPTY
   }, React__default.createElement(ImageButton, {
     onClick: onCreate,
-    className: styles$1R[CSS_CLASS_CREATE_BUTTON]
+    className: styles$1Q[CSS_CLASS_CREATE_BUTTON]
   }))), props.isMobileView ? React__default.createElement(React__default.Fragment, null, React__default.createElement(List$1, {
     itemList: props.itemList,
     itemTemplate: function itemTemplate(item) {
@@ -86089,7 +85163,7 @@ var EditableList = function EditableList(props) {
   }))));
 };
 
-var styles$1S = {"vitro-reorderable-list":"_reorderable-list_vitro-reorderable-list_3Vinbji","vitro-reorderable-item":"_reorderable-list_vitro-reorderable-item_2gH3muk","vitro-drag-button":"_reorderable-list_vitro-drag-button_2gzxwKx","vitro-dragged-item":"_reorderable-list_vitro-dragged-item_fft3ham","vitro-drop-zone":"_reorderable-list_vitro-drop-zone_15pbLJE","vitro-hidden":"_reorderable-list_vitro-hidden_2ZpMCYZ"};
+var styles$1R = {"vitro-reorderable-list":"_reorderable-list_vitro-reorderable-list_3Vinbji","vitro-reorderable-item":"_reorderable-list_vitro-reorderable-item_2gH3muk","vitro-drag-button":"_reorderable-list_vitro-drag-button_2gzxwKx","vitro-dragged-item":"_reorderable-list_vitro-dragged-item_fft3ham","vitro-drop-zone":"_reorderable-list_vitro-drop-zone_15pbLJE","vitro-hidden":"_reorderable-list_vitro-hidden_2ZpMCYZ"};
 
 var ReorderableListContent = function ReorderableListContent(props) {
   return React__default.createElement(React__default.Fragment, null, props.draggedIndex !== null && React__default.createElement("div", {
@@ -86098,7 +85172,7 @@ var ReorderableListContent = function ReorderableListContent(props) {
       top: props.position[1] + UNIT.PX,
       width: props.draggedItemWidth ? props.draggedItemWidth + UNIT.PX : undefined
     },
-    className: styles$1S['vitro-dragged-item']
+    className: styles$1R['vitro-dragged-item']
   }, props.getItem(_extends({}, props.itemList[props.draggedIndex], {
     index: -1
   }), false)), React__default.createElement("li", {
@@ -86106,11 +85180,11 @@ var ReorderableListContent = function ReorderableListContent(props) {
       width: props.draggedItemWidth ? props.draggedItemWidth + UNIT.PX : undefined
     }
   }, React__default.createElement("div", {
-    className: styles$1S['vitro-drop-zone'] + (props.draggedIndex === null || props.activeDropZoneIndex !== 0 ? CTRL.SPACE + styles$1S['vitro-hidden'] : CTRL.EMPTY)
+    className: styles$1R['vitro-drop-zone'] + (props.draggedIndex === null || props.activeDropZoneIndex !== 0 ? CTRL.SPACE + styles$1R['vitro-hidden'] : CTRL.EMPTY)
   })), props.itemList && props.itemList.map(function (item, index) {
     return React__default.createElement("li", {
       key: index,
-      className: styles$1S['vitro-reorderable-item'] + (props.itemClassName ? CTRL.SPACE + props.itemClassName : CTRL.EMPTY)
+      className: styles$1R['vitro-reorderable-item'] + (props.itemClassName ? CTRL.SPACE + props.itemClassName : CTRL.EMPTY)
     }, props.getItem(_extends({}, item, {
       index: index
     })));
@@ -86148,13 +85222,13 @@ var ReorderableItem = function ReorderableItem(props) {
     ref: buttonRef,
     onClick: function onClick() {},
     onMouseDown: onMouseDown,
-    className: styles$1S['vitro-drag-button'],
+    className: styles$1R['vitro-drag-button'],
     onTouchStart: onTouchStart
   }), props.children), props.isDropAllowed !== false && React__default.createElement("div", {
     style: {
       width: props.draggedItemWidth ? props.draggedItemWidth - 16 + UNIT.PX : undefined
     },
-    className: styles$1S['vitro-drop-zone'] + (props.isDropZoneActive ? CTRL.EMPTY : CTRL.SPACE + styles$1S['vitro-hidden'])
+    className: styles$1R['vitro-drop-zone'] + (props.isDropZoneActive ? CTRL.EMPTY : CTRL.SPACE + styles$1R['vitro-hidden'])
   }));
 };
 
@@ -86214,7 +85288,7 @@ var ReorderableList = function ReorderableList(props) {
   });
   React.useEffect(function () {
     if (draggedIndex !== null) {
-      var elements = Array.from(document.getElementsByClassName(styles$1S['vitro-drop-zone']));
+      var elements = Array.from(document.getElementsByClassName(styles$1R['vitro-drop-zone']));
       var positions = elements.map(function (e) {
         return e.getBoundingClientRect().top - startPosition.current[1];
       });
@@ -86346,7 +85420,7 @@ var ReorderableList = function ReorderableList(props) {
     });
   }
   return React__default.createElement("ul", {
-    className: styles$1S['vitro-list'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$1R['vitro-list'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }, React__default.createElement(ReorderableListContent, {
     itemList: itemList,
     draggedIndex: draggedIndex,
@@ -86358,7 +85432,7 @@ var ReorderableList = function ReorderableList(props) {
   }));
 };
 
-var styles$1T = {"vitro-checkbox-reorderable-list":"_checkbox-reorderable-list_vitro-checkbox-reorderable-list_3VUoUyI","vitro-reorderable-item":"_checkbox-reorderable-list_vitro-reorderable-item__ZSM4NT","vitro-checkbox":"_checkbox-reorderable-list_vitro-checkbox_3FVD6mG"};
+var styles$1S = {"vitro-checkbox-reorderable-list":"_checkbox-reorderable-list_vitro-checkbox-reorderable-list_3VUoUyI","vitro-reorderable-item":"_checkbox-reorderable-list_vitro-reorderable-item__ZSM4NT","vitro-checkbox":"_checkbox-reorderable-list_vitro-checkbox_3FVD6mG"};
 
 var CheckboxReorderableList = function CheckboxReorderableList(props) {
   var _useState = React.useState([]),
@@ -86459,27 +85533,27 @@ var CheckboxReorderableList = function CheckboxReorderableList(props) {
       onChange: function onChange(value) {
         return _onChange(value, item.id);
       },
-      className: styles$1T['vitro-checkbox'] + (className ? CTRL.SPACE + className : CTRL.EMPTY)
+      className: styles$1S['vitro-checkbox'] + (className ? CTRL.SPACE + className : CTRL.EMPTY)
     });
   };
   return React__default.createElement("ul", {
     ref: listRef,
-    className: styles$1T['vitro-checkbox-reorderable-list'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$1S['vitro-checkbox-reorderable-list'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }, React__default.createElement(ReorderableList, {
     itemList: reorderableItemList,
     itemTemplate: getCheckbox,
     onChange: onChangePosition,
-    itemClassName: styles$1T['vitro-reorderable-item'],
+    itemClassName: styles$1S['vitro-reorderable-item'],
     isCustomContainer: true
   }), React__default.createElement(List$1, {
     itemList: itemList,
     itemTemplate: getCheckbox,
-    itemClassName: styles$1T['vitro-item'],
+    itemClassName: styles$1S['vitro-item'],
     isCustomContainer: true
   }));
 };
 
-var styles$1U = {"vitro-pin-button":"_pin-button_vitro-pin-button_3DklgEh","vitro-active":"_pin-button_vitro-active_2PgztSG"};
+var styles$1T = {"vitro-pin-button":"_pin-button_vitro-pin-button_3DklgEh","vitro-active":"_pin-button_vitro-active_2PgztSG"};
 
 var PinButton = function PinButton(props) {
   var _useState = React.useState(props.isActive || false),
@@ -86498,11 +85572,11 @@ var PinButton = function PinButton(props) {
   };
   return React__default.createElement(ImageButton, {
     onClick: onClick,
-    className: styles$1U['vitro-pin-button'] + (isActive ? CTRL.SPACE + styles$1U['vitro-active'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$1T['vitro-pin-button'] + (isActive ? CTRL.SPACE + styles$1T['vitro-active'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   });
 };
 
-var styles$1V = {"vitro-file-list-dropdown":"_file-list_vitro-file-list-dropdown_1BOOwqC","vitro-file-list-dropdown-item":"_file-list_vitro-file-list-dropdown-item_WtaYXLN","vitro-file-list-dropdown-image":"_file-list_vitro-file-list-dropdown-image_OUWbJBZ","vitro-file-list-dropdown-item-text":"_file-list_vitro-file-list-dropdown-item-text_3U6fMu7"};
+var styles$1U = {"vitro-file-list-dropdown":"_file-list_vitro-file-list-dropdown_1BOOwqC","vitro-file-list-dropdown-item":"_file-list_vitro-file-list-dropdown-item_WtaYXLN","vitro-file-list-dropdown-image":"_file-list_vitro-file-list-dropdown-image_OUWbJBZ","vitro-file-list-dropdown-item-text":"_file-list_vitro-file-list-dropdown-item-text_3U6fMu7"};
 
 var CSS_CLASS_FILE_LIST_DROPDOWN = 'vitro-file-list-dropdown';
 var CSS_CLASS_FILE_LIST_DROPDOWN_ITEM = 'vitro-file-list-dropdown-item';
@@ -86514,16 +85588,16 @@ var FileList = function FileList(props) {
     props.onOpen(item);
   };
   return React__default.createElement("div", {
-    className: styles$1V[CSS_CLASS_FILE_LIST_DROPDOWN]
+    className: styles$1U[CSS_CLASS_FILE_LIST_DROPDOWN]
   }, (_props$itemList = props.itemList) === null || _props$itemList === void 0 ? void 0 : _props$itemList.map(function (item) {
     return React__default.createElement("div", {
-      className: styles$1V[CSS_CLASS_FILE_LIST_DROPDOWN_ITEM]
+      className: styles$1U[CSS_CLASS_FILE_LIST_DROPDOWN_ITEM]
     }, React__default.createElement("span", {
-      className: styles$1V[CSS_CLASS_FILE_LIST_DROPDOWN_ITEM_IMAGE]
+      className: styles$1U[CSS_CLASS_FILE_LIST_DROPDOWN_ITEM_IMAGE]
     }, item.icon ? React__default.createElement("img", {
       src: item.icon
     }) : CTRL.EMPTY), React__default.createElement("span", {
-      className: styles$1V[CSS_CLASS_FILE_LIST_DROPDOWN_ITEM_TEXT]
+      className: styles$1U[CSS_CLASS_FILE_LIST_DROPDOWN_ITEM_TEXT]
     }, React__default.createElement("a", {
       onClick: function onClick() {
         return onOpen(item);
@@ -86537,7 +85611,7 @@ var LOCALE$e;
   LOCALE["DROPZONE_LABEL"] = "app.common.filePicker.dropZoneLabel";
 })(LOCALE$e || (LOCALE$e = {}));
 
-var styles$1W = {"vitro-file-picker":"_file-picker_vitro-file-picker_IV0PnKh","vitro-label":"_file-picker_vitro-label_1KY5QMW","vitro-scrollbar":"_file-picker_vitro-scrollbar_8t0LAkw","vitro-scrollbar-content":"_file-picker_vitro-scrollbar-content_3oLBqOf","vitro-drop-zone":"_file-picker_vitro-drop-zone_2xdKr3Y","vitro-drop-zone-active":"_file-picker_vitro-drop-zone-active_260SDRz","vitro-display-none":"_file-picker_vitro-display-none_RwEJqfN","vitro-file":"_file-picker_vitro-file_29jX2Dc","vitro-file-content":"_file-picker_vitro-file-content_1yV1plf","vitro-buttons-container":"_file-picker_vitro-buttons-container_2iewyGZ","vitro-download-button":"_file-picker_vitro-download-button_oKjHiUO","vitro-delete-button":"_file-picker_vitro-delete-button_29YhyRG"};
+var styles$1V = {"vitro-file-picker":"_file-picker_vitro-file-picker_IV0PnKh","vitro-label":"_file-picker_vitro-label_1KY5QMW","vitro-scrollbar":"_file-picker_vitro-scrollbar_8t0LAkw","vitro-scrollbar-content":"_file-picker_vitro-scrollbar-content_3oLBqOf","vitro-drop-zone":"_file-picker_vitro-drop-zone_2xdKr3Y","vitro-drop-zone-active":"_file-picker_vitro-drop-zone-active_260SDRz","vitro-display-none":"_file-picker_vitro-display-none_RwEJqfN","vitro-file":"_file-picker_vitro-file_29jX2Dc","vitro-file-content":"_file-picker_vitro-file-content_1yV1plf","vitro-buttons-container":"_file-picker_vitro-buttons-container_2iewyGZ","vitro-download-button":"_file-picker_vitro-download-button_oKjHiUO","vitro-delete-button":"_file-picker_vitro-delete-button_29YhyRG"};
 
 var FilePicker = function FilePicker(props) {
   var _useState = React.useState(false),
@@ -86619,33 +85693,33 @@ var FilePicker = function FilePicker(props) {
     }
   };
   return React__default.createElement(FlexBox, {
-    className: styles$1W['vitro-file-picker'],
+    className: styles$1V['vitro-file-picker'],
     ref: ref,
     isColumn: true
   }, React__default.createElement(Label, {
     text: props.label,
     isRequired: props.isRequired,
-    className: styles$1W['vitro-label']
+    className: styles$1V['vitro-label']
   }), props.value && props.value.length ? React__default.createElement(ScrollBar, {
-    className: styles$1W['vitro-scrollbar'],
-    contentClassName: styles$1W['vitro-scrollbar-content']
+    className: styles$1V['vitro-scrollbar'],
+    contentClassName: styles$1V['vitro-scrollbar-content']
   }, props.value.map(function (item, index) {
     return React__default.createElement(File, Object.assign({}, item, {
       key: index,
-      className: styles$1W['vitro-file'],
-      contentClassName: styles$1W['vitro-file-content']
+      className: styles$1V['vitro-file'],
+      contentClassName: styles$1V['vitro-file-content']
     }), React__default.createElement(FlexBox, {
-      className: styles$1W['vitro-buttons-container']
+      className: styles$1V['vitro-buttons-container']
     }, props.onDownload && item.isDownloadEnabled !== false && React__default.createElement(ImageButton, {
       onClick: function onClick() {
         return onDownload(item.id, item.name);
       },
-      className: styles$1W['vitro-download-button']
+      className: styles$1V['vitro-download-button']
     }), !props.isReadOnly && props.onDelete && React__default.createElement(ImageButton, {
       onClick: function onClick() {
         return onDelete(item.id);
       },
-      className: styles$1W['vitro-delete-button']
+      className: styles$1V['vitro-delete-button']
     })));
   })) : null, !props.isReadOnly && React__default.createElement(DropZone, {
     onClick: onClick,
@@ -86653,12 +85727,12 @@ var FilePicker = function FilePicker(props) {
     onDragOver: onDragOver,
     onDragLeave: onDragLeave,
     label: localeService.create(LOCALE$e.DROPZONE_LABEL),
-    className: isDropZoneActive ? styles$1W['vitro-drop-zone-active'] : styles$1W['vitro-drop-zone']
+    className: isDropZoneActive ? styles$1V['vitro-drop-zone-active'] : styles$1V['vitro-drop-zone']
   }), React__default.createElement("input", {
     type: 'file',
     onChange: onSelectFile,
     ref: fileInputRef,
-    className: styles$1W['vitro-display-none'],
+    className: styles$1V['vitro-display-none'],
     multiple: props.isMultiSelect
   }), props.errorMessage && React__default.createElement(ErrorMessage, {
     text: props.errorMessage
@@ -86759,7 +85833,7 @@ var TelerikMediaPlayerServiceImpl = /*#__PURE__*/function () {
   return TelerikMediaPlayerServiceImpl;
 }();
 
-var styles$1X = {"vitro-video-viewer":"_video-viewer_vitro-video-viewer_1KHO5IM","vitro-header":"_video-viewer_vitro-header_hwAjLDd","vitro-body":"_video-viewer_vitro-body_124aVK2","vitro-button-close":"_video-viewer_vitro-button-close_TB-QCiO","vitro-player":"_video-viewer_vitro-player_2JJVj_u"};
+var styles$1W = {"vitro-video-viewer":"_video-viewer_vitro-video-viewer_1KHO5IM","vitro-header":"_video-viewer_vitro-header_hwAjLDd","vitro-body":"_video-viewer_vitro-body_124aVK2","vitro-button-close":"_video-viewer_vitro-button-close_TB-QCiO","vitro-player":"_video-viewer_vitro-player_2JJVj_u"};
 
 var VideoViewer = React.forwardRef(function (props, ref) {
   var _useState = React.useState(),
@@ -86815,37 +85889,37 @@ var VideoViewer = React.forwardRef(function (props, ref) {
     }
   };
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
-    className: styles$1X['vitro-video-viewer']
+    className: styles$1W['vitro-video-viewer']
   }, React__default.createElement("div", {
-    className: styles$1X['vitro-header']
+    className: styles$1W['vitro-header']
   }, React__default.createElement("button", {
-    className: styles$1X['vitro-button-close'],
+    className: styles$1W['vitro-button-close'],
     onClick: props.onCloseClick
   })), React__default.createElement("div", {
-    className: styles$1X['vitro-body']
+    className: styles$1W['vitro-body']
   }, React__default.createElement("div", {
-    className: styles$1X['vitro-player'],
+    className: styles$1W['vitro-player'],
     ref: playerContainerRef
   }))));
 });
 
-var styles$1Y = {"vitro-separator":"_separator_vitro-separator_1TmOy37","vitro-separator-vertical":"_separator_vitro-separator-vertical_2ePwXRL"};
+var styles$1X = {"vitro-separator":"_separator_vitro-separator_1TmOy37","vitro-separator-vertical":"_separator_vitro-separator-vertical_2ePwXRL"};
 
 var Separator = function Separator(props) {
   return React__default.createElement("div", {
-    className: props.isVertical ? styles$1Y['vitro-separator-vertical'] : styles$1Y['vitro-separator']
+    className: props.isVertical ? styles$1X['vitro-separator-vertical'] : styles$1X['vitro-separator']
   });
 };
 
-var styles$1Z = {"vitro-white-close-button":"_close-button_vitro-white-close-button_cbxJwL7","vitro-close-button":"_close-button_vitro-close-button_1PA2DFD"};
+var styles$1Y = {"vitro-white-close-button":"_close-button_vitro-white-close-button_cbxJwL7","vitro-close-button":"_close-button_vitro-close-button_1PA2DFD"};
 
 var CloseButton$1 = function CloseButton(props) {
   return React__default.createElement(ImageButton, Object.assign({}, props, {
-    className: (props.isWhite ? styles$1Z['vitro-white-close-button'] : styles$1Z['vitro-close-button']) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: (props.isWhite ? styles$1Y['vitro-white-close-button'] : styles$1Y['vitro-close-button']) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }));
 };
 
-var styles$1_ = {"vitro-field-value-list":"_field-value-list_vitro-field-value-list_3HYOe79","vitro-flex-column":"_field-value-list_vitro-flex-column_esMxbc0","vitro-label":"_field-value-list_vitro-label_512jxv0","vitro-value":"_field-value-list_vitro-value_237ljdz"};
+var styles$1Z = {"vitro-field-value-list":"_field-value-list_vitro-field-value-list_3HYOe79","vitro-flex-column":"_field-value-list_vitro-flex-column_esMxbc0","vitro-label":"_field-value-list_vitro-label_512jxv0","vitro-value":"_field-value-list_vitro-value_237ljdz"};
 
 var FieldValueList = function FieldValueList(props) {
   var labelList = props.itemList.map(function (item) {
@@ -86855,78 +85929,162 @@ var FieldValueList = function FieldValueList(props) {
     return item.value;
   });
   return React__default.createElement(FlexBox, {
-    className: styles$1_['vitro-field-value-list']
+    className: styles$1Z['vitro-field-value-list']
   }, React__default.createElement(FlexBox, {
-    className: styles$1_['vitro-flex-column'],
+    className: styles$1Z['vitro-flex-column'],
     isColumn: true
   }, labelList.map(function (label, key) {
     return React__default.createElement(Label, {
       key: key,
       text: label + CTRL.COLON,
-      className: styles$1_['vitro-label']
+      className: styles$1Z['vitro-label']
     });
   })), React__default.createElement(FlexBox, {
-    className: styles$1_['vitro-flex-column'],
+    className: styles$1Z['vitro-flex-column'],
     isColumn: true
   }, valueList.map(function (value, key) {
     return React__default.createElement(Label, {
       key: key,
       text: value,
-      className: styles$1_['vitro-value']
+      className: styles$1Z['vitro-value']
     });
   })));
 };
 
-var styles$1$ = {"vitro-shared-item-link-form":"_shared-item-link-form_vitro-shared-item-link-form_3EJHrCZ","vitro-image":"_shared-item-link-form_vitro-image_3sxUXMr","vitro-content":"_shared-item-link-form_vitro-content_3N5eaFX","vitro-title":"_shared-item-link-form_vitro-title_3Nz4A4T","vitro-button-group":"_shared-item-link-form_vitro-button-group_6J7aKmY","vitro-link-input":"_shared-item-link-form_vitro-link-input_1I8xMul"};
+var styles$1_ = {"vitro-shared-item-link-form":"_shared-item-link-form_vitro-shared-item-link-form_3EJHrCZ","vitro-image":"_shared-item-link-form_vitro-image_3sxUXMr","vitro-content":"_shared-item-link-form_vitro-content_3N5eaFX","vitro-title":"_shared-item-link-form_vitro-title_3Nz4A4T","vitro-button-group":"_shared-item-link-form_vitro-button-group_6J7aKmY","vitro-link-input":"_shared-item-link-form_vitro-link-input_1I8xMul"};
 
 var SharedItemLinkForm = function SharedItemLinkForm(props) {
   return React__default.createElement(FlexBox, {
-    className: styles$1$['vitro-shared-item-link-form']
+    className: styles$1_['vitro-shared-item-link-form']
   }, React__default.createElement(Image, {
     defaultUrl: props.imageUrl,
-    className: styles$1$['vitro-image']
+    className: styles$1_['vitro-image']
   }), React__default.createElement(FlexBox, {
-    className: styles$1$['vitro-content'],
+    className: styles$1_['vitro-content'],
     isColumn: true
   }, React__default.createElement(Heading, {
     text: props.name,
     tag: TAG.H1,
-    className: styles$1$['vitro-title']
+    className: styles$1_['vitro-title']
   }), props.fieldValueList && React__default.createElement(FieldValueList, {
     itemList: props.fieldValueList
   }), React__default.createElement(ButtonGroup, {
     itemList: props.buttonList,
-    className: styles$1$['vitro-button-group']
+    className: styles$1_['vitro-button-group']
   }), props.uri && React__default.createElement(LinkInput, {
     label: props.linkLabel,
     value: {
       uri: props.uri
     },
-    className: styles$1$['vitro-link-input'],
+    className: styles$1_['vitro-link-input'],
     isCopyOrigin: true,
     isReadOnly: true
   })));
 };
 
-var styles$20 = {"vitro-delete-button":"_delete-button_vitro-delete-button_1rHMYDM","vitro-button":"_delete-button_vitro-button_3x1CMPO","vitro-image":"_delete-button_vitro-image_3suuRwK"};
+var styles$1$ = {"vitro-delete-button":"_delete-button_vitro-delete-button_1rHMYDM","vitro-button":"_delete-button_vitro-button_3x1CMPO","vitro-image":"_delete-button_vitro-image_3suuRwK"};
 
 var DeleteButton = function DeleteButton(props) {
   return React__default.createElement("button", {
-    className: styles$20['vitro-delete-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    className: styles$1$['vitro-delete-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
     onClick: props.onClick
   }, React__default.createElement("div", {
-    className: styles$20['vitro-image']
+    className: styles$1$['vitro-image']
   }), props.text && React__default.createElement("div", null, props.text));
 };
 
-var styles$21 = {"vitro-placeholder":"_placeholder_vitro-placeholder_4NH7HcF"};
+var styles$20 = {"vitro-placeholder":"_placeholder_vitro-placeholder_4NH7HcF"};
 
 var Placeholder = function Placeholder(props) {
   return React__default.createElement(FlexBox, {
-    className: styles$21['vitro-placeholder'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$20['vitro-placeholder'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }, React__default.createElement(FlexBox, null, React__default.createElement("span", null, props.text)));
 };
 
+var styles$21 = {"vitro-slide-up-panel":"_slide-up-button_vitro-slide-up-panel_2Poe8de","vitro-scrollbar-content":"_slide-up-button_vitro-scrollbar-content_1MC0emV","vitro-slide-up-button-item":"_slide-up-button_vitro-slide-up-button-item_2IAqXm4","vitro-slide-up-button-dropdown-item":"_slide-up-button_vitro-slide-up-button-dropdown-item_3M28bm7","vitro-image-container":"_slide-up-button_vitro-image-container_3gJ3-PB"};
+
+var SlideUpButtonItem = function SlideUpButtonItem(props) {
+  var onClick = function onClick(e) {
+    if (props.onClick) {
+      props.onClick(e);
+    } else if (props.href) {
+      var event = new CustomEvent(exports.EVENT.HISTORY_UPDATE, {
+        detail: {
+          pathname: props.href
+        }
+      });
+      window.dispatchEvent(event);
+    }
+  };
+  return React__default.createElement(FlexBox, {
+    onClick: onClick,
+    className: styles$21['vitro-slide-up-button-item']
+  }, (props.isShowImage || props.imageUrl) && React__default.createElement(FlexBox, {
+    className: styles$21['vitro-image-container']
+  }, props.imageUrl && React__default.createElement(Image, {
+    defaultUrl: props.imageUrl,
+    hoverUrl: props.imageHoverUrl
+  })), React__default.createElement("span", null, props.text));
+};
+
+var SlideUpButtonDropdownItem = function SlideUpButtonDropdownItem(props) {
+  return React__default.createElement(ExpandControlGroup, {
+    expandText: CTRL.EMPTY,
+    collapseText: CTRL.EMPTY,
+    className: styles$21['vitro-slide-up-button-dropdown-item'],
+    buttonContent: React__default.createElement(FlexBox, null, (props.isShowImage || props.imageUrl) && React__default.createElement(FlexBox, {
+      className: styles$21['vitro-image-container']
+    }, props.imageUrl ? React__default.createElement(Image, {
+      defaultUrl: props.imageUrl,
+      hoverUrl: props.imageHoverUrl
+    }) : null), React__default.createElement("span", null, props.text))
+  }, props.itemList && props.itemList.length !== 0 && props.itemList.map(function (item) {
+    if (item.itemList) {
+      return React__default.createElement(SlideUpButtonDropdownItem, Object.assign({}, item));
+    }
+    return React__default.createElement(SlideUpButtonItem, Object.assign({}, item));
+  }), props.children);
+};
+
+var SlideUpButton = function SlideUpButton(props) {
+  var _props$itemList;
+  var _useState = React.useState(false),
+    isExpanded = _useState[0],
+    setIsExpanded = _useState[1];
+  var isShowImage = (_props$itemList = props.itemList) !== null && _props$itemList !== void 0 && _props$itemList.find(function (item) {
+    return item.imageUrl;
+  }) ? true : false;
+  var onClick = function onClick(e) {
+    setIsExpanded(true);
+    if (props.onClick) {
+      props.onClick(e);
+    }
+  };
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement(Button$2, {
+    onClick: onClick,
+    text: CTRL.EMPTY,
+    imageUrl: props.imageUrl,
+    imageHoverUrl: props.imageHoverUrl,
+    className: props.className
+  }), React__default.createElement(SlideUpPanel, {
+    isShow: isExpanded,
+    onClose: function onClose() {
+      return setIsExpanded(false);
+    },
+    className: styles$21['vitro-slide-up-panel']
+  }, React__default.createElement(ScrollBar, {
+    contentClassName: styles$21['vitro-scrollbar-content'],
+    isHideScrollX: true
+  }, props.itemList && props.itemList.length !== 0 && props.itemList.map(function (item) {
+    if (item.itemList) {
+      return React__default.createElement(SlideUpButtonDropdownItem, Object.assign({}, item));
+    }
+    return React__default.createElement(SlideUpButtonItem, Object.assign({}, item, {
+      isShowImage: isShowImage
+    }));
+  }), props.children)));
+};
+
 exports.ACTION_HANDLER = ActionHandlerConstants;
 exports.ALERT = AlertConstants;
 exports.ActionHandler = ActionHandler;
@@ -86952,13 +86110,13 @@ exports.CommandMenu = CommandMenu;
 exports.CommandMenuButton = CommandMenuButton;
 exports.CommandMenuDropdownButton = CommandMenuDropdownButton;
 exports.CommandMenuLookupPicker = CommandMenuLookupPicker;
-exports.CommandMenuSubItem = CommandMenuSubItem;
 exports.ComponentLoader = ComponentLoader;
 exports.ComponentLoaderServiceImpl = ComponentLoaderServiceImpl;
 exports.ControlGroup = ControlGroup;
 exports.CopyButton = CopyButton;
 exports.Criterion = Criterion;
 exports.CriterionFieldIterator = CriterionFieldIterator;
+exports.DROPDOWN_BUTTON = DropdownButtonConstants;
 exports.DatePicker = DatePicker;
 exports.DeleteButton = DeleteButton;
 exports.Dialog = Dialog;
@@ -86966,6 +86124,8 @@ exports.DialogContent = DialogContent;
 exports.DialogFooter = DialogFooter;
 exports.DropZone = DropZone;
 exports.DropdownButton = DropdownButton;
+exports.DropdownButtonDropdownItem = DropdownButtonDropdownItem;
+exports.DropdownButtonItem = DropdownButtonItem;
 exports.DxfViewer = DxfViewer;
 exports.EditableFieldIterator = EditableFieldIterator;
 exports.EditableList = EditableList;
@@ -87034,6 +86194,9 @@ exports.SharedItemLinkForm = SharedItemLinkForm;
 exports.Sidebar = Sidebar;
 exports.SidebarButton = SidebarButton;
 exports.SiteSelect = SiteSelect;
+exports.SlideUpButton = SlideUpButton;
+exports.SlideUpButtonDropdownItem = SlideUpButtonDropdownItem;
+exports.SlideUpButtonItem = SlideUpButtonItem;
 exports.SlideUpPanel = SlideUpPanel;
 exports.Splitter = Splitter;
 exports.StarButton = StarButton;