@univerjs/ui 0.4.1 → 0.4.2-nightly.202410291606

package/lib/es/index.js

@@ -6,10 +6,10 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
 var __name = (target, value) => __defProp(target, "name", { value, configurable: !0 });
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value);
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-import { toDisposable, IUniverInstanceService, DocumentFlavor, useDependency, LocaleService, ColorKit, createIdentifier, Disposable, Workbook, UniverInstanceType, DocumentDataModel, SlideDataModel, remove, FOCUSING_UNIVER_EDITOR, IContextService, Inject, Injector, Tools, IConfigService, isRealNum, ErrorService, CommandType, IUndoRedoService, UndoCommand, RedoCommand, Optional, ICommandService, useInjector, ILogService, useObservable as useObservable$1, ThemeService, LifecycleService, connectInjector, isInternalEditorID, LifecycleStages, DependentOn, Plugin, mergeOverrideWithDependencies, ILocalStorageService, BaselineOffset, getBorderStyleType, BorderStyleTypes } from "@univerjs/core";
+import { toDisposable, IUniverInstanceService, DocumentFlavor, useDependency, LocaleService, ColorKit, createIdentifier, Disposable, Workbook, UniverInstanceType, DocumentDataModel, SlideDataModel, remove, FOCUSING_UNIVER_EDITOR, IContextService, Inject, Injector, Tools, IConfigService, isRealNum, ThemeService, ErrorService, CommandType, IUndoRedoService, UndoCommand, RedoCommand, Optional, ICommandService, useInjector, ILogService, useObservable as useObservable$1, LifecycleService, connectInjector, isInternalEditorID, LifecycleStages, DependentOn, Plugin, mergeOverrideWithDependencies, ILocalStorageService, BaselineOffset, getBorderStyleType, BorderStyleTypes } from "@univerjs/core";
 import * as React from "react";
 import React__default, { forwardRef, useRef, createElement, cloneElement, useEffect, useState, useMemo, useCallback, memo, createContext, useContext, version as version$1, isValidElement, useLayoutEffect } from "react";
-import { Observable, switchMap, BehaviorSubject, isObservable, fromEvent, Subject, combineLatest, distinctUntilChanged, throttleTime, animationFrameScheduler, filter, debounceTime, map as map$1, startWith, take, ReplaySubject } from "rxjs";
+import { Observable, switchMap, BehaviorSubject, isObservable, fromEvent, Subject, combineLatest, distinctUntilChanged, first, throttleTime, animationFrameScheduler, filter, debounceTime, map as map$1, startWith, take, ReplaySubject } from "rxjs";
 import { InputNumber, resizeObserverCtor, Menu as Menu$1, MenuItemGroup, MenuItem as MenuItem$1, SubMenu, MessageType, RectPopup, Popup, Tooltip, Dropdown, defaultTheme, themeInstance, ConfigProvider, ConfigContext, Confirm, Dialog, Message } from "@univerjs/design";
 import { map } from "rxjs/operators";
 import { IRenderManagerService, UniverRenderEnginePlugin, ptToPx } from "@univerjs/engine-render";
@@ -61,78 +61,86 @@ function generateShortUuid() {
 }
 __name(generateShortUuid, "generateShortUuid");
 IconBase.displayName = "UniverIcon";
-var element$1I = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M4.06641 3.49366C4.06641 2.27555 5.14145 1.3916 6.33307 1.3916 7.52469 1.3916 8.59974 2.27555 8.59974 3.49366V6.49777C8.59974 7.71586 7.52469 8.59982 6.33307 8.59982 5.14145 8.59982 4.06641 7.71586 4.06641 6.49777V3.49366zM6.33307 2.5916C5.68376 2.5916 5.26641 3.05264 5.26641 3.49366V6.49777C5.26641 6.93878 5.68376 7.39982 6.33307 7.39982 6.98239 7.39982 7.39974 6.93878 7.39974 6.49777V3.49366C7.39974 3.05264 6.98239 2.5916 6.33307 2.5916zM10.0664 3.49366C10.0664 2.27555 11.1415 1.3916 12.3331 1.3916 13.5247 1.3916 14.5997 2.27555 14.5997 3.49366V6.49777C14.5997 7.71586 13.5247 8.59982 12.3331 8.59982 11.1415 8.59982 10.0664 7.71586 10.0664 6.49777V3.49366zM12.3331 2.5916C11.6838 2.5916 11.2664 3.05264 11.2664 3.49366V6.49777C11.2664 6.93878 11.6838 7.39982 12.3331 7.39982 12.9824 7.39982 13.3997 6.93878 13.3997 6.49777V3.49366C13.3997 3.05264 12.9824 2.5916 12.3331 2.5916z", fillRule: "evenodd", clipRule: "evenodd" } }, { tag: "path", attrs: { fill: "currentColor", d: "M12.4242 9.5417C12.1899 9.30739 11.81 9.30739 11.5756 9.5417 11.3413 9.77602 11.3413 10.1559 11.5756 10.3902L12.5514 11.366H6.3334C6.00203 11.366 5.7334 11.6346 5.7334 11.966 5.7334 12.2973 6.00203 12.566 6.3334 12.566H12.5514L11.5756 13.5417C11.3413 13.776 11.3413 14.1559 11.5756 14.3902 11.81 14.6245 12.1899 14.6245 12.4242 14.3902L14.4159 12.3985C14.5294 12.2893 14.6001 12.1359 14.6001 11.966 14.6001 11.796 14.5294 11.6426 14.4159 11.5334L12.4242 9.5417zM1.3999 8.3002C1.3999 7.96882 1.66853 7.7002 1.9999 7.7002H2.33324C2.66461 7.7002 2.93324 7.96882 2.93324 8.3002 2.93324 8.63157 2.66461 8.9002 2.33324 8.9002H1.9999C1.66853 8.9002 1.3999 8.63157 1.3999 8.3002z" } }] }, AddDigitsSingle = forwardRef(function(props, ref) {
+var element$1J = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M4.06641 3.49366C4.06641 2.27555 5.14145 1.3916 6.33307 1.3916 7.52469 1.3916 8.59974 2.27555 8.59974 3.49366V6.49777C8.59974 7.71586 7.52469 8.59982 6.33307 8.59982 5.14145 8.59982 4.06641 7.71586 4.06641 6.49777V3.49366zM6.33307 2.5916C5.68376 2.5916 5.26641 3.05264 5.26641 3.49366V6.49777C5.26641 6.93878 5.68376 7.39982 6.33307 7.39982 6.98239 7.39982 7.39974 6.93878 7.39974 6.49777V3.49366C7.39974 3.05264 6.98239 2.5916 6.33307 2.5916zM10.0664 3.49366C10.0664 2.27555 11.1415 1.3916 12.3331 1.3916 13.5247 1.3916 14.5997 2.27555 14.5997 3.49366V6.49777C14.5997 7.71586 13.5247 8.59982 12.3331 8.59982 11.1415 8.59982 10.0664 7.71586 10.0664 6.49777V3.49366zM12.3331 2.5916C11.6838 2.5916 11.2664 3.05264 11.2664 3.49366V6.49777C11.2664 6.93878 11.6838 7.39982 12.3331 7.39982 12.9824 7.39982 13.3997 6.93878 13.3997 6.49777V3.49366C13.3997 3.05264 12.9824 2.5916 12.3331 2.5916z", fillRule: "evenodd", clipRule: "evenodd" } }, { tag: "path", attrs: { fill: "currentColor", d: "M12.4242 9.5417C12.1899 9.30739 11.81 9.30739 11.5756 9.5417 11.3413 9.77602 11.3413 10.1559 11.5756 10.3902L12.5514 11.366H6.3334C6.00203 11.366 5.7334 11.6346 5.7334 11.966 5.7334 12.2973 6.00203 12.566 6.3334 12.566H12.5514L11.5756 13.5417C11.3413 13.776 11.3413 14.1559 11.5756 14.3902 11.81 14.6245 12.1899 14.6245 12.4242 14.3902L14.4159 12.3985C14.5294 12.2893 14.6001 12.1359 14.6001 11.966 14.6001 11.796 14.5294 11.6426 14.4159 11.5334L12.4242 9.5417zM1.3999 8.3002C1.3999 7.96882 1.66853 7.7002 1.9999 7.7002H2.33324C2.66461 7.7002 2.93324 7.96882 2.93324 8.3002 2.93324 8.63157 2.66461 8.9002 2.33324 8.9002H1.9999C1.66853 8.9002 1.3999 8.63157 1.3999 8.3002z" } }] }, AddDigitsSingle = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "add-digits-single",
     ref,
-    icon: element$1I
+    icon: element$1J
   }));
 });
 AddDigitsSingle.displayName = "AddDigitsSingle";
-var element$1H = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "mask", attrs: { id: "mask0_107_1312", style: { maskType: "alpha" }, width: 16, height: 16, x: 0, y: 0, maskUnits: "userSpaceOnUse" }, children: [{ tag: "path", attrs: { fill: "#D9D9D9", d: "M0 0H16V16H0z" } }] }, { tag: "g", attrs: { mask: "url(#mask0_107_1312)" }, children: [{ tag: "path", attrs: { fill: "colorChannel1", d: "M8.60231 5.77597L9.38125 6.55432C9.61658 6.78947 9.99797 6.78932 10.2331 6.554C10.4683 6.31867 10.4681 5.93728 10.2328 5.70214L8.44939 3.92009C8.33908 3.79657 8.1786 3.7188 7.99995 3.7188C7.84562 3.71861 7.6906 3.77736 7.57281 3.89506L5.76712 5.69933C5.5318 5.93447 5.53165 6.31587 5.76679 6.55119C6.00193 6.78652 6.38332 6.78667 6.61865 6.55153L7.3976 5.77319L7.3976 10.2246L6.61865 9.44621C6.38333 9.21107 6.00194 9.21121 5.76679 9.44654C5.53165 9.68186 5.53179 10.0633 5.76712 10.2984L7.55051 12.0804C7.66082 12.204 7.82131 12.2817 7.99995 12.2817L8.00089 12.2817C8.15512 12.2819 8.30939 12.2231 8.4271 12.1055L10.2328 10.3012C10.4681 10.0661 10.4683 9.68467 10.2331 9.44934C9.99798 9.21402 9.61659 9.21387 9.38126 9.44901L8.60231 10.2274L8.60231 5.77597Z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M13.7039 3.24701C14.0539 3.24701 14.3377 2.96327 14.3377 2.61325 14.3377 2.26324 14.0539 1.97949 13.7039 1.97949L2.29627 1.97949C1.94625 1.97949 1.66251 2.26324 1.66251 2.61325 1.66251 2.96327 1.94625 3.24701 2.29627 3.24701L13.7039 3.24701zM13.7039 14.0209C14.0539 14.0209 14.3377 13.7372 14.3377 13.3872 14.3377 13.0371 14.0539 12.7534 13.7039 12.7534L2.29627 12.7534C1.94625 12.7534 1.66251 13.0371 1.66251 13.3872 1.66251 13.7372 1.94625 14.0209 2.29627 14.0209L13.7039 14.0209z" } }] }] }, AdjustHeight = forwardRef(function(props, ref) {
+var element$1I = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "mask", attrs: { id: "mask0_107_1312", style: { maskType: "alpha" }, width: 16, height: 16, x: 0, y: 0, maskUnits: "userSpaceOnUse" }, children: [{ tag: "path", attrs: { fill: "#D9D9D9", d: "M0 0H16V16H0z" } }] }, { tag: "g", attrs: { mask: "url(#mask0_107_1312)" }, children: [{ tag: "path", attrs: { fill: "colorChannel1", d: "M8.60231 5.77597L9.38125 6.55432C9.61658 6.78947 9.99797 6.78932 10.2331 6.554C10.4683 6.31867 10.4681 5.93728 10.2328 5.70214L8.44939 3.92009C8.33908 3.79657 8.1786 3.7188 7.99995 3.7188C7.84562 3.71861 7.6906 3.77736 7.57281 3.89506L5.76712 5.69933C5.5318 5.93447 5.53165 6.31587 5.76679 6.55119C6.00193 6.78652 6.38332 6.78667 6.61865 6.55153L7.3976 5.77319L7.3976 10.2246L6.61865 9.44621C6.38333 9.21107 6.00194 9.21121 5.76679 9.44654C5.53165 9.68186 5.53179 10.0633 5.76712 10.2984L7.55051 12.0804C7.66082 12.204 7.82131 12.2817 7.99995 12.2817L8.00089 12.2817C8.15512 12.2819 8.30939 12.2231 8.4271 12.1055L10.2328 10.3012C10.4681 10.0661 10.4683 9.68467 10.2331 9.44934C9.99798 9.21402 9.61659 9.21387 9.38126 9.44901L8.60231 10.2274L8.60231 5.77597Z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M13.7039 3.24701C14.0539 3.24701 14.3377 2.96327 14.3377 2.61325 14.3377 2.26324 14.0539 1.97949 13.7039 1.97949L2.29627 1.97949C1.94625 1.97949 1.66251 2.26324 1.66251 2.61325 1.66251 2.96327 1.94625 3.24701 2.29627 3.24701L13.7039 3.24701zM13.7039 14.0209C14.0539 14.0209 14.3377 13.7372 14.3377 13.3872 14.3377 13.0371 14.0539 12.7534 13.7039 12.7534L2.29627 12.7534C1.94625 12.7534 1.66251 13.0371 1.66251 13.3872 1.66251 13.7372 1.94625 14.0209 2.29627 14.0209L13.7039 14.0209z" } }] }] }, AdjustHeight = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "adjust-height",
     ref,
-    icon: element$1H
+    icon: element$1I
   }));
 });
 AdjustHeight.displayName = "AdjustHeight";
-var element$1G = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "mask", attrs: { id: "mask0_102_1166", style: { maskType: "alpha" }, width: 16, height: 16, x: 0, y: 0, maskUnits: "userSpaceOnUse" }, children: [{ tag: "path", attrs: { fill: "#D9D9D9", d: "M0 0H16V16H0z" } }] }, { tag: "g", attrs: { mask: "url(#mask0_102_1166)" }, children: [{ tag: "path", attrs: { fill: "colorChannel1", d: "M5.77574 7.3974L6.5541 6.61846C6.78924 6.38313 6.78909 6.00174 6.55377 5.7666C6.31844 5.53145 5.93705 5.5316 5.70191 5.76692L3.91987 7.55032C3.79634 7.66063 3.71857 7.82111 3.71857 7.99976C3.71838 8.15409 3.77713 8.30912 3.89483 8.42691L5.6991 10.2326C5.93425 10.4679 6.31564 10.4681 6.55096 10.2329C6.78629 9.99778 6.78644 9.61639 6.5513 9.38106L5.77296 8.60211L10.2243 8.60211L9.44598 9.38106C9.21084 9.61638 9.21099 9.99777 9.44631 10.2329C9.68164 10.4681 10.063 10.4679 10.2982 10.2326L12.0802 8.4492C12.2037 8.33889 12.2815 8.1784 12.2815 7.99976L12.2815 7.99882C12.2816 7.84459 12.2229 7.69032 12.1052 7.57261L10.301 5.76693C10.0658 5.5316 9.68444 5.53145 9.44911 5.76659C9.21379 6.00173 9.21364 6.38312 9.44878 6.61845L10.2271 7.3974L5.77574 7.3974Z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M3.24683 2.29598C3.24683 1.94596 2.96308 1.66222 2.61307 1.66222 2.26305 1.66222 1.97931 1.94596 1.97931 2.29598L1.97931 13.7036C1.97931 14.0537 2.26305 14.3374 2.61307 14.3374 2.96308 14.3374 3.24683 14.0537 3.24683 13.7036L3.24683 2.29598zM14.0207 2.29598C14.0207 1.94596 13.737 1.66222 13.387 1.66222 13.037 1.66222 12.7532 1.94596 12.7532 2.29598L12.7532 13.7036C12.7532 14.0537 13.037 14.3374 13.387 14.3374 13.737 14.3374 14.0207 14.0537 14.0207 13.7036L14.0207 2.29598z" } }] }] }, AdjustWidth = forwardRef(function(props, ref) {
+var element$1H = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "mask", attrs: { id: "mask0_102_1166", style: { maskType: "alpha" }, width: 16, height: 16, x: 0, y: 0, maskUnits: "userSpaceOnUse" }, children: [{ tag: "path", attrs: { fill: "#D9D9D9", d: "M0 0H16V16H0z" } }] }, { tag: "g", attrs: { mask: "url(#mask0_102_1166)" }, children: [{ tag: "path", attrs: { fill: "colorChannel1", d: "M5.77574 7.3974L6.5541 6.61846C6.78924 6.38313 6.78909 6.00174 6.55377 5.7666C6.31844 5.53145 5.93705 5.5316 5.70191 5.76692L3.91987 7.55032C3.79634 7.66063 3.71857 7.82111 3.71857 7.99976C3.71838 8.15409 3.77713 8.30912 3.89483 8.42691L5.6991 10.2326C5.93425 10.4679 6.31564 10.4681 6.55096 10.2329C6.78629 9.99778 6.78644 9.61639 6.5513 9.38106L5.77296 8.60211L10.2243 8.60211L9.44598 9.38106C9.21084 9.61638 9.21099 9.99777 9.44631 10.2329C9.68164 10.4681 10.063 10.4679 10.2982 10.2326L12.0802 8.4492C12.2037 8.33889 12.2815 8.1784 12.2815 7.99976L12.2815 7.99882C12.2816 7.84459 12.2229 7.69032 12.1052 7.57261L10.301 5.76693C10.0658 5.5316 9.68444 5.53145 9.44911 5.76659C9.21379 6.00173 9.21364 6.38312 9.44878 6.61845L10.2271 7.3974L5.77574 7.3974Z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M3.24683 2.29598C3.24683 1.94596 2.96308 1.66222 2.61307 1.66222 2.26305 1.66222 1.97931 1.94596 1.97931 2.29598L1.97931 13.7036C1.97931 14.0537 2.26305 14.3374 2.61307 14.3374 2.96308 14.3374 3.24683 14.0537 3.24683 13.7036L3.24683 2.29598zM14.0207 2.29598C14.0207 1.94596 13.737 1.66222 13.387 1.66222 13.037 1.66222 12.7532 1.94596 12.7532 2.29598L12.7532 13.7036C12.7532 14.0537 13.037 14.3374 13.387 14.3374 13.737 14.3374 14.0207 14.0537 14.0207 13.7036L14.0207 2.29598z" } }] }] }, AdjustWidth = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "adjust-width",
     ref,
-    icon: element$1G
+    icon: element$1H
   }));
 });
 AdjustWidth.displayName = "AdjustWidth";
-var element$1F = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.3999 13.6999C1.3999 13.3685 1.66853 13.0999 1.9999 13.0999H13.9999C14.3313 13.0999 14.5999 13.3685 14.5999 13.6999 14.5999 14.0312 14.3313 14.2999 13.9999 14.2999H1.9999C1.66853 14.2999 1.3999 14.0312 1.3999 13.6999zM7.57564 10.3914C7.80995 10.6257 8.18985 10.6257 8.42417 10.3914L10.4242 8.3914C10.6585 8.15709 10.6585 7.77719 10.4242 7.54287 10.1899 7.30856 9.80995 7.30856 9.57564 7.54287L7.9999 9.11861 6.42417 7.54287C6.18985 7.30856 5.80995 7.30856 5.57564 7.54287 5.34132 7.77719 5.34132 8.15709 5.57564 8.3914L7.57564 10.3914z", fillRule: "evenodd", clipRule: "evenodd" } }, { tag: "path", attrs: { fill: "currentColor", d: "M7.9999 10.5671C8.33127 10.5671 8.5999 10.2985 8.5999 9.96714V2.30047C8.5999 1.9691 8.33127 1.70047 7.9999 1.70047C7.66853 1.70047 7.3999 1.9691 7.3999 2.30047V9.96714C7.3999 10.2985 7.66853 10.5671 7.9999 10.5671Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, AlignBottomSingle = forwardRef(function(props, ref) {
+var element$1G = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.3999 13.6999C1.3999 13.3685 1.66853 13.0999 1.9999 13.0999H13.9999C14.3313 13.0999 14.5999 13.3685 14.5999 13.6999 14.5999 14.0312 14.3313 14.2999 13.9999 14.2999H1.9999C1.66853 14.2999 1.3999 14.0312 1.3999 13.6999zM7.57564 10.3914C7.80995 10.6257 8.18985 10.6257 8.42417 10.3914L10.4242 8.3914C10.6585 8.15709 10.6585 7.77719 10.4242 7.54287 10.1899 7.30856 9.80995 7.30856 9.57564 7.54287L7.9999 9.11861 6.42417 7.54287C6.18985 7.30856 5.80995 7.30856 5.57564 7.54287 5.34132 7.77719 5.34132 8.15709 5.57564 8.3914L7.57564 10.3914z", fillRule: "evenodd", clipRule: "evenodd" } }, { tag: "path", attrs: { fill: "currentColor", d: "M7.9999 10.5671C8.33127 10.5671 8.5999 10.2985 8.5999 9.96714V2.30047C8.5999 1.9691 8.33127 1.70047 7.9999 1.70047C7.66853 1.70047 7.3999 1.9691 7.3999 2.30047V9.96714C7.3999 10.2985 7.66853 10.5671 7.9999 10.5671Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, AlignBottomSingle = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "align-bottom-single",
     ref,
-    icon: element$1F
+    icon: element$1G
   }));
 });
 AlignBottomSingle.displayName = "AlignBottomSingle";
-var element$1E = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.9999 1.89941C1.66853 1.89941 1.3999 2.16804 1.3999 2.49941 1.3999 2.83078 1.66853 3.09941 1.9999 3.09941H13.9999C14.3313 3.09941 14.5999 2.83078 14.5999 2.49941 14.5999 2.16804 14.3313 1.89941 13.9999 1.89941H1.9999zM1.9999 5.56641C1.66853 5.56641 1.3999 5.83504 1.3999 6.16641 1.3999 6.49778 1.66853 6.76641 1.9999 6.76641H13.9999C14.3313 6.76641 14.5999 6.49778 14.5999 6.16641 14.5999 5.83504 14.3313 5.56641 13.9999 5.56641H1.9999zM1.3999 9.8334C1.3999 9.50203 1.66853 9.2334 1.9999 9.2334H13.9999C14.3313 9.2334 14.5999 9.50203 14.5999 9.8334 14.5999 10.1648 14.3313 10.4334 13.9999 10.4334H1.9999C1.66853 10.4334 1.3999 10.1648 1.3999 9.8334zM1.9999 12.9004C1.66853 12.9004 1.3999 13.169 1.3999 13.5004 1.3999 13.8318 1.66853 14.1004 1.9999 14.1004H13.9999C14.3313 14.1004 14.5999 13.8318 14.5999 13.5004 14.5999 13.169 14.3313 12.9004 13.9999 12.9004H1.9999z" } }] }, AlignTextBothSingle = forwardRef(function(props, ref) {
+var element$1F = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.9999 1.89941C1.66853 1.89941 1.3999 2.16804 1.3999 2.49941 1.3999 2.83078 1.66853 3.09941 1.9999 3.09941H13.9999C14.3313 3.09941 14.5999 2.83078 14.5999 2.49941 14.5999 2.16804 14.3313 1.89941 13.9999 1.89941H1.9999zM1.9999 5.56641C1.66853 5.56641 1.3999 5.83504 1.3999 6.16641 1.3999 6.49778 1.66853 6.76641 1.9999 6.76641H13.9999C14.3313 6.76641 14.5999 6.49778 14.5999 6.16641 14.5999 5.83504 14.3313 5.56641 13.9999 5.56641H1.9999zM1.3999 9.8334C1.3999 9.50203 1.66853 9.2334 1.9999 9.2334H13.9999C14.3313 9.2334 14.5999 9.50203 14.5999 9.8334 14.5999 10.1648 14.3313 10.4334 13.9999 10.4334H1.9999C1.66853 10.4334 1.3999 10.1648 1.3999 9.8334zM1.9999 12.9004C1.66853 12.9004 1.3999 13.169 1.3999 13.5004 1.3999 13.8318 1.66853 14.1004 1.9999 14.1004H13.9999C14.3313 14.1004 14.5999 13.8318 14.5999 13.5004 14.5999 13.169 14.3313 12.9004 13.9999 12.9004H1.9999z" } }] }, AlignTextBothSingle = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "align-text-both-single",
     ref,
-    icon: element$1E
+    icon: element$1F
   }));
 });
 AlignTextBothSingle.displayName = "AlignTextBothSingle";
-var element$1D = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.3999 2.3002C1.3999 2.63157 1.66853 2.9002 1.9999 2.9002H13.9999C14.3313 2.9002 14.5999 2.63157 14.5999 2.3002 14.5999 1.96882 14.3313 1.7002 13.9999 1.7002H1.9999C1.66853 1.7002 1.3999 1.96882 1.3999 2.3002zM8.22957 5.47839C8.30034 5.50767 8.36664 5.55107 8.42417 5.6086L10.4242 7.6086C10.6585 7.84291 10.6585 8.22281 10.4242 8.45713 10.1899 8.69144 9.80995 8.69144 9.57564 8.45713L8.5999 7.48139V13.6995C8.5999 14.0309 8.33127 14.2995 7.9999 14.2995 7.66853 14.2995 7.3999 14.0309 7.3999 13.6995V7.48139L6.42417 8.45713C6.18985 8.69144 5.80995 8.69144 5.57564 8.45713 5.34132 8.22281 5.34132 7.84291 5.57564 7.6086L7.57541 5.60882C7.7522 5.43203 8.01209 5.38841 8.22957 5.47839z" } }] }, AlignTopSingle = forwardRef(function(props, ref) {
+var element$1E = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.3999 2.3002C1.3999 2.63157 1.66853 2.9002 1.9999 2.9002H13.9999C14.3313 2.9002 14.5999 2.63157 14.5999 2.3002 14.5999 1.96882 14.3313 1.7002 13.9999 1.7002H1.9999C1.66853 1.7002 1.3999 1.96882 1.3999 2.3002zM8.22957 5.47839C8.30034 5.50767 8.36664 5.55107 8.42417 5.6086L10.4242 7.6086C10.6585 7.84291 10.6585 8.22281 10.4242 8.45713 10.1899 8.69144 9.80995 8.69144 9.57564 8.45713L8.5999 7.48139V13.6995C8.5999 14.0309 8.33127 14.2995 7.9999 14.2995 7.66853 14.2995 7.3999 14.0309 7.3999 13.6995V7.48139L6.42417 8.45713C6.18985 8.69144 5.80995 8.69144 5.57564 8.45713 5.34132 8.22281 5.34132 7.84291 5.57564 7.6086L7.57541 5.60882C7.7522 5.43203 8.01209 5.38841 8.22957 5.47839z" } }] }, AlignTopSingle = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "align-top-single",
     ref,
-    icon: element$1D
+    icon: element$1E
   }));
 });
 AlignTopSingle.displayName = "AlignTopSingle";
-var element$1C = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M7.9999 1.12915C8.03875 1.12915 8.07673 1.13284 8.11352 1.13989H12.2599C13.6958 1.13989 14.8599 2.30395 14.8599 3.73989V7.88619C14.867 7.92301 14.8707 7.96102 14.8707 7.9999C14.8707 8.03878 14.867 8.0768 14.8599 8.11362V12.2599C14.8599 13.6958 13.6958 14.8599 12.2599 14.8599H8.11362C8.0768 14.867 8.03878 14.8707 7.9999 14.8707C7.96102 14.8707 7.92301 14.867 7.88619 14.8599H3.73989C2.30396 14.8599 1.13989 13.6958 1.13989 12.2599V8.11352C1.13284 8.07673 1.12915 8.03875 1.12915 7.9999C1.12915 7.96106 1.13284 7.92308 1.13989 7.88629V3.73989C1.13989 2.30396 2.30395 1.13989 3.73989 1.13989H7.88629C7.92308 1.13284 7.96106 1.12915 7.9999 1.12915ZM2.33989 8.5999V12.2599C2.33989 13.0331 2.9667 13.6599 3.73989 13.6599H7.3999V8.5999H2.33989ZM7.3999 7.3999H2.33989V3.73989C2.33989 2.9667 2.96669 2.33989 3.73989 2.33989H7.3999V7.3999ZM8.5999 8.5999V13.6599H12.2599C13.0331 13.6599 13.6599 13.0331 13.6599 12.2599V8.5999H8.5999ZM13.6599 7.3999H8.5999V2.33989H12.2599C13.0331 2.33989 13.6599 2.96669 13.6599 3.73989V7.3999Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, AllBorderSingle = forwardRef(function(props, ref) {
+var element$1D = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M7.9999 1.12915C8.03875 1.12915 8.07673 1.13284 8.11352 1.13989H12.2599C13.6958 1.13989 14.8599 2.30395 14.8599 3.73989V7.88619C14.867 7.92301 14.8707 7.96102 14.8707 7.9999C14.8707 8.03878 14.867 8.0768 14.8599 8.11362V12.2599C14.8599 13.6958 13.6958 14.8599 12.2599 14.8599H8.11362C8.0768 14.867 8.03878 14.8707 7.9999 14.8707C7.96102 14.8707 7.92301 14.867 7.88619 14.8599H3.73989C2.30396 14.8599 1.13989 13.6958 1.13989 12.2599V8.11352C1.13284 8.07673 1.12915 8.03875 1.12915 7.9999C1.12915 7.96106 1.13284 7.92308 1.13989 7.88629V3.73989C1.13989 2.30396 2.30395 1.13989 3.73989 1.13989H7.88629C7.92308 1.13284 7.96106 1.12915 7.9999 1.12915ZM2.33989 8.5999V12.2599C2.33989 13.0331 2.9667 13.6599 3.73989 13.6599H7.3999V8.5999H2.33989ZM7.3999 7.3999H2.33989V3.73989C2.33989 2.9667 2.96669 2.33989 3.73989 2.33989H7.3999V7.3999ZM8.5999 8.5999V13.6599H12.2599C13.0331 13.6599 13.6599 13.0331 13.6599 12.2599V8.5999H8.5999ZM13.6599 7.3999H8.5999V2.33989H12.2599C13.0331 2.33989 13.6599 2.96669 13.6599 3.73989V7.3999Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, AllBorderSingle = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "all-border-single",
     ref,
-    icon: element$1C
+    icon: element$1D
   }));
 });
 AllBorderSingle.displayName = "AllBorderSingle";
-var element$1B = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M8.5999 5.9999C8.5999 5.66853 8.33127 5.3999 7.9999 5.3999C7.66853 5.3999 7.3999 5.66853 7.3999 5.9999V7.40329L6.004 7.4051C5.67263 7.40553 5.40435 7.67451 5.40479 8.00588C5.40522 8.33725 5.6742 8.60553 6.00557 8.6051L7.3999 8.60329V9.9999C7.3999 10.3313 7.66853 10.5999 7.9999 10.5999C8.33127 10.5999 8.5999 10.3313 8.5999 9.9999V8.60172L10.0004 8.5999C10.3317 8.59947 10.6 8.33049 10.5996 7.99912C10.5992 7.66775 10.3302 7.39947 9.9988 7.3999L8.5999 7.40172V5.9999Z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M7.99958 1.73315C4.53861 1.73315 1.73291 4.53885 1.73291 7.99982C1.73291 11.4608 4.53861 14.2665 7.99958 14.2665C9.51395 14.2665 10.9029 13.7293 11.9862 12.8351L13.2422 14.0908C13.4765 14.3251 13.8564 14.3251 14.0907 14.0907C14.325 13.8564 14.325 13.4765 14.0906 13.2422L12.8347 11.9866C13.729 10.9033 14.2662 9.51428 14.2662 7.99982C14.2662 4.53885 11.4605 1.73315 7.99958 1.73315ZM2.93291 7.99982C2.93291 5.20159 5.20135 2.93315 7.99958 2.93315C10.7978 2.93315 13.0662 5.20159 13.0662 7.99982C13.0662 10.7981 10.7978 13.0665 7.99958 13.0665C5.20135 13.0665 2.93291 10.7981 2.93291 7.99982Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, AmplifySingle = forwardRef(function(props, ref) {
+var element$1C = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M8.5999 5.9999C8.5999 5.66853 8.33127 5.3999 7.9999 5.3999C7.66853 5.3999 7.3999 5.66853 7.3999 5.9999V7.40329L6.004 7.4051C5.67263 7.40553 5.40435 7.67451 5.40479 8.00588C5.40522 8.33725 5.6742 8.60553 6.00557 8.6051L7.3999 8.60329V9.9999C7.3999 10.3313 7.66853 10.5999 7.9999 10.5999C8.33127 10.5999 8.5999 10.3313 8.5999 9.9999V8.60172L10.0004 8.5999C10.3317 8.59947 10.6 8.33049 10.5996 7.99912C10.5992 7.66775 10.3302 7.39947 9.9988 7.3999L8.5999 7.40172V5.9999Z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M7.99958 1.73315C4.53861 1.73315 1.73291 4.53885 1.73291 7.99982C1.73291 11.4608 4.53861 14.2665 7.99958 14.2665C9.51395 14.2665 10.9029 13.7293 11.9862 12.8351L13.2422 14.0908C13.4765 14.3251 13.8564 14.3251 14.0907 14.0907C14.325 13.8564 14.325 13.4765 14.0906 13.2422L12.8347 11.9866C13.729 10.9033 14.2662 9.51428 14.2662 7.99982C14.2662 4.53885 11.4605 1.73315 7.99958 1.73315ZM2.93291 7.99982C2.93291 5.20159 5.20135 2.93315 7.99958 2.93315C10.7978 2.93315 13.0662 5.20159 13.0662 7.99982C13.0662 10.7981 10.7978 13.0665 7.99958 13.0665C5.20135 13.0665 2.93291 10.7981 2.93291 7.99982Z", fillRule: "evenodd", clipRule: "evenodd" } }] }, AmplifySingle = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "amplify-single",
     ref,
-    icon: element$1B
+    icon: element$1C
   }));
 });
 AmplifySingle.displayName = "AmplifySingle";
-var element$1A = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "mask", attrs: { id: "mask0_107_1317", style: { maskType: "alpha" }, width: 16, height: 16, x: 0, y: 0, maskUnits: "userSpaceOnUse" }, children: [{ tag: "path", attrs: { fill: "#D9D9D9", d: "M0 0H16V16H0z" } }] }, { tag: "g", attrs: { mask: "url(#mask0_107_1317)" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M2.29713 1.98047C1.94717 1.98047 1.66348 2.26416 1.66348 2.61412 1.66348 2.96408 1.94717 3.24777 2.29713 3.24777H13.7028C14.0528 3.24777 14.3365 2.96408 14.3365 2.61412 14.3365 2.26416 14.0528 1.98047 13.7028 1.98047H2.29713zM2.29713 12.7525C1.94717 12.7525 1.66348 13.0362 1.66348 13.3862 1.66348 13.7361 1.94717 14.0198 2.29713 14.0198H13.7028C14.0528 14.0198 14.3365 13.7361 14.3365 13.3862 14.3365 13.0362 14.0528 12.7525 13.7028 12.7525H2.29713z" } }, { tag: "path", attrs: { fill: "colorChannel1", d: "M7.42163 4.25588L4.25471 11.2231C4.10989 11.5417 4.25077 11.9174 4.56935 12.0622C4.88794 12.207 5.2636 12.0661 5.40841 11.7475L6.24766 9.90119H9.75197L10.5912 11.7475C10.736 12.0661 11.1117 12.207 11.4303 12.0622C11.7489 11.9174 11.8897 11.5417 11.7449 11.2231L8.578 4.25589C8.5675 4.23244 8.55557 4.20961 8.54227 4.18755C8.49012 4.10102 8.41688 4.0262 8.32579 3.97171C8.301 3.95688 8.27527 3.94377 8.24878 3.93246C8.16764 3.89775 8.08309 3.8813 7.99981 3.88135C7.88457 3.88142 7.77177 3.91309 7.67384 3.97171C7.58714 4.02361 7.5121 4.09664 7.45735 4.18755C7.44406 4.20961 7.43213 4.23244 7.42163 4.25588ZM9.17592 8.63388L7.99981 6.04644L6.8237 8.63388H9.17592Z", fillRule: "evenodd", clipRule: "evenodd" } }] }] }, AutoHeight = forwardRef(function(props, ref) {
+var element$1B = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "mask", attrs: { id: "mask0_107_1317", style: { maskType: "alpha" }, width: 16, height: 16, x: 0, y: 0, maskUnits: "userSpaceOnUse" }, children: [{ tag: "path", attrs: { fill: "#D9D9D9", d: "M0 0H16V16H0z" } }] }, { tag: "g", attrs: { mask: "url(#mask0_107_1317)" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M2.29713 1.98047C1.94717 1.98047 1.66348 2.26416 1.66348 2.61412 1.66348 2.96408 1.94717 3.24777 2.29713 3.24777H13.7028C14.0528 3.24777 14.3365 2.96408 14.3365 2.61412 14.3365 2.26416 14.0528 1.98047 13.7028 1.98047H2.29713zM2.29713 12.7525C1.94717 12.7525 1.66348 13.0362 1.66348 13.3862 1.66348 13.7361 1.94717 14.0198 2.29713 14.0198H13.7028C14.0528 14.0198 14.3365 13.7361 14.3365 13.3862 14.3365 13.0362 14.0528 12.7525 13.7028 12.7525H2.29713z" } }, { tag: "path", attrs: { fill: "colorChannel1", d: "M7.42163 4.25588L4.25471 11.2231C4.10989 11.5417 4.25077 11.9174 4.56935 12.0622C4.88794 12.207 5.2636 12.0661 5.40841 11.7475L6.24766 9.90119H9.75197L10.5912 11.7475C10.736 12.0661 11.1117 12.207 11.4303 12.0622C11.7489 11.9174 11.8897 11.5417 11.7449 11.2231L8.578 4.25589C8.5675 4.23244 8.55557 4.20961 8.54227 4.18755C8.49012 4.10102 8.41688 4.0262 8.32579 3.97171C8.301 3.95688 8.27527 3.94377 8.24878 3.93246C8.16764 3.89775 8.08309 3.8813 7.99981 3.88135C7.88457 3.88142 7.77177 3.91309 7.67384 3.97171C7.58714 4.02361 7.5121 4.09664 7.45735 4.18755C7.44406 4.20961 7.43213 4.23244 7.42163 4.25588ZM9.17592 8.63388L7.99981 6.04644L6.8237 8.63388H9.17592Z", fillRule: "evenodd", clipRule: "evenodd" } }] }] }, AutoHeight = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "auto-height",
     ref,
-    icon: element$1A
+    icon: element$1B
   }));
 });
 AutoHeight.displayName = "AutoHeight";
+var element$1A = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "mask", attrs: { id: "mask0_102_1171", style: { maskType: "alpha" }, width: 16, height: 16, x: 0, y: 0, maskUnits: "userSpaceOnUse" }, children: [{ tag: "path", attrs: { fill: "#D9D9D9", d: "M0 0H16V16H0z" } }] }, { tag: "g", attrs: { mask: "url(#mask0_102_1171)" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.98032 13.7028C1.98032 14.0527 2.26401 14.3364 2.61397 14.3364 2.96392 14.3364 3.24762 14.0527 3.24762 13.7028L3.24762 2.29706C3.24762 1.9471 2.96392 1.66341 2.61397 1.66341 2.26401 1.66341 1.98032 1.9471 1.98032 2.29706L1.98032 13.7028zM12.7524 13.7028C12.7524 14.0527 13.0361 14.3364 13.386 14.3364 13.736 14.3364 14.0197 14.0527 14.0197 13.7028L14.0197 2.29706C14.0197 1.9471 13.736 1.66341 13.386 1.66341 13.0361 1.66341 12.7524 1.9471 12.7524 2.29706L12.7524 13.7028z" } }, { tag: "path", attrs: { fill: "colorChannel1", d: "M7.42187 4.25588L4.25495 11.2231C4.11014 11.5417 4.25101 11.9174 4.5696 12.0622C4.88819 12.207 5.26385 12.0661 5.40866 11.7475L6.2479 9.90119H9.75222L10.5915 11.7475C10.7363 12.0661 11.1119 12.207 11.4305 12.0622C11.7491 11.9174 11.89 11.5417 11.7452 11.2231L8.57825 4.25589C8.56775 4.23244 8.55582 4.20961 8.54252 4.18755C8.49037 4.10102 8.41713 4.0262 8.32603 3.97171C8.30125 3.95688 8.27551 3.94377 8.24902 3.93246C8.16788 3.89775 8.08333 3.8813 8.00006 3.88135C7.88481 3.88142 7.77201 3.91309 7.67409 3.97171C7.58739 4.02361 7.51235 4.09664 7.4576 4.18755C7.4443 4.20961 7.43237 4.23244 7.42187 4.25588ZM9.17617 8.63388L8.00006 6.04644L6.82395 8.63388H9.17617Z", fillRule: "evenodd", clipRule: "evenodd" } }] }] }, AutoWidth = forwardRef(function(props, ref) {
+  return createElement(IconBase, Object.assign({}, props, {
+    id: "auto-width",
+    ref,
+    icon: element$1A
+  }));
+});
+AutoWidth.displayName = "AutoWidth";
 var element$1z = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M2.5999 2.2001C2.5999 1.86873 2.33127 1.6001 1.9999 1.6001 1.66853 1.6001 1.3999 1.86873 1.3999 2.2001V13.8001C1.3999 14.1315 1.66853 14.4001 1.9999 14.4001 2.33127 14.4001 2.5999 14.1315 2.5999 13.8001V2.2001zM14.5999 2.2001C14.5999 1.86873 14.3313 1.6001 13.9999 1.6001 13.6685 1.6001 13.3999 1.86873 13.3999 2.2001V13.8001C13.3999 14.1315 13.6685 14.4001 13.9999 14.4001 14.3313 14.4001 14.5999 14.1315 14.5999 13.8001V2.2001zM6.424 8.24239C6.65832 8.4767 6.65832 8.8566 6.424 9.09091L6.11502 9.3999H9.33307C10.1063 9.3999 10.7331 8.7731 10.7331 7.9999 10.7331 7.22671 10.1063 6.5999 9.33307 6.5999H4.6666L4.66645 5.3999H9.33307C10.769 5.3999 11.9331 6.56396 11.9331 7.9999 11.9331 9.43584 10.769 10.5999 9.33307 10.5999H6.11485L6.424 10.9091C6.65832 11.1434 6.65832 11.5233 6.424 11.7576 6.18969 11.9919 5.80979 11.9919 5.57548 11.7576L4.24214 10.4242C4.00783 10.1899 4.00783 9.81003 4.24214 9.57572L5.57548 8.24239C5.80979 8.00807 6.18969 8.00807 6.424 8.24239z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M4.6666 6.5999C4.33523 6.5999 4.06641 6.33127 4.06641 5.9999C4.06641 5.66853 4.33508 5.3999 4.66645 5.3999L4.6666 6.5999Z" } }] }, AutowrapSingle = forwardRef(function(props, ref) {
   return createElement(IconBase, Object.assign({}, props, {
     id: "autowrap-single",
@@ -1008,6 +1016,7 @@ const _ComponentManager = class _ComponentManager {
       Hide,
       HorizontalBorder,
       AutoHeight,
+      AutoWidth,
       AdjustHeight,
       AdjustWidth,
       AvgSingle,
@@ -1122,11 +1131,11 @@ const _ZIndexManager = class _ZIndexManager {
 };
 _MAX_INDEX = new WeakMap(), _MIN_INDEX = new WeakMap(), __name(_ZIndexManager, "ZIndexManager"), __privateAdd(_ZIndexManager, _MAX_INDEX, 2147483647), __privateAdd(_ZIndexManager, _MIN_INDEX, -2147483647);
 let ZIndexManager = _ZIndexManager;
-function getMenuHiddenObservable(accessor, targetUniverType, matchUnitId) {
+function getMenuHiddenObservable(accessor, targetUniverType, matchUnitId, needHideUnitId) {
   const univerInstanceService = accessor.get(IUniverInstanceService);
   return new Observable((subscriber) => {
     const subscription = univerInstanceService.focused$.subscribe((unitId) => {
-      if (unitId == null || matchUnitId && matchUnitId !== unitId)
+      if (unitId == null || matchUnitId && matchUnitId !== unitId || needHideUnitId && needHideUnitId === unitId)
         return subscriber.next(!0);
       const univerType2 = univerInstanceService.getUnitType(unitId);
       subscriber.next(univerType2 !== targetUniverType);
@@ -2076,93 +2085,41 @@ function MenuItem({ menuItem, onClick }) {
   ] });
 }
 __name(MenuItem, "MenuItem");
-const _ProgressService = class _ProgressService extends Disposable {
-  constructor() {
-    super(...arguments);
-    /**
-     * The total number of tasks remaining
-     */
-    __publicField(this, "_taskCount", 0);
-    __publicField(this, "_progressChange$", new Subject());
-    __publicField(this, "_progressVisible$", new Subject());
-    __publicField(this, "progressChange$", this._progressChange$.asObservable());
-    __publicField(this, "progressVisible$", this._progressVisible$.asObservable());
-  }
-  dispose() {
-    super.dispose(), this._clear(), this._progressChange$.complete(), this._progressVisible$.complete();
-  }
-  pushTask(task) {
-    if (this._taskCount === 0)
-      return;
-    const { count } = task;
-    if (count <= 0)
-      return;
-    const step = Math.min(1, count / this._taskCount);
-    this._progressChange$.next({
-      step
-    }), this._taskCount -= count, this._taskCount < 0 && (this._taskCount = 0), this._taskCount === 0 && this._progressVisible$.next(!1);
-  }
-  insertTaskCount(count) {
-    count <= 0 || (this._taskCount === 0 && this._progressVisible$.next(!0), this._taskCount += count);
-  }
-  complete() {
-    this._taskCount !== 0 && (this._progressChange$.next({
-      step: 1
-    }), this._clear(), this._progressVisible$.next(!1));
-  }
-  stop() {
-    this._taskCount !== 0 && (this._clear(), this._progressVisible$.next(!1));
-  }
-  getTaskCount() {
-    return this._taskCount;
-  }
-  _clear() {
-    this._taskCount = 0;
-  }
-};
-__name(_ProgressService, "ProgressService");
-let ProgressService = _ProgressService;
-const IProgressService = createIdentifier(
-  "univer.progress.service"
-), progressBar = "univer-progress-bar", progressBarContainer = "univer-progress-bar-container", progressBarInner = "univer-progress-bar-inner", progressBarCloseButton = "univer-progress-bar-close-button", styles$b = {
+const progressBar = "univer-progress-bar", progressBarContainer = "univer-progress-bar-container", progressBarInner = "univer-progress-bar-inner", progressBarCloseButton = "univer-progress-bar-close-button", styles$b = {
   progressBar,
   progressBarContainer,
   progressBarInner,
   progressBarCloseButton
 };
 function ProgressBar(props) {
-  const { barColor } = props, progressService = useDependency(IProgressService), progressBarInnerRef = useRef(null), [visible, setVisible] = useState(!1);
-  useEffect(() => {
-    const progressVisible = progressService.progressVisible$.subscribe((isVisible) => {
-      isVisible ? setVisible(isVisible) : setTimeout(() => {
-        setVisible(isVisible), progressBarInnerRef.current && (progressBarInnerRef.current.style.width = "0%");
-      }, 500);
-    }), progressChange = progressService.progressChange$.subscribe((task) => {
-      const { step } = task;
-      if (progressBarInnerRef.current) {
-        const currentProgress = Number.parseFloat(progressBarInnerRef.current.style.width) || 0, newProgress = currentProgress + (100 - currentProgress) * step;
-        progressBarInnerRef.current.style.width = `${newProgress}%`;
-      }
-    });
-    return () => {
-      progressVisible.unsubscribe(), progressChange.unsubscribe();
+  const { barColor, progress, onTerminate, onClearProgress } = props, { count, done } = progress, themeService = useDependency(ThemeService), color = barColor != null ? barColor : themeService.getCurrentTheme().primaryColor, progressBarInnerRef = useRef(null), [visible, setVisible] = useState(count > 0), [prevCount, setPrevCount] = useState(0), [prevDone, setPrevDone] = useState(0);
+  return useEffect(() => {
+    if (!progressBarInnerRef.current) return;
+    const progressBarInner2 = progressBarInnerRef.current;
+    count === 0 && done === 0 ? setVisible(!1) : count === done && prevCount === 0 && prevDone === 0 ? (setVisible(!0), progressBarInner2.style.width = "0%", requestAnimationFrame(() => {
+      progressBarInner2.style.width = "100%";
+    })) : count > 0 && (setVisible(!0), progressBarInner2.style.width = `${Math.floor(done / count * 100)}%`);
+    const handleTransitionEnd = /* @__PURE__ */ __name(() => {
+      (count === 0 && done === 0 || done === count) && (setVisible(!1), progressBarInner2.style.width = "0%", done === count && onClearProgress && onClearProgress());
+    }, "handleTransitionEnd");
+    return progressBarInner2.addEventListener("transitionend", handleTransitionEnd), setPrevCount(count), setPrevDone(done), () => {
+      progressBarInner2.removeEventListener("transitionend", handleTransitionEnd);
     };
-  }, []);
-  function handleClose() {
-    progressService.stop();
-  }
-  return __name(handleClose, "handleClose"), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$b.progressBarContainer, style: { display: visible ? "flex" : "none" }, children: [
+  }, [count, done]), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$b.progressBarContainer, style: { display: visible ? "flex" : "none" }, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$b.progressBar, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
       "div",
       {
         ref: progressBarInnerRef,
         className: styles$b.progressBarInner,
         style: {
-          backgroundColor: barColor
+          backgroundColor: color
         }
       }
     ) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$b.progressBarCloseButton, onClick: handleClose, children: /* @__PURE__ */ jsxRuntimeExports.jsx(CloseSingle, {}) })
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$b.progressBarCloseButton, onClick: onTerminate, children: [
+      " ",
+      /* @__PURE__ */ jsxRuntimeExports.jsx(CloseSingle, {})
+    ] })
   ] });
 }
 __name(ProgressBar, "ProgressBar");
@@ -2602,7 +2559,7 @@ ShortcutPanelController = __decorateClass$c([
   __decorateParam$c(4, ICommandService)
 ], ShortcutPanelController);
 const IUIController = createIdentifier("univer.ui.ui-controller");
-var render$1 = {}, interopRequireWildcard = { exports: {} }, _typeof$2 = { exports: {} };
+var render$1 = {}, interopRequireWildcard = { exports: {} }, _typeof$1 = { exports: {} };
 (function(module) {
   function _typeof3(o) {
     "@babel/helpers - typeof";
@@ -2613,8 +2570,8 @@ var render$1 = {}, interopRequireWildcard = { exports: {} }, _typeof$2 = { expor
     }, module.exports.__esModule = !0, module.exports.default = module.exports, _typeof3(o);
   }
   __name(_typeof3, "_typeof"), module.exports = _typeof3, module.exports.__esModule = !0, module.exports.default = module.exports;
-})(_typeof$2);
-var _typeofExports = _typeof$2.exports;
+})(_typeof$1);
+var _typeofExports = _typeof$1.exports;
 (function(module) {
   var _typeof3 = _typeofExports.default;
   function _getRequireWildcardCache(e2) {
@@ -2984,7 +2941,7 @@ var regeneratorRuntimeExports = regeneratorRuntime.exports, asyncToGenerator = {
   }
   __name(_asyncToGenerator, "_asyncToGenerator"), module.exports = _asyncToGenerator, module.exports.__esModule = !0, module.exports.default = module.exports;
 })(asyncToGenerator);
-var asyncToGeneratorExports = asyncToGenerator.exports, objectSpread2 = { exports: {} }, defineProperty = { exports: {} }, toPropertyKey$2 = { exports: {} }, toPrimitive$2 = { exports: {} };
+var asyncToGeneratorExports = asyncToGenerator.exports, objectSpread2 = { exports: {} }, defineProperty = { exports: {} }, toPropertyKey$1 = { exports: {} }, toPrimitive$1 = { exports: {} };
 (function(module) {
   var _typeof3 = _typeofExports.default;
   function toPrimitive2(t2, r2) {
@@ -2998,8 +2955,8 @@ var asyncToGeneratorExports = asyncToGenerator.exports, objectSpread2 = { export
     return (r2 === "string" ? String : Number)(t2);
   }
   __name(toPrimitive2, "toPrimitive"), module.exports = toPrimitive2, module.exports.__esModule = !0, module.exports.default = module.exports;
-})(toPrimitive$2);
-var toPrimitiveExports = toPrimitive$2.exports;
+})(toPrimitive$1);
+var toPrimitiveExports = toPrimitive$1.exports;
 (function(module) {
   var _typeof3 = _typeofExports.default, toPrimitive2 = toPrimitiveExports;
   function toPropertyKey2(t2) {
@@ -3007,8 +2964,8 @@ var toPrimitiveExports = toPrimitive$2.exports;
     return _typeof3(i) == "symbol" ? i : i + "";
   }
   __name(toPropertyKey2, "toPropertyKey"), module.exports = toPropertyKey2, module.exports.__esModule = !0, module.exports.default = module.exports;
-})(toPropertyKey$2);
-var toPropertyKeyExports = toPropertyKey$2.exports;
+})(toPropertyKey$1);
+var toPropertyKeyExports = toPropertyKey$1.exports;
 (function(module) {
   var toPropertyKey2 = toPropertyKeyExports;
   function _defineProperty2(e2, r2, t2) {
@@ -3054,7 +3011,7 @@ Object.defineProperty(render$1, "__esModule", {
 });
 render$1._r = _r;
 render$1._u = _u;
-var render_2 = render$1.render = render, unmount_1 = render$1.unmount = unmount, _regeneratorRuntime2 = _interopRequireDefault(regeneratorRuntimeExports), _asyncToGenerator2 = _interopRequireDefault(asyncToGeneratorExports), _typeof2 = _interopRequireDefault(_typeofExports), _objectSpread2$2 = _interopRequireDefault(objectSpread2Exports), ReactDOM = _interopRequireWildcard(ReactDOM$1), fullClone = (0, _objectSpread2$2.default)({}, ReactDOM), version = fullClone.version, reactRender = fullClone.render, unmountComponentAtNode = fullClone.unmountComponentAtNode, createRoot;
+var render_2 = render$1.render = render, unmount_1 = render$1.unmount = unmount, _regeneratorRuntime2 = _interopRequireDefault(regeneratorRuntimeExports), _asyncToGenerator2 = _interopRequireDefault(asyncToGeneratorExports), _typeof2 = _interopRequireDefault(_typeofExports), _objectSpread2$1 = _interopRequireDefault(objectSpread2Exports), ReactDOM = _interopRequireWildcard(ReactDOM$1), fullClone = (0, _objectSpread2$1.default)({}, ReactDOM), version = fullClone.version, reactRender = fullClone.render, unmountComponentAtNode = fullClone.unmountComponentAtNode, createRoot;
 try {
   var mainVersion = Number((version || "").split(".")[0]);
   mainVersion >= 18 && (createRoot = fullClone.createRoot);
@@ -3190,21 +3147,47 @@ const floatDomWrapper = "univer-float-dom-wrapper", floatDom = "univer-float-dom
   floatDomWrapper,
   floatDom
 }, FloatDomSingle = memo((props) => {
-  const { layer, id } = props, componentManager = useDependency(ComponentManager), position = useObservable(layer.position$), Component = typeof layer.componentKey == "string" ? componentManager.get(layer.componentKey) : layer.componentKey, layerProps = {
+  const { layer, id } = props, componentManager = useDependency(ComponentManager), size$ = useMemo(() => layer.position$.pipe(
+    distinctUntilChanged(
+      (prev, curr) => prev.absolute.left === curr.absolute.left && prev.absolute.top === curr.absolute.top && prev.endX - prev.startX === curr.endX - curr.startX && prev.endY - prev.startY === curr.endY - curr.startY
+    )
+  ), [layer.position$]), position = useObservable(useMemo(() => layer.position$.pipe(first()), [layer.position$])), domRef = useRef(null), innerDomRef = useRef(null), transformRef = useRef(`transform: rotate(${position == null ? void 0 : position.rotate}deg) translate(${position == null ? void 0 : position.startX}px, ${position == null ? void 0 : position.startY}px)`), innerStyle = useRef({}), Component = typeof layer.componentKey == "string" ? componentManager.get(layer.componentKey) : layer.componentKey, layerProps = useMemo(() => ({
     data: layer.data,
     ...layer.props
-  };
+  }), [layer.data, layer.props]);
+  useEffect(() => {
+    const subscription = layer.position$.subscribe((position2) => {
+      transformRef.current = `rotate(${position2.rotate}deg) translate(${position2.startX}px, ${position2.startY}px)`, domRef.current && (domRef.current.style.transform = transformRef.current);
+    }), sizeSubscription = size$.subscribe((size) => {
+      if (domRef.current && (domRef.current.style.width = `${Math.max(size.endX - size.startX - 2, 0)}px`, domRef.current.style.height = `${Math.max(size.endY - size.startY - 2, 0)}px`), innerDomRef.current) {
+        const style2 = {
+          width: `${size.width - 4}px`,
+          height: `${size.height - 4}px`,
+          left: `${size.absolute.left ? 0 : "auto"}`,
+          top: `${size.absolute.top ? 0 : "auto"}`,
+          right: `${size.absolute.left ? "auto" : 0}`,
+          bottom: `${size.absolute.top ? "auto" : 0}`
+        };
+        innerDomRef.current.style.width = style2.width, innerDomRef.current.style.height = style2.height, innerDomRef.current.style.left = style2.left, innerDomRef.current.style.top = style2.top, innerDomRef.current.style.right = style2.right, innerDomRef.current.style.bottom = style2.bottom, innerStyle.current = style2;
+      }
+    });
+    return () => {
+      subscription.unsubscribe(), sizeSubscription.unsubscribe();
+    };
+  }, [layer.position$, size$]);
+  const component = useMemo(() => Component ? /* @__PURE__ */ jsxRuntimeExports.jsx(Component, { ...layerProps }) : null, [Component, layerProps]);
   return position ? /* @__PURE__ */ jsxRuntimeExports.jsx(
     "div",
     {
+      ref: domRef,
       className: styles$9.floatDomWrapper,
       style: {
         position: "absolute",
-        top: position.startY,
-        left: position.startX,
+        top: 0,
+        left: 0,
         width: Math.max(position.endX - position.startX - 2, 0),
         height: Math.max(position.endY - position.startY - 2, 0),
-        transform: `rotate(${position.rotate}deg)`,
+        transform: transformRef.current,
         overflow: "hidden"
       },
       onPointerMove: /* @__PURE__ */ __name((e2) => {
@@ -3223,15 +3206,10 @@ const floatDomWrapper = "univer-float-dom-wrapper", floatDom = "univer-float-dom
         "div",
         {
           id,
+          ref: innerDomRef,
           className: styles$9.floatDom,
-          style: {
-            width: position.width,
-            height: position.height,
-            position: "absolute",
-            ...position.absolute.left ? { left: 0 } : { right: 0 },
-            ...position.absolute.top ? { top: 0 } : { bottom: 0 }
-          },
-          children: Component ? /* @__PURE__ */ jsxRuntimeExports.jsx(Component, { ...layerProps }) : null
+          style: { position: "absolute", ...innerStyle.current },
+          children: component
         }
       )
     }
@@ -4088,7 +4066,7 @@ function ZenZone() {
     if (Component2)
       return Component2;
   }, [componentKey]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { style: hidden ? { display: "none" } : void 0, className: _className, children: Component && /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {}) });
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { style: hidden ? { opacity: 0, zIndex: -1 } : void 0, className: _className, children: Component && /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {}) });
 }
 __name(ZenZone, "ZenZone");
 const IGlobalZoneService = createIdentifier("univer.global-zone-service"), globalZone = "univer-global-zone", globalZoneOpen = "univer-global-zone-open", globalZoneClose = "univer-global-zone-close", styles$4 = {
@@ -4131,13 +4109,13 @@ function DesktopWorkbench(props) {
     contextMenu = !0,
     mountContainer,
     onRendered
-  } = props, localeService = useDependency(LocaleService), themeService = useDependency(ThemeService), messageService = useDependency(IMessageService), instanceService = useDependency(IUniverInstanceService), contentRef = useRef(null), footerComponents = useComponentsOfPart(BuiltInUIPart.FOOTER), headerComponents = useComponentsOfPart(BuiltInUIPart.HEADER), headerMenuComponents = useComponentsOfPart(BuiltInUIPart.HEADER_MENU), contentComponents = useComponentsOfPart(BuiltInUIPart.CONTENT), leftSidebarComponents = useComponentsOfPart(BuiltInUIPart.LEFT_SIDEBAR), globalComponents = useComponentsOfPart(BuiltInUIPart.GLOBAL), [focusUnitType, setFocusUnitType] = useState(UniverInstanceType.UNIVER_UNKNOWN);
+  } = props, localeService = useDependency(LocaleService), themeService = useDependency(ThemeService), messageService = useDependency(IMessageService), instanceService = useDependency(IUniverInstanceService), contentRef = useRef(null), footerComponents = useComponentsOfPart(BuiltInUIPart.FOOTER), headerComponents = useComponentsOfPart(BuiltInUIPart.HEADER), headerMenuComponents = useComponentsOfPart(BuiltInUIPart.HEADER_MENU), contentComponents = useComponentsOfPart(BuiltInUIPart.CONTENT), leftSidebarComponents = useComponentsOfPart(BuiltInUIPart.LEFT_SIDEBAR), globalComponents = useComponentsOfPart(BuiltInUIPart.GLOBAL), [docSnapShot, setDocSnapShot] = useState(null);
   useEffect(() => {
     const sub = instanceService.focused$.subscribe((id) => {
       if (id == null)
         return;
-      const instanceType = instanceService.getUnitType(id);
-      setFocusUnitType(instanceType);
+      const instanceType = instanceService.getUnitType(id), instance = instanceService.getUnit(id);
+      instanceType === UniverInstanceType.UNIVER_DOC && instance && setDocSnapShot(instance.getSnapshot());
     });
     return () => {
       sub.unsubscribe();
@@ -4173,7 +4151,7 @@ function DesktopWorkbench(props) {
               className: clsx$1(
                 styles$3.workbenchContainerContent,
                 {
-                  [styles$3.workbenchContainerDocContent]: focusUnitType === UniverInstanceType.UNIVER_DOC
+                  [styles$3.workbenchContainerDocContent]: (docSnapShot == null ? void 0 : docSnapShot.documentStyle.documentFlavor) === DocumentFlavor.TRADITIONAL
                 }
               ),
               children: [
@@ -4294,17 +4272,7 @@ function createContainer$1(id) {
   return element2.id = id, element2;
 }
 __name(createContainer$1, "createContainer$1");
-const appLayout = "univer-app-layout", appHeader = "univer-app-header", appContainer = "univer-app-container", appContainerHeader = "univer-app-container-header", appContainerWrapper = "univer-app-container-wrapper", appContainerContent = "univer-app-container-content", appContainerCanvas = "univer-app-container-canvas", appContainerLeftSidebar = "univer-app-container-left-sidebar", appContainerSidebar = "univer-app-container-sidebar", styles$2 = {
-  appLayout,
-  appHeader,
-  appContainer,
-  appContainerHeader,
-  appContainerWrapper,
-  appContainerContent,
-  appContainerCanvas,
-  appContainerLeftSidebar,
-  appContainerSidebar
-}, mobileMenuContainer = "univer-mobile-menu-container", mobileMenuItem = "univer-mobile-menu-item", styles$1 = {
+const mobileMenuContainer = "univer-mobile-menu-container", mobileMenuItem = "univer-mobile-menu-item", styles$2 = {
   mobileMenuContainer,
   mobileMenuItem
 };
@@ -4322,7 +4290,7 @@ function MobileMenu(props) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     "div",
     {
-      className: styles$1.mobileMenuContainer,
+      className: styles$2.mobileMenuContainer,
       style: {
         gridTemplateColumns: `repeat(${Math.min(2, flattedMenuItems.length)}, 48px)`
       },
@@ -4342,9 +4310,9 @@ function MobileMenuItem(props) {
   const { menuItem, onClick } = props, { id, type, title, label, icon } = menuItem;
   if (type !== MenuItemType.BUTTON)
     throw new Error(`[MobileMenuItem]: on mobile devices only "BUTTON" type menu items are supported. Please check "${id}".`);
-  const disabled = useObservable$1(menuItem.disabled$, !1), activated = useObservable$1(menuItem.activated$, !1), hidden = useObservable$1(menuItem.hidden$, !1), value = useObservable$1(menuItem.value$), className = clsx$1(styles$1.mobileMenuItem, {
-    [styles$1.mobileMenuItemActivated]: activated,
-    [styles$1.mobileMenuItemHidden]: hidden
+  const disabled = useObservable$1(menuItem.disabled$, !1), activated = useObservable$1(menuItem.activated$, !1), hidden = useObservable$1(menuItem.hidden$, !1), value = useObservable$1(menuItem.value$), className = clsx$1(styles$2.mobileMenuItem, {
+    [styles$2.mobileMenuItemActivated]: activated,
+    [styles$2.mobileMenuItemHidden]: hidden
   });
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     "button",
@@ -4395,6 +4363,17 @@ function MobileContextMenu() {
   ) }) });
 }
 __name(MobileContextMenu, "MobileContextMenu");
+const appLayout = "univer-app-layout", appHeader = "univer-app-header", appContainer = "univer-app-container", appContainerHeader = "univer-app-container-header", appContainerWrapper = "univer-app-container-wrapper", appContainerContent = "univer-app-container-content", appContainerCanvas = "univer-app-container-canvas", appContainerLeftSidebar = "univer-app-container-left-sidebar", appContainerSidebar = "univer-app-container-sidebar", styles$1 = {
+  appLayout,
+  appHeader,
+  appContainer,
+  appContainerHeader,
+  appContainerWrapper,
+  appContainerContent,
+  appContainerCanvas,
+  appContainerLeftSidebar,
+  appContainerSidebar
+};
 function MobileApp(props) {
   const {
     header = !0,
@@ -4425,17 +4404,17 @@ function MobileApp(props) {
       subscriptions.forEach((subscription) => subscription.unsubscribe()), document.body.removeChild(portalContainer);
     };
   }, [localeService, messageService, mountContainer, portalContainer, themeService.currentTheme$]), /* @__PURE__ */ jsxRuntimeExports.jsxs(ConfigProvider, { locale: locale == null ? void 0 : locale.design, mountContainer: portalContainer, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$2.appLayout, tabIndex: -1, onBlur: /* @__PURE__ */ __name((e2) => e2.stopPropagation(), "onBlur"), children: [
-      header && /* @__PURE__ */ jsxRuntimeExports.jsx("header", { className: styles$2.appContainerHeader }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: styles$2.appContainer, children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$2.appContainerWrapper, children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx("aside", { className: styles$2.appContainerLeftSidebar, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ComponentContainer, { components: leftSidebarComponents }, "left-sidebar") }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: styles$2.appContainerContent, children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("header", { className: styles$2.appHeader, children: header && /* @__PURE__ */ jsxRuntimeExports.jsx(ComponentContainer, { components: headerComponents }, "header") }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.appLayout, tabIndex: -1, onBlur: /* @__PURE__ */ __name((e2) => e2.stopPropagation(), "onBlur"), children: [
+      header && /* @__PURE__ */ jsxRuntimeExports.jsx("header", { className: styles$1.appContainerHeader }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: styles$1.appContainer, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.appContainerWrapper, children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("aside", { className: styles$1.appContainerLeftSidebar, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ComponentContainer, { components: leftSidebarComponents }, "left-sidebar") }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { className: styles$1.appContainerContent, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("header", { className: styles$1.appHeader, children: header && /* @__PURE__ */ jsxRuntimeExports.jsx(ComponentContainer, { components: headerComponents }, "header") }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               "section",
               {
-                className: styles$2.appContainerCanvas,
+                className: styles$1.appContainerCanvas,
                 ref: contentRef,
                 "data-range-selector": !0,
                 onContextMenu: /* @__PURE__ */ __name((e2) => e2.preventDefault(), "onContextMenu"),
@@ -4443,9 +4422,9 @@ function MobileApp(props) {
               }
             )
           ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("aside", { className: styles$2.appContainerSidebar, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Sidebar, {}) })
+          /* @__PURE__ */ jsxRuntimeExports.jsx("aside", { className: styles$1.appContainerSidebar, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Sidebar, {}) })
         ] }),
-        footer && /* @__PURE__ */ jsxRuntimeExports.jsx("footer", { className: styles$2.appFooter, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ComponentContainer, { components: footerComponents }, "footer") }),
+        footer && /* @__PURE__ */ jsxRuntimeExports.jsx("footer", { className: styles$1.appFooter, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ComponentContainer, { components: footerComponents }, "footer") }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(ZenZone, {})
       ] })
     ] }),
@@ -6453,42 +6432,42 @@ const _DesktopMessageService = class _DesktopMessageService {
 };
 __name(_DesktopMessageService, "DesktopMessageService");
 let DesktopMessageService = _DesktopMessageService;
-function _arrayLikeToArray$1(r2, a) {
+function _arrayLikeToArray(r2, a) {
   (a == null || a > r2.length) && (a = r2.length);
   for (var e2 = 0, n2 = Array(a); e2 < a; e2++) n2[e2] = r2[e2];
   return n2;
 }
-__name(_arrayLikeToArray$1, "_arrayLikeToArray$1");
+__name(_arrayLikeToArray, "_arrayLikeToArray");
 function _arrayWithoutHoles(r2) {
-  if (Array.isArray(r2)) return _arrayLikeToArray$1(r2);
+  if (Array.isArray(r2)) return _arrayLikeToArray(r2);
 }
 __name(_arrayWithoutHoles, "_arrayWithoutHoles");
 function _iterableToArray(r2) {
   if (typeof Symbol < "u" && r2[Symbol.iterator] != null || r2["@@iterator"] != null) return Array.from(r2);
 }
 __name(_iterableToArray, "_iterableToArray");
-function _unsupportedIterableToArray$1(r2, a) {
+function _unsupportedIterableToArray(r2, a) {
   if (r2) {
-    if (typeof r2 == "string") return _arrayLikeToArray$1(r2, a);
+    if (typeof r2 == "string") return _arrayLikeToArray(r2, a);
     var t2 = {}.toString.call(r2).slice(8, -1);
-    return t2 === "Object" && r2.constructor && (t2 = r2.constructor.name), t2 === "Map" || t2 === "Set" ? Array.from(r2) : t2 === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t2) ? _arrayLikeToArray$1(r2, a) : void 0;
+    return t2 === "Object" && r2.constructor && (t2 = r2.constructor.name), t2 === "Map" || t2 === "Set" ? Array.from(r2) : t2 === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t2) ? _arrayLikeToArray(r2, a) : void 0;
   }
 }
-__name(_unsupportedIterableToArray$1, "_unsupportedIterableToArray$1");
+__name(_unsupportedIterableToArray, "_unsupportedIterableToArray");
 function _nonIterableSpread() {
   throw new TypeError(`Invalid attempt to spread non-iterable instance.
 In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
 }
 __name(_nonIterableSpread, "_nonIterableSpread");
 function _toConsumableArray(r2) {
-  return _arrayWithoutHoles(r2) || _iterableToArray(r2) || _unsupportedIterableToArray$1(r2) || _nonIterableSpread();
+  return _arrayWithoutHoles(r2) || _iterableToArray(r2) || _unsupportedIterableToArray(r2) || _nonIterableSpread();
 }
 __name(_toConsumableArray, "_toConsumableArray");
-function _arrayWithHoles$1(r2) {
+function _arrayWithHoles(r2) {
   if (Array.isArray(r2)) return r2;
 }
-__name(_arrayWithHoles$1, "_arrayWithHoles$1");
-function _iterableToArrayLimit$1(r2, l2) {
+__name(_arrayWithHoles, "_arrayWithHoles");
+function _iterableToArrayLimit(r2, l2) {
   var t2 = r2 == null ? null : typeof Symbol < "u" && r2[Symbol.iterator] || r2["@@iterator"];
   if (t2 != null) {
     var e2, n2, i, u2, a = [], f2 = !0, o = !1;
@@ -6509,16 +6488,16 @@ function _iterableToArrayLimit$1(r2, l2) {
     return a;
   }
 }
-__name(_iterableToArrayLimit$1, "_iterableToArrayLimit$1");
-function _nonIterableRest$1() {
+__name(_iterableToArrayLimit, "_iterableToArrayLimit");
+function _nonIterableRest() {
   throw new TypeError(`Invalid attempt to destructure non-iterable instance.
 In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
 }
-__name(_nonIterableRest$1, "_nonIterableRest$1");
-function _slicedToArray$1(r2, e2) {
-  return _arrayWithHoles$1(r2) || _iterableToArrayLimit$1(r2, e2) || _unsupportedIterableToArray$1(r2, e2) || _nonIterableRest$1();
+__name(_nonIterableRest, "_nonIterableRest");
+function _slicedToArray(r2, e2) {
+  return _arrayWithHoles(r2) || _iterableToArrayLimit(r2, e2) || _unsupportedIterableToArray(r2, e2) || _nonIterableRest();
 }
-__name(_slicedToArray$1, "_slicedToArray$1");
+__name(_slicedToArray, "_slicedToArray");
 function _objectWithoutPropertiesLoose(r2, e2) {
   if (r2 == null) return {};
   var t2 = {};
@@ -6539,41 +6518,41 @@ function _objectWithoutProperties(e2, t2) {
   return i;
 }
 __name(_objectWithoutProperties, "_objectWithoutProperties");
-function _typeof$1(o) {
+function _typeof(o) {
   "@babel/helpers - typeof";
-  return _typeof$1 = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(o2) {
+  return _typeof = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(o2) {
     return typeof o2;
   } : function(o2) {
     return o2 && typeof Symbol == "function" && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2;
-  }, _typeof$1(o);
+  }, _typeof(o);
 }
-__name(_typeof$1, "_typeof$1");
-function toPrimitive$1(t2, r2) {
-  if (_typeof$1(t2) != "object" || !t2) return t2;
+__name(_typeof, "_typeof");
+function toPrimitive(t2, r2) {
+  if (_typeof(t2) != "object" || !t2) return t2;
   var e2 = t2[Symbol.toPrimitive];
   if (e2 !== void 0) {
     var i = e2.call(t2, r2 || "default");
-    if (_typeof$1(i) != "object") return i;
+    if (_typeof(i) != "object") return i;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
   return (r2 === "string" ? String : Number)(t2);
 }
-__name(toPrimitive$1, "toPrimitive$1");
-function toPropertyKey$1(t2) {
-  var i = toPrimitive$1(t2, "string");
-  return _typeof$1(i) == "symbol" ? i : i + "";
+__name(toPrimitive, "toPrimitive");
+function toPropertyKey(t2) {
+  var i = toPrimitive(t2, "string");
+  return _typeof(i) == "symbol" ? i : i + "";
 }
-__name(toPropertyKey$1, "toPropertyKey$1");
-function _defineProperty$1(e2, r2, t2) {
-  return (r2 = toPropertyKey$1(r2)) in e2 ? Object.defineProperty(e2, r2, {
+__name(toPropertyKey, "toPropertyKey");
+function _defineProperty(e2, r2, t2) {
+  return (r2 = toPropertyKey(r2)) in e2 ? Object.defineProperty(e2, r2, {
     value: t2,
     enumerable: !0,
     configurable: !0,
     writable: !0
   }) : e2[r2] = t2, e2;
 }
-__name(_defineProperty$1, "_defineProperty$1");
-function ownKeys$1(e2, r2) {
+__name(_defineProperty, "_defineProperty");
+function ownKeys(e2, r2) {
   var t2 = Object.keys(e2);
   if (Object.getOwnPropertySymbols) {
     var o = Object.getOwnPropertySymbols(e2);
@@ -6583,19 +6562,19 @@ function ownKeys$1(e2, r2) {
   }
   return t2;
 }
-__name(ownKeys$1, "ownKeys$1");
-function _objectSpread2$1(e2) {
+__name(ownKeys, "ownKeys");
+function _objectSpread2(e2) {
   for (var r2 = 1; r2 < arguments.length; r2++) {
     var t2 = arguments[r2] != null ? arguments[r2] : {};
-    r2 % 2 ? ownKeys$1(Object(t2), !0).forEach(function(r3) {
-      _defineProperty$1(e2, r3, t2[r3]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e2, Object.getOwnPropertyDescriptors(t2)) : ownKeys$1(Object(t2)).forEach(function(r3) {
+    r2 % 2 ? ownKeys(Object(t2), !0).forEach(function(r3) {
+      _defineProperty(e2, r3, t2[r3]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e2, Object.getOwnPropertyDescriptors(t2)) : ownKeys(Object(t2)).forEach(function(r3) {
       Object.defineProperty(e2, r3, Object.getOwnPropertyDescriptor(t2, r3));
     });
   }
   return e2;
 }
-__name(_objectSpread2$1, "_objectSpread2$1");
+__name(_objectSpread2, "_objectSpread2");
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function(n2) {
     for (var e2 = 1; e2 < arguments.length; e2++) {
@@ -6646,15 +6625,6 @@ var classnames = { exports: {} };
 })(classnames);
 var classnamesExports = classnames.exports;
 const clsx = /* @__PURE__ */ getDefaultExportFromCjs(classnamesExports);
-function _typeof(o) {
-  "@babel/helpers - typeof";
-  return _typeof = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(o2) {
-    return typeof o2;
-  } : function(o2) {
-    return o2 && typeof Symbol == "function" && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2;
-  }, _typeof(o);
-}
-__name(_typeof, "_typeof");
 function isDOM(node) {
   return node instanceof HTMLElement || node instanceof SVGElement;
 }
@@ -6795,7 +6765,7 @@ __name(_classCallCheck, "_classCallCheck");
 function _defineProperties(e2, r2) {
   for (var t2 = 0; t2 < r2.length; t2++) {
     var o = r2[t2];
-    o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e2, toPropertyKey$1(o.key), o);
+    o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e2, toPropertyKey(o.key), o);
   }
 }
 __name(_defineProperties, "_defineProperties");
@@ -6847,7 +6817,7 @@ function _assertThisInitialized(e2) {
 }
 __name(_assertThisInitialized, "_assertThisInitialized");
 function _possibleConstructorReturn(t2, e2) {
-  if (e2 && (_typeof$1(e2) == "object" || typeof e2 == "function")) return e2;
+  if (e2 && (_typeof(e2) == "object" || typeof e2 == "function")) return e2;
   if (e2 !== void 0) throw new TypeError("Derived constructors may only return object or undefined");
   return _assertThisInitialized(t2);
 }
@@ -6888,52 +6858,6 @@ function useEvent(callback) {
   return memoFn;
 }
 __name(useEvent, "useEvent");
-function _arrayWithHoles(r2) {
-  if (Array.isArray(r2)) return r2;
-}
-__name(_arrayWithHoles, "_arrayWithHoles");
-function _iterableToArrayLimit(r2, l2) {
-  var t2 = r2 == null ? null : typeof Symbol < "u" && r2[Symbol.iterator] || r2["@@iterator"];
-  if (t2 != null) {
-    var e2, n2, i, u2, a = [], f2 = !0, o = !1;
-    try {
-      if (i = (t2 = t2.call(r2)).next, l2 !== 0) for (; !(f2 = (e2 = i.call(t2)).done) && (a.push(e2.value), a.length !== l2); f2 = !0) ;
-    } catch (r3) {
-      o = !0, n2 = r3;
-    } finally {
-      try {
-        if (!f2 && t2.return != null && (u2 = t2.return(), Object(u2) !== u2)) return;
-      } finally {
-        if (o) throw n2;
-      }
-    }
-    return a;
-  }
-}
-__name(_iterableToArrayLimit, "_iterableToArrayLimit");
-function _arrayLikeToArray(r2, a) {
-  (a == null || a > r2.length) && (a = r2.length);
-  for (var e2 = 0, n2 = Array(a); e2 < a; e2++) n2[e2] = r2[e2];
-  return n2;
-}
-__name(_arrayLikeToArray, "_arrayLikeToArray");
-function _unsupportedIterableToArray(r2, a) {
-  if (r2) {
-    if (typeof r2 == "string") return _arrayLikeToArray(r2, a);
-    var t2 = {}.toString.call(r2).slice(8, -1);
-    return t2 === "Object" && r2.constructor && (t2 = r2.constructor.name), t2 === "Map" || t2 === "Set" ? Array.from(r2) : t2 === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t2) ? _arrayLikeToArray(r2, a) : void 0;
-  }
-}
-__name(_unsupportedIterableToArray, "_unsupportedIterableToArray");
-function _nonIterableRest() {
-  throw new TypeError(`Invalid attempt to destructure non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
-}
-__name(_nonIterableRest, "_nonIterableRest");
-function _slicedToArray(r2, e2) {
-  return _arrayWithHoles(r2) || _iterableToArrayLimit(r2, e2) || _unsupportedIterableToArray(r2, e2) || _nonIterableRest();
-}
-__name(_slicedToArray, "_slicedToArray");
 function canUseDom() {
   return !!(typeof window < "u" && window.document && window.document.createElement);
 }
@@ -6951,54 +6875,6 @@ function useSafeState(defaultValue) {
   return __name(safeSetState, "safeSetState"), [value, safeSetState];
 }
 __name(useSafeState, "useSafeState");
-function toPrimitive(t2, r2) {
-  if (_typeof(t2) != "object" || !t2) return t2;
-  var e2 = t2[Symbol.toPrimitive];
-  if (e2 !== void 0) {
-    var i = e2.call(t2, r2 || "default");
-    if (_typeof(i) != "object") return i;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return (r2 === "string" ? String : Number)(t2);
-}
-__name(toPrimitive, "toPrimitive");
-function toPropertyKey(t2) {
-  var i = toPrimitive(t2, "string");
-  return _typeof(i) == "symbol" ? i : i + "";
-}
-__name(toPropertyKey, "toPropertyKey");
-function _defineProperty(e2, r2, t2) {
-  return (r2 = toPropertyKey(r2)) in e2 ? Object.defineProperty(e2, r2, {
-    value: t2,
-    enumerable: !0,
-    configurable: !0,
-    writable: !0
-  }) : e2[r2] = t2, e2;
-}
-__name(_defineProperty, "_defineProperty");
-function ownKeys(e2, r2) {
-  var t2 = Object.keys(e2);
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(e2);
-    r2 && (o = o.filter(function(r3) {
-      return Object.getOwnPropertyDescriptor(e2, r3).enumerable;
-    })), t2.push.apply(t2, o);
-  }
-  return t2;
-}
-__name(ownKeys, "ownKeys");
-function _objectSpread2(e2) {
-  for (var r2 = 1; r2 < arguments.length; r2++) {
-    var t2 = arguments[r2] != null ? arguments[r2] : {};
-    r2 % 2 ? ownKeys(Object(t2), !0).forEach(function(r3) {
-      _defineProperty(e2, r3, t2[r3]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e2, Object.getOwnPropertyDescriptors(t2)) : ownKeys(Object(t2)).forEach(function(r3) {
-      Object.defineProperty(e2, r3, Object.getOwnPropertyDescriptor(t2, r3));
-    });
-  }
-  return e2;
-}
-__name(_objectSpread2, "_objectSpread2");
 function useSyncState(defaultValue) {
   var _React$useReducer = React.useReducer(function(x) {
     return x + 1;
@@ -7046,7 +6922,7 @@ __name(getVendorPrefixedEventName, "getVendorPrefixedEventName");
 var internalAnimationEndName = getVendorPrefixedEventName("animationend"), internalTransitionEndName = getVendorPrefixedEventName("transitionend"), supportTransition = !!(internalAnimationEndName && internalTransitionEndName), animationEndName = internalAnimationEndName || "animationend", transitionEndName = internalTransitionEndName || "transitionend";
 function getTransitionName(transitionName, transitionType) {
   if (!transitionName) return null;
-  if (_typeof$1(transitionName) === "object") {
+  if (_typeof(transitionName) === "object") {
     var type = transitionType.replace(/-\w/g, function(match2) {
       return match2[1].toUpperCase();
     });
@@ -7135,7 +7011,7 @@ function isActive(step) {
 }
 __name(isActive, "isActive");
 const useStepQueue = /* @__PURE__ */ __name(function(status, prepareOnly, callback) {
-  var _useState = useSafeState(STEP_NONE), _useState2 = _slicedToArray$1(_useState, 2), step = _useState2[0], setStep = _useState2[1], _useNextFrame = useNextFrame(), _useNextFrame2 = _slicedToArray$1(_useNextFrame, 2), nextFrame = _useNextFrame2[0], cancelNextFrame = _useNextFrame2[1];
+  var _useState = useSafeState(STEP_NONE), _useState2 = _slicedToArray(_useState, 2), step = _useState2[0], setStep = _useState2[1], _useNextFrame = useNextFrame(), _useNextFrame2 = _slicedToArray(_useNextFrame, 2), nextFrame = _useNextFrame2[0], cancelNextFrame = _useNextFrame2[1];
   function startQueue() {
     setStep(STEP_PREPARE, !0);
   }
@@ -7158,7 +7034,7 @@ const useStepQueue = /* @__PURE__ */ __name(function(status, prepareOnly, callba
   }, []), [startQueue, step];
 }, "useStepQueue");
 function useStatus(supportMotion, visible, getElement, _ref) {
-  var _ref$motionEnter = _ref.motionEnter, motionEnter = _ref$motionEnter === void 0 ? !0 : _ref$motionEnter, _ref$motionAppear = _ref.motionAppear, motionAppear = _ref$motionAppear === void 0 ? !0 : _ref$motionAppear, _ref$motionLeave = _ref.motionLeave, motionLeave = _ref$motionLeave === void 0 ? !0 : _ref$motionLeave, motionDeadline = _ref.motionDeadline, motionLeaveImmediately = _ref.motionLeaveImmediately, onAppearPrepare = _ref.onAppearPrepare, onEnterPrepare = _ref.onEnterPrepare, onLeavePrepare = _ref.onLeavePrepare, onAppearStart = _ref.onAppearStart, onEnterStart = _ref.onEnterStart, onLeaveStart = _ref.onLeaveStart, onAppearActive = _ref.onAppearActive, onEnterActive = _ref.onEnterActive, onLeaveActive = _ref.onLeaveActive, onAppearEnd = _ref.onAppearEnd, onEnterEnd = _ref.onEnterEnd, onLeaveEnd = _ref.onLeaveEnd, onVisibleChanged = _ref.onVisibleChanged, _useState = useSafeState(), _useState2 = _slicedToArray$1(_useState, 2), asyncVisible = _useState2[0], setAsyncVisible = _useState2[1], _useSyncState = useSyncState(STATUS_NONE), _useSyncState2 = _slicedToArray$1(_useSyncState, 2), getStatus = _useSyncState2[0], setStatus = _useSyncState2[1], _useState3 = useSafeState(null), _useState4 = _slicedToArray$1(_useState3, 2), style2 = _useState4[0], setStyle = _useState4[1], currentStatus = getStatus(), mountedRef = useRef(!1), deadlineRef = useRef(null);
+  var _ref$motionEnter = _ref.motionEnter, motionEnter = _ref$motionEnter === void 0 ? !0 : _ref$motionEnter, _ref$motionAppear = _ref.motionAppear, motionAppear = _ref$motionAppear === void 0 ? !0 : _ref$motionAppear, _ref$motionLeave = _ref.motionLeave, motionLeave = _ref$motionLeave === void 0 ? !0 : _ref$motionLeave, motionDeadline = _ref.motionDeadline, motionLeaveImmediately = _ref.motionLeaveImmediately, onAppearPrepare = _ref.onAppearPrepare, onEnterPrepare = _ref.onEnterPrepare, onLeavePrepare = _ref.onLeavePrepare, onAppearStart = _ref.onAppearStart, onEnterStart = _ref.onEnterStart, onLeaveStart = _ref.onLeaveStart, onAppearActive = _ref.onAppearActive, onEnterActive = _ref.onEnterActive, onLeaveActive = _ref.onLeaveActive, onAppearEnd = _ref.onAppearEnd, onEnterEnd = _ref.onEnterEnd, onLeaveEnd = _ref.onLeaveEnd, onVisibleChanged = _ref.onVisibleChanged, _useState = useSafeState(), _useState2 = _slicedToArray(_useState, 2), asyncVisible = _useState2[0], setAsyncVisible = _useState2[1], _useSyncState = useSyncState(STATUS_NONE), _useSyncState2 = _slicedToArray(_useSyncState, 2), getStatus = _useSyncState2[0], setStatus = _useSyncState2[1], _useState3 = useSafeState(null), _useState4 = _slicedToArray(_useState3, 2), style2 = _useState4[0], setStyle = _useState4[1], currentStatus = getStatus(), mountedRef = useRef(!1), deadlineRef = useRef(null);
   function getDomElement() {
     return getElement();
   }
@@ -7177,14 +7053,14 @@ function useStatus(supportMotion, visible, getElement, _ref) {
         status === STATUS_APPEAR && currentActive ? canEnd = onAppearEnd == null ? void 0 : onAppearEnd(element2, event) : status === STATUS_ENTER && currentActive ? canEnd = onEnterEnd == null ? void 0 : onEnterEnd(element2, event) : status === STATUS_LEAVE && currentActive && (canEnd = onLeaveEnd == null ? void 0 : onLeaveEnd(element2, event)), currentActive && canEnd !== !1 && updateMotionEndStatus();
       }
     }
-  }), _useDomMotionEvents = useDomMotionEvents(onInternalMotionEnd), _useDomMotionEvents2 = _slicedToArray$1(_useDomMotionEvents, 1), patchMotionEvents = _useDomMotionEvents2[0], getEventHandlers = /* @__PURE__ */ __name(function(targetStatus) {
+  }), _useDomMotionEvents = useDomMotionEvents(onInternalMotionEnd), _useDomMotionEvents2 = _slicedToArray(_useDomMotionEvents, 1), patchMotionEvents = _useDomMotionEvents2[0], getEventHandlers = /* @__PURE__ */ __name(function(targetStatus) {
     switch (targetStatus) {
       case STATUS_APPEAR:
-        return _defineProperty$1(_defineProperty$1(_defineProperty$1({}, STEP_PREPARE, onAppearPrepare), STEP_START, onAppearStart), STEP_ACTIVE, onAppearActive);
+        return _defineProperty(_defineProperty(_defineProperty({}, STEP_PREPARE, onAppearPrepare), STEP_START, onAppearStart), STEP_ACTIVE, onAppearActive);
       case STATUS_ENTER:
-        return _defineProperty$1(_defineProperty$1(_defineProperty$1({}, STEP_PREPARE, onEnterPrepare), STEP_START, onEnterStart), STEP_ACTIVE, onEnterActive);
+        return _defineProperty(_defineProperty(_defineProperty({}, STEP_PREPARE, onEnterPrepare), STEP_START, onEnterStart), STEP_ACTIVE, onEnterActive);
       case STATUS_LEAVE:
-        return _defineProperty$1(_defineProperty$1(_defineProperty$1({}, STEP_PREPARE, onLeavePrepare), STEP_START, onLeaveStart), STEP_ACTIVE, onLeaveActive);
+        return _defineProperty(_defineProperty(_defineProperty({}, STEP_PREPARE, onLeavePrepare), STEP_START, onLeaveStart), STEP_ACTIVE, onLeaveActive);
       default:
         return {};
     }
@@ -7204,7 +7080,7 @@ function useStatus(supportMotion, visible, getElement, _ref) {
         deadline: !0
       });
     }, motionDeadline))), step === STEP_PREPARED && updateMotionEndStatus(), DoStep;
-  }), _useStepQueue2 = _slicedToArray$1(_useStepQueue, 2), startStep = _useStepQueue2[0], step = _useStepQueue2[1], active = isActive(step);
+  }), _useStepQueue2 = _slicedToArray(_useStepQueue, 2), startStep = _useStepQueue2[0], step = _useStepQueue2[1], active = isActive(step);
   activeRef.current = active, useIsomorphicLayoutEffect(function() {
     setAsyncVisible(visible);
     var isMounted = mountedRef.current;
@@ -7228,14 +7104,14 @@ function useStatus(supportMotion, visible, getElement, _ref) {
     asyncVisible && (firstMountChangeRef.current = !0), asyncVisible !== void 0 && currentStatus === STATUS_NONE && ((firstMountChangeRef.current || asyncVisible) && (onVisibleChanged == null || onVisibleChanged(asyncVisible)), firstMountChangeRef.current = !0);
   }, [asyncVisible, currentStatus]);
   var mergedStyle = style2;
-  return eventHandlers[STEP_PREPARE] && step === STEP_START && (mergedStyle = _objectSpread2$1({
+  return eventHandlers[STEP_PREPARE] && step === STEP_START && (mergedStyle = _objectSpread2({
     transition: "none"
   }, mergedStyle)), [currentStatus, step, mergedStyle, asyncVisible != null ? asyncVisible : visible];
 }
 __name(useStatus, "useStatus");
 function genCSSMotion(config) {
   var transitionSupport = config;
-  _typeof$1(config) === "object" && (transitionSupport = config.transitionSupport);
+  _typeof(config) === "object" && (transitionSupport = config.transitionSupport);
   function isSupportTransition(props, contextMotion) {
     return !!(props.motionName && transitionSupport && contextMotion !== !1);
   }
@@ -7250,19 +7126,19 @@ function genCSSMotion(config) {
       }
     }
     __name(getDomElement, "getDomElement");
-    var _useStatus = useStatus(supportMotion, visible, getDomElement, props), _useStatus2 = _slicedToArray$1(_useStatus, 4), status = _useStatus2[0], statusStep = _useStatus2[1], statusStyle = _useStatus2[2], mergedVisible = _useStatus2[3], renderedRef = React.useRef(mergedVisible);
+    var _useStatus = useStatus(supportMotion, visible, getDomElement, props), _useStatus2 = _slicedToArray(_useStatus, 4), status = _useStatus2[0], statusStep = _useStatus2[1], statusStyle = _useStatus2[2], mergedVisible = _useStatus2[3], renderedRef = React.useRef(mergedVisible);
     mergedVisible && (renderedRef.current = !0);
     var setNodeRef = React.useCallback(function(node) {
       nodeRef.current = node, fillRef(ref, node);
-    }, [ref]), motionChildren, mergedProps = _objectSpread2$1(_objectSpread2$1({}, eventProps), {}, {
+    }, [ref]), motionChildren, mergedProps = _objectSpread2(_objectSpread2({}, eventProps), {}, {
       visible
     });
     if (!children)
       motionChildren = null;
     else if (status === STATUS_NONE)
-      mergedVisible ? motionChildren = children(_objectSpread2$1({}, mergedProps), setNodeRef) : !removeOnLeave && renderedRef.current && leavedClassName ? motionChildren = children(_objectSpread2$1(_objectSpread2$1({}, mergedProps), {}, {
+      mergedVisible ? motionChildren = children(_objectSpread2({}, mergedProps), setNodeRef) : !removeOnLeave && renderedRef.current && leavedClassName ? motionChildren = children(_objectSpread2(_objectSpread2({}, mergedProps), {}, {
         className: leavedClassName
-      }), setNodeRef) : forceRender || !removeOnLeave && !leavedClassName ? motionChildren = children(_objectSpread2$1(_objectSpread2$1({}, mergedProps), {}, {
+      }), setNodeRef) : forceRender || !removeOnLeave && !leavedClassName ? motionChildren = children(_objectSpread2(_objectSpread2({}, mergedProps), {}, {
         style: {
           display: "none"
         }
@@ -7271,8 +7147,8 @@ function genCSSMotion(config) {
       var statusSuffix;
       statusStep === STEP_PREPARE ? statusSuffix = "prepare" : isActive(statusStep) ? statusSuffix = "active" : statusStep === STEP_START && (statusSuffix = "start");
       var motionCls = getTransitionName(motionName, "".concat(status, "-").concat(statusSuffix));
-      motionChildren = children(_objectSpread2$1(_objectSpread2$1({}, mergedProps), {}, {
-        className: clsx(getTransitionName(motionName, status), _defineProperty$1(_defineProperty$1({}, motionCls, motionCls && statusSuffix), motionName, typeof motionName == "string")),
+      motionChildren = children(_objectSpread2(_objectSpread2({}, mergedProps), {}, {
+        className: clsx(getTransitionName(motionName, status), _defineProperty(_defineProperty({}, motionCls, motionCls && statusSuffix), motionName, typeof motionName == "string")),
         style: statusStyle
       }), setNodeRef);
     }
@@ -7293,9 +7169,9 @@ const CSSMotion = genCSSMotion(supportTransition);
 var STATUS_ADD = "add", STATUS_KEEP = "keep", STATUS_REMOVE = "remove", STATUS_REMOVED = "removed";
 function wrapKeyToObject(key) {
   var keyObj;
-  return key && _typeof$1(key) === "object" && "key" in key ? keyObj = key : keyObj = {
+  return key && _typeof(key) === "object" && "key" in key ? keyObj = key : keyObj = {
     key
-  }, _objectSpread2$1(_objectSpread2$1({}, keyObj), {}, {
+  }, _objectSpread2(_objectSpread2({}, keyObj), {}, {
     key: String(keyObj.key)
   });
 }
@@ -7312,20 +7188,20 @@ function diffKeys() {
       var currentKeyObj = currentKeyObjects[i];
       if (currentKeyObj.key === keyObj.key) {
         currentIndex < i && (list = list.concat(currentKeyObjects.slice(currentIndex, i).map(function(obj) {
-          return _objectSpread2$1(_objectSpread2$1({}, obj), {}, {
+          return _objectSpread2(_objectSpread2({}, obj), {}, {
             status: STATUS_ADD
           });
-        })), currentIndex = i), list.push(_objectSpread2$1(_objectSpread2$1({}, currentKeyObj), {}, {
+        })), currentIndex = i), list.push(_objectSpread2(_objectSpread2({}, currentKeyObj), {}, {
           status: STATUS_KEEP
         })), currentIndex += 1, hit = !0;
         break;
       }
     }
-    hit || list.push(_objectSpread2$1(_objectSpread2$1({}, keyObj), {}, {
+    hit || list.push(_objectSpread2(_objectSpread2({}, keyObj), {}, {
       status: STATUS_REMOVE
     }));
   }), currentIndex < currentLen && (list = list.concat(currentKeyObjects.slice(currentIndex).map(function(obj) {
-    return _objectSpread2$1(_objectSpread2$1({}, obj), {}, {
+    return _objectSpread2(_objectSpread2({}, obj), {}, {
       status: STATUS_ADD
     });
   })));
@@ -7357,11 +7233,11 @@ function genCSSMotionList(transitionSupport) {
       _classCallCheck(this, CSSMotionList3);
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++)
         args[_key] = arguments[_key];
-      return _this = _super.call.apply(_super, [this].concat(args)), _defineProperty$1(_assertThisInitialized(_this), "state", {
+      return _this = _super.call.apply(_super, [this].concat(args)), _defineProperty(_assertThisInitialized(_this), "state", {
         keyEntities: []
-      }), _defineProperty$1(_assertThisInitialized(_this), "removeKey", function(removeKey) {
+      }), _defineProperty(_assertThisInitialized(_this), "removeKey", function(removeKey) {
         var keyEntities = _this.state.keyEntities, nextKeyEntities = keyEntities.map(function(entity) {
-          return entity.key !== removeKey ? entity : _objectSpread2$1(_objectSpread2$1({}, entity), {}, {
+          return entity.key !== removeKey ? entity : _objectSpread2(_objectSpread2({}, entity), {}, {
             status: STATUS_REMOVED
           });
         });
@@ -7394,7 +7270,7 @@ function genCSSMotionList(transitionSupport) {
               }
             }, "onVisibleChanged")
           }), function(props, ref) {
-            return children(_objectSpread2$1(_objectSpread2$1({}, props), {}, {
+            return children(_objectSpread2(_objectSpread2({}, props), {}, {
               index
             }), ref);
           });
@@ -7416,7 +7292,7 @@ function genCSSMotionList(transitionSupport) {
       }, "getDerivedStateFromProps")
     }]), CSSMotionList3;
   }(React.Component);
-  return _defineProperty$1(CSSMotionList2, "defaultProps", {
+  return _defineProperty(CSSMotionList2, "defaultProps", {
     component: "div"
   }), CSSMotionList2;
 }
@@ -7976,7 +7852,7 @@ function pickAttrs(props) {
 }
 __name(pickAttrs, "pickAttrs");
 var Notify = /* @__PURE__ */ React.forwardRef(function(props, ref) {
-  var prefixCls = props.prefixCls, style2 = props.style, className = props.className, _props$duration = props.duration, duration = _props$duration === void 0 ? 4.5 : _props$duration, showProgress = props.showProgress, _props$pauseOnHover = props.pauseOnHover, pauseOnHover = _props$pauseOnHover === void 0 ? !0 : _props$pauseOnHover, eventKey = props.eventKey, content = props.content, closable = props.closable, _props$closeIcon = props.closeIcon, closeIcon = _props$closeIcon === void 0 ? "x" : _props$closeIcon, divProps = props.props, onClick = props.onClick, onNoticeClose = props.onNoticeClose, times = props.times, forcedHovering = props.hovering, _React$useState = React.useState(!1), _React$useState2 = _slicedToArray$1(_React$useState, 2), hovering = _React$useState2[0], setHovering = _React$useState2[1], _React$useState3 = React.useState(0), _React$useState4 = _slicedToArray$1(_React$useState3, 2), percent = _React$useState4[0], setPercent = _React$useState4[1], _React$useState5 = React.useState(0), _React$useState6 = _slicedToArray$1(_React$useState5, 2), spentTime = _React$useState6[0], setSpentTime = _React$useState6[1], mergedHovering = forcedHovering || hovering, mergedShowProgress = duration > 0 && showProgress, onInternalClose = /* @__PURE__ */ __name(function() {
+  var prefixCls = props.prefixCls, style2 = props.style, className = props.className, _props$duration = props.duration, duration = _props$duration === void 0 ? 4.5 : _props$duration, showProgress = props.showProgress, _props$pauseOnHover = props.pauseOnHover, pauseOnHover = _props$pauseOnHover === void 0 ? !0 : _props$pauseOnHover, eventKey = props.eventKey, content = props.content, closable = props.closable, _props$closeIcon = props.closeIcon, closeIcon = _props$closeIcon === void 0 ? "x" : _props$closeIcon, divProps = props.props, onClick = props.onClick, onNoticeClose = props.onNoticeClose, times = props.times, forcedHovering = props.hovering, _React$useState = React.useState(!1), _React$useState2 = _slicedToArray(_React$useState, 2), hovering = _React$useState2[0], setHovering = _React$useState2[1], _React$useState3 = React.useState(0), _React$useState4 = _slicedToArray(_React$useState3, 2), percent = _React$useState4[0], setPercent = _React$useState4[1], _React$useState5 = React.useState(0), _React$useState6 = _slicedToArray(_React$useState5, 2), spentTime = _React$useState6[0], setSpentTime = _React$useState6[1], mergedHovering = forcedHovering || hovering, mergedShowProgress = duration > 0 && showProgress, onInternalClose = /* @__PURE__ */ __name(function() {
     onNoticeClose(eventKey);
   }, "onInternalClose"), onCloseKeyDown = /* @__PURE__ */ __name(function(e2) {
     (e2.key === "Enter" || e2.code === "Enter" || e2.keyCode === KeyCode.ENTER) && onInternalClose();
@@ -8004,13 +7880,13 @@ var Notify = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     }
   }, [duration, spentTime, mergedHovering, mergedShowProgress, times]);
   var closableObj = React.useMemo(function() {
-    return _typeof$1(closable) === "object" && closable !== null ? closable : closable ? {
+    return _typeof(closable) === "object" && closable !== null ? closable : closable ? {
       closeIcon
     } : {};
   }, [closable, closeIcon]), ariaProps = pickAttrs(closableObj, !0), validPercent = 100 - (!percent || percent < 0 ? 0 : percent > 100 ? 100 : percent), noticePrefixCls = "".concat(prefixCls, "-notice");
   return /* @__PURE__ */ React.createElement("div", _extends({}, divProps, {
     ref,
-    className: clsx(noticePrefixCls, className, _defineProperty$1({}, "".concat(noticePrefixCls, "-closable"), closable)),
+    className: clsx(noticePrefixCls, className, _defineProperty({}, "".concat(noticePrefixCls, "-closable"), closable)),
     style: style2,
     onMouseEnter: /* @__PURE__ */ __name(function(e2) {
       var _divProps$onMouseEnte;
@@ -8043,18 +7919,18 @@ var Notify = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     threshold: DEFAULT_THRESHOLD,
     gap: DEFAULT_GAP
   };
-  if (config && _typeof$1(config) === "object") {
+  if (config && _typeof(config) === "object") {
     var _config$offset, _config$threshold, _config$gap;
     result.offset = (_config$offset = config.offset) !== null && _config$offset !== void 0 ? _config$offset : DEFAULT_OFFSET, result.threshold = (_config$threshold = config.threshold) !== null && _config$threshold !== void 0 ? _config$threshold : DEFAULT_THRESHOLD, result.gap = (_config$gap = config.gap) !== null && _config$gap !== void 0 ? _config$gap : DEFAULT_GAP;
   }
   return [!!config, result];
 }, "useStack"), _excluded$1 = ["className", "style", "classNames", "styles"], NoticeList = /* @__PURE__ */ __name(function(props) {
-  var configList = props.configList, placement = props.placement, prefixCls = props.prefixCls, className = props.className, style2 = props.style, motion = props.motion, onAllNoticeRemoved = props.onAllNoticeRemoved, onNoticeClose = props.onNoticeClose, stackConfig = props.stack, _useContext = useContext(NotificationContext), ctxCls = _useContext.classNames, dictRef = useRef({}), _useState = useState(null), _useState2 = _slicedToArray$1(_useState, 2), latestNotice = _useState2[0], setLatestNotice = _useState2[1], _useState3 = useState([]), _useState4 = _slicedToArray$1(_useState3, 2), hoverKeys = _useState4[0], setHoverKeys = _useState4[1], keys = configList.map(function(config) {
+  var configList = props.configList, placement = props.placement, prefixCls = props.prefixCls, className = props.className, style2 = props.style, motion = props.motion, onAllNoticeRemoved = props.onAllNoticeRemoved, onNoticeClose = props.onNoticeClose, stackConfig = props.stack, _useContext = useContext(NotificationContext), ctxCls = _useContext.classNames, dictRef = useRef({}), _useState = useState(null), _useState2 = _slicedToArray(_useState, 2), latestNotice = _useState2[0], setLatestNotice = _useState2[1], _useState3 = useState([]), _useState4 = _slicedToArray(_useState3, 2), hoverKeys = _useState4[0], setHoverKeys = _useState4[1], keys = configList.map(function(config) {
     return {
       config,
       key: String(config.key)
     };
-  }), _useStack = useStack(stackConfig), _useStack2 = _slicedToArray$1(_useStack, 2), stack = _useStack2[0], _useStack2$ = _useStack2[1], offset = _useStack2$.offset, threshold = _useStack2$.threshold, gap = _useStack2$.gap, expanded = stack && (hoverKeys.length > 0 || keys.length <= threshold), placementMotion = typeof motion == "function" ? motion(placement) : motion;
+  }), _useStack = useStack(stackConfig), _useStack2 = _slicedToArray(_useStack, 2), stack = _useStack2[0], _useStack2$ = _useStack2[1], offset = _useStack2$.offset, threshold = _useStack2$.threshold, gap = _useStack2$.gap, expanded = stack && (hoverKeys.length > 0 || keys.length <= threshold), placementMotion = typeof motion == "function" ? motion(placement) : motion;
   return useEffect(function() {
     stack && hoverKeys.length > 1 && setHoverKeys(function(prev) {
       return prev.filter(function(key) {
@@ -8072,7 +7948,7 @@ var Notify = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     }
   }, [keys, stack]), /* @__PURE__ */ React__default.createElement(CSSMotionList, _extends({
     key: placement,
-    className: clsx(prefixCls, "".concat(prefixCls, "-").concat(placement), ctxCls == null ? void 0 : ctxCls.list, className, _defineProperty$1(_defineProperty$1({}, "".concat(prefixCls, "-stack"), !!stack), "".concat(prefixCls, "-stack-expanded"), expanded)),
+    className: clsx(prefixCls, "".concat(prefixCls, "-").concat(placement), ctxCls == null ? void 0 : ctxCls.list, className, _defineProperty(_defineProperty({}, "".concat(prefixCls, "-stack"), !!stack), "".concat(prefixCls, "-stack-expanded"), expanded)),
     style: style2,
     keys,
     motionAppear: !0
@@ -8101,7 +7977,7 @@ var Notify = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     return /* @__PURE__ */ React__default.createElement("div", {
       ref: nodeRef,
       className: clsx("".concat(prefixCls, "-notice-wrapper"), motionClassName, configClassNames == null ? void 0 : configClassNames.wrapper),
-      style: _objectSpread2$1(_objectSpread2$1(_objectSpread2$1({}, motionStyle), stackStyle), configStyles == null ? void 0 : configStyles.wrapper),
+      style: _objectSpread2(_objectSpread2(_objectSpread2({}, motionStyle), stackStyle), configStyles == null ? void 0 : configStyles.wrapper),
       onMouseEnter: /* @__PURE__ */ __name(function() {
         return setHoverKeys(function(prev) {
           return prev.includes(strKey) ? prev : [].concat(_toConsumableArray(prev), [strKey]);
@@ -8131,7 +8007,7 @@ var Notify = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     })));
   });
 }, "NoticeList2"), Notifications = /* @__PURE__ */ React.forwardRef(function(props, ref) {
-  var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-notification" : _props$prefixCls, container = props.container, motion = props.motion, maxCount = props.maxCount, className = props.className, style2 = props.style, onAllRemoved = props.onAllRemoved, stack = props.stack, renderNotifications = props.renderNotifications, _React$useState = React.useState([]), _React$useState2 = _slicedToArray$1(_React$useState, 2), configList = _React$useState2[0], setConfigList = _React$useState2[1], onNoticeClose = /* @__PURE__ */ __name(function(key) {
+  var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "rc-notification" : _props$prefixCls, container = props.container, motion = props.motion, maxCount = props.maxCount, className = props.className, style2 = props.style, onAllRemoved = props.onAllRemoved, stack = props.stack, renderNotifications = props.renderNotifications, _React$useState = React.useState([]), _React$useState2 = _slicedToArray(_React$useState, 2), configList = _React$useState2[0], setConfigList = _React$useState2[1], onNoticeClose = /* @__PURE__ */ __name(function(key) {
     var _config$onClose, config = configList.find(function(item) {
       return item.key === key;
     });
@@ -8147,7 +8023,7 @@ var Notify = /* @__PURE__ */ React.forwardRef(function(props, ref) {
         setConfigList(function(list) {
           var clone = _toConsumableArray(list), index = clone.findIndex(function(item) {
             return item.key === config.key;
-          }), innerConfig = _objectSpread2$1({}, config);
+          }), innerConfig = _objectSpread2({}, config);
           if (index >= 0) {
             var _list$index;
             innerConfig.times = (((_list$index = list[index]) === null || _list$index === void 0 ? void 0 : _list$index.times) || 0) + 1, clone[index] = innerConfig;
@@ -8164,7 +8040,7 @@ var Notify = /* @__PURE__ */ React.forwardRef(function(props, ref) {
       }, "destroy")
     };
   });
-  var _React$useState3 = React.useState({}), _React$useState4 = _slicedToArray$1(_React$useState3, 2), placements = _React$useState4[0], setPlacements = _React$useState4[1];
+  var _React$useState3 = React.useState({}), _React$useState4 = _slicedToArray(_React$useState3, 2), placements = _React$useState4[0], setPlacements = _React$useState4[1];
   React.useEffect(function() {
     var nextPlacements = {};
     configList.forEach(function(config) {
@@ -8176,7 +8052,7 @@ var Notify = /* @__PURE__ */ React.forwardRef(function(props, ref) {
   }, [configList]);
   var onAllNoticeRemoved = /* @__PURE__ */ __name(function(placement) {
     setPlacements(function(originPlacements) {
-      var clone = _objectSpread2$1({}, originPlacements), list = clone[placement] || [];
+      var clone = _objectSpread2({}, originPlacements), list = clone[placement] || [];
       return list.length || delete clone[placement], clone;
     });
   }, "onAllNoticeRemoved2"), emptyRef = React.useRef(!1);
@@ -8218,7 +8094,7 @@ function mergeConfig() {
 }
 __name(mergeConfig, "mergeConfig");
 function useNotification() {
-  var rootConfig = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _rootConfig$getContai = rootConfig.getContainer, getContainer = _rootConfig$getContai === void 0 ? defaultGetContainer : _rootConfig$getContai, motion = rootConfig.motion, prefixCls = rootConfig.prefixCls, maxCount = rootConfig.maxCount, className = rootConfig.className, style2 = rootConfig.style, onAllRemoved = rootConfig.onAllRemoved, stack = rootConfig.stack, renderNotifications = rootConfig.renderNotifications, shareConfig = _objectWithoutProperties(rootConfig, _excluded), _React$useState = React.useState(), _React$useState2 = _slicedToArray$1(_React$useState, 2), container = _React$useState2[0], setContainer = _React$useState2[1], notificationsRef = React.useRef(), contextHolder = /* @__PURE__ */ React.createElement(Notifications, {
+  var rootConfig = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _rootConfig$getContai = rootConfig.getContainer, getContainer = _rootConfig$getContai === void 0 ? defaultGetContainer : _rootConfig$getContai, motion = rootConfig.motion, prefixCls = rootConfig.prefixCls, maxCount = rootConfig.maxCount, className = rootConfig.className, style2 = rootConfig.style, onAllRemoved = rootConfig.onAllRemoved, stack = rootConfig.stack, renderNotifications = rootConfig.renderNotifications, shareConfig = _objectWithoutProperties(rootConfig, _excluded), _React$useState = React.useState(), _React$useState2 = _slicedToArray(_React$useState, 2), container = _React$useState2[0], setContainer = _React$useState2[1], notificationsRef = React.useRef(), contextHolder = /* @__PURE__ */ React.createElement(Notifications, {
     container,
     ref: notificationsRef,
     prefixCls,
@@ -8229,7 +8105,7 @@ function useNotification() {
     onAllRemoved,
     stack,
     renderNotifications
-  }), _React$useState3 = React.useState([]), _React$useState4 = _slicedToArray$1(_React$useState3, 2), taskQueue = _React$useState4[0], setTaskQueue = _React$useState4[1], api = React.useMemo(function() {
+  }), _React$useState3 = React.useState([]), _React$useState4 = _slicedToArray(_React$useState3, 2), taskQueue = _React$useState4[0], setTaskQueue = _React$useState4[1], api = React.useMemo(function() {
     return {
       open: /* @__PURE__ */ __name(function(config) {
         var mergedConfig = mergeConfig(shareConfig, config);
@@ -8504,7 +8380,6 @@ let UniverMobileUIPlugin = (_a17 = class extends Plugin {
       [ILocalStorageService, { useClass: DesktopLocalStorageService, lazy: !0 }],
       [IBeforeCloseService, { useClass: DesktopBeforeCloseService }],
       [ICanvasPopupService, { useClass: CanvasPopupService }],
-      [IProgressService, { useClass: ProgressService }],
       [CanvasFloatDomService],
       // controllers
       [
@@ -8580,7 +8455,6 @@ let UniverUIPlugin = (_a18 = class extends Plugin {
       [IBeforeCloseService, { useClass: DesktopBeforeCloseService }],
       [ILocalFileService, { useClass: DesktopLocalFileService }],
       [ICanvasPopupService, { useClass: CanvasPopupService }],
-      [IProgressService, { useClass: ProgressService }],
       [CanvasFloatDomService],
       [IUIController, {
         useFactory: /* @__PURE__ */ __name((injector) => injector.createInstance(DesktopUIController, this._config), "useFactory"),
@@ -8921,8 +8795,8 @@ function handelTableToJson(table) {
           data[r2][c2] = cell;
           const rowSpan = (_a19 = Number(td.getAttribute("rowSpan"))) != null ? _a19 : 1, colSpan = (_b = Number(td.getAttribute("colSpan"))) != null ? _b : 1;
           if (rowSpan > 1 || colSpan > 1) {
-            const first = { rs: +rowSpan - 1, cs: +colSpan - 1, r: r2, c: c2 };
-            data[r2][c2].mc = first;
+            const first2 = { rs: +rowSpan - 1, cs: +colSpan - 1, r: r2, c: c2 };
+            data[r2][c2].mc = first2;
             for (let rp = 0; rp < rowSpan; rp++)
               for (let cp = 0; cp < colSpan; cp++)
                 rp === 0 && cp === 0 || (data[r2 + rp][c2 + cp] = { mc: null });
@@ -9010,8 +8884,8 @@ function handelExcelToJson(html) {
           data[r2][c2] = cell;
           const rowSpan = (_a20 = Number(td.getAttribute("rowSpan"))) != null ? _a20 : 1, colSpan = (_b = Number(td.getAttribute("colSpan"))) != null ? _b : 1;
           if (rowSpan > 1 || colSpan > 1) {
-            const first = { rs: +rowSpan - 1, cs: +colSpan - 1, r: r2, c: c2 };
-            data[r2][c2].mc = first;
+            const first2 = { rs: +rowSpan - 1, cs: +colSpan - 1, r: r2, c: c2 };
+            data[r2][c2].mc = first2;
             for (let rp = 0; rp < rowSpan; rp++)
               for (let cp = 0; cp < colSpan; cp++)
                 rp === 0 && cp === 0 || (data[r2 + rp][c2 + cp] = { mc: null });
@@ -9102,7 +8976,6 @@ export {
   IMessageService,
   INotificationService,
   IPlatformService,
-  IProgressService,
   IShortcutService,
   ISidebarService,
   IUIController,
@@ -9123,7 +8996,6 @@ export {
   PasteCommand,
   PlatformService,
   ProgressBar,
-  ProgressService,
   RedoShortcutItem,
   Ribbon,
   RibbonDataGroup,