@univerjs/design 1.0.0-alpha.6 → 1.0.0-alpha.8

package/lib/index.css

@@ -191,6 +191,10 @@
   z-index: 10;
 }
 
+.univer-z-\[1070\] {
+  z-index: 1070;
+}
+
 .univer-z-\[1080\] {
   z-index: 1080;
 }
@@ -456,6 +460,10 @@
   max-height: 1000px;
 }
 
+.univer-max-h-\[300px\] {
+  max-height: 300px;
+}
+
 .univer-max-h-full {
   max-height: 100%;
 }
@@ -604,6 +612,10 @@
   transform-origin: var(--radix-hover-card-content-transform-origin);
 }
 
+.univer-origin-top-left {
+  transform-origin: 0 0;
+}
+
 .-univer-translate-x-1\/2 {
   --univer-tw-translate-x: -50%;
   transform: translate(-50%, var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
@@ -652,6 +664,18 @@
   transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
 }
 
+.univer-scale-y-0 {
+  --univer-tw-scale-y: 0;
+  transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(0);
+  transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
+}
+
+.univer-scale-y-100 {
+  --univer-tw-scale-y: 1;
+  transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(1);
+  transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
+}
+
 .\!univer-animate-none {
   animation: none !important;
 }
@@ -867,6 +891,10 @@
   overflow-y: auto;
 }
 
+.univer-overflow-x-hidden {
+  overflow-x: hidden;
+}
+
 .univer-truncate {
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -1280,6 +1308,11 @@
   padding-bottom: .75rem;
 }
 
+.univer-py-6 {
+  padding-top: 1.5rem;
+  padding-bottom: 1.5rem;
+}
+
 .\!univer-pl-4 {
   padding-left: 1rem !important;
 }
@@ -1685,6 +1718,12 @@
   transition-timing-function: cubic-bezier(.4, 0, .2, 1);
 }
 
+.univer-transition-\[transform\,opacity\] {
+  transition-property: transform, opacity;
+  transition-duration: .15s;
+  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+}
+
 .univer-transition-all {
   transition-property: all;
   transition-duration: .15s;
@@ -1884,6 +1923,10 @@
   animation-timing-function: cubic-bezier(0, 0, .2, 1);
 }
 
+.\[scroll-padding-block\:4px\] {
+  scroll-padding-block: 4px;
+}
+
 .placeholder\:univer-text-gray-200::placeholder {
   color: var(--univer-gray-200);
 }
@@ -1939,7 +1982,7 @@
   margin-bottom: 0;
 }
 
-.data-\[disabled\]\:univer-pointer-events-none[data-disabled] {
+.data-\[disabled\=true\]\:univer-pointer-events-none[data-disabled="true"], .data-\[disabled\]\:univer-pointer-events-none[data-disabled] {
   pointer-events: none;
 }
 
@@ -1959,7 +2002,7 @@
   width: 1px;
 }
 
-.data-\[state\=open\]\:univer-bg-gray-100[data-state="open"] {
+.data-\[selected\=true\]\:univer-bg-gray-100[data-selected="true"], .data-\[state\=open\]\:univer-bg-gray-100[data-state="open"] {
   background-color: var(--univer-gray-100);
 }
 
@@ -1967,7 +2010,7 @@
   color: var(--univer-red-600);
 }
 
-.data-\[disabled\]\:univer-opacity-50[data-disabled] {
+.data-\[disabled\=true\]\:univer-opacity-50[data-disabled="true"], .data-\[disabled\]\:univer-opacity-50[data-disabled] {
   opacity: .5;
 }
 
@@ -2221,6 +2264,14 @@
   right: auto;
 }
 
+.rtl\:univer-ml-0:where([dir="rtl"], [dir="rtl"] *) {
+  margin-left: 0;
+}
+
+.rtl\:univer-mr-auto:where([dir="rtl"], [dir="rtl"] *) {
+  margin-right: auto;
+}
+
 .rtl\:\!univer-rotate-0:where([dir="rtl"], [dir="rtl"] *) {
   --univer-tw-rotate: 0deg !important;
   transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(0deg) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y)) !important;
@@ -2395,6 +2446,10 @@
   background-color: var(--univer-gray-600) !important;
 }
 
+.dark\:data-\[selected\=true\]\:\!univer-bg-gray-600[data-selected="true"]:where(.univer-dark, .univer-dark *) {
+  background-color: var(--univer-gray-600) !important;
+}
+
 .dark\:data-\[state\=open\]\:\!univer-bg-gray-600[data-state="open"]:where(.univer-dark, .univer-dark *) {
   background-color: var(--univer-gray-600) !important;
 }
@@ -2485,6 +2540,10 @@
   flex-shrink: 0;
 }
 
+.\[\&\>svg\]\:univer-text-gray-400 > svg {
+  color: var(--univer-gray-400);
+}
+
 .\[\&\>ul\:not\(\:last-child\)\]\:univer-border-0 > ul:not(:last-child) {
   border-width: 0;
 }
@@ -2501,6 +2560,29 @@
   border-right-color: var(--univer-gray-200);
 }
 
+.\[\&_\[cmdk-group-heading\]\]\:univer-px-2 [cmdk-group-heading] {
+  padding-left: .5rem;
+  padding-right: .5rem;
+}
+
+.\[\&_\[cmdk-group-heading\]\]\:univer-py-1\.5 [cmdk-group-heading] {
+  padding-top: .375rem;
+  padding-bottom: .375rem;
+}
+
+.\[\&_\[cmdk-group-heading\]\]\:univer-text-xs [cmdk-group-heading] {
+  font-size: .75rem;
+  line-height: 1rem;
+}
+
+.\[\&_\[cmdk-group-heading\]\]\:univer-font-medium [cmdk-group-heading] {
+  font-weight: 500;
+}
+
+.\[\&_\[cmdk-group-heading\]\]\:univer-text-gray-500 [cmdk-group-heading] {
+  color: var(--univer-gray-500);
+}
+
 .\[\&_\[data-description\]\]\:univer-text-sm [data-description] {
   font-size: .875rem;
   line-height: 1.25rem;
@@ -2712,80 +2794,3 @@
 .\[\&_svg\]\:univer-shrink-0 svg {
   flex-shrink: 0;
 }
-.univer-popup {
-  z-index: 1070;
-  --univer-tw-shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
-  --univer-tw-shadow-colored: 0 1px 3px 0 var(--univer-tw-shadow-color), 0 1px 2px -1px var(--univer-tw-shadow-color);
-  box-shadow: 0 0 #0000, 0 0 #0000, 0 1px 3px #0000001a, 0 1px 2px -1px #0000001a;
-  box-shadow: var(--univer-tw-ring-offset-shadow, 0 0 #0000), var(--univer-tw-ring-shadow, 0 0 #0000), var(--univer-tw-shadow);
-  border-radius: 6px;
-  position: fixed;
-  top: -9999px;
-  left: -9999px;
-  overflow: hidden;
-}
-
-.univer-popup-enter {
-  transform-origin: 0 0;
-  opacity: 0;
-  animation-duration: .15s;
-  animation-timing-function: cubic-bezier(.08, .82, .17, 1);
-  animation-play-state: paused;
-  animation-fill-mode: both;
-}
-
-.univer-popup-enter-active {
-  animation-name: popup-slide-up-in;
-  animation-play-state: running;
-}
-
-.univer-popup-exit {
-  transform-origin: 0 0;
-  opacity: 1;
-  animation-name: popup-slide-up-out;
-  animation-duration: .15s;
-  animation-timing-function: cubic-bezier(.6, .04, .98, .34);
-  animation-play-state: running;
-  animation-fill-mode: both;
-}
-
-.univer-popup-exit-active {
-  display: none;
-}
-
-@keyframes popup-slide-up-in {
-  0% {
-    transform-origin: 0 0;
-    opacity: 0;
-    transform: scaleY(0);
-  }
-
-  100% {
-    transform-origin: 0 0;
-    opacity: 1;
-    transform: scaleY(1);
-  }
-}
-
-@keyframes popup-slide-up-out {
-  0% {
-    transform-origin: 0 0;
-    opacity: 1;
-    transform: scaleY(1);
-  }
-
-  100% {
-    transform-origin: 0 0;
-    opacity: 0;
-    transform: scaleY(0);
-  }
-}
-
-.univer-popup-mask {
-  z-index: 1060;
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-}

package/lib/index.js

@@ -1,4 +1,4 @@
-import { CalendarIcon, CheckMarkIcon, ClockIcon, CloseIcon, DeleteIcon, DownIcon, ErrorIcon, InfoIcon, LoadingMultiIcon, MoreDownIcon, MoreLeftIcon, MoreRightIcon, MoreUpIcon, OneToOneIcon, SuccessIcon, WarningIcon, ZoomInIcon, ZoomOutIcon } from "@univerjs/icons";
+import { CalendarIcon, CheckMarkIcon, ClockIcon, CloseIcon, DeleteIcon, DownIcon, ErrorIcon, InfoIcon, LoadingMultiIcon, MoreDownIcon, MoreLeftIcon, MoreRightIcon, MoreUpIcon, OneToOneIcon, SearchIcon, SuccessIcon, WarningIcon, ZoomInIcon, ZoomOutIcon } from "@univerjs/icons";
 import { Children, cloneElement, createContext, forwardRef, isValidElement, memo, useCallback, useContext, useEffect, useId, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { clsx as clsx$1 } from "clsx";
 import { extendTailwindMerge } from "tailwind-merge";
@@ -9,10 +9,10 @@ import { Slot } from "@radix-ui/react-slot";
 import { CheckboxItem, Content, Item, ItemIndicator, Portal, RadioGroup as RadioGroup$1, RadioItem, Root, Separator as Separator$1, Sub, SubContent, SubTrigger, Trigger } from "@radix-ui/react-dropdown-menu";
 import { Content as Content$1, Portal as Portal$1, Root as Root$1, Trigger as Trigger$1 } from "@radix-ui/react-popover";
 import { Close, Content as Content$2, Description, Overlay, Portal as Portal$2, Root as Root$2, Title } from "@radix-ui/react-dialog";
+import { Command as Command$1 } from "cmdk";
 import { createPortal } from "react-dom";
 import { Content as Content$3, Portal as Portal$3, Root as Root$3, Trigger as Trigger$2 } from "@radix-ui/react-hover-card";
 import { Toaster as Toaster$1, toast, toast as toast$1 } from "sonner";
-import { CSSTransition } from "react-transition-group";
 import { Root as Root$4 } from "@radix-ui/react-separator";
 import { createRoot } from "react-dom/client";
 
@@ -1107,7 +1107,8 @@ function useDraggable(options = {}) {
 		if (!isDragging) return;
 		e.preventDefault();
 		e.stopPropagation();
-		setPosition(calculateBounds(e.clientX, e.clientY));
+		const newPosition = calculateBounds(e.clientX, e.clientY);
+		setPosition(newPosition);
 	}, [isDragging, calculateBounds]);
 	const endDrag = useCallback(() => {
 		setIsDragging(false);
@@ -1504,10 +1505,11 @@ function RgbInput({ hsv, alpha, format, onChange }) {
 			if (value !== "" && !/^\d*\.?\d*$/.test(value)) return;
 			const numValue = value === "" ? 0 : Number.parseFloat(value);
 			if (numValue > 1) return;
-			setLocalValues({
+			const newValues = {
 				...localValues,
 				a: numValue
-			});
+			};
+			setLocalValues(newValues);
 			if (onChange) onChange(hsv[0], hsv[1], hsv[2], numValue);
 			return;
 		}
@@ -2061,6 +2063,69 @@ function ColorPicker({ format = "hex", value, onChange }) {
 	});
 }
 
+//#endregion
+//#region src/components/command/Command.tsx
+function Command({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1, {
+		"data-slot": "command",
+		className: clsx("univer-flex univer-h-full univer-w-full univer-flex-col univer-overflow-hidden univer-rounded-md univer-bg-white univer-text-gray-900 dark:!univer-bg-gray-700 dark:!univer-text-white", className),
+		...props
+	});
+}
+function CommandInput({ className, ...props }) {
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "command-input-wrapper",
+		className: "univer-flex univer-h-10 univer-items-center univer-gap-2 univer-border-0 univer-border-b univer-border-solid univer-border-gray-200 univer-px-3 dark:!univer-border-gray-600 [&>svg]:univer-size-4 [&>svg]:univer-shrink-0 [&>svg]:univer-text-gray-400",
+		children: [/* @__PURE__ */ jsx(SearchIcon, {}), /* @__PURE__ */ jsx(Command$1.Input, {
+			"data-slot": "command-input",
+			className: clsx("univer-h-10 univer-w-full univer-border-none univer-bg-transparent univer-text-sm univer-outline-none placeholder:univer-text-gray-400", className),
+			...props
+		})]
+	});
+}
+function CommandList({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.List, {
+		"data-slot": "command-list",
+		className: clsx("univer-max-h-[300px] univer-overflow-y-auto univer-overflow-x-hidden univer-p-1 [scroll-padding-block:4px]", className),
+		...props
+	});
+}
+function CommandEmpty({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.Empty, {
+		"data-slot": "command-empty",
+		className: clsx("univer-py-6 univer-text-center univer-text-sm univer-text-gray-500", className),
+		...props
+	});
+}
+function CommandGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.Group, {
+		"data-slot": "command-group",
+		className: clsx("univer-overflow-hidden univer-p-1 [&_[cmdk-group-heading]]:univer-px-2 [&_[cmdk-group-heading]]:univer-py-1.5 [&_[cmdk-group-heading]]:univer-text-xs [&_[cmdk-group-heading]]:univer-font-medium [&_[cmdk-group-heading]]:univer-text-gray-500", className),
+		...props
+	});
+}
+function CommandItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.Item, {
+		"data-slot": "command-item",
+		className: clsx("univer-relative univer-flex univer-cursor-default univer-select-none univer-items-center univer-gap-2 univer-rounded univer-px-2 univer-py-1.5 univer-text-sm univer-outline-none data-[disabled=true]:univer-pointer-events-none data-[selected=true]:univer-bg-gray-100 data-[disabled=true]:univer-opacity-50 dark:data-[selected=true]:!univer-bg-gray-600", className),
+		...props
+	});
+}
+function CommandSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command$1.Separator, {
+		"data-slot": "command-separator",
+		className: clsx("univer-my-1 univer-h-px univer-bg-gray-200 dark:!univer-bg-gray-600", className),
+		...props
+	});
+}
+function CommandShortcut({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "command-shortcut",
+		className: clsx("univer-ml-auto univer-text-xs univer-tracking-widest univer-text-gray-400 rtl:univer-ml-0 rtl:univer-mr-auto", className),
+		...props
+	});
+}
+
 //#endregion
 //#region src/components/confirm/Confirm.tsx
 function Footer(props) {
@@ -2329,7 +2394,10 @@ function DraggableList(props) {
 				onPointerDownCapture: (e) => {
 					if (pointerIdRef.current !== null) return;
 					if (!draggableHandle) pressedHandleIdRef.current = itemId;
-					else pressedHandleIdRef.current = !!e.target.closest(draggableHandle) ? itemId : null;
+					else {
+						const isMatched = !!e.target.closest(draggableHandle);
+						pressedHandleIdRef.current = isMatched ? itemId : null;
+					}
 					if (pressedHandleIdRef.current !== itemId) return;
 					const rect = e.currentTarget.getBoundingClientRect();
 					dragPointerOffsetRef.current = {
@@ -2708,7 +2776,7 @@ const Input = forwardRef(({ autoFocus = false, className, style, type = "text",
 
 //#endregion
 //#region src/components/input-number/InputNumber.tsx
-const InputNumber = forwardRef(({ value, defaultValue, size = "small", min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER, step = 1, precision, formatter, parser, controls = true, className, inputClassName, controlsClassName, disabled, onChange, onKeyDown, onPressEnter, onFocus, onBlur, allowEmpty = false }, ref) => {
+const InputNumber = forwardRef(({ value, defaultValue, size = "small", min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER, step = 1, precision, formatter, parser, controls = true, className, inputClassName, controlsClassName, disabled, onChange, onKeyDown, onPressEnter, onFocus, onBlur, allowEmpty = false, allowClear = false }, ref) => {
 	const { locale } = useContext(ConfigContext);
 	const [internalValue, setInternalValue] = useState(value !== void 0 ? value : defaultValue !== void 0 ? defaultValue : null);
 	const lastValidValueRef = useRef(internalValue);
@@ -2854,6 +2922,7 @@ const InputNumber = forwardRef(({ value, defaultValue, size = "small", min = Num
 				className: clsx("univer-box-border", inputClassName),
 				size,
 				value: inputValue,
+				allowClear,
 				disabled,
 				onChange: handleInputChange,
 				onFocus,
@@ -2910,14 +2979,16 @@ function Segmented({ items, value, defaultValue, onChange, className = "" }) {
 			const containerRect = containerRef.current.getBoundingClientRect();
 			const newRect = newItemElement.getBoundingClientRect();
 			const newLeft = newRect.left - containerRect.left - SEGMENTED_PADDING;
-			if (oldItemElement) setSlideStyle({
-				"--slide-from": `${oldItemElement.getBoundingClientRect().left - containerRect.left - SEGMENTED_PADDING}px`,
-				"--slide-to": `${newLeft}px`,
-				left: `${SEGMENTED_PADDING}px`,
-				width: `${newRect.width}px`,
-				transform: `translateX(${newLeft}px)`
-			});
-			else setSlideStyle({
+			if (oldItemElement) {
+				const oldLeft = oldItemElement.getBoundingClientRect().left - containerRect.left - SEGMENTED_PADDING;
+				setSlideStyle({
+					"--slide-from": `${oldLeft}px`,
+					"--slide-to": `${newLeft}px`,
+					left: `${SEGMENTED_PADDING}px`,
+					width: `${newRect.width}px`,
+					transform: `translateX(${newLeft}px)`
+				});
+			} else setSlideStyle({
 				left: `${SEGMENTED_PADDING}px`,
 				width: `${newRect.width}px`,
 				transform: `translateX(${newLeft}px)`
@@ -3773,9 +3844,10 @@ function PanelField(props) {
 //#endregion
 //#region src/components/popup/Popup.tsx
 const POPUP_POINTER_OFFSET = 2;
+const DEFAULT_POPUP_OFFSET = [0, 0];
 const HIDDEN_POPUP_OFFSET = [-9999, -9999];
 function Popup(props) {
-	const { children, visible = false, offset = [0, 0], overflowVisible = false, placementY = "below" } = props;
+	const { children, visible = false, offset = DEFAULT_POPUP_OFFSET, overflowVisible = false, placementY = "below" } = props;
 	const nodeRef = useRef(null);
 	const [realOffset, setRealOffset] = useState(HIDDEN_POPUP_OFFSET);
 	const { mountContainer, direction } = useContext(ConfigContext);
@@ -3821,29 +3893,17 @@ function Popup(props) {
 	function preventDefault(event) {
 		event.preventDefault();
 	}
-	return createPortal(/* @__PURE__ */ jsx(CSSTransition, {
-		in: visible,
-		nodeRef,
-		timeout: 500,
-		classNames: {
-			enter: "univer-popup-enter",
-			enterActive: "univer-popup-enter-active",
-			enterDone: "univer-popup-enter-done",
-			exitActive: "univer-popup-exit",
-			exitDone: "univer-popup-exit-active"
+	return createPortal(/* @__PURE__ */ jsx("section", {
+		ref: nodeRef,
+		dir: direction,
+		className: clsx("univer-popup univer-fixed univer-z-[1070] univer-origin-top-left univer-overflow-hidden univer-rounded-md univer-shadow univer-transition-[transform,opacity] univer-duration-150", visible ? "univer-[transition-timing-function:cubic-bezier(0.08,0.82,0.17,1)] univer-scale-y-100 univer-opacity-100" : "univer-[transition-timing-function:cubic-bezier(0.6,0.04,0.98,0.34)] univer-scale-y-0 univer-opacity-0"),
+		style: {
+			left: realOffset[0] + POPUP_POINTER_OFFSET,
+			top: realOffset[1] + POPUP_POINTER_OFFSET,
+			overflow: overflowVisible ? "visible" : void 0
 		},
-		children: /* @__PURE__ */ jsx("section", {
-			ref: nodeRef,
-			dir: direction,
-			className: "univer-popup",
-			style: {
-				left: realOffset[0] + POPUP_POINTER_OFFSET,
-				top: realOffset[1] + POPUP_POINTER_OFFSET,
-				overflow: overflowVisible ? "visible" : void 0
-			},
-			onContextMenu: preventDefault,
-			children
-		})
+		onContextMenu: preventDefault,
+		children
 	}), mountContainer);
 }
 
@@ -4050,13 +4110,15 @@ function MultipleSelect(props) {
 				disabled: option.disabled,
 				checked: value.includes(option.value),
 				onSelect: (item) => {
-					onChange(value.includes(item) ? value.filter((v) => v !== item) : [...value, item]);
+					const newValue = value.includes(item) ? value.filter((v) => v !== item) : [...value, item];
+					onChange(newValue);
 				}
 			};
 		});
 	}, [options]);
 	function handleClose(item) {
-		onChange(value.filter((v) => v !== item));
+		const newValue = value.filter((v) => v !== item);
+		onChange(newValue);
 	}
 	const displayValue = useMemo(() => {
 		return options.filter((option) => value.includes(option.value)).map((option, index) => /* @__PURE__ */ jsx(Badge, {
@@ -4314,7 +4376,8 @@ const filterLeafNode = (tree, keyList) => {
 	const result = [];
 	const find = createCacheWithFindNodePathFromTree(tree);
 	keyList.forEach((key) => {
-		const node = findNodeFromPath(tree, find.findNodePathFromTreeWithCache(key));
+		const path = find.findNodePathFromTreeWithCache(key);
+		const node = findNodeFromPath(tree, path);
 		if (node) {
 			var _node$children3;
 			if (!((_node$children3 = node.children) === null || _node$children3 === void 0 ? void 0 : _node$children3.length)) result.push(node);
@@ -4469,43 +4532,4 @@ function unmount(container) {
 }
 
 //#endregion
-//#region src/helper/resize-observer.ts
-/**
-* Copyright 2023-present DreamNum Co., Ltd.
-*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*/
-/**
-* All elements are observed by a single ResizeObserver is got greater performance than each element observed by separate ResizeObserver
-* See issue https://github.com/WICG/resize-observer/issues/59#issuecomment-408098151
-*/
-const _resizeObserverCallbacks = /* @__PURE__ */ new Set();
-let _resizeObserver;
-function resizeObserverCtor(callback) {
-	if (!_resizeObserver) _resizeObserver = new ResizeObserver((...args) => {
-		_resizeObserverCallbacks.forEach((callback) => callback(...args));
-	});
-	return {
-		observe(target, options) {
-			_resizeObserverCallbacks.add(callback);
-			_resizeObserver.observe(target, options);
-		},
-		unobserve(target) {
-			_resizeObserverCallbacks.delete(callback);
-			_resizeObserver.unobserve(target);
-		}
-	};
-}
-
-//#endregion
-export { Accordion, Avatar, Badge, Button, ButtonGroup, Calendar, CascaderList, Checkbox, CheckboxGroup, ColorPicker, ColorPresets, ConfigContext, ConfigProvider, Confirm, DatePicker, DateRangePicker, Dialog, DraggableList, Dropdown, DropdownMenu, FormDualColumnLayout, FormLayout, Gallery, GradientColorPicker, HoverCard, Input, InputNumber, KBD, MessageType, Messager, MultipleSelect, Pager, Panel, PanelField, PanelSection, Popup, Radio, RadioGroup, Segmented, Select, SelectList, Separator, Switch, Textarea, TimeInput, Toaster, Tooltip, Tree, TreeSelectionMode, borderBottomClassName, borderClassName, borderLeftBottomClassName, borderLeftClassName, borderRightClassName, borderTopClassName, clsx, cva, divideXClassName, divideYClassName, filterLeafNode, findNodePathFromTree, findSubTreeFromPath, isBrowser, mergeTreeSelected, message, removeMessage, render, resetButtonClassName, resizeObserverCtor, scrollbarClassName, selectClassName, toast, unmount };
+export { Accordion, Avatar, Badge, Button, ButtonGroup, Calendar, CascaderList, Checkbox, CheckboxGroup, ColorPicker, ColorPresets, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ConfigContext, ConfigProvider, Confirm, DatePicker, DateRangePicker, Dialog, DraggableList, Dropdown, DropdownMenu, FormDualColumnLayout, FormLayout, Gallery, GradientColorPicker, HoverCard, Input, InputNumber, KBD, MessageType, Messager, MultipleSelect, Pager, Panel, PanelField, PanelSection, Popup, Radio, RadioGroup, Segmented, Select, SelectList, Separator, Switch, Textarea, TimeInput, Toaster, Tooltip, Tree, TreeSelectionMode, borderBottomClassName, borderClassName, borderLeftBottomClassName, borderLeftClassName, borderRightClassName, borderTopClassName, clsx, cva, divideXClassName, divideYClassName, filterLeafNode, findNodePathFromTree, findSubTreeFromPath, isBrowser, mergeTreeSelected, message, removeMessage, render, resetButtonClassName, scrollbarClassName, selectClassName, toast, unmount };

package/lib/locale/ar-SA.js

@@ -16,7 +16,7 @@ const locale = { design: {
 	},
 	CascaderList: { empty: "لا شيء" },
 	Calendar: {
-		year: "",
+		year: "سنة",
 		weekDays: [
 			"ح",
 			"ن",

package/lib/locale/ca-ES.js

@@ -12,11 +12,11 @@ const locale = { design: {
 	},
 	Confirm: {
 		cancel: "cancel·la",
-		confirm: "ok"
+		confirm: "D'acord"
 	},
 	CascaderList: { empty: "Cap" },
 	Calendar: {
-		year: "",
+		year: "Any",
 		weekDays: [
 			"dg",
 			"dl",
@@ -51,7 +51,7 @@ const locale = { design: {
 	ColorPicker: {
 		more: "Més colors",
 		cancel: "cancel·la",
-		confirm: "ok"
+		confirm: "D'acord"
 	},
 	GradientColorPicker: {
 		linear: "Lineal",

package/lib/locale/de-DE.js

@@ -16,7 +16,7 @@ const locale = { design: {
 	},
 	CascaderList: { empty: "Keine" },
 	Calendar: {
-		year: "",
+		year: "Jahr",
 		weekDays: [
 			"So",
 			"Mo",

package/lib/locale/es-ES.js

@@ -16,7 +16,7 @@ const locale = { design: {
 	},
 	CascaderList: { empty: "Cap" },
 	Calendar: {
-		year: "",
+		year: "Año",
 		weekDays: [
 			"Dg",
 			"Dl",

package/lib/locale/fr-FR.js

@@ -12,11 +12,11 @@ const locale = { design: {
 	},
 	Confirm: {
 		cancel: "annuler",
-		confirm: "ok"
+		confirm: "OK"
 	},
 	CascaderList: { empty: "Aucun" },
 	Calendar: {
-		year: "",
+		year: "Année",
 		weekDays: [
 			"Dim",
 			"Lun",
@@ -51,7 +51,7 @@ const locale = { design: {
 	ColorPicker: {
 		more: "Plus de couleurs",
 		cancel: "annuler",
-		confirm: "ok"
+		confirm: "OK"
 	},
 	GradientColorPicker: {
 		linear: "Linéaire",

package/lib/locale/id-ID.js

@@ -16,7 +16,7 @@ const locale = { design: {
 	},
 	CascaderList: { empty: "Tidak ada" },
 	Calendar: {
-		year: "",
+		year: "Tahun",
 		weekDays: [
 			"Min",
 			"Sen",

package/lib/locale/it-IT.js

@@ -12,11 +12,11 @@ const locale = { design: {
 	},
 	Confirm: {
 		cancel: "annulla",
-		confirm: "ok"
+		confirm: "OK"
 	},
 	CascaderList: { empty: "Nessuno" },
 	Calendar: {
-		year: "",
+		year: "Anno",
 		weekDays: [
 			"Dom",
 			"Lun",
@@ -51,7 +51,7 @@ const locale = { design: {
 	ColorPicker: {
 		more: "Altri Colori",
 		cancel: "annulla",
-		confirm: "ok"
+		confirm: "OK"
 	},
 	GradientColorPicker: {
 		linear: "Lineare",