@aloudata/aloudata-design 3.0.26 → 3.1.0

package/dist/Dropdown/index.js

@@ -3,13 +3,13 @@ import { useFloatingPopupZIndex } from "../_utils/floatingLayer.js";
 /* empty css         */
 import Menu from "../Menu/index.js";
 import { ensureWeakRefFallback } from "../_utils/weakRefFallback.js";
-import { cloneElement, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
+import { cloneElement, useCallback, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import ReactDOM from "react-dom";
-import { FloatingFocusManager, FloatingNode, FloatingTree, autoUpdate, flip, offset, safePolygon, shift, size, useClick, useDismiss, useFloating, useFloatingNodeId, useFloatingParentNodeId, useHover, useId as useId$1, useInteractions, useRole } from "@floating-ui/react";
+import { FloatingFocusManager, FloatingNode, FloatingTree, autoUpdate, flip, offset, safePolygon, shift, size, useClick, useDismiss, useFloating, useFloatingNodeId, useFloatingParentNodeId, useHover, useId as useId$1, useInteractions, useRole, useTransitionStyles } from "@floating-ui/react";
 import { useMemoizedFn } from "ahooks";
 //#region src/Dropdown/index.tsx
-var OVERLAY_EXIT_ANIMATION_MS = 200;
+var OVERLAY_TRANSITION_MS = 200;
 ensureWeakRefFallback();
 function resolvePlacementSide(currentPlacement) {
 	const [side] = currentPlacement.split("-");
@@ -42,8 +42,6 @@ function hasTrigger(trigger, action) {
 function Dropdown(props) {
 	const { children, destroyPopupOnHide = true, getPopupContainer, menu, overlayClassName, placement = "bottom-start", trigger = "click", open, onOpenChange = () => {}, closeOnFocusOut = true, overlayStyle, overlayInnerStyle, dropdownRender, disabled, offset: offsetProps = 4, delay = 0, autoUpdatePos = false, initialFocus = -1, popupMatchTriggerWidth = false, allowOverlap = false } = props;
 	const [isOpen, setIsOpen] = useState(open || false);
-	const [isAnimatingOut, setIsAnimatingOut] = useState(false);
-	const closeAnimationTimerRef = useRef(null);
 	const lastResolvedFloatingStylesRef = useRef(null);
 	const lastResolvedSideRef = useRef(resolvePlacementSide(placement));
 	const currentFloatingStylesRef = useRef(null);
@@ -54,71 +52,18 @@ function Dropdown(props) {
 	const popupZIndex = useFloatingPopupZIndex();
 	const onOpenChangeFn = useMemoizedFn(onOpenChange);
 	const isOpenControlled = open !== void 0;
-	const clearCloseAnimationTimer = useCallback(() => {
-		if (closeAnimationTimerRef.current) {
-			clearTimeout(closeAnimationTimerRef.current);
-			closeAnimationTimerRef.current = null;
-		}
-	}, []);
-	const stopCloseAnimation = useCallback(() => {
-		clearCloseAnimationTimer();
-		document.body.classList.remove("ald-dropdown-root-closing");
-		setIsAnimatingOut(false);
-	}, [clearCloseAnimationTimer]);
 	const markRootClosing = useCallback(() => {
 		document.body.classList.add("ald-dropdown-root-closing");
 		lastResolvedFloatingStylesRef.current = currentFloatingStylesRef.current ?? lastResolvedFloatingStylesRef.current;
 		lastResolvedSideRef.current = currentFloatingSideRef.current ?? lastResolvedSideRef.current;
 	}, []);
-	const startCloseAnimation = useCallback(() => {
-		clearCloseAnimationTimer();
-		markRootClosing();
-		setIsAnimatingOut(true);
-		closeAnimationTimerRef.current = setTimeout(() => {
-			document.body.classList.remove("ald-dropdown-root-closing");
-			setIsAnimatingOut(false);
-			closeAnimationTimerRef.current = null;
-		}, OVERLAY_EXIT_ANIMATION_MS);
-	}, [clearCloseAnimationTimer, markRootClosing]);
 	useLayoutEffect(() => {
-		if (!isOpenControlled) return;
-		if (open) {
-			stopCloseAnimation();
-			setIsOpen(true);
-			return;
-		}
-		if (isOpen) startCloseAnimation();
-		setIsOpen(false);
-	}, [
-		isOpen,
-		isOpenControlled,
-		open,
-		startCloseAnimation,
-		stopCloseAnimation
-	]);
-	useEffect(() => {
-		return () => {
-			clearCloseAnimationTimer();
-		};
-	}, [clearCloseAnimationTimer]);
-	useEffect(() => {
-		return () => {
-			document.body.classList.remove("ald-dropdown-root-closing");
-		};
-	}, []);
+		if (isOpenControlled) setIsOpen(!!open);
+	}, [isOpenControlled, open]);
 	const onChangeOpen = useCallback((newOpen) => {
-		if (!isOpenControlled) {
-			if (newOpen) stopCloseAnimation();
-			else startCloseAnimation();
-			setIsOpen(newOpen);
-		}
+		if (!isOpenControlled) setIsOpen(newOpen);
 		onOpenChangeFn(newOpen);
-	}, [
-		isOpenControlled,
-		onOpenChangeFn,
-		startCloseAnimation,
-		stopCloseAnimation
-	]);
+	}, [isOpenControlled, onOpenChangeFn]);
 	const nodeId = useFloatingNodeId();
 	const { refs, floatingStyles, context, placement: floatingPlacement, x, y } = useFloating({
 		nodeId,
@@ -151,6 +96,26 @@ function Dropdown(props) {
 		],
 		whileElementsMounted: autoUpdatePos ? autoUpdate : void 0
 	});
+	const { isMounted, styles: transitionStyles } = useTransitionStyles(context, {
+		duration: OVERLAY_TRANSITION_MS,
+		initial: {
+			opacity: 0,
+			transform: "var(--ald-dropdown-enter-transform)"
+		},
+		close: {
+			opacity: 0,
+			transform: "var(--ald-dropdown-exit-transform)"
+		},
+		common: { transitionTimingFunction: "ease-in-out" }
+	});
+	const isAnimatingOut = !isOpen && isMounted;
+	useLayoutEffect(() => {
+		if (isAnimatingOut) document.body.classList.add("ald-dropdown-root-closing");
+		else document.body.classList.remove("ald-dropdown-root-closing");
+		return () => {
+			if (isAnimatingOut) document.body.classList.remove("ald-dropdown-root-closing");
+		};
+	}, [isAnimatingOut]);
 	const click = useClick(context, { enabled: hasTrigger(trigger, "click") });
 	const hover = useHover(context, {
 		enabled: hasTrigger(trigger, "hover"),
@@ -280,7 +245,7 @@ function Dropdown(props) {
 		maxWidth: "none"
 	} : void 0;
 	const floatingSide = resolvePlacementSide(String(floatingPlacement));
-	const shouldKeepMounted = !destroyPopupOnHide || isOpen || isAnimatingOut;
+	const shouldKeepMounted = !destroyPopupOnHide || isMounted;
 	const isPositionReady = x !== null && y !== null;
 	const overlayHidden = !isOpen && !isAnimatingOut || isOpen && !isPositionReady;
 	const resolvedFloatingStyles = isAnimatingOut ? lastResolvedFloatingStylesRef.current ?? floatingStyles : floatingStyles;
@@ -292,34 +257,35 @@ function Dropdown(props) {
 		lastResolvedSideRef.current = floatingSide;
 	}
 	const renderFloatingContent = useCallback(() => {
-		const surface = /* @__PURE__ */ jsx("div", {
-			...isAnimatingOut ? {} : getFloatingProps(),
-			className: cn("ald-dropdown-overlay", "tw-pointer-events-auto tw-z-[1001] tw-max-w-none tw-outline-none", overlayClassName, { "ald-dropdown-overlay-hidden": overlayHidden }),
-			ref: refs.setFloating,
-			style: {
-				zIndex: popupZIndex,
-				...resolvedFloatingStyles,
-				...matchedOverlayStyle,
-				...overlayStyle
-			},
-			"aria-labelledby": headingId,
-			children: /* @__PURE__ */ jsx("div", {
-				className: cn("ald-dropdown-surface", "tw-flex tw-flex-col tw-items-start tw-text-sm"),
-				style: {
-					...matchedSurfaceStyle,
-					...overlayInnerStyle
-				},
-				"data-state": isOpen ? "open" : "closed",
-				"data-side": resolvedFloatingSide,
-				children: popupElement
-			})
-		});
-		const popupElem = isAnimatingOut && !isOpen ? surface : /* @__PURE__ */ jsx(FloatingFocusManager, {
+		const popupElem = /* @__PURE__ */ jsx(FloatingFocusManager, {
 			context,
+			disabled: isAnimatingOut,
 			modal: false,
 			initialFocus,
 			closeOnFocusOut,
-			children: surface
+			children: /* @__PURE__ */ jsx("div", {
+				...isAnimatingOut ? {} : getFloatingProps(),
+				className: cn("ald-dropdown-overlay", "tw-pointer-events-auto tw-z-[1001] tw-max-w-none tw-outline-none", overlayClassName, { "ald-dropdown-overlay-hidden": overlayHidden }),
+				ref: refs.setFloating,
+				style: {
+					zIndex: popupZIndex,
+					...resolvedFloatingStyles,
+					...matchedOverlayStyle,
+					...overlayStyle
+				},
+				"aria-labelledby": headingId,
+				children: /* @__PURE__ */ jsx("div", {
+					className: cn("ald-dropdown-surface", "tw-flex tw-flex-col tw-items-start tw-text-sm"),
+					style: {
+						...matchedSurfaceStyle,
+						...overlayInnerStyle,
+						...transitionStyles
+					},
+					"data-state": isOpen ? "open" : "closed",
+					"data-side": resolvedFloatingSide,
+					children: popupElement
+				})
+			})
 		});
 		const popupContainer = typeof getPopupContainer === "function" ? getPopupContainer() : document.body;
 		return ReactDOM.createPortal(popupElem, popupContainer);
@@ -335,6 +301,7 @@ function Dropdown(props) {
 		overlayInnerStyle,
 		matchedOverlayStyle,
 		matchedSurfaceStyle,
+		transitionStyles,
 		popupZIndex,
 		overlayHidden,
 		isAnimatingOut,

package/dist/Dropdown/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/Dropdown/index.tsx"],"sourcesContent":["import './dropdown.css';\nimport {\n  FloatingFocusManager,\n  FloatingFocusManagerProps,\n  FloatingNode,\n  FloatingTree,\n  OffsetOptions,\n  UseHoverProps,\n  autoUpdate,\n  flip,\n  offset,\n  safePolygon,\n  shift,\n  size,\n  useClick,\n  useDismiss,\n  useFloating,\n  useFloatingNodeId,\n  useFloatingParentNodeId,\n  useHover,\n  useId,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport type { Placement } from '@floating-ui/react';\nimport { useMemoizedFn } from 'ahooks';\nimport { cn } from '../lib/utils';\nimport React, {\n  cloneElement,\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport ReactDOM from 'react-dom';\nimport Menu, { MenuInfo, MenuProps } from '../Menu';\nimport { useFloatingPopupZIndex } from '../_utils/floatingLayer';\nimport { ensureWeakRefFallback } from '../_utils/weakRefFallback';\n\nconst OVERLAY_EXIT_ANIMATION_MS = 200;\n\nensureWeakRefFallback();\n\nfunction resolvePlacementSide(\n  currentPlacement: string,\n): 'top' | 'bottom' | 'left' | 'right' {\n  const [side] = currentPlacement.split('-');\n  if (\n    side === 'top' ||\n    side === 'bottom' ||\n    side === 'left' ||\n    side === 'right'\n  ) {\n    return side;\n  }\n  if (currentPlacement.startsWith('top')) {\n    return 'top';\n  }\n  if (currentPlacement.startsWith('bottom')) {\n    return 'bottom';\n  }\n  if (currentPlacement.startsWith('left')) {\n    return 'left';\n  }\n  if (currentPlacement.startsWith('right')) {\n    return 'right';\n  }\n  return 'bottom';\n}\n\nfunction parsePopupMatchWidth(value: unknown): number | undefined {\n  if (typeof value === 'number') {\n    return value;\n  }\n\n  if (typeof value === 'string' && value.trim() !== '') {\n    const parsedValue = Number(value);\n    return Number.isNaN(parsedValue) ? undefined : parsedValue;\n  }\n\n  return undefined;\n}\n\nexport type ActionType = 'hover' | 'click';\nexport type PlacementType =\n  | 'top'\n  | 'bottom'\n  | 'left'\n  | 'right'\n  | 'top-start'\n  | 'top-end'\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'left-start'\n  | 'left-end'\n  | 'right-start'\n  | 'right-end'\n  // Legacy antd-style placement names\n  | 'topLeft'\n  | 'topRight'\n  | 'bottomLeft'\n  | 'bottomRight';\n\nconst legacyPlacementMap = {\n  topLeft: 'top-start',\n  topRight: 'top-end',\n  bottomLeft: 'bottom-start',\n  bottomRight: 'bottom-end',\n} as const;\n\nfunction normalizePlacement(placement: PlacementType): Placement {\n  return (legacyPlacementMap[placement as keyof typeof legacyPlacementMap] ??\n    placement) as Placement;\n}\n\nexport interface IDropdownProps {\n  children: React.ReactNode;\n  /**\n   * @description 菜单弹出位置的偏移量\n   */\n  offset?: OffsetOptions;\n  /**\n   * @description 关闭后是否销毁 Dropdown\n   * @default false\n   */\n  destroyPopupOnHide?: boolean;\n  /**\n   * @description 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位\n   * @default () => document.body\n   */\n  getPopupContainer?: () => HTMLElement;\n  /**\n   * @description 菜单\n   * @type Menu | () => Menu\n   * @default -\n   */\n  menu?: MenuProps;\n  // /**\n  //  * @description 菜单\n  //  * @type Menu | () => Menu\n  //  * @default -\n  //  */\n  // menu?: ReactElement | (() => ReactElement);\n  /**\n   * @description 下拉根元素的类名称\n   * @default -\n   */\n  overlayClassName?: string;\n  /**\n   * @description 菜单弹出位置\n   * @default bottomLeft\n   */\n  placement?: PlacementType;\n  /**\n   * @description 触发下拉的行为\n   * @type ActionType, 其中 ActionType 为 'hover' | 'click' | 'contextMenu';\n   * @default click\n   */\n  trigger?: ActionType | ActionType[];\n  /**\n   * @description 菜单是否显示\n   * @default -\n   */\n  open?: boolean;\n  /**\n   * @description 菜单显示状态改变时调用，参数为 open，点击菜单按钮导致的消失不会触发\n   * @default -\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * @description 焦点移出触发元素和浮层时是否关闭 Dropdown\n   * @default true\n   */\n  closeOnFocusOut?: boolean;\n  /**\n   * @description 下拉框外层 overlay 的内联样式（与定位 transform 合并）\n   * @default -\n   */\n  overlayStyle?: React.CSSProperties;\n  /**\n   * @description 下拉框内层 surface 的内联样式。\n   * 用于覆盖 surface 默认约束（默认 min-width:160px、max-width:320px）；\n   * 自定义 dropdownRender 内容若需大于 320px 宽，传 `{ width: 400, maxWidth: 'none' }` 即可。\n   * @default -\n   */\n  overlayInnerStyle?: React.CSSProperties;\n\n  /**\n   * @description 自定义下拉框内容\n   * @default -\n   */\n  dropdownRender?: (menus: React.ReactNode) => React.ReactNode;\n  /**\n   * @description 是否禁用\n   * @default false\n   */\n  // 透传给子元素，antd的dropdown用cloneElement生成dropdown的子元素，劫持了disabled属性，因此如果Dropdown上没有disabled属性，子元素不能获得该属性\n  disabled?: boolean;\n  /**\n   * @description 鼠标移入后延迟显示下拉框的时间，单位为毫秒\n   * @default 0\n   */\n  delay?: UseHoverProps['delay'];\n  /**\n   * @description 是否在下拉框变化的时候自动更新位置\n   * @default false\n   */\n  autoUpdatePos?: boolean;\n  /**\n   * @description 初始化焦点，参照：https://floating-ui.com/docs/floatingfocusmanager#initialfocus\n   */\n  initialFocus?: FloatingFocusManagerProps['initialFocus'];\n\n  /**\n   * @description 菜单是否跟随触发元素宽度\n   * @default false\n   */\n  popupMatchTriggerWidth?: boolean | number;\n  /**\n   * @description 空间不足时自动计算菜单最大高度并启用滚动，启用后 offset 固定为 0\n   * @default false\n   */\n  allowOverlap?: boolean;\n}\n\nfunction hasTrigger(\n  trigger: ActionType | ActionType[],\n  action: ActionType,\n): boolean {\n  return Array.isArray(trigger) ? trigger.includes(action) : trigger === action;\n}\n\nexport default function Dropdown(props: IDropdownProps) {\n  const {\n    children,\n    destroyPopupOnHide = true,\n    getPopupContainer,\n    menu,\n    overlayClassName,\n    placement = 'bottom-start',\n    trigger = 'click',\n    open,\n    onOpenChange = () => {},\n    closeOnFocusOut = true,\n    overlayStyle,\n    overlayInnerStyle,\n    dropdownRender,\n    disabled,\n    offset: offsetProps = 4,\n    delay = 0,\n    autoUpdatePos = false,\n    // 默认不自动 focus\n    initialFocus = -1,\n    popupMatchTriggerWidth = false,\n    allowOverlap = false,\n  } = props;\n  const [isOpen, setIsOpen] = useState<boolean>(open || false);\n  const [isAnimatingOut, setIsAnimatingOut] = useState(false);\n  const closeAnimationTimerRef = useRef<ReturnType<typeof setTimeout> | null>(\n    null,\n  );\n  const lastResolvedFloatingStylesRef = useRef<React.CSSProperties | null>(\n    null,\n  );\n  const lastResolvedSideRef = useRef<'top' | 'bottom' | 'left' | 'right'>(\n    resolvePlacementSide(placement),\n  );\n  const currentFloatingStylesRef = useRef<React.CSSProperties | null>(null);\n  const currentFloatingSideRef = useRef<'top' | 'bottom' | 'left' | 'right'>(\n    resolvePlacementSide(placement),\n  );\n  const [targetElement, setTargetElement] = useState<HTMLElement | null>(null);\n  const popupMatchTriggerWidthNumber = parsePopupMatchWidth(\n    popupMatchTriggerWidth,\n  );\n  const [matchedTriggerWidth, setMatchedTriggerWidth] = useState<\n    number | undefined\n  >(popupMatchTriggerWidthNumber);\n  const popupZIndex = useFloatingPopupZIndex();\n\n  const onOpenChangeFn = useMemoizedFn(onOpenChange);\n  const isOpenControlled = open !== undefined;\n\n  const clearCloseAnimationTimer = useCallback(() => {\n    if (closeAnimationTimerRef.current) {\n      clearTimeout(closeAnimationTimerRef.current);\n      closeAnimationTimerRef.current = null;\n    }\n  }, []);\n\n  const stopCloseAnimation = useCallback(() => {\n    clearCloseAnimationTimer();\n    document.body.classList.remove('ald-dropdown-root-closing');\n    setIsAnimatingOut(false);\n  }, [clearCloseAnimationTimer]);\n\n  const markRootClosing = useCallback(() => {\n    document.body.classList.add('ald-dropdown-root-closing');\n    lastResolvedFloatingStylesRef.current =\n      currentFloatingStylesRef.current ?? lastResolvedFloatingStylesRef.current;\n    lastResolvedSideRef.current =\n      currentFloatingSideRef.current ?? lastResolvedSideRef.current;\n  }, []);\n\n  const startCloseAnimation = useCallback(() => {\n    clearCloseAnimationTimer();\n    markRootClosing();\n    setIsAnimatingOut(true);\n    closeAnimationTimerRef.current = setTimeout(() => {\n      document.body.classList.remove('ald-dropdown-root-closing');\n      setIsAnimatingOut(false);\n      closeAnimationTimerRef.current = null;\n    }, OVERLAY_EXIT_ANIMATION_MS);\n  }, [clearCloseAnimationTimer, markRootClosing]);\n\n  useLayoutEffect(() => {\n    if (!isOpenControlled) {\n      return;\n    }\n\n    if (open) {\n      stopCloseAnimation();\n      setIsOpen(true);\n      return;\n    }\n\n    if (isOpen) {\n      startCloseAnimation();\n    }\n    setIsOpen(false);\n  }, [isOpen, isOpenControlled, open, startCloseAnimation, stopCloseAnimation]);\n\n  useEffect(() => {\n    return () => {\n      clearCloseAnimationTimer();\n    };\n  }, [clearCloseAnimationTimer]);\n\n  useEffect(() => {\n    return () => {\n      document.body.classList.remove('ald-dropdown-root-closing');\n    };\n  }, []);\n\n  const onChangeOpen = useCallback(\n    (newOpen: boolean) => {\n      if (!isOpenControlled) {\n        if (newOpen) {\n          stopCloseAnimation();\n        } else {\n          startCloseAnimation();\n        }\n        setIsOpen(newOpen);\n      }\n      onOpenChangeFn(newOpen);\n    },\n    [isOpenControlled, onOpenChangeFn, startCloseAnimation, stopCloseAnimation],\n  );\n\n  const nodeId = useFloatingNodeId();\n  const normalizedPlacement = normalizePlacement(placement);\n  const {\n    refs,\n    floatingStyles,\n    context,\n    placement: floatingPlacement,\n    x,\n    y,\n  } = useFloating({\n    nodeId,\n    placement: normalizedPlacement,\n    open: isOpen,\n    onOpenChange: onChangeOpen,\n    middleware: [\n      offset(allowOverlap ? 0 : offsetProps),\n      flip({\n        altBoundary: true,\n        padding: 8,\n        fallbackAxisSideDirection: 'end',\n        ...(allowOverlap && { fallbackStrategy: 'bestFit' }),\n      }),\n      shift({\n        padding: 8,\n        ...(allowOverlap && { mainAxis: true }),\n      }),\n      size({\n        altBoundary: true,\n        ...(allowOverlap && { padding: 8 }),\n        apply({ availableHeight, elements }) {\n          if (!allowOverlap) {\n            return;\n          }\n\n          Object.assign(elements.floating.style, {\n            maxHeight: `${Math.max(100, availableHeight)}px`,\n            overflowY: 'auto',\n          });\n        },\n      }),\n    ],\n    whileElementsMounted: autoUpdatePos ? autoUpdate : undefined,\n  });\n\n  const click = useClick(context, {\n    enabled: hasTrigger(trigger, 'click'),\n  });\n  const hover = useHover(context, {\n    enabled: hasTrigger(trigger, 'hover'),\n    handleClose: safePolygon({}),\n    delay: delay,\n  });\n  const dismiss = useDismiss(context, {});\n  const role = useRole(context);\n\n  const propsList = useMemo(() => {\n    const res = [dismiss, role];\n\n    if (hasTrigger(trigger, 'hover')) {\n      res.unshift(hover);\n    }\n    if (hasTrigger(trigger, 'click')) {\n      res.unshift(click);\n    }\n    return res;\n  }, [trigger, click, dismiss, role, hover]);\n\n  const { getReferenceProps, getFloatingProps } = useInteractions(propsList);\n\n  const headingId = useId();\n\n  useLayoutEffect(() => {\n    if (!popupMatchTriggerWidth || !isOpen) {\n      setMatchedTriggerWidth(undefined);\n      return;\n    }\n\n    if (popupMatchTriggerWidthNumber !== undefined) {\n      setMatchedTriggerWidth(popupMatchTriggerWidthNumber);\n      return;\n    }\n\n    const referenceElement = targetElement;\n    if (!referenceElement) {\n      return;\n    }\n\n    const updateMatchedWidth = () => {\n      const nextWidth = referenceElement.getBoundingClientRect().width;\n      setMatchedTriggerWidth((currentWidth) =>\n        currentWidth === nextWidth ? currentWidth : nextWidth,\n      );\n    };\n\n    updateMatchedWidth();\n\n    if (typeof ResizeObserver === 'undefined') {\n      window.addEventListener('resize', updateMatchedWidth);\n      return () => {\n        window.removeEventListener('resize', updateMatchedWidth);\n      };\n    }\n\n    let resizeAnimationFrame: number | undefined;\n    const scheduleMatchedWidthUpdate = () => {\n      if (resizeAnimationFrame !== undefined) {\n        cancelAnimationFrame(resizeAnimationFrame);\n      }\n      resizeAnimationFrame = requestAnimationFrame(updateMatchedWidth);\n    };\n\n    const observer = new ResizeObserver(scheduleMatchedWidthUpdate);\n    observer.observe(referenceElement);\n\n    return () => {\n      if (resizeAnimationFrame !== undefined) {\n        cancelAnimationFrame(resizeAnimationFrame);\n      }\n      observer.disconnect();\n    };\n  }, [\n    isOpen,\n    popupMatchTriggerWidth,\n    popupMatchTriggerWidthNumber,\n    targetElement,\n  ]);\n\n  const child = children as React.ReactElement;\n  const childProps = child.props || {};\n  const referenceProps = getReferenceProps();\n  const updateMatchedWidthFromElement = useCallback(\n    (element: HTMLElement) => {\n      if (!popupMatchTriggerWidth) {\n        return;\n      }\n\n      setMatchedTriggerWidth((currentWidth) => {\n        const nextWidth =\n          popupMatchTriggerWidthNumber !== undefined\n            ? popupMatchTriggerWidthNumber\n            : element.getBoundingClientRect().width;\n        return currentWidth === nextWidth ? currentWidth : nextWidth;\n      });\n    },\n    [popupMatchTriggerWidth, popupMatchTriggerWidthNumber],\n  );\n  const modifiedChild = cloneElement(child, {\n    ...childProps,\n    disabled,\n    // ref: (node: HTMLDivElement) => refs.setReference(node),\n    ...referenceProps,\n    onClick: (event: React.MouseEvent<HTMLElement>) => {\n      updateMatchedWidthFromElement(event.currentTarget);\n      childProps.onClick?.(event);\n      const { onClick: referenceOnClick } = referenceProps;\n      if (typeof referenceOnClick === 'function') {\n        referenceOnClick(event);\n      }\n    },\n  });\n\n  const onMenuItemClick = useCallback(\n    (info: MenuInfo) => {\n      if (menu?.onClick) {\n        menu.onClick(info);\n      }\n      if (info.keepOpen) {\n        document.body.classList.remove('ald-dropdown-root-closing');\n        return;\n      }\n      onChangeOpen(false);\n    },\n    [menu, onChangeOpen],\n  );\n\n  const menuInstance = useMemo(() => {\n    const menuProps = {\n      ...menu,\n      items: menu?.items || [],\n      menuStyle: {\n        ...(popupMatchTriggerWidth\n          ? {\n              width: '100%',\n              minWidth: 0,\n              maxWidth: 'none',\n            }\n          : undefined),\n        ...menu?.menuStyle,\n      },\n      onBeforeLeafItemClick: isOpenControlled ? undefined : markRootClosing,\n      rootClosing: isAnimatingOut,\n    };\n    return (\n      <Menu\n        {...menuProps}\n        onClick={onMenuItemClick}\n        externalOverflow={allowOverlap}\n      />\n    );\n  }, [\n    allowOverlap,\n    isAnimatingOut,\n    isOpenControlled,\n    markRootClosing,\n    menu,\n    onMenuItemClick,\n    popupMatchTriggerWidth,\n  ]);\n\n  const popupElement = useMemo(() => {\n    return typeof dropdownRender === 'function'\n      ? dropdownRender(menuInstance)\n      : menuInstance;\n  }, [dropdownRender, menuInstance]);\n\n  const mergedMatchedTriggerWidth =\n    popupMatchTriggerWidthNumber ?? matchedTriggerWidth;\n  const matchedOverlayStyle =\n    popupMatchTriggerWidth && mergedMatchedTriggerWidth !== undefined\n      ? ({\n          width: `${mergedMatchedTriggerWidth}px`,\n          minWidth: 0,\n        } satisfies React.CSSProperties)\n      : undefined;\n\n  const matchedSurfaceStyle = popupMatchTriggerWidth\n    ? ({\n        width: '100%',\n        minWidth: 0,\n        maxWidth: 'none',\n      } satisfies React.CSSProperties)\n    : undefined;\n\n  const floatingSide = resolvePlacementSide(String(floatingPlacement));\n  const shouldKeepMounted = !destroyPopupOnHide || isOpen || isAnimatingOut;\n  const isPositionReady = x !== null && y !== null;\n  const overlayHidden =\n    (!isOpen && !isAnimatingOut) || (isOpen && !isPositionReady);\n  const resolvedFloatingStyles = isAnimatingOut\n    ? lastResolvedFloatingStylesRef.current ?? floatingStyles\n    : floatingStyles;\n  const resolvedFloatingSide = isAnimatingOut\n    ? lastResolvedSideRef.current\n    : floatingSide;\n\n  if (isOpen && isPositionReady) {\n    currentFloatingStylesRef.current = { ...floatingStyles };\n    currentFloatingSideRef.current = floatingSide;\n    lastResolvedFloatingStylesRef.current = { ...floatingStyles };\n    lastResolvedSideRef.current = floatingSide;\n  }\n\n  // 渲染浮动内容到自定义容器\n  const renderFloatingContent = useCallback(() => {\n    const surface = (\n      <div\n        {...(isAnimatingOut ? {} : getFloatingProps())}\n        className={cn(\n          'ald-dropdown-overlay',\n          // tw-outline-none：FloatingFocusManager 打开时会聚焦浮层容器，不抑制 outline 会渲染出蓝色焦点框\n          'tw-pointer-events-auto tw-z-[1001] tw-max-w-none tw-outline-none',\n          overlayClassName,\n          { 'ald-dropdown-overlay-hidden': overlayHidden },\n        )}\n        ref={refs.setFloating}\n        style={{\n          zIndex: popupZIndex,\n          ...resolvedFloatingStyles,\n          ...matchedOverlayStyle,\n          ...overlayStyle,\n        }}\n        aria-labelledby={headingId}\n      >\n        <div\n          className={cn(\n            'ald-dropdown-surface',\n            'tw-flex tw-flex-col tw-items-start tw-text-sm',\n          )}\n          style={{\n            ...matchedSurfaceStyle,\n            ...overlayInnerStyle,\n          }}\n          data-state={isOpen ? 'open' : 'closed'}\n          data-side={resolvedFloatingSide}\n        >\n          {popupElement}\n        </div>\n      </div>\n    );\n\n    const popupElem =\n      isAnimatingOut && !isOpen ? (\n        surface\n      ) : (\n        <FloatingFocusManager\n          context={context}\n          modal={false}\n          initialFocus={initialFocus}\n          closeOnFocusOut={closeOnFocusOut}\n        >\n          {surface}\n        </FloatingFocusManager>\n      );\n\n    const popupContainer =\n      typeof getPopupContainer === 'function'\n        ? getPopupContainer()\n        : document.body;\n    return ReactDOM.createPortal(popupElem, popupContainer);\n  }, [\n    context,\n    getFloatingProps,\n    getPopupContainer,\n    headingId,\n    popupElement,\n    refs.setFloating,\n    overlayClassName,\n    overlayStyle,\n    overlayInnerStyle,\n    matchedOverlayStyle,\n    matchedSurfaceStyle,\n    popupZIndex,\n    overlayHidden,\n    isAnimatingOut,\n    isOpen,\n    initialFocus,\n    closeOnFocusOut,\n    resolvedFloatingSide,\n    resolvedFloatingStyles,\n  ]);\n\n  const popup = shouldKeepMounted ? renderFloatingContent() : null;\n  const { setReference } = refs;\n\n  const setTargetRef = useCallback(\n    (node: HTMLElement | null) => {\n      if (node) {\n        // display: contents 元素没有 box model，getBoundingClientRect() 返回零值\n        // 需要获取实际的第一个子元素作为 floating-ui 的参考元素\n        const target =\n          node.style.display === 'contents'\n            ? (node.firstElementChild as HTMLElement) || node\n            : node;\n        setTargetElement((currentTarget) =>\n          currentTarget === target ? currentTarget : target,\n        );\n        setReference(target);\n      } else {\n        setTargetElement(null);\n        setReference(null);\n      }\n    },\n    [setReference],\n  );\n\n  const content = (\n    <>\n      <span ref={setTargetRef} style={{ display: 'contents' }}>\n        {modifiedChild}\n      </span>\n      <FloatingNode id={nodeId}>{popup}</FloatingNode>\n    </>\n  );\n\n  const parentId = useFloatingParentNodeId();\n  if (!parentId) {\n    return <FloatingTree>{content}</FloatingTree>;\n  }\n\n  return content;\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/Dropdown/index.tsx"],"sourcesContent":["import './dropdown.css';\nimport {\n  FloatingFocusManager,\n  FloatingFocusManagerProps,\n  FloatingNode,\n  FloatingTree,\n  OffsetOptions,\n  UseHoverProps,\n  autoUpdate,\n  flip,\n  offset,\n  safePolygon,\n  shift,\n  size,\n  useClick,\n  useDismiss,\n  useFloating,\n  useFloatingNodeId,\n  useFloatingParentNodeId,\n  useHover,\n  useId,\n  useInteractions,\n  useRole,\n  useTransitionStyles,\n} from '@floating-ui/react';\nimport type { Placement } from '@floating-ui/react';\nimport { useMemoizedFn } from 'ahooks';\nimport { cn } from '../lib/utils';\nimport React, {\n  cloneElement,\n  useCallback,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport ReactDOM from 'react-dom';\nimport Menu, { MenuInfo, MenuProps } from '../Menu';\nimport { useFloatingPopupZIndex } from '../_utils/floatingLayer';\nimport { ensureWeakRefFallback } from '../_utils/weakRefFallback';\n\nconst OVERLAY_TRANSITION_MS = 200;\n\nensureWeakRefFallback();\n\nfunction resolvePlacementSide(\n  currentPlacement: string,\n): 'top' | 'bottom' | 'left' | 'right' {\n  const [side] = currentPlacement.split('-');\n  if (\n    side === 'top' ||\n    side === 'bottom' ||\n    side === 'left' ||\n    side === 'right'\n  ) {\n    return side;\n  }\n  if (currentPlacement.startsWith('top')) {\n    return 'top';\n  }\n  if (currentPlacement.startsWith('bottom')) {\n    return 'bottom';\n  }\n  if (currentPlacement.startsWith('left')) {\n    return 'left';\n  }\n  if (currentPlacement.startsWith('right')) {\n    return 'right';\n  }\n  return 'bottom';\n}\n\nfunction parsePopupMatchWidth(value: unknown): number | undefined {\n  if (typeof value === 'number') {\n    return value;\n  }\n\n  if (typeof value === 'string' && value.trim() !== '') {\n    const parsedValue = Number(value);\n    return Number.isNaN(parsedValue) ? undefined : parsedValue;\n  }\n\n  return undefined;\n}\n\nexport type ActionType = 'hover' | 'click';\nexport type PlacementType =\n  | 'top'\n  | 'bottom'\n  | 'left'\n  | 'right'\n  | 'top-start'\n  | 'top-end'\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'left-start'\n  | 'left-end'\n  | 'right-start'\n  | 'right-end'\n  // Legacy antd-style placement names\n  | 'topLeft'\n  | 'topRight'\n  | 'bottomLeft'\n  | 'bottomRight';\n\nconst legacyPlacementMap = {\n  topLeft: 'top-start',\n  topRight: 'top-end',\n  bottomLeft: 'bottom-start',\n  bottomRight: 'bottom-end',\n} as const;\n\nfunction normalizePlacement(placement: PlacementType): Placement {\n  return (legacyPlacementMap[placement as keyof typeof legacyPlacementMap] ??\n    placement) as Placement;\n}\n\nexport interface IDropdownProps {\n  children: React.ReactNode;\n  /**\n   * @description 菜单弹出位置的偏移量\n   */\n  offset?: OffsetOptions;\n  /**\n   * @description 关闭后是否销毁 Dropdown\n   * @default false\n   */\n  destroyPopupOnHide?: boolean;\n  /**\n   * @description 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位\n   * @default () => document.body\n   */\n  getPopupContainer?: () => HTMLElement;\n  /**\n   * @description 菜单\n   * @type Menu | () => Menu\n   * @default -\n   */\n  menu?: MenuProps;\n  // /**\n  //  * @description 菜单\n  //  * @type Menu | () => Menu\n  //  * @default -\n  //  */\n  // menu?: ReactElement | (() => ReactElement);\n  /**\n   * @description 下拉根元素的类名称\n   * @default -\n   */\n  overlayClassName?: string;\n  /**\n   * @description 菜单弹出位置\n   * @default bottomLeft\n   */\n  placement?: PlacementType;\n  /**\n   * @description 触发下拉的行为\n   * @type ActionType, 其中 ActionType 为 'hover' | 'click' | 'contextMenu';\n   * @default click\n   */\n  trigger?: ActionType | ActionType[];\n  /**\n   * @description 菜单是否显示\n   * @default -\n   */\n  open?: boolean;\n  /**\n   * @description 菜单显示状态改变时调用，参数为 open，点击菜单按钮导致的消失不会触发\n   * @default -\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * @description 焦点移出触发元素和浮层时是否关闭 Dropdown\n   * @default true\n   */\n  closeOnFocusOut?: boolean;\n  /**\n   * @description 下拉框外层 overlay 的内联样式（与定位 transform 合并）\n   * @default -\n   */\n  overlayStyle?: React.CSSProperties;\n  /**\n   * @description 下拉框内层 surface 的内联样式。\n   * 用于覆盖 surface 默认约束（默认 min-width:160px、max-width:320px）；\n   * 自定义 dropdownRender 内容若需大于 320px 宽，传 `{ width: 400, maxWidth: 'none' }` 即可。\n   * @default -\n   */\n  overlayInnerStyle?: React.CSSProperties;\n\n  /**\n   * @description 自定义下拉框内容\n   * @default -\n   */\n  dropdownRender?: (menus: React.ReactNode) => React.ReactNode;\n  /**\n   * @description 是否禁用\n   * @default false\n   */\n  // 透传给子元素，antd的dropdown用cloneElement生成dropdown的子元素，劫持了disabled属性，因此如果Dropdown上没有disabled属性，子元素不能获得该属性\n  disabled?: boolean;\n  /**\n   * @description 鼠标移入后延迟显示下拉框的时间，单位为毫秒\n   * @default 0\n   */\n  delay?: UseHoverProps['delay'];\n  /**\n   * @description 是否在下拉框变化的时候自动更新位置\n   * @default false\n   */\n  autoUpdatePos?: boolean;\n  /**\n   * @description 初始化焦点，参照：https://floating-ui.com/docs/floatingfocusmanager#initialfocus\n   */\n  initialFocus?: FloatingFocusManagerProps['initialFocus'];\n\n  /**\n   * @description 菜单是否跟随触发元素宽度\n   * @default false\n   */\n  popupMatchTriggerWidth?: boolean | number;\n  /**\n   * @description 空间不足时自动计算菜单最大高度并启用滚动，启用后 offset 固定为 0\n   * @default false\n   */\n  allowOverlap?: boolean;\n}\n\nfunction hasTrigger(\n  trigger: ActionType | ActionType[],\n  action: ActionType,\n): boolean {\n  return Array.isArray(trigger) ? trigger.includes(action) : trigger === action;\n}\n\nexport default function Dropdown(props: IDropdownProps) {\n  const {\n    children,\n    destroyPopupOnHide = true,\n    getPopupContainer,\n    menu,\n    overlayClassName,\n    placement = 'bottom-start',\n    trigger = 'click',\n    open,\n    onOpenChange = () => {},\n    closeOnFocusOut = true,\n    overlayStyle,\n    overlayInnerStyle,\n    dropdownRender,\n    disabled,\n    offset: offsetProps = 4,\n    delay = 0,\n    autoUpdatePos = false,\n    // 默认不自动 focus\n    initialFocus = -1,\n    popupMatchTriggerWidth = false,\n    allowOverlap = false,\n  } = props;\n  const [isOpen, setIsOpen] = useState<boolean>(open || false);\n  const lastResolvedFloatingStylesRef = useRef<React.CSSProperties | null>(\n    null,\n  );\n  const lastResolvedSideRef = useRef<'top' | 'bottom' | 'left' | 'right'>(\n    resolvePlacementSide(placement),\n  );\n  const currentFloatingStylesRef = useRef<React.CSSProperties | null>(null);\n  const currentFloatingSideRef = useRef<'top' | 'bottom' | 'left' | 'right'>(\n    resolvePlacementSide(placement),\n  );\n  const [targetElement, setTargetElement] = useState<HTMLElement | null>(null);\n  const popupMatchTriggerWidthNumber = parsePopupMatchWidth(\n    popupMatchTriggerWidth,\n  );\n  const [matchedTriggerWidth, setMatchedTriggerWidth] = useState<\n    number | undefined\n  >(popupMatchTriggerWidthNumber);\n  const popupZIndex = useFloatingPopupZIndex();\n\n  const onOpenChangeFn = useMemoizedFn(onOpenChange);\n  const isOpenControlled = open !== undefined;\n\n  const markRootClosing = useCallback(() => {\n    document.body.classList.add('ald-dropdown-root-closing');\n    lastResolvedFloatingStylesRef.current =\n      currentFloatingStylesRef.current ?? lastResolvedFloatingStylesRef.current;\n    lastResolvedSideRef.current =\n      currentFloatingSideRef.current ?? lastResolvedSideRef.current;\n  }, []);\n\n  useLayoutEffect(() => {\n    if (isOpenControlled) {\n      setIsOpen(!!open);\n    }\n  }, [isOpenControlled, open]);\n\n  const onChangeOpen = useCallback(\n    (newOpen: boolean) => {\n      if (!isOpenControlled) {\n        setIsOpen(newOpen);\n      }\n      onOpenChangeFn(newOpen);\n    },\n    [isOpenControlled, onOpenChangeFn],\n  );\n\n  const nodeId = useFloatingNodeId();\n  const normalizedPlacement = normalizePlacement(placement);\n  const {\n    refs,\n    floatingStyles,\n    context,\n    placement: floatingPlacement,\n    x,\n    y,\n  } = useFloating({\n    nodeId,\n    placement: normalizedPlacement,\n    open: isOpen,\n    onOpenChange: onChangeOpen,\n    middleware: [\n      offset(allowOverlap ? 0 : offsetProps),\n      flip({\n        altBoundary: true,\n        padding: 8,\n        fallbackAxisSideDirection: 'end',\n        ...(allowOverlap && { fallbackStrategy: 'bestFit' }),\n      }),\n      shift({\n        padding: 8,\n        ...(allowOverlap && { mainAxis: true }),\n      }),\n      size({\n        altBoundary: true,\n        ...(allowOverlap && { padding: 8 }),\n        apply({ availableHeight, elements }) {\n          if (!allowOverlap) {\n            return;\n          }\n\n          Object.assign(elements.floating.style, {\n            maxHeight: `${Math.max(100, availableHeight)}px`,\n            overflowY: 'auto',\n          });\n        },\n      }),\n    ],\n    whileElementsMounted: autoUpdatePos ? autoUpdate : undefined,\n  });\n  const { isMounted, styles: transitionStyles } = useTransitionStyles(context, {\n    duration: OVERLAY_TRANSITION_MS,\n    initial: {\n      opacity: 0,\n      transform: 'var(--ald-dropdown-enter-transform)',\n    },\n    close: {\n      opacity: 0,\n      transform: 'var(--ald-dropdown-exit-transform)',\n    },\n    common: {\n      transitionTimingFunction: 'ease-in-out',\n    },\n  });\n  const isAnimatingOut = !isOpen && isMounted;\n\n  useLayoutEffect(() => {\n    if (isAnimatingOut) {\n      document.body.classList.add('ald-dropdown-root-closing');\n    } else {\n      document.body.classList.remove('ald-dropdown-root-closing');\n    }\n\n    return () => {\n      if (isAnimatingOut) {\n        document.body.classList.remove('ald-dropdown-root-closing');\n      }\n    };\n  }, [isAnimatingOut]);\n\n  const click = useClick(context, {\n    enabled: hasTrigger(trigger, 'click'),\n  });\n  const hover = useHover(context, {\n    enabled: hasTrigger(trigger, 'hover'),\n    handleClose: safePolygon({}),\n    delay: delay,\n  });\n  const dismiss = useDismiss(context, {});\n  const role = useRole(context);\n\n  const propsList = useMemo(() => {\n    const res = [dismiss, role];\n\n    if (hasTrigger(trigger, 'hover')) {\n      res.unshift(hover);\n    }\n    if (hasTrigger(trigger, 'click')) {\n      res.unshift(click);\n    }\n    return res;\n  }, [trigger, click, dismiss, role, hover]);\n\n  const { getReferenceProps, getFloatingProps } = useInteractions(propsList);\n\n  const headingId = useId();\n\n  useLayoutEffect(() => {\n    if (!popupMatchTriggerWidth || !isOpen) {\n      setMatchedTriggerWidth(undefined);\n      return;\n    }\n\n    if (popupMatchTriggerWidthNumber !== undefined) {\n      setMatchedTriggerWidth(popupMatchTriggerWidthNumber);\n      return;\n    }\n\n    const referenceElement = targetElement;\n    if (!referenceElement) {\n      return;\n    }\n\n    const updateMatchedWidth = () => {\n      const nextWidth = referenceElement.getBoundingClientRect().width;\n      setMatchedTriggerWidth((currentWidth) =>\n        currentWidth === nextWidth ? currentWidth : nextWidth,\n      );\n    };\n\n    updateMatchedWidth();\n\n    if (typeof ResizeObserver === 'undefined') {\n      window.addEventListener('resize', updateMatchedWidth);\n      return () => {\n        window.removeEventListener('resize', updateMatchedWidth);\n      };\n    }\n\n    let resizeAnimationFrame: number | undefined;\n    const scheduleMatchedWidthUpdate = () => {\n      if (resizeAnimationFrame !== undefined) {\n        cancelAnimationFrame(resizeAnimationFrame);\n      }\n      resizeAnimationFrame = requestAnimationFrame(updateMatchedWidth);\n    };\n\n    const observer = new ResizeObserver(scheduleMatchedWidthUpdate);\n    observer.observe(referenceElement);\n\n    return () => {\n      if (resizeAnimationFrame !== undefined) {\n        cancelAnimationFrame(resizeAnimationFrame);\n      }\n      observer.disconnect();\n    };\n  }, [\n    isOpen,\n    popupMatchTriggerWidth,\n    popupMatchTriggerWidthNumber,\n    targetElement,\n  ]);\n\n  const child = children as React.ReactElement;\n  const childProps = child.props || {};\n  const referenceProps = getReferenceProps();\n  const updateMatchedWidthFromElement = useCallback(\n    (element: HTMLElement) => {\n      if (!popupMatchTriggerWidth) {\n        return;\n      }\n\n      setMatchedTriggerWidth((currentWidth) => {\n        const nextWidth =\n          popupMatchTriggerWidthNumber !== undefined\n            ? popupMatchTriggerWidthNumber\n            : element.getBoundingClientRect().width;\n        return currentWidth === nextWidth ? currentWidth : nextWidth;\n      });\n    },\n    [popupMatchTriggerWidth, popupMatchTriggerWidthNumber],\n  );\n  const modifiedChild = cloneElement(child, {\n    ...childProps,\n    disabled,\n    // ref: (node: HTMLDivElement) => refs.setReference(node),\n    ...referenceProps,\n    onClick: (event: React.MouseEvent<HTMLElement>) => {\n      updateMatchedWidthFromElement(event.currentTarget);\n      childProps.onClick?.(event);\n      const { onClick: referenceOnClick } = referenceProps;\n      if (typeof referenceOnClick === 'function') {\n        referenceOnClick(event);\n      }\n    },\n  });\n\n  const onMenuItemClick = useCallback(\n    (info: MenuInfo) => {\n      if (menu?.onClick) {\n        menu.onClick(info);\n      }\n      if (info.keepOpen) {\n        document.body.classList.remove('ald-dropdown-root-closing');\n        return;\n      }\n      onChangeOpen(false);\n    },\n    [menu, onChangeOpen],\n  );\n\n  const menuInstance = useMemo(() => {\n    const menuProps = {\n      ...menu,\n      items: menu?.items || [],\n      menuStyle: {\n        ...(popupMatchTriggerWidth\n          ? {\n              width: '100%',\n              minWidth: 0,\n              maxWidth: 'none',\n            }\n          : undefined),\n        ...menu?.menuStyle,\n      },\n      onBeforeLeafItemClick: isOpenControlled ? undefined : markRootClosing,\n      rootClosing: isAnimatingOut,\n    };\n    return (\n      <Menu\n        {...menuProps}\n        onClick={onMenuItemClick}\n        externalOverflow={allowOverlap}\n      />\n    );\n  }, [\n    allowOverlap,\n    isAnimatingOut,\n    isOpenControlled,\n    markRootClosing,\n    menu,\n    onMenuItemClick,\n    popupMatchTriggerWidth,\n  ]);\n\n  const popupElement = useMemo(() => {\n    return typeof dropdownRender === 'function'\n      ? dropdownRender(menuInstance)\n      : menuInstance;\n  }, [dropdownRender, menuInstance]);\n\n  const mergedMatchedTriggerWidth =\n    popupMatchTriggerWidthNumber ?? matchedTriggerWidth;\n  const matchedOverlayStyle =\n    popupMatchTriggerWidth && mergedMatchedTriggerWidth !== undefined\n      ? ({\n          width: `${mergedMatchedTriggerWidth}px`,\n          minWidth: 0,\n        } satisfies React.CSSProperties)\n      : undefined;\n\n  const matchedSurfaceStyle = popupMatchTriggerWidth\n    ? ({\n        width: '100%',\n        minWidth: 0,\n        maxWidth: 'none',\n      } satisfies React.CSSProperties)\n    : undefined;\n\n  const floatingSide = resolvePlacementSide(String(floatingPlacement));\n  const shouldKeepMounted = !destroyPopupOnHide || isMounted;\n  const isPositionReady = x !== null && y !== null;\n  const overlayHidden =\n    (!isOpen && !isAnimatingOut) || (isOpen && !isPositionReady);\n  const resolvedFloatingStyles = isAnimatingOut\n    ? lastResolvedFloatingStylesRef.current ?? floatingStyles\n    : floatingStyles;\n  const resolvedFloatingSide = isAnimatingOut\n    ? lastResolvedSideRef.current\n    : floatingSide;\n\n  if (isOpen && isPositionReady) {\n    currentFloatingStylesRef.current = { ...floatingStyles };\n    currentFloatingSideRef.current = floatingSide;\n    lastResolvedFloatingStylesRef.current = { ...floatingStyles };\n    lastResolvedSideRef.current = floatingSide;\n  }\n\n  // 渲染浮动内容到自定义容器\n  const renderFloatingContent = useCallback(() => {\n    const surface = (\n      <div\n        {...(isAnimatingOut ? {} : getFloatingProps())}\n        className={cn(\n          'ald-dropdown-overlay',\n          // tw-outline-none：FloatingFocusManager 打开时会聚焦浮层容器，不抑制 outline 会渲染出蓝色焦点框\n          'tw-pointer-events-auto tw-z-[1001] tw-max-w-none tw-outline-none',\n          overlayClassName,\n          { 'ald-dropdown-overlay-hidden': overlayHidden },\n        )}\n        ref={refs.setFloating}\n        style={{\n          zIndex: popupZIndex,\n          ...resolvedFloatingStyles,\n          ...matchedOverlayStyle,\n          ...overlayStyle,\n        }}\n        aria-labelledby={headingId}\n      >\n        <div\n          className={cn(\n            'ald-dropdown-surface',\n            'tw-flex tw-flex-col tw-items-start tw-text-sm',\n          )}\n          style={{\n            ...matchedSurfaceStyle,\n            ...overlayInnerStyle,\n            ...transitionStyles,\n          }}\n          data-state={isOpen ? 'open' : 'closed'}\n          data-side={resolvedFloatingSide}\n        >\n          {popupElement}\n        </div>\n      </div>\n    );\n\n    const popupElem = (\n      <FloatingFocusManager\n        context={context}\n        disabled={isAnimatingOut}\n        modal={false}\n        initialFocus={initialFocus}\n        closeOnFocusOut={closeOnFocusOut}\n      >\n        {surface}\n      </FloatingFocusManager>\n    );\n\n    const popupContainer =\n      typeof getPopupContainer === 'function'\n        ? getPopupContainer()\n        : document.body;\n    return ReactDOM.createPortal(popupElem, popupContainer);\n  }, [\n    context,\n    getFloatingProps,\n    getPopupContainer,\n    headingId,\n    popupElement,\n    refs.setFloating,\n    overlayClassName,\n    overlayStyle,\n    overlayInnerStyle,\n    matchedOverlayStyle,\n    matchedSurfaceStyle,\n    transitionStyles,\n    popupZIndex,\n    overlayHidden,\n    isAnimatingOut,\n    isOpen,\n    initialFocus,\n    closeOnFocusOut,\n    resolvedFloatingSide,\n    resolvedFloatingStyles,\n  ]);\n\n  const popup = shouldKeepMounted ? renderFloatingContent() : null;\n  const { setReference } = refs;\n\n  const setTargetRef = useCallback(\n    (node: HTMLElement | null) => {\n      if (node) {\n        // display: contents 元素没有 box model，getBoundingClientRect() 返回零值\n        // 需要获取实际的第一个子元素作为 floating-ui 的参考元素\n        const target =\n          node.style.display === 'contents'\n            ? (node.firstElementChild as HTMLElement) || node\n            : node;\n        setTargetElement((currentTarget) =>\n          currentTarget === target ? currentTarget : target,\n        );\n        setReference(target);\n      } else {\n        setTargetElement(null);\n        setReference(null);\n      }\n    },\n    [setReference],\n  );\n\n  const content = (\n    <>\n      <span ref={setTargetRef} style={{ display: 'contents' }}>\n        {modifiedChild}\n      </span>\n      <FloatingNode id={nodeId}>{popup}</FloatingNode>\n    </>\n  );\n\n  const parentId = useFloatingParentNodeId();\n  if (!parentId) {\n    return <FloatingTree>{content}</FloatingTree>;\n  }\n\n  return content;\n}\n"],"mappings":"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"}

package/dist/Input/components/Input/index.js

@@ -54,13 +54,13 @@ var Input = forwardRef((props, ref) => {
 	}) : showCount ? `${currentValue.length}${maxLength ? `/${maxLength}` : ""}` : null;
 	const compactClasses = compactItemClassnames ? cn(!compactItemClassnames["ald-input-compact-first-item"] && "!tw-rounded-l-none", !compactItemClassnames["ald-input-compact-last-item"] && "!tw-rounded-r-none", !compactItemClassnames["ald-input-compact-first-item"] && "-tw-ml-px") : void 0;
 	return /* @__PURE__ */ jsxs("span", {
-		className: cn("ald-input ant-input-affix-wrapper tw-inline-flex tw-w-full tw-items-center tw-bg-[var(--background-default)]", bordered && "tw-rounded-r-75 tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]", !mergedDisabled && [
-			"has-[input:focus-visible]:tw-shadow-[0_0_0_2px_var(--focus-ring)]",
-			"forced-colors:has-[input:focus-visible]:tw-outline",
-			"forced-colors:has-[input:focus-visible]:tw-outline-2",
-			"forced-colors:has-[input:focus-visible]:tw-outline-offset-2",
-			"forced-colors:has-[input:focus-visible]:tw-outline-[Highlight]"
-		], focused && "ant-input-affix-wrapper-focused tw-border-[var(--border-brand-strong)]", !mergedDisabled && !focused && "hover:tw-border-[var(--border-brand-strong)]", `ald-input-${getSizeType(size)}`, "tw-text-typography-body-dense", size === "small" && "tw-h-7", size === "large" && "tw-h-9", (size === "middle" || !size) && "tw-h-8", status === "error" && `ald-input-error tw-border-[var(--border-negative-strong)]`, status === "warning" && `ald-input-warning tw-border-[var(--border-warning-subtle)]`, mergedDisabled && "ald-input-disabled tw-cursor-not-allowed tw-bg-[var(--background-neutral-on-subtle)] tw-text-[var(--content-secondary)]", compactClasses, className),
+		className: cn("ald-input ant-input-affix-wrapper tw-inline-flex tw-w-full tw-items-center tw-bg-[var(--background-default)] tw-transition-[border-color,box-shadow] tw-duration-150 tw-ease-out", bordered && "tw-rounded-r-75 tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]", !mergedDisabled && [
+			"has-[input:focus]:tw-shadow-[inset_0_0_0_1px_var(--focus-ring)]",
+			"forced-colors:has-[input:focus]:tw-outline",
+			"forced-colors:has-[input:focus]:tw-outline-2",
+			"forced-colors:has-[input:focus]:tw-outline-offset-2",
+			"forced-colors:has-[input:focus]:tw-outline-[Highlight]"
+		], focused && "ant-input-affix-wrapper-focused", focused && !status && "!tw-border-[var(--border-brand-strong)]", `ald-input-${getSizeType(size)}`, "tw-text-typography-body-dense", size === "small" && "tw-h-7", size === "large" && "tw-h-9", (size === "middle" || !size) && "tw-h-8", status === "error" && `ald-input-error tw-border-[var(--border-negative-strong)]`, status === "warning" && `ald-input-warning tw-border-[var(--border-warning-subtle)]`, mergedDisabled && "ald-input-disabled tw-cursor-not-allowed tw-bg-[var(--background-neutral-on-subtle)] tw-text-[var(--content-secondary)]", compactClasses, className),
 		style: {
 			...style,
 			width

package/dist/Input/components/Input/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/Input/components/Input/index.tsx"],"sourcesContent":["import React, {\n  ReactNode,\n  forwardRef,\n  useContext,\n  useRef,\n  useState,\n} from 'react';\nimport DisabledContext from '../../../ConfigProvider/DisabledContext';\nimport SizeContext, { SizeType } from '../../../ConfigProvider/sizeContext';\nimport { CloseCircleFill } from '../../../Icon';\nimport { cn } from '../../../lib/utils';\nimport { useCompactItemContext } from '../../../Space/CompactContext';\n\ninterface IShowCountProps {\n  formatter: (args: { count: number; maxLength?: number }) => string;\n}\nexport type TSize = SizeType;\nexport type InputRef = HTMLInputElement & {\n  /** antd v4 compat — points to the underlying <input> element */\n  input?: HTMLInputElement | null;\n};\n\ntype ChangeEventHandler = (e: React.ChangeEvent<HTMLInputElement>) => void;\n\nexport interface IInputProps\n  extends Omit<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    | 'size'\n    | 'prefix'\n    | 'value'\n    | 'defaultValue'\n    | 'onChange'\n    | 'disabled'\n    | 'type'\n    | 'max'\n  > {\n  addonAfter?: ReactNode;\n  addonBefore?: ReactNode;\n  size?: TSize;\n  id?: string;\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  allowClear?: boolean;\n  disabled?: boolean;\n  showCount?: boolean | IShowCountProps;\n  maxLength?: number;\n  minLength?: number;\n  max?: number;\n  value?: string;\n  defaultValue?: string;\n  onPressEnter?: React.KeyboardEventHandler<HTMLInputElement>;\n  onChange?: ChangeEventHandler;\n  className?: string;\n  style?: React.CSSProperties;\n  placeholder?: string;\n  type?: string;\n  bordered?: boolean;\n  status?: 'error' | 'warning' | '';\n  autoComplete?: string;\n  autoFocus?: boolean;\n  readOnly?: boolean;\n  width?: number | string;\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n  onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;\n  onCompositionStart?: React.CompositionEventHandler<HTMLInputElement>;\n  onCompositionEnd?: React.CompositionEventHandler<HTMLInputElement>;\n  /** 透传到内部 input 元素的 data-testid，用于自动化测试定位 */\n  'data-testid'?: string;\n  /** 透传到内部 input 元素的 aria-label，用于可访问性与自动化测试定位 */\n  'aria-label'?: string;\n}\n\nexport function getSizeType(sizeType: TSize): TSize {\n  if (['small', 'middle', 'large'].includes(sizeType || '')) {\n    return sizeType;\n  }\n  return 'middle';\n}\n\nconst Input = forwardRef<InputRef, IInputProps>((props, ref) => {\n  const {\n    size: customSize,\n    className,\n    bordered = true,\n    status,\n    disabled,\n    allowClear,\n    prefix,\n    suffix,\n    addonBefore,\n    addonAfter,\n    showCount,\n    maxLength,\n    minLength,\n    value: controlledValue,\n    defaultValue,\n    onChange,\n    onPressEnter,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    onCompositionStart,\n    onCompositionEnd,\n    placeholder,\n    type,\n    id,\n    autoComplete = 'off',\n    autoFocus,\n    readOnly,\n    width,\n    style,\n    'data-testid': dataTestid,\n    'aria-label': ariaLabel,\n    ...restInputProps\n  } = props;\n\n  const contextDisabled = useContext(DisabledContext);\n  const mergedDisabled = disabled ?? contextDisabled;\n\n  const contentSize = useContext(SizeContext);\n  const { compactSize, compactItemClassnames } =\n    useCompactItemContext('ald-input');\n  const size = customSize || compactSize || contentSize || 'middle';\n\n  const isControlled = 'value' in props;\n  const [innerValue, setInnerValue] = useState(defaultValue ?? '');\n  const currentValue = isControlled ? controlledValue ?? '' : innerValue;\n  const [focused, setFocused] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  React.useImperativeHandle(ref, () => {\n    const el = inputRef.current!;\n    // Expose .input for antd v4 compat (ref.current.input.focus())\n    (el as InputRef).input = el;\n    return el as InputRef;\n  });\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (!isControlled) setInnerValue(e.target.value);\n    onChange?.(e);\n  };\n\n  const handleClear = () => {\n    // 通过原生 input 事件统一触发 React onChange，确保事件契约完整且只回调一次。\n    const nativeEvent = new Event('input', { bubbles: true });\n    if (inputRef.current) {\n      const nativeSetter = Object.getOwnPropertyDescriptor(\n        HTMLInputElement.prototype,\n        'value',\n      )?.set;\n      nativeSetter?.call(inputRef.current, '');\n      inputRef.current.dispatchEvent(nativeEvent);\n    }\n    if (!isControlled) setInnerValue('');\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Enter') onPressEnter?.(e);\n    onKeyDown?.(e);\n  };\n\n  const showClearIcon = allowClear && currentValue && !mergedDisabled;\n\n  const countInfo =\n    showCount && typeof showCount === 'object'\n      ? showCount.formatter({\n          count: currentValue.length,\n          maxLength,\n        })\n      : showCount\n      ? `${currentValue.length}${maxLength ? `/${maxLength}` : ''}`\n      : null;\n\n  // Build compact-mode border-radius and margin overrides\n  const compactClasses = compactItemClassnames\n    ? cn(\n        !compactItemClassnames['ald-input-compact-first-item'] &&\n          '!tw-rounded-l-none',\n        !compactItemClassnames['ald-input-compact-last-item'] &&\n          '!tw-rounded-r-none',\n        !compactItemClassnames['ald-input-compact-first-item'] && '-tw-ml-px',\n      )\n    : undefined;\n\n  return (\n    <span\n      className={cn(\n        // antd 兼容：保留 ant-* class，消费方 CSS 可能依赖该选择器\n        'ald-input ant-input-affix-wrapper tw-inline-flex tw-w-full tw-items-center tw-bg-[var(--background-default)]',\n        bordered &&\n          'tw-rounded-r-75 tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]',\n        !mergedDisabled && [\n          'has-[input:focus-visible]:tw-shadow-[0_0_0_2px_var(--focus-ring)]',\n          'forced-colors:has-[input:focus-visible]:tw-outline',\n          'forced-colors:has-[input:focus-visible]:tw-outline-2',\n          'forced-colors:has-[input:focus-visible]:tw-outline-offset-2',\n          'forced-colors:has-[input:focus-visible]:tw-outline-[Highlight]',\n        ],\n        // antd 兼容：保留 ant-* class，消费方 CSS 可能依赖该选择器\n        // 保留既有 border 状态以维持 antd 兼容；键盘焦点由上方的 Focus State Layer 独立呈现。\n        focused &&\n          'ant-input-affix-wrapper-focused tw-border-[var(--border-brand-strong)]',\n        !mergedDisabled &&\n          !focused &&\n          'hover:tw-border-[var(--border-brand-strong)]',\n        `ald-input-${getSizeType(size)}`,\n        // Typography Foundation: the wrapper owns the approved Body Dense\n        // context for the editable value and placeholder. Count opts into its\n        // approved Caption role below.\n        'tw-text-typography-body-dense',\n        // Component Geometry: height belongs to the Input envelope, not to a\n        // relationship-spacing Primitive.\n        size === 'small' && 'tw-h-7',\n        size === 'large' && 'tw-h-9',\n        (size === 'middle' || !size) && 'tw-h-8',\n        status === 'error' &&\n          `ald-input-error tw-border-[var(--border-negative-strong)]`,\n        status === 'warning' &&\n          `ald-input-warning tw-border-[var(--border-warning-subtle)]`,\n        mergedDisabled &&\n          'ald-input-disabled tw-cursor-not-allowed tw-bg-[var(--background-neutral-on-subtle)] tw-text-[var(--content-secondary)]',\n        compactClasses,\n        className,\n      )}\n      style={{\n        ...style,\n        width,\n      }}\n      onMouseDown={(e) => {\n        // 点击 wrapper 非 input 区域时：\n        // 如果 input 已聚焦 → preventDefault 防止点击 wrapper 导致丢焦\n        // 如果 input 未聚焦 → 不阻止默认行为，让浏览器正常处理 blur 上一个元素\n        if (e.target !== inputRef.current) {\n          if (document.activeElement === inputRef.current) {\n            e.preventDefault();\n          }\n        }\n      }}\n      onMouseUp={(e) => {\n        // 在 mouseUp 时将焦点转发给内部 input（兼容 prefix/suffix/padding 区域的点击）\n        if (e.target !== inputRef.current && inputRef.current) {\n          inputRef.current.focus();\n        }\n      }}\n    >\n      {addonBefore && (\n        <span className=\"ald-input-addon tw-flex tw-shrink-0 tw-items-center tw-self-stretch tw-border-r tw-border-solid tw-border-[var(--border-default)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]\">\n          {addonBefore}\n        </span>\n      )}\n      {/* antd 兼容：保留 ant-input-prefix class，消费方 CSS 可能依赖该选择器 */}\n      {prefix && (\n        <span className=\"ald-input-prefix ant-input-prefix tw-flex tw-shrink-0 tw-items-center tw-pl-2 tw-text-[var(--content-secondary)]\">\n          {prefix}\n        </span>\n      )}\n      {/*\n       * Value Affordance and Text Containment remain Constraint-owned and\n       * Blocked. These shrink guards reserve local Geometry for affordances;\n       * they do not define a spacing Primitive or Mapping.\n       */}\n      <input\n        ref={inputRef}\n        id={id}\n        type={type || 'text'}\n        className=\"tw-min-w-0 tw-flex-1 tw-self-stretch tw-border-0 tw-bg-[var(--action-ghost-normal)] tw-px-2 tw-text-[var(--content-primary)] tw-text-inherit tw-outline-none\"\n        value={currentValue}\n        onChange={handleChange}\n        onBlur={(e) => {\n          setFocused(false);\n          onBlur?.(e);\n        }}\n        onFocus={(e) => {\n          setFocused(true);\n          onFocus?.(e);\n        }}\n        onKeyDown={handleKeyDown}\n        onCompositionStart={onCompositionStart}\n        onCompositionEnd={onCompositionEnd}\n        disabled={mergedDisabled}\n        placeholder={placeholder}\n        maxLength={maxLength}\n        minLength={minLength}\n        autoComplete={autoComplete}\n        autoFocus={autoFocus}\n        readOnly={readOnly}\n        spellCheck={false}\n        data-testid={dataTestid}\n        aria-label={ariaLabel}\n        {...restInputProps}\n      />\n      {showClearIcon && (\n        <span\n          // antd 兼容：保留 ant-* class，消费方 CSS 可能依赖该选择器\n          className=\"ald-input-clear ant-input-clear-icon tw-flex tw-shrink-0 tw-cursor-pointer tw-items-center tw-pr-1\"\n          onClick={handleClear}\n        >\n          <CloseCircleFill size={16} color=\"var(--content-secondary)\" />\n        </span>\n      )}\n      {/* antd 兼容：保留 ant-input-suffix class，消费方 CSS 可能依赖该选择器 */}\n      {suffix && (\n        <span className=\"ald-input-suffix ant-input-suffix tw-flex tw-shrink-0 tw-items-center tw-pr-2 tw-text-[var(--content-secondary)]\">\n          {suffix}\n        </span>\n      )}\n      {countInfo && (\n        <span className=\"ald-input-count tw-shrink-0 tw-pr-2 tw-text-[var(--content-tertiary)] tw-text-typography-caption\">\n          {countInfo}\n        </span>\n      )}\n      {addonAfter && (\n        <span className=\"ald-input-addon tw-border-l tw-border-solid tw-border-[var(--border-default)] tw-px-2 tw-text-[var(--content-secondary)]\">\n          {addonAfter}\n        </span>\n      )}\n    </span>\n  );\n});\n\nexport default Input;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/Input/components/Input/index.tsx"],"sourcesContent":["import React, {\n  ReactNode,\n  forwardRef,\n  useContext,\n  useRef,\n  useState,\n} from 'react';\nimport DisabledContext from '../../../ConfigProvider/DisabledContext';\nimport SizeContext, { SizeType } from '../../../ConfigProvider/sizeContext';\nimport { CloseCircleFill } from '../../../Icon';\nimport { cn } from '../../../lib/utils';\nimport { useCompactItemContext } from '../../../Space/CompactContext';\n\ninterface IShowCountProps {\n  formatter: (args: { count: number; maxLength?: number }) => string;\n}\nexport type TSize = SizeType;\nexport type InputRef = HTMLInputElement & {\n  /** antd v4 compat — points to the underlying <input> element */\n  input?: HTMLInputElement | null;\n};\n\ntype ChangeEventHandler = (e: React.ChangeEvent<HTMLInputElement>) => void;\n\nexport interface IInputProps\n  extends Omit<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    | 'size'\n    | 'prefix'\n    | 'value'\n    | 'defaultValue'\n    | 'onChange'\n    | 'disabled'\n    | 'type'\n    | 'max'\n  > {\n  addonAfter?: ReactNode;\n  addonBefore?: ReactNode;\n  size?: TSize;\n  id?: string;\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  allowClear?: boolean;\n  disabled?: boolean;\n  showCount?: boolean | IShowCountProps;\n  maxLength?: number;\n  minLength?: number;\n  max?: number;\n  value?: string;\n  defaultValue?: string;\n  onPressEnter?: React.KeyboardEventHandler<HTMLInputElement>;\n  onChange?: ChangeEventHandler;\n  className?: string;\n  style?: React.CSSProperties;\n  placeholder?: string;\n  type?: string;\n  bordered?: boolean;\n  status?: 'error' | 'warning' | '';\n  autoComplete?: string;\n  autoFocus?: boolean;\n  readOnly?: boolean;\n  width?: number | string;\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n  onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;\n  onCompositionStart?: React.CompositionEventHandler<HTMLInputElement>;\n  onCompositionEnd?: React.CompositionEventHandler<HTMLInputElement>;\n  /** 透传到内部 input 元素的 data-testid，用于自动化测试定位 */\n  'data-testid'?: string;\n  /** 透传到内部 input 元素的 aria-label，用于可访问性与自动化测试定位 */\n  'aria-label'?: string;\n}\n\nexport function getSizeType(sizeType: TSize): TSize {\n  if (['small', 'middle', 'large'].includes(sizeType || '')) {\n    return sizeType;\n  }\n  return 'middle';\n}\n\nconst Input = forwardRef<InputRef, IInputProps>((props, ref) => {\n  const {\n    size: customSize,\n    className,\n    bordered = true,\n    status,\n    disabled,\n    allowClear,\n    prefix,\n    suffix,\n    addonBefore,\n    addonAfter,\n    showCount,\n    maxLength,\n    minLength,\n    value: controlledValue,\n    defaultValue,\n    onChange,\n    onPressEnter,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    onCompositionStart,\n    onCompositionEnd,\n    placeholder,\n    type,\n    id,\n    autoComplete = 'off',\n    autoFocus,\n    readOnly,\n    width,\n    style,\n    'data-testid': dataTestid,\n    'aria-label': ariaLabel,\n    ...restInputProps\n  } = props;\n\n  const contextDisabled = useContext(DisabledContext);\n  const mergedDisabled = disabled ?? contextDisabled;\n\n  const contentSize = useContext(SizeContext);\n  const { compactSize, compactItemClassnames } =\n    useCompactItemContext('ald-input');\n  const size = customSize || compactSize || contentSize || 'middle';\n\n  const isControlled = 'value' in props;\n  const [innerValue, setInnerValue] = useState(defaultValue ?? '');\n  const currentValue = isControlled ? controlledValue ?? '' : innerValue;\n  const [focused, setFocused] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  React.useImperativeHandle(ref, () => {\n    const el = inputRef.current!;\n    // Expose .input for antd v4 compat (ref.current.input.focus())\n    (el as InputRef).input = el;\n    return el as InputRef;\n  });\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (!isControlled) setInnerValue(e.target.value);\n    onChange?.(e);\n  };\n\n  const handleClear = () => {\n    // 通过原生 input 事件统一触发 React onChange，确保事件契约完整且只回调一次。\n    const nativeEvent = new Event('input', { bubbles: true });\n    if (inputRef.current) {\n      const nativeSetter = Object.getOwnPropertyDescriptor(\n        HTMLInputElement.prototype,\n        'value',\n      )?.set;\n      nativeSetter?.call(inputRef.current, '');\n      inputRef.current.dispatchEvent(nativeEvent);\n    }\n    if (!isControlled) setInnerValue('');\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Enter') onPressEnter?.(e);\n    onKeyDown?.(e);\n  };\n\n  const showClearIcon = allowClear && currentValue && !mergedDisabled;\n\n  const countInfo =\n    showCount && typeof showCount === 'object'\n      ? showCount.formatter({\n          count: currentValue.length,\n          maxLength,\n        })\n      : showCount\n      ? `${currentValue.length}${maxLength ? `/${maxLength}` : ''}`\n      : null;\n\n  // Build compact-mode border-radius and margin overrides\n  const compactClasses = compactItemClassnames\n    ? cn(\n        !compactItemClassnames['ald-input-compact-first-item'] &&\n          '!tw-rounded-l-none',\n        !compactItemClassnames['ald-input-compact-last-item'] &&\n          '!tw-rounded-r-none',\n        !compactItemClassnames['ald-input-compact-first-item'] && '-tw-ml-px',\n      )\n    : undefined;\n\n  return (\n    <span\n      className={cn(\n        // antd 兼容：保留 ant-* class，消费方 CSS 可能依赖该选择器\n        'ald-input ant-input-affix-wrapper tw-inline-flex tw-w-full tw-items-center tw-bg-[var(--background-default)] tw-transition-[border-color,box-shadow] tw-duration-150 tw-ease-out',\n        bordered &&\n          'tw-rounded-r-75 tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]',\n        !mergedDisabled && [\n          'has-[input:focus]:tw-shadow-[inset_0_0_0_1px_var(--focus-ring)]',\n          'forced-colors:has-[input:focus]:tw-outline',\n          'forced-colors:has-[input:focus]:tw-outline-2',\n          'forced-colors:has-[input:focus]:tw-outline-offset-2',\n          'forced-colors:has-[input:focus]:tw-outline-[Highlight]',\n        ],\n        // antd 兼容：保留 ant-* class，消费方 CSS 可能依赖该选择器\n        // 保留既有 border 状态以维持 antd 兼容；焦点由上方的 Focus State Layer 独立呈现。\n        focused && 'ant-input-affix-wrapper-focused',\n        focused && !status && '!tw-border-[var(--border-brand-strong)]',\n        `ald-input-${getSizeType(size)}`,\n        // Typography Foundation: the wrapper owns the approved Body Dense\n        // context for the editable value and placeholder. Count opts into its\n        // approved Caption role below.\n        'tw-text-typography-body-dense',\n        // Component Geometry: height belongs to the Input envelope, not to a\n        // relationship-spacing Primitive.\n        size === 'small' && 'tw-h-7',\n        size === 'large' && 'tw-h-9',\n        (size === 'middle' || !size) && 'tw-h-8',\n        status === 'error' &&\n          `ald-input-error tw-border-[var(--border-negative-strong)]`,\n        status === 'warning' &&\n          `ald-input-warning tw-border-[var(--border-warning-subtle)]`,\n        mergedDisabled &&\n          'ald-input-disabled tw-cursor-not-allowed tw-bg-[var(--background-neutral-on-subtle)] tw-text-[var(--content-secondary)]',\n        compactClasses,\n        className,\n      )}\n      style={{\n        ...style,\n        width,\n      }}\n      onMouseDown={(e) => {\n        // 点击 wrapper 非 input 区域时：\n        // 如果 input 已聚焦 → preventDefault 防止点击 wrapper 导致丢焦\n        // 如果 input 未聚焦 → 不阻止默认行为，让浏览器正常处理 blur 上一个元素\n        if (e.target !== inputRef.current) {\n          if (document.activeElement === inputRef.current) {\n            e.preventDefault();\n          }\n        }\n      }}\n      onMouseUp={(e) => {\n        // 在 mouseUp 时将焦点转发给内部 input（兼容 prefix/suffix/padding 区域的点击）\n        if (e.target !== inputRef.current && inputRef.current) {\n          inputRef.current.focus();\n        }\n      }}\n    >\n      {addonBefore && (\n        <span className=\"ald-input-addon tw-flex tw-shrink-0 tw-items-center tw-self-stretch tw-border-r tw-border-solid tw-border-[var(--border-default)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]\">\n          {addonBefore}\n        </span>\n      )}\n      {/* antd 兼容：保留 ant-input-prefix class，消费方 CSS 可能依赖该选择器 */}\n      {prefix && (\n        <span className=\"ald-input-prefix ant-input-prefix tw-flex tw-shrink-0 tw-items-center tw-pl-2 tw-text-[var(--content-secondary)]\">\n          {prefix}\n        </span>\n      )}\n      {/*\n       * Value Affordance and Text Containment remain Constraint-owned and\n       * Blocked. These shrink guards reserve local Geometry for affordances;\n       * they do not define a spacing Primitive or Mapping.\n       */}\n      <input\n        ref={inputRef}\n        id={id}\n        type={type || 'text'}\n        className=\"tw-min-w-0 tw-flex-1 tw-self-stretch tw-border-0 tw-bg-[var(--action-ghost-normal)] tw-px-2 tw-text-[var(--content-primary)] tw-text-inherit tw-outline-none\"\n        value={currentValue}\n        onChange={handleChange}\n        onBlur={(e) => {\n          setFocused(false);\n          onBlur?.(e);\n        }}\n        onFocus={(e) => {\n          setFocused(true);\n          onFocus?.(e);\n        }}\n        onKeyDown={handleKeyDown}\n        onCompositionStart={onCompositionStart}\n        onCompositionEnd={onCompositionEnd}\n        disabled={mergedDisabled}\n        placeholder={placeholder}\n        maxLength={maxLength}\n        minLength={minLength}\n        autoComplete={autoComplete}\n        autoFocus={autoFocus}\n        readOnly={readOnly}\n        spellCheck={false}\n        data-testid={dataTestid}\n        aria-label={ariaLabel}\n        {...restInputProps}\n      />\n      {showClearIcon && (\n        <span\n          // antd 兼容：保留 ant-* class，消费方 CSS 可能依赖该选择器\n          className=\"ald-input-clear ant-input-clear-icon tw-flex tw-shrink-0 tw-cursor-pointer tw-items-center tw-pr-1\"\n          onClick={handleClear}\n        >\n          <CloseCircleFill size={16} color=\"var(--content-secondary)\" />\n        </span>\n      )}\n      {/* antd 兼容：保留 ant-input-suffix class，消费方 CSS 可能依赖该选择器 */}\n      {suffix && (\n        <span className=\"ald-input-suffix ant-input-suffix tw-flex tw-shrink-0 tw-items-center tw-pr-2 tw-text-[var(--content-secondary)]\">\n          {suffix}\n        </span>\n      )}\n      {countInfo && (\n        <span className=\"ald-input-count tw-shrink-0 tw-pr-2 tw-text-[var(--content-tertiary)] tw-text-typography-caption\">\n          {countInfo}\n        </span>\n      )}\n      {addonAfter && (\n        <span className=\"ald-input-addon tw-border-l tw-border-solid tw-border-[var(--border-default)] tw-px-2 tw-text-[var(--content-secondary)]\">\n          {addonAfter}\n        </span>\n      )}\n    </span>\n  );\n});\n\nexport default Input;\n"],"mappings":"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"}

package/dist/Input/components/TextArea/index.js

@@ -33,12 +33,13 @@ var TextArea_default = forwardRef((props, ref) => {
 	const minRows = typeof autoSize === "object" ? autoSize.minRows : void 0;
 	const maxRows = typeof autoSize === "object" ? autoSize.maxRows : void 0;
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn("ald-input ald-input-textarea tw-relative", `ald-input-textarea-${getSizeType(size)}`, isBordered && "tw-rounded-r-75 tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]", !mergedDisabled && [
-			"has-[textarea:focus-visible]:tw-shadow-[0_0_0_2px_var(--focus-ring)]",
-			"forced-colors:has-[textarea:focus-visible]:tw-outline",
-			"forced-colors:has-[textarea:focus-visible]:tw-outline-2",
-			"forced-colors:has-[textarea:focus-visible]:tw-outline-offset-2",
-			"forced-colors:has-[textarea:focus-visible]:tw-outline-[Highlight]"
+		className: cn("ald-input ald-input-textarea tw-relative tw-transition-[border-color,box-shadow] tw-duration-150 tw-ease-out", `ald-input-textarea-${getSizeType(size)}`, isBordered && "tw-rounded-r-75 tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]", !mergedDisabled && [
+			"has-[textarea:focus]:!tw-border-[var(--border-brand-strong)]",
+			"has-[textarea:focus]:tw-shadow-[inset_0_0_0_1px_var(--focus-ring)]",
+			"forced-colors:has-[textarea:focus]:tw-outline",
+			"forced-colors:has-[textarea:focus]:tw-outline-2",
+			"forced-colors:has-[textarea:focus]:tw-outline-offset-2",
+			"forced-colors:has-[textarea:focus]:tw-outline-[Highlight]"
 		], mergedDisabled && "ald-input-disabled tw-opacity-50", className),
 		style,
 		children: [

package/dist/Input/components/TextArea/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/Input/components/TextArea/index.tsx"],"sourcesContent":["import React, { forwardRef, useContext, useRef, useState } from 'react';\nimport DisabledContext from '../../../ConfigProvider/DisabledContext';\nimport SizeContext from '../../../ConfigProvider/sizeContext';\nimport { CloseCircleFill } from '../../../Icon';\nimport { cn } from '../../../lib/utils';\nimport { TSize, getSizeType } from '../Input';\n\nexport type TextAreaRef = HTMLTextAreaElement;\n\nexport interface ITextAreaProps\n  extends Omit<\n    React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n    'size' | 'value' | 'defaultValue' | 'onChange' | 'disabled' | 'rows'\n  > {\n  autoFocus?: boolean;\n  allowClear?: boolean;\n  autoSize?: boolean | { minRows?: number; maxRows?: number };\n  defaultValue?: string;\n  maxLength?: number;\n  showCount?:\n    | boolean\n    | { formatter: (args: { count: number; maxLength?: number }) => string };\n  value?: string;\n  onPressEnter?: React.KeyboardEventHandler<HTMLTextAreaElement>;\n  onResize?: (size: { width: number; height: number }) => void;\n  border?: boolean;\n  bordered?: boolean;\n  className?: string;\n  size?: TSize;\n  disabled?: boolean;\n  placeholder?: string;\n  rows?: number;\n  onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  onBlur?: React.FocusEventHandler<HTMLTextAreaElement>;\n  onFocus?: React.FocusEventHandler<HTMLTextAreaElement>;\n  onKeyDown?: React.KeyboardEventHandler<HTMLTextAreaElement>;\n  onCompositionStart?: React.CompositionEventHandler<HTMLTextAreaElement>;\n  onCompositionEnd?: React.CompositionEventHandler<HTMLTextAreaElement>;\n  style?: React.CSSProperties;\n}\n\nexport default forwardRef<TextAreaRef, ITextAreaProps>((props, ref) => {\n  const {\n    bordered,\n    border,\n    size: customSize,\n    disabled,\n    className = '',\n    allowClear = false,\n    value: controlledValue,\n    defaultValue,\n    onChange,\n    onPressEnter,\n    maxLength,\n    showCount,\n    autoSize,\n    placeholder,\n    rows,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    onCompositionStart,\n    onCompositionEnd,\n    style,\n    ...restTextAreaProps\n  } = props;\n\n  const isBordered = bordered ?? border ?? true;\n\n  const contextDisabled = useContext(DisabledContext);\n  const mergedDisabled = disabled ?? contextDisabled;\n\n  const contentSize = useContext(SizeContext);\n  const size = customSize || contentSize || 'middle';\n  const isControlled = 'value' in props;\n  const [innerValue, setInnerValue] = useState(defaultValue ?? '');\n  const currentValue = isControlled ? controlledValue ?? '' : innerValue;\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n  React.useImperativeHandle(ref, () => textareaRef.current!);\n\n  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    if (!isControlled) setInnerValue(e.target.value);\n    onChange?.(e);\n  };\n\n  const handleClear = () => {\n    if (!isControlled) setInnerValue('');\n    onChange?.({\n      target: { value: '' },\n    } as React.ChangeEvent<HTMLTextAreaElement>);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n    if (e.key === 'Enter') onPressEnter?.(e);\n    onKeyDown?.(e);\n  };\n\n  const minRows = typeof autoSize === 'object' ? autoSize.minRows : undefined;\n  const maxRows = typeof autoSize === 'object' ? autoSize.maxRows : undefined;\n\n  return (\n    <div\n      className={cn(\n        'ald-input ald-input-textarea tw-relative',\n        `ald-input-textarea-${getSizeType(size)}`,\n        isBordered &&\n          'tw-rounded-r-75 tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]',\n        !mergedDisabled && [\n          'has-[textarea:focus-visible]:tw-shadow-[0_0_0_2px_var(--focus-ring)]',\n          'forced-colors:has-[textarea:focus-visible]:tw-outline',\n          'forced-colors:has-[textarea:focus-visible]:tw-outline-2',\n          'forced-colors:has-[textarea:focus-visible]:tw-outline-offset-2',\n          'forced-colors:has-[textarea:focus-visible]:tw-outline-[Highlight]',\n        ],\n        mergedDisabled && 'ald-input-disabled tw-opacity-50',\n        className,\n      )}\n      style={style}\n    >\n      <textarea\n        ref={textareaRef}\n        className=\"tw-w-full tw-resize-y tw-border-0 tw-bg-[var(--action-ghost-normal)] tw-px-3 tw-py-2 tw-text-[var(--content-primary)] tw-outline-none tw-text-typography-body-dense\"\n        value={currentValue}\n        onChange={handleChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyDown={handleKeyDown}\n        onCompositionStart={onCompositionStart}\n        onCompositionEnd={onCompositionEnd}\n        disabled={mergedDisabled}\n        placeholder={placeholder}\n        maxLength={maxLength}\n        rows={rows || (minRows ?? 3)}\n        spellCheck={false}\n        autoComplete=\"off\"\n        {...restTextAreaProps}\n        style={{\n          minHeight: minRows ? `${minRows * 22}px` : undefined,\n          maxHeight: maxRows ? `${maxRows * 22}px` : undefined,\n        }}\n      />\n      {allowClear && currentValue && !mergedDisabled && (\n        <span\n          className=\"tw-absolute tw-right-2 tw-top-2 tw-cursor-pointer\"\n          onClick={handleClear}\n        >\n          <CloseCircleFill size={16} color=\"var(--content-secondary)\" />\n        </span>\n      )}\n      {showCount && (\n        <div className=\"tw-px-2 tw-pb-1 tw-text-right tw-text-[var(--content-tertiary)] tw-text-typography-caption\">\n          {typeof showCount === 'object'\n            ? showCount.formatter({ count: currentValue.length, maxLength })\n            : `${currentValue.length}${maxLength ? `/${maxLength}` : ''}`}\n        </div>\n      )}\n    </div>\n  );\n});\n"],"mappings":";;;;;;;;AAyCA,IAAA,mBAAe,YAAyC,OAAO,QAAQ;CACrE,MAAM,EACJ,UACA,QACA,MAAM,YACN,UACA,YAAY,IACZ,aAAa,OACb,OAAO,iBACP,cACA,UACA,cACA,WACA,WACA,UACA,aACA,MACA,QACA,SACA,WACA,oBACA,kBACA,OACA,GAAG,sBACD;CAEJ,MAAM,aAAa,YAAY,UAAU;CAEzC,MAAM,kBAAkB,WAAW,gBAAgB;CACnD,MAAM,iBAAiB,YAAY;CAEnC,MAAM,cAAc,WAAW,YAAY;CAC3C,MAAM,OAAO,cAAc,eAAe;CAC1C,MAAM,eAAe,WAAW;CAChC,MAAM,CAAC,YAAY,iBAAiB,SAAS,gBAAgB,GAAG;CAChE,MAAM,eAAe,eAAe,mBAAmB,KAAK;CAC5D,MAAM,cAAc,OAA4B,KAAK;AAErD,OAAM,oBAAoB,WAAW,YAAY,QAAS;CAE1D,MAAM,gBAAgB,MAA8C;AAClE,MAAI,CAAC,aAAc,eAAc,EAAE,OAAO,MAAM;AAChD,aAAW,EAAE;;CAGf,MAAM,oBAAoB;AACxB,MAAI,CAAC,aAAc,eAAc,GAAG;AACpC,aAAW,EACT,QAAQ,EAAE,OAAO,IAAI,EACtB,CAA2C;;CAG9C,MAAM,iBAAiB,MAAgD;AACrE,MAAI,EAAE,QAAQ,QAAS,gBAAe,EAAE;AACxC,cAAY,EAAE;;CAGhB,MAAM,UAAU,OAAO,aAAa,WAAW,SAAS,UAAU;CAClE,MAAM,UAAU,OAAO,aAAa,WAAW,SAAS,UAAU;AAElE,QACE,qBAAC,OAAD;EACE,WAAW,GACT,4CACA,sBAAsB,YAAY,KAAK,IACvC,cACE,sFACF,CAAC,kBAAkB;GACjB;GACA;GACA;GACA;GACA;GACD,EACD,kBAAkB,oCAClB,UACD;EACM;YAhBT;GAkBE,oBAAC,YAAD;IACE,KAAK;IACL,WAAU;IACV,OAAO;IACP,UAAU;IACF;IACC;IACT,WAAW;IACS;IACF;IAClB,UAAU;IACG;IACF;IACX,MAAM,SAAS,WAAW;IAC1B,YAAY;IACZ,cAAa;IACb,GAAI;IACJ,OAAO;KACL,WAAW,UAAU,GAAG,UAAU,GAAG,MAAM;KAC3C,WAAW,UAAU,GAAG,UAAU,GAAG,MAAM;KAC5C;IACD,CAAA;GACD,cAAc,gBAAgB,CAAC,kBAC9B,oBAAC,QAAD;IACE,WAAU;IACV,SAAS;cAET,oBAAC,MAAD;KAAiB,MAAM;KAAI,OAAM;KAA6B,CAAA;IACzD,CAAA;GAER,aACC,oBAAC,OAAD;IAAK,WAAU;cACZ,OAAO,cAAc,WAClB,UAAU,UAAU;KAAE,OAAO,aAAa;KAAQ;KAAW,CAAC,GAC9D,GAAG,aAAa,SAAS,YAAY,IAAI,cAAc;IACvD,CAAA;GAEJ;;EAER"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/Input/components/TextArea/index.tsx"],"sourcesContent":["import React, { forwardRef, useContext, useRef, useState } from 'react';\nimport DisabledContext from '../../../ConfigProvider/DisabledContext';\nimport SizeContext from '../../../ConfigProvider/sizeContext';\nimport { CloseCircleFill } from '../../../Icon';\nimport { cn } from '../../../lib/utils';\nimport { TSize, getSizeType } from '../Input';\n\nexport type TextAreaRef = HTMLTextAreaElement;\n\nexport interface ITextAreaProps\n  extends Omit<\n    React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n    'size' | 'value' | 'defaultValue' | 'onChange' | 'disabled' | 'rows'\n  > {\n  autoFocus?: boolean;\n  allowClear?: boolean;\n  autoSize?: boolean | { minRows?: number; maxRows?: number };\n  defaultValue?: string;\n  maxLength?: number;\n  showCount?:\n    | boolean\n    | { formatter: (args: { count: number; maxLength?: number }) => string };\n  value?: string;\n  onPressEnter?: React.KeyboardEventHandler<HTMLTextAreaElement>;\n  onResize?: (size: { width: number; height: number }) => void;\n  border?: boolean;\n  bordered?: boolean;\n  className?: string;\n  size?: TSize;\n  disabled?: boolean;\n  placeholder?: string;\n  rows?: number;\n  onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  onBlur?: React.FocusEventHandler<HTMLTextAreaElement>;\n  onFocus?: React.FocusEventHandler<HTMLTextAreaElement>;\n  onKeyDown?: React.KeyboardEventHandler<HTMLTextAreaElement>;\n  onCompositionStart?: React.CompositionEventHandler<HTMLTextAreaElement>;\n  onCompositionEnd?: React.CompositionEventHandler<HTMLTextAreaElement>;\n  style?: React.CSSProperties;\n}\n\nexport default forwardRef<TextAreaRef, ITextAreaProps>((props, ref) => {\n  const {\n    bordered,\n    border,\n    size: customSize,\n    disabled,\n    className = '',\n    allowClear = false,\n    value: controlledValue,\n    defaultValue,\n    onChange,\n    onPressEnter,\n    maxLength,\n    showCount,\n    autoSize,\n    placeholder,\n    rows,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    onCompositionStart,\n    onCompositionEnd,\n    style,\n    ...restTextAreaProps\n  } = props;\n\n  const isBordered = bordered ?? border ?? true;\n\n  const contextDisabled = useContext(DisabledContext);\n  const mergedDisabled = disabled ?? contextDisabled;\n\n  const contentSize = useContext(SizeContext);\n  const size = customSize || contentSize || 'middle';\n  const isControlled = 'value' in props;\n  const [innerValue, setInnerValue] = useState(defaultValue ?? '');\n  const currentValue = isControlled ? controlledValue ?? '' : innerValue;\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n  React.useImperativeHandle(ref, () => textareaRef.current!);\n\n  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    if (!isControlled) setInnerValue(e.target.value);\n    onChange?.(e);\n  };\n\n  const handleClear = () => {\n    if (!isControlled) setInnerValue('');\n    onChange?.({\n      target: { value: '' },\n    } as React.ChangeEvent<HTMLTextAreaElement>);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n    if (e.key === 'Enter') onPressEnter?.(e);\n    onKeyDown?.(e);\n  };\n\n  const minRows = typeof autoSize === 'object' ? autoSize.minRows : undefined;\n  const maxRows = typeof autoSize === 'object' ? autoSize.maxRows : undefined;\n\n  return (\n    <div\n      className={cn(\n        'ald-input ald-input-textarea tw-relative tw-transition-[border-color,box-shadow] tw-duration-150 tw-ease-out',\n        `ald-input-textarea-${getSizeType(size)}`,\n        isBordered &&\n          'tw-rounded-r-75 tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]',\n        !mergedDisabled && [\n          'has-[textarea:focus]:!tw-border-[var(--border-brand-strong)]',\n          'has-[textarea:focus]:tw-shadow-[inset_0_0_0_1px_var(--focus-ring)]',\n          'forced-colors:has-[textarea:focus]:tw-outline',\n          'forced-colors:has-[textarea:focus]:tw-outline-2',\n          'forced-colors:has-[textarea:focus]:tw-outline-offset-2',\n          'forced-colors:has-[textarea:focus]:tw-outline-[Highlight]',\n        ],\n        mergedDisabled && 'ald-input-disabled tw-opacity-50',\n        className,\n      )}\n      style={style}\n    >\n      <textarea\n        ref={textareaRef}\n        className=\"tw-w-full tw-resize-y tw-border-0 tw-bg-[var(--action-ghost-normal)] tw-px-3 tw-py-2 tw-text-[var(--content-primary)] tw-outline-none tw-text-typography-body-dense\"\n        value={currentValue}\n        onChange={handleChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyDown={handleKeyDown}\n        onCompositionStart={onCompositionStart}\n        onCompositionEnd={onCompositionEnd}\n        disabled={mergedDisabled}\n        placeholder={placeholder}\n        maxLength={maxLength}\n        rows={rows || (minRows ?? 3)}\n        spellCheck={false}\n        autoComplete=\"off\"\n        {...restTextAreaProps}\n        style={{\n          minHeight: minRows ? `${minRows * 22}px` : undefined,\n          maxHeight: maxRows ? `${maxRows * 22}px` : undefined,\n        }}\n      />\n      {allowClear && currentValue && !mergedDisabled && (\n        <span\n          className=\"tw-absolute tw-right-2 tw-top-2 tw-cursor-pointer\"\n          onClick={handleClear}\n        >\n          <CloseCircleFill size={16} color=\"var(--content-secondary)\" />\n        </span>\n      )}\n      {showCount && (\n        <div className=\"tw-px-2 tw-pb-1 tw-text-right tw-text-[var(--content-tertiary)] tw-text-typography-caption\">\n          {typeof showCount === 'object'\n            ? showCount.formatter({ count: currentValue.length, maxLength })\n            : `${currentValue.length}${maxLength ? `/${maxLength}` : ''}`}\n        </div>\n      )}\n    </div>\n  );\n});\n"],"mappings":";;;;;;;;AAyCA,IAAA,mBAAe,YAAyC,OAAO,QAAQ;CACrE,MAAM,EACJ,UACA,QACA,MAAM,YACN,UACA,YAAY,IACZ,aAAa,OACb,OAAO,iBACP,cACA,UACA,cACA,WACA,WACA,UACA,aACA,MACA,QACA,SACA,WACA,oBACA,kBACA,OACA,GAAG,sBACD;CAEJ,MAAM,aAAa,YAAY,UAAU;CAEzC,MAAM,kBAAkB,WAAW,gBAAgB;CACnD,MAAM,iBAAiB,YAAY;CAEnC,MAAM,cAAc,WAAW,YAAY;CAC3C,MAAM,OAAO,cAAc,eAAe;CAC1C,MAAM,eAAe,WAAW;CAChC,MAAM,CAAC,YAAY,iBAAiB,SAAS,gBAAgB,GAAG;CAChE,MAAM,eAAe,eAAe,mBAAmB,KAAK;CAC5D,MAAM,cAAc,OAA4B,KAAK;AAErD,OAAM,oBAAoB,WAAW,YAAY,QAAS;CAE1D,MAAM,gBAAgB,MAA8C;AAClE,MAAI,CAAC,aAAc,eAAc,EAAE,OAAO,MAAM;AAChD,aAAW,EAAE;;CAGf,MAAM,oBAAoB;AACxB,MAAI,CAAC,aAAc,eAAc,GAAG;AACpC,aAAW,EACT,QAAQ,EAAE,OAAO,IAAI,EACtB,CAA2C;;CAG9C,MAAM,iBAAiB,MAAgD;AACrE,MAAI,EAAE,QAAQ,QAAS,gBAAe,EAAE;AACxC,cAAY,EAAE;;CAGhB,MAAM,UAAU,OAAO,aAAa,WAAW,SAAS,UAAU;CAClE,MAAM,UAAU,OAAO,aAAa,WAAW,SAAS,UAAU;AAElE,QACE,qBAAC,OAAD;EACE,WAAW,GACT,gHACA,sBAAsB,YAAY,KAAK,IACvC,cACE,sFACF,CAAC,kBAAkB;GACjB;GACA;GACA;GACA;GACA;GACA;GACD,EACD,kBAAkB,oCAClB,UACD;EACM;YAjBT;GAmBE,oBAAC,YAAD;IACE,KAAK;IACL,WAAU;IACV,OAAO;IACP,UAAU;IACF;IACC;IACT,WAAW;IACS;IACF;IAClB,UAAU;IACG;IACF;IACX,MAAM,SAAS,WAAW;IAC1B,YAAY;IACZ,cAAa;IACb,GAAI;IACJ,OAAO;KACL,WAAW,UAAU,GAAG,UAAU,GAAG,MAAM;KAC3C,WAAW,UAAU,GAAG,UAAU,GAAG,MAAM;KAC5C;IACD,CAAA;GACD,cAAc,gBAAgB,CAAC,kBAC9B,oBAAC,QAAD;IACE,WAAU;IACV,SAAS;cAET,oBAAC,MAAD;KAAiB,MAAM;KAAI,OAAM;KAA6B,CAAA;IACzD,CAAA;GAER,aACC,oBAAC,OAAD;IAAK,WAAU;cACZ,OAAO,cAAc,WAClB,UAAU,UAAU;KAAE,OAAO,aAAa;KAAQ;KAAW,CAAC,GAC9D,GAAG,aAAa,SAAS,YAAY,IAAI,cAAc;IACvD,CAAA;GAEJ;;EAER"}

package/dist/InputNumber/index.js

@@ -84,12 +84,13 @@ function InputNumber(props) {
 	const inputBox = /* @__PURE__ */ jsxs("div", {
 		"data-testid": !hasAddon ? dataTestId : void 0,
 		"aria-label": !hasAddon ? ariaLabel : void 0,
-		className: cn("ald-input-number tw-inline-flex tw-w-[90px] tw-min-w-0 tw-items-center tw-overflow-hidden", bordered && "tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]", mergedDisabled ? "ald-input-number-disabled tw-cursor-not-allowed tw-bg-[var(--background-neutral-on-subtle)] tw-text-[var(--content-secondary)]" : "tw-bg-[var(--background-default)] tw-text-[var(--content-primary)] hover:tw-border-[var(--border-brand-strong)]", !hasAddon && sizeClasses, hasAddon ? "tw-h-auto tw-flex-1 tw-self-stretch tw-rounded-none" : radiusClasses, status === "error" && "tw-border-[var(--border-negative-strong)]", status === "warning" && "tw-border-[var(--border-warning-subtle)]", !mergedDisabled && [
-			"has-[input:focus-visible]:tw-shadow-[0_0_0_2px_var(--focus-ring)]",
-			"forced-colors:has-[input:focus-visible]:tw-outline",
-			"forced-colors:has-[input:focus-visible]:tw-outline-2",
-			"forced-colors:has-[input:focus-visible]:tw-outline-offset-2",
-			"forced-colors:has-[input:focus-visible]:tw-outline-[Highlight]"
+		className: cn("ald-input-number tw-inline-flex tw-w-[90px] tw-min-w-0 tw-items-center tw-overflow-hidden tw-transition-[border-color,box-shadow] tw-duration-150 tw-ease-out", bordered && "tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]", mergedDisabled ? "ald-input-number-disabled tw-cursor-not-allowed tw-bg-[var(--background-neutral-on-subtle)] tw-text-[var(--content-secondary)]" : "tw-bg-[var(--background-default)] tw-text-[var(--content-primary)] hover:tw-border-[var(--border-brand-strong)]", !hasAddon && sizeClasses, hasAddon ? "tw-h-auto tw-flex-1 tw-self-stretch tw-rounded-none" : radiusClasses, status === "error" && "tw-border-[var(--border-negative-strong)]", status === "warning" && "tw-border-[var(--border-warning-subtle)]", !mergedDisabled && [
+			!status && "has-[input:focus]:!tw-border-[var(--border-brand-strong)]",
+			"has-[input:focus]:tw-shadow-[inset_0_0_0_1px_var(--focus-ring)]",
+			"forced-colors:has-[input:focus]:tw-outline",
+			"forced-colors:has-[input:focus]:tw-outline-2",
+			"forced-colors:has-[input:focus]:tw-outline-offset-2",
+			"forced-colors:has-[input:focus]:tw-outline-[Highlight]"
 		], !hasAddon && className),
 		style: !hasAddon ? style : void 0,
 		children: [prefix && /* @__PURE__ */ jsx("span", {

package/dist/InputNumber/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/InputNumber/index.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport SizeContext from '../ConfigProvider/sizeContext';\nimport { cn } from '../lib/utils';\nimport { IInputNumberProps } from './type';\n\nexport default function InputNumber(props: IInputNumberProps) {\n  const {\n    className,\n    disabled: customDisabled,\n    size: customSize,\n    status,\n    value: controlledValue,\n    defaultValue,\n    min = -Infinity,\n    max = Infinity,\n    step = 1,\n    precision,\n    onChange,\n    onPressEnter,\n    onBlur,\n    onFocus,\n    formatter,\n    parser,\n    prefix,\n    addonBefore,\n    addonAfter,\n    placeholder,\n    autoFocus,\n    bordered = true,\n    keyboard = true,\n    readonly: readOnly,\n    style,\n    id,\n    'data-testid': dataTestId,\n    'aria-label': ariaLabel,\n  } = props;\n\n  const contentSize = useContext(SizeContext);\n  const size = customSize || contentSize || 'middle';\n  const disabled = useContext(DisabledContext);\n  const mergedDisabled = customDisabled ?? disabled;\n\n  const isControlled = 'value' in props;\n  const [innerValue, setInnerValue] = useState<number | null | undefined>(\n    defaultValue ?? null,\n  );\n  const currentValue = isControlled ? controlledValue : innerValue;\n\n  const [inputStr, setInputStr] = useState(\n    currentValue !== null && currentValue !== undefined\n      ? String(currentValue)\n      : '',\n  );\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    if (currentValue !== null && currentValue !== undefined) {\n      setInputStr(String(currentValue));\n    } else {\n      setInputStr('');\n    }\n  }, [currentValue]);\n\n  const clamp = useCallback(\n    (val: number) => {\n      let v = Math.max(min, Math.min(max, val));\n      if (precision !== undefined) {\n        v = Number(v.toFixed(precision));\n      }\n      return v;\n    },\n    [min, max, precision],\n  );\n\n  const updateValue = useCallback(\n    (newVal: number | null) => {\n      const clamped = newVal !== null ? clamp(newVal) : null;\n      if (!isControlled) setInnerValue(clamped);\n      onChange?.(clamped);\n    },\n    [clamp, isControlled, onChange],\n  );\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const raw = e.target.value;\n    setInputStr(raw);\n    if (raw === '') {\n      // 清空立即同步到 value，对齐 antd 行为。\n      // 否则消费方\"清空后直接点确定\"（未 blur 触发 handleBlur 的 null 兜底）拿到的\n      // 仍是旧值，把已清空的筛选条件错误带进 query（被 release-2.3_test 周期实例\n      // 更多浮窗实测复现）。\n      updateValue(null);\n      return;\n    }\n    if (raw === '-') return;\n    const parsed = parser ? parser(raw) : Number(raw);\n    if (!isNaN(parsed)) {\n      updateValue(parsed);\n    }\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    if (inputStr === '' || inputStr === '-') {\n      updateValue(null);\n      setInputStr('');\n    } else {\n      const parsed = parser ? parser(inputStr) : Number(inputStr);\n      if (!isNaN(parsed)) {\n        const clamped = clamp(parsed);\n        updateValue(clamped);\n        setInputStr(String(clamped));\n      }\n    }\n    onBlur?.(e);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Enter') {\n      onPressEnter?.(e);\n    }\n    if (!keyboard) return;\n    const numStep = typeof step === 'string' ? Number(step) : step;\n    if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      updateValue(clamp((currentValue ?? 0) + numStep));\n    } else if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      updateValue(clamp((currentValue ?? 0) - numStep));\n    }\n  };\n\n  const displayValue = formatter\n    ? formatter(currentValue ?? undefined, {\n        userTyping: document.activeElement === inputRef.current,\n        input: inputStr,\n      })\n    : inputStr;\n\n  const hasAddon = addonBefore || addonAfter;\n\n  const sizeClasses = cn(\n    size === 'large' && 'ald-input-number-large tw-h-9 tw-text-base',\n    size === 'small' && 'ald-input-number-small tw-h-7 tw-text-xs',\n    size !== 'large' &&\n      size !== 'small' &&\n      'ald-input-number-middle tw-h-8 tw-text-sm',\n  );\n\n  const radiusClasses = cn(\n    size === 'large' && 'tw-rounded-[8px]',\n    size === 'small' && 'tw-rounded-[4px]',\n    size !== 'large' && size !== 'small' && 'tw-rounded-[6px]',\n  );\n\n  const inputBox = (\n    <div\n      data-testid={!hasAddon ? dataTestId : undefined}\n      aria-label={!hasAddon ? ariaLabel : undefined}\n      className={cn(\n        // 默认宽度 90px 与 antd InputNumber 对齐：input 上 size={1} 会让 intrinsic\n        // 宽度坍缩到 1 字符，若 wrapper 也不给宽度，整个组件在 flex / inline 上下\n        // 文里就只剩 ~9px。消费方可通过 className（`w-[xxx]`）或 style 覆盖。\n        'ald-input-number tw-inline-flex tw-w-[90px] tw-min-w-0 tw-items-center tw-overflow-hidden',\n        bordered &&\n          'tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]',\n        mergedDisabled\n          ? 'ald-input-number-disabled tw-cursor-not-allowed tw-bg-[var(--background-neutral-on-subtle)] tw-text-[var(--content-secondary)]'\n          : 'tw-bg-[var(--background-default)] tw-text-[var(--content-primary)] hover:tw-border-[var(--border-brand-strong)]',\n        !hasAddon && sizeClasses,\n        hasAddon\n          ? 'tw-h-auto tw-flex-1 tw-self-stretch tw-rounded-none'\n          : radiusClasses,\n        status === 'error' && 'tw-border-[var(--border-negative-strong)]',\n        status === 'warning' && 'tw-border-[var(--border-warning-subtle)]',\n        // Focus State Layer belongs to the field envelope, while the input\n        // remains the native focus owner. It intentionally does not share\n        // status, hover, or disabled styling and does not affect Geometry.\n        !mergedDisabled && [\n          'has-[input:focus-visible]:tw-shadow-[0_0_0_2px_var(--focus-ring)]',\n          'forced-colors:has-[input:focus-visible]:tw-outline',\n          'forced-colors:has-[input:focus-visible]:tw-outline-2',\n          'forced-colors:has-[input:focus-visible]:tw-outline-offset-2',\n          'forced-colors:has-[input:focus-visible]:tw-outline-[Highlight]',\n        ],\n        !hasAddon && className,\n      )}\n      style={!hasAddon ? style : undefined}\n    >\n      {prefix && (\n        <span className=\"tw-px-2 tw-text-[var(--content-secondary)]\">\n          {prefix}\n        </span>\n      )}\n      <input\n        ref={inputRef}\n        id={id}\n        type=\"text\"\n        inputMode=\"numeric\"\n        // size=1 让 <input> 的 intrinsic 宽度坍缩到 1 个字符，\n        // 在 flex 父容器中按 width / flex-1 受控，避免默认 size=20 把 inline-flex 外层撑出 ~150px 内容宽度。\n        size={1}\n        className={cn(\n          // Typography Foundation: editable numeric content and its placeholder\n          // consume the same approved Body Dense contract as Input. Prefix and\n          // add-on surfaces remain outside this Typography ownership.\n          'tw-min-w-0 tw-flex-1 tw-border-0 tw-bg-[var(--action-ghost-normal)] tw-px-[7px] tw-text-inherit tw-outline-none tw-text-typography-body-dense',\n          mergedDisabled &&\n            'tw-cursor-not-allowed tw-text-[var(--content-secondary)]',\n        )}\n        value={displayValue}\n        onChange={handleChange}\n        onBlur={handleBlur}\n        onFocus={onFocus}\n        onKeyDown={handleKeyDown}\n        disabled={mergedDisabled}\n        readOnly={readOnly}\n        autoFocus={autoFocus}\n        placeholder={placeholder}\n      />\n    </div>\n  );\n\n  if (!hasAddon) return inputBox;\n\n  return (\n    <div\n      data-testid={dataTestId}\n      aria-label={ariaLabel}\n      className={cn(\n        // 自然宽 = 内部 inputBox 默认 90px + addonBefore/After 内容宽。inline-flex\n        // 让外层按内容宽呈现，不再 `tw-w-full` 强吞 flex 父级剩余空间——后者会把\n        // 同 flex 行的 Slider 挤成 0 宽（看板\"图形宽度\"行只剩 thumb 圆点的根因）。\n        // `tw-min-w-0` 让本身作为 flex item 时受消费方 `flex-basis` / `width`\n        // 真正约束——默认 `min-width: auto = min-content` 会被内部 input(90px) +\n        // addon 撑到 ~126px，覆盖消费方的 flex-basis。内部 inputBox 已 `tw-min-w-0\n        // tw-overflow-hidden`，被约束后内容会按 input flex-1 收缩，不会溢出。\n        // 消费方需要撑满显式加 `tw-w-full` className，需要更窄/更宽直接覆盖宽度。\n        'ald-input-number-group tw-inline-flex tw-min-w-0 tw-items-stretch',\n        sizeClasses,\n        radiusClasses,\n        mergedDisabled && 'ald-input-number-disabled',\n        className,\n      )}\n      style={style}\n    >\n      {addonBefore && (\n        <span\n          className={cn(\n            'ald-input-number-addon tw-flex tw-shrink-0 tw-items-center tw-border tw-border-r-0 tw-border-solid tw-border-[var(--border-neutral-subtle)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]',\n            size === 'large' && 'tw-rounded-l-[8px]',\n            size === 'small' && 'tw-rounded-l-[4px]',\n            size !== 'large' && size !== 'small' && 'tw-rounded-l-[6px]',\n          )}\n        >\n          {addonBefore}\n        </span>\n      )}\n      {inputBox}\n      {addonAfter && (\n        <span\n          className={cn(\n            'ald-input-number-addon tw-flex tw-shrink-0 tw-items-center tw-border tw-border-l-0 tw-border-solid tw-border-[var(--border-neutral-subtle)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]',\n            size === 'large' && 'tw-rounded-r-[8px]',\n            size === 'small' && 'tw-rounded-r-[4px]',\n            size !== 'large' && size !== 'small' && 'tw-rounded-r-[6px]',\n          )}\n        >\n          {addonAfter}\n        </span>\n      )}\n    </div>\n  );\n}\n\nexport type { IInputNumberProps };\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/InputNumber/index.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport SizeContext from '../ConfigProvider/sizeContext';\nimport { cn } from '../lib/utils';\nimport { IInputNumberProps } from './type';\n\nexport default function InputNumber(props: IInputNumberProps) {\n  const {\n    className,\n    disabled: customDisabled,\n    size: customSize,\n    status,\n    value: controlledValue,\n    defaultValue,\n    min = -Infinity,\n    max = Infinity,\n    step = 1,\n    precision,\n    onChange,\n    onPressEnter,\n    onBlur,\n    onFocus,\n    formatter,\n    parser,\n    prefix,\n    addonBefore,\n    addonAfter,\n    placeholder,\n    autoFocus,\n    bordered = true,\n    keyboard = true,\n    readonly: readOnly,\n    style,\n    id,\n    'data-testid': dataTestId,\n    'aria-label': ariaLabel,\n  } = props;\n\n  const contentSize = useContext(SizeContext);\n  const size = customSize || contentSize || 'middle';\n  const disabled = useContext(DisabledContext);\n  const mergedDisabled = customDisabled ?? disabled;\n\n  const isControlled = 'value' in props;\n  const [innerValue, setInnerValue] = useState<number | null | undefined>(\n    defaultValue ?? null,\n  );\n  const currentValue = isControlled ? controlledValue : innerValue;\n\n  const [inputStr, setInputStr] = useState(\n    currentValue !== null && currentValue !== undefined\n      ? String(currentValue)\n      : '',\n  );\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    if (currentValue !== null && currentValue !== undefined) {\n      setInputStr(String(currentValue));\n    } else {\n      setInputStr('');\n    }\n  }, [currentValue]);\n\n  const clamp = useCallback(\n    (val: number) => {\n      let v = Math.max(min, Math.min(max, val));\n      if (precision !== undefined) {\n        v = Number(v.toFixed(precision));\n      }\n      return v;\n    },\n    [min, max, precision],\n  );\n\n  const updateValue = useCallback(\n    (newVal: number | null) => {\n      const clamped = newVal !== null ? clamp(newVal) : null;\n      if (!isControlled) setInnerValue(clamped);\n      onChange?.(clamped);\n    },\n    [clamp, isControlled, onChange],\n  );\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const raw = e.target.value;\n    setInputStr(raw);\n    if (raw === '') {\n      // 清空立即同步到 value，对齐 antd 行为。\n      // 否则消费方\"清空后直接点确定\"（未 blur 触发 handleBlur 的 null 兜底）拿到的\n      // 仍是旧值，把已清空的筛选条件错误带进 query（被 release-2.3_test 周期实例\n      // 更多浮窗实测复现）。\n      updateValue(null);\n      return;\n    }\n    if (raw === '-') return;\n    const parsed = parser ? parser(raw) : Number(raw);\n    if (!isNaN(parsed)) {\n      updateValue(parsed);\n    }\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    if (inputStr === '' || inputStr === '-') {\n      updateValue(null);\n      setInputStr('');\n    } else {\n      const parsed = parser ? parser(inputStr) : Number(inputStr);\n      if (!isNaN(parsed)) {\n        const clamped = clamp(parsed);\n        updateValue(clamped);\n        setInputStr(String(clamped));\n      }\n    }\n    onBlur?.(e);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Enter') {\n      onPressEnter?.(e);\n    }\n    if (!keyboard) return;\n    const numStep = typeof step === 'string' ? Number(step) : step;\n    if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      updateValue(clamp((currentValue ?? 0) + numStep));\n    } else if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      updateValue(clamp((currentValue ?? 0) - numStep));\n    }\n  };\n\n  const displayValue = formatter\n    ? formatter(currentValue ?? undefined, {\n        userTyping: document.activeElement === inputRef.current,\n        input: inputStr,\n      })\n    : inputStr;\n\n  const hasAddon = addonBefore || addonAfter;\n\n  const sizeClasses = cn(\n    size === 'large' && 'ald-input-number-large tw-h-9 tw-text-base',\n    size === 'small' && 'ald-input-number-small tw-h-7 tw-text-xs',\n    size !== 'large' &&\n      size !== 'small' &&\n      'ald-input-number-middle tw-h-8 tw-text-sm',\n  );\n\n  const radiusClasses = cn(\n    size === 'large' && 'tw-rounded-[8px]',\n    size === 'small' && 'tw-rounded-[4px]',\n    size !== 'large' && size !== 'small' && 'tw-rounded-[6px]',\n  );\n\n  const inputBox = (\n    <div\n      data-testid={!hasAddon ? dataTestId : undefined}\n      aria-label={!hasAddon ? ariaLabel : undefined}\n      className={cn(\n        // 默认宽度 90px 与 antd InputNumber 对齐：input 上 size={1} 会让 intrinsic\n        // 宽度坍缩到 1 字符，若 wrapper 也不给宽度，整个组件在 flex / inline 上下\n        // 文里就只剩 ~9px。消费方可通过 className（`w-[xxx]`）或 style 覆盖。\n        'ald-input-number tw-inline-flex tw-w-[90px] tw-min-w-0 tw-items-center tw-overflow-hidden tw-transition-[border-color,box-shadow] tw-duration-150 tw-ease-out',\n        bordered &&\n          'tw-border tw-border-solid tw-border-[var(--border-neutral-subtle)]',\n        mergedDisabled\n          ? 'ald-input-number-disabled tw-cursor-not-allowed tw-bg-[var(--background-neutral-on-subtle)] tw-text-[var(--content-secondary)]'\n          : 'tw-bg-[var(--background-default)] tw-text-[var(--content-primary)] hover:tw-border-[var(--border-brand-strong)]',\n        !hasAddon && sizeClasses,\n        hasAddon\n          ? 'tw-h-auto tw-flex-1 tw-self-stretch tw-rounded-none'\n          : radiusClasses,\n        status === 'error' && 'tw-border-[var(--border-negative-strong)]',\n        status === 'warning' && 'tw-border-[var(--border-warning-subtle)]',\n        // Focus State Layer belongs to the field envelope, while the input\n        // remains the native focus owner. It intentionally does not share\n        // status, hover, or disabled styling and does not affect Geometry.\n        !mergedDisabled && [\n          !status &&\n            'has-[input:focus]:!tw-border-[var(--border-brand-strong)]',\n          'has-[input:focus]:tw-shadow-[inset_0_0_0_1px_var(--focus-ring)]',\n          'forced-colors:has-[input:focus]:tw-outline',\n          'forced-colors:has-[input:focus]:tw-outline-2',\n          'forced-colors:has-[input:focus]:tw-outline-offset-2',\n          'forced-colors:has-[input:focus]:tw-outline-[Highlight]',\n        ],\n        !hasAddon && className,\n      )}\n      style={!hasAddon ? style : undefined}\n    >\n      {prefix && (\n        <span className=\"tw-px-2 tw-text-[var(--content-secondary)]\">\n          {prefix}\n        </span>\n      )}\n      <input\n        ref={inputRef}\n        id={id}\n        type=\"text\"\n        inputMode=\"numeric\"\n        // size=1 让 <input> 的 intrinsic 宽度坍缩到 1 个字符，\n        // 在 flex 父容器中按 width / flex-1 受控，避免默认 size=20 把 inline-flex 外层撑出 ~150px 内容宽度。\n        size={1}\n        className={cn(\n          // Typography Foundation: editable numeric content and its placeholder\n          // consume the same approved Body Dense contract as Input. Prefix and\n          // add-on surfaces remain outside this Typography ownership.\n          'tw-min-w-0 tw-flex-1 tw-border-0 tw-bg-[var(--action-ghost-normal)] tw-px-[7px] tw-text-inherit tw-outline-none tw-text-typography-body-dense',\n          mergedDisabled &&\n            'tw-cursor-not-allowed tw-text-[var(--content-secondary)]',\n        )}\n        value={displayValue}\n        onChange={handleChange}\n        onBlur={handleBlur}\n        onFocus={onFocus}\n        onKeyDown={handleKeyDown}\n        disabled={mergedDisabled}\n        readOnly={readOnly}\n        autoFocus={autoFocus}\n        placeholder={placeholder}\n      />\n    </div>\n  );\n\n  if (!hasAddon) return inputBox;\n\n  return (\n    <div\n      data-testid={dataTestId}\n      aria-label={ariaLabel}\n      className={cn(\n        // 自然宽 = 内部 inputBox 默认 90px + addonBefore/After 内容宽。inline-flex\n        // 让外层按内容宽呈现，不再 `tw-w-full` 强吞 flex 父级剩余空间——后者会把\n        // 同 flex 行的 Slider 挤成 0 宽（看板\"图形宽度\"行只剩 thumb 圆点的根因）。\n        // `tw-min-w-0` 让本身作为 flex item 时受消费方 `flex-basis` / `width`\n        // 真正约束——默认 `min-width: auto = min-content` 会被内部 input(90px) +\n        // addon 撑到 ~126px，覆盖消费方的 flex-basis。内部 inputBox 已 `tw-min-w-0\n        // tw-overflow-hidden`，被约束后内容会按 input flex-1 收缩，不会溢出。\n        // 消费方需要撑满显式加 `tw-w-full` className，需要更窄/更宽直接覆盖宽度。\n        'ald-input-number-group tw-inline-flex tw-min-w-0 tw-items-stretch',\n        sizeClasses,\n        radiusClasses,\n        mergedDisabled && 'ald-input-number-disabled',\n        className,\n      )}\n      style={style}\n    >\n      {addonBefore && (\n        <span\n          className={cn(\n            'ald-input-number-addon tw-flex tw-shrink-0 tw-items-center tw-border tw-border-r-0 tw-border-solid tw-border-[var(--border-neutral-subtle)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]',\n            size === 'large' && 'tw-rounded-l-[8px]',\n            size === 'small' && 'tw-rounded-l-[4px]',\n            size !== 'large' && size !== 'small' && 'tw-rounded-l-[6px]',\n          )}\n        >\n          {addonBefore}\n        </span>\n      )}\n      {inputBox}\n      {addonAfter && (\n        <span\n          className={cn(\n            'ald-input-number-addon tw-flex tw-shrink-0 tw-items-center tw-border tw-border-l-0 tw-border-solid tw-border-[var(--border-neutral-subtle)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]',\n            size === 'large' && 'tw-rounded-r-[8px]',\n            size === 'small' && 'tw-rounded-r-[4px]',\n            size !== 'large' && size !== 'small' && 'tw-rounded-r-[6px]',\n          )}\n        >\n          {addonAfter}\n        </span>\n      )}\n    </div>\n  );\n}\n\nexport type { IInputNumberProps };\n"],"mappings":"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"}

package/dist/Select/Selector/FixedOverflow.d.ts

@@ -7,6 +7,7 @@ export interface FixedOverflowProps<T> {
     }) => React.ReactNode;
     itemKey: (item: T) => React.Key;
     renderRest: (omittedItems: T[]) => React.ReactNode;
+    gap?: number;
     className?: string;
     onVisibleChange?: (count: number) => void;
 }