antd-mobile 5.36.1 → 5.37.0

package/2x/bundle/antd-mobile.umd.development.js

@@ -452,14 +452,24 @@
   function mergeProps(...items) {
     const ret = {};
     items.forEach((item) => {
-      Object.keys(item).forEach((key) => {
-        if (item[key] !== void 0) {
-          ret[key] = item[key];
-        }
-      });
+      if (item) {
+        Object.keys(item).forEach((key) => {
+          if (item[key] !== void 0) {
+            ret[key] = item[key];
+          }
+        });
+      }
     });
     return ret;
   }
+  function mergeProp(defaultProp, ...propList) {
+    for (let i2 = propList.length - 1; i2 >= 0; i2 -= 1) {
+      if (propList[i2] !== void 0) {
+        return propList[i2];
+      }
+    }
+    return defaultProp;
+  }
   var createUpdateEffect = function(hook) {
     return function(effect, deps) {
       var isMounted = React$1.useRef(false);
@@ -6511,6 +6521,7 @@
   }
   const defaultPopupBaseProps = {
     closeOnMaskClick: false,
+    closeIcon: React$1.createElement(CloseOutline, null),
     destroyOnClose: false,
     disableBodyScroll: true,
     forceRender: false,
@@ -8368,11 +8379,12 @@ Please add \`${key}Action\` when creating your handler.`);
     position: "bottom"
   });
   const Popup = (p) => {
-    const props = mergeProps(defaultProps$14, p);
-    const bodyCls = classNames(`${classPrefix$1o}-body`, props.bodyClassName, `${classPrefix$1o}-body-position-${props.position}`);
     const {
-      locale
+      locale,
+      popup: componentConfig = {}
     } = useConfig();
+    const props = mergeProps(defaultProps$14, componentConfig, p);
+    const bodyCls = classNames(`${classPrefix$1o}-body`, props.bodyClassName, `${classPrefix$1o}-body-position-${props.position}`);
     const [active, setActive] = React$1.useState(props.visible);
     const ref = React$1.useRef(null);
     useLockScroll(ref, props.disableBodyScroll && active ? "strict" : false);
@@ -8469,7 +8481,7 @@ Please add \`${key}Action\` when creating your handler.`);
       },
       role: "button",
       "aria-label": locale.common.close
-    }, React$1.createElement(CloseOutline, null)), props.children))));
+    }, props.closeIcon), props.children))));
     return React$1.createElement(ShouldRender, {
       active,
       forceRender: props.forceRender,
@@ -11413,9 +11425,17 @@ Please add \`${key}Action\` when creating your handler.`);
   }
   const classPrefix$12 = `adm-list-item`;
   const ListItem = (props) => {
-    var _a;
+    var _a, _b;
+    const {
+      arrow: arrow2,
+      arrowIcon
+    } = props;
+    const {
+      list: componentConfig = {}
+    } = useConfig();
     const clickable = (_a = props.clickable) !== null && _a !== void 0 ? _a : !!props.onClick;
-    const arrow2 = props.arrow === void 0 ? clickable : props.arrow;
+    const showArrow = (_b = arrow2 !== null && arrow2 !== void 0 ? arrow2 : arrowIcon) !== null && _b !== void 0 ? _b : clickable;
+    const mergedArrowIcon = mergeProp(componentConfig.arrowIcon, arrow2 !== true ? arrow2 : null, arrowIcon !== true ? arrowIcon : null);
     const content = React$1.createElement("div", {
       className: `${classPrefix$12}-content`
     }, isNodeWithContent(props.prefix) && React$1.createElement("div", {
@@ -11428,9 +11448,9 @@ Please add \`${key}Action\` when creating your handler.`);
       className: `${classPrefix$12}-description`
     }, props.description)), isNodeWithContent(props.extra) && React$1.createElement("div", {
       className: `${classPrefix$12}-content-extra`
-    }, props.extra), isNodeWithContent(arrow2) && React$1.createElement("div", {
+    }, props.extra), showArrow && React$1.createElement("div", {
       className: `${classPrefix$12}-content-arrow`
-    }, arrow2 === true ? React$1.createElement(RightOutline, null) : arrow2));
+    }, mergedArrowIcon || React$1.createElement(RightOutline, null)));
     return withNativeProps(props, React$1.createElement(clickable ? "a" : "div", {
       className: classNames(`${classPrefix$12}`, clickable ? ["adm-plain-anchor"] : [], props.disabled && `${classPrefix$12}-disabled`),
       onClick: props.disabled ? void 0 : props.onClick
@@ -11446,11 +11466,14 @@ Please add \`${key}Action\` when creating your handler.`);
     defaultValue: [],
     activeIcon: React$1.createElement(CheckOutline, null)
   };
-  const CheckList$1 = (p) => {
-    const props = mergeProps(defaultProps$R, p);
-    const [value, setValue2] = usePropsValue(props);
+  const CheckList$1 = (props) => {
+    const {
+      checkList: componentConfig = {}
+    } = useConfig();
+    const mergedProps = mergeProps(defaultProps$R, componentConfig, props);
+    const [value, setValue2] = usePropsValue(mergedProps);
     function check(val) {
-      if (props.multiple) {
+      if (mergedProps.multiple) {
         setValue2([...value, val]);
       } else {
         setValue2([val]);
@@ -11464,7 +11487,7 @@ Please add \`${key}Action\` when creating your handler.`);
       extra,
       disabled,
       readOnly
-    } = props;
+    } = mergedProps;
     return React$1.createElement(CheckListContext.Provider, {
       value: {
         value,
@@ -11475,10 +11498,10 @@ Please add \`${key}Action\` when creating your handler.`);
         disabled,
         readOnly
       }
-    }, withNativeProps(props, React$1.createElement(List$1, {
-      mode: props.mode,
+    }, withNativeProps(mergedProps, React$1.createElement(List$1, {
+      mode: mergedProps.mode,
       className: classPrefix$11
-    }, props.children)));
+    }, mergedProps.children)));
   };
   const classPrefix$10 = `adm-check-list-item`;
   const CheckListItem = (props) => {
@@ -11951,12 +11974,15 @@ Please add \`${key}Action\` when creating your handler.`);
   const defaultProps$O = Object.assign(Object.assign({}, defaultPopupBaseProps), {
     getContainer: null
   });
-  const CenterPopup = (p) => {
-    const props = mergeProps(defaultProps$O, p);
+  const CenterPopup = (props) => {
+    const {
+      popup: componentConfig = {}
+    } = useConfig();
+    const mergedProps = mergeProps(defaultProps$O, componentConfig, props);
     const unmountedRef = useUnmountedRef$1();
     const style = useSpring({
-      scale: props.visible ? 1 : 0.8,
-      opacity: props.visible ? 1 : 0,
+      scale: mergedProps.visible ? 1 : 0.8,
+      opacity: mergedProps.visible ? 1 : 0,
       config: {
         mass: 1.2,
         tension: 200,
@@ -11967,69 +11993,69 @@ Please add \`${key}Action\` when creating your handler.`);
         var _a, _b;
         if (unmountedRef.current)
           return;
-        setActive(props.visible);
-        if (props.visible) {
-          (_a = props.afterShow) === null || _a === void 0 ? void 0 : _a.call(props);
+        setActive(mergedProps.visible);
+        if (mergedProps.visible) {
+          (_a = mergedProps.afterShow) === null || _a === void 0 ? void 0 : _a.call(mergedProps);
         } else {
-          (_b = props.afterClose) === null || _b === void 0 ? void 0 : _b.call(props);
+          (_b = mergedProps.afterClose) === null || _b === void 0 ? void 0 : _b.call(mergedProps);
         }
       }
     });
-    const [active, setActive] = React$1.useState(props.visible);
+    const [active, setActive] = React$1.useState(mergedProps.visible);
     useIsomorphicLayoutEffect$2(() => {
-      if (props.visible) {
+      if (mergedProps.visible) {
         setActive(true);
       }
-    }, [props.visible]);
+    }, [mergedProps.visible]);
     const ref = React$1.useRef(null);
-    useLockScroll(ref, props.disableBodyScroll && active);
-    const maskVisible = useInnerVisible(active && props.visible);
+    useLockScroll(ref, mergedProps.disableBodyScroll && active);
+    const maskVisible = useInnerVisible(active && mergedProps.visible);
     const body = React$1.createElement("div", {
-      className: classNames(`${classPrefix$Y}-body`, props.bodyClassName),
-      style: props.bodyStyle
-    }, props.children);
-    const node = withStopPropagation(props.stopPropagation, withNativeProps(props, React$1.createElement("div", {
+      className: classNames(`${classPrefix$Y}-body`, mergedProps.bodyClassName),
+      style: mergedProps.bodyStyle
+    }, mergedProps.children);
+    const node = withStopPropagation(mergedProps.stopPropagation, withNativeProps(mergedProps, React$1.createElement("div", {
       className: classPrefix$Y,
       style: {
         display: active ? void 0 : "none",
         pointerEvents: active ? void 0 : "none"
       }
-    }, props.mask && React$1.createElement(Mask, {
+    }, mergedProps.mask && React$1.createElement(Mask, {
       visible: maskVisible,
-      forceRender: props.forceRender,
-      destroyOnClose: props.destroyOnClose,
+      forceRender: mergedProps.forceRender,
+      destroyOnClose: mergedProps.destroyOnClose,
       onMaskClick: (e2) => {
         var _a, _b;
-        (_a = props.onMaskClick) === null || _a === void 0 ? void 0 : _a.call(props, e2);
-        if (props.closeOnMaskClick) {
-          (_b = props.onClose) === null || _b === void 0 ? void 0 : _b.call(props);
+        (_a = mergedProps.onMaskClick) === null || _a === void 0 ? void 0 : _a.call(mergedProps, e2);
+        if (mergedProps.closeOnMaskClick) {
+          (_b = mergedProps.onClose) === null || _b === void 0 ? void 0 : _b.call(mergedProps);
         }
       },
-      style: props.maskStyle,
-      className: classNames(`${classPrefix$Y}-mask`, props.maskClassName),
+      style: mergedProps.maskStyle,
+      className: classNames(`${classPrefix$Y}-mask`, mergedProps.maskClassName),
       disableBodyScroll: false,
-      stopPropagation: props.stopPropagation
+      stopPropagation: mergedProps.stopPropagation
     }), React$1.createElement("div", {
       className: `${classPrefix$Y}-wrap`,
-      role: props.role,
-      "aria-label": props["aria-label"]
+      role: mergedProps.role,
+      "aria-label": mergedProps["aria-label"]
     }, React$1.createElement(animated.div, {
       style: Object.assign(Object.assign({}, style), {
         pointerEvents: style.opacity.to((v) => v === 1 ? "unset" : "none")
       }),
       ref
-    }, props.showCloseButton && React$1.createElement("a", {
+    }, mergedProps.showCloseButton && React$1.createElement("a", {
       className: classNames(`${classPrefix$Y}-close`, "adm-plain-anchor"),
       onClick: () => {
         var _a;
-        (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+        (_a = mergedProps.onClose) === null || _a === void 0 ? void 0 : _a.call(mergedProps);
       }
-    }, React$1.createElement(CloseOutline, null)), body)))));
+    }, mergedProps.closeIcon), body)))));
     return React$1.createElement(ShouldRender, {
       active,
-      forceRender: props.forceRender,
-      destroyOnClose: props.destroyOnClose
-    }, renderToContainer(props.getContainer, node));
+      forceRender: mergedProps.forceRender,
+      destroyOnClose: mergedProps.destroyOnClose
+    }, renderToContainer(mergedProps.getContainer, node));
   };
   const CheckboxGroupContext = React$1.createContext(null);
   const defaultProps$N = {
@@ -12273,8 +12299,12 @@ Please add \`${key}Action\` when creating your handler.`);
     }, React$1.createElement(List$1.Item, null, shouldRender && props.children)));
   };
   const Collapse = (props) => {
+    const {
+      collapse: componentConfig = {}
+    } = useConfig();
+    const mergedProps = mergeProps(componentConfig, props);
     const panels = [];
-    traverseReactNode(props.children, (child) => {
+    traverseReactNode(mergedProps.children, (child) => {
       if (!React$1.isValidElement(child))
         return;
       const key = child.key;
@@ -12284,11 +12314,11 @@ Please add \`${key}Action\` when creating your handler.`);
     });
     const handlePropsValue = () => {
       var _a;
-      if (!props.accordion) {
+      if (!mergedProps.accordion) {
         return {
-          value: props.activeKey,
-          defaultValue: (_a = props.defaultActiveKey) !== null && _a !== void 0 ? _a : [],
-          onChange: props.onChange
+          value: mergedProps.activeKey,
+          defaultValue: (_a = mergedProps.defaultActiveKey) !== null && _a !== void 0 ? _a : [],
+          onChange: mergedProps.onChange
         };
       }
       const initValue = {
@@ -12296,29 +12326,29 @@ Please add \`${key}Action\` when creating your handler.`);
         defaultValue: [],
         onChange: (v) => {
           var _a2, _b;
-          (_a2 = props.onChange) === null || _a2 === void 0 ? void 0 : _a2.call(props, (_b = v[0]) !== null && _b !== void 0 ? _b : null);
+          (_a2 = mergedProps.onChange) === null || _a2 === void 0 ? void 0 : _a2.call(mergedProps, (_b = v[0]) !== null && _b !== void 0 ? _b : null);
         }
       };
-      if (props.activeKey === void 0) {
+      if (mergedProps.activeKey === void 0) {
         initValue.value = void 0;
-      } else if (props.activeKey !== null) {
-        initValue.value = [props.activeKey];
+      } else if (mergedProps.activeKey !== null) {
+        initValue.value = [mergedProps.activeKey];
       }
-      if (![null, void 0].includes(props.defaultActiveKey)) {
-        initValue.defaultValue = [props.defaultActiveKey];
+      if (![null, void 0].includes(mergedProps.defaultActiveKey)) {
+        initValue.defaultValue = [mergedProps.defaultActiveKey];
       }
       return initValue;
     };
     const [activeKey, setActiveKey] = usePropsValue(handlePropsValue());
     const activeKeyList = activeKey === null ? [] : Array.isArray(activeKey) ? activeKey : [activeKey];
-    return withNativeProps(props, React$1.createElement("div", {
+    return withNativeProps(mergedProps, React$1.createElement("div", {
       className: classPrefix$W
     }, React$1.createElement(List$1, null, panels.map((panel) => {
       const key = panel.key;
       const active = activeKeyList.includes(key);
       function handleClick(event) {
         var _a, _b;
-        if (props.accordion) {
+        if (mergedProps.accordion) {
           if (active) {
             setActiveKey([]);
           } else {
@@ -12333,27 +12363,19 @@ Please add \`${key}Action\` when creating your handler.`);
         }
         (_b = (_a = panel.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event);
       }
-      const renderArrow = () => {
-        let arrow2 = React$1.createElement(DownOutline, null);
-        if (props.arrow !== void 0) {
-          arrow2 = props.arrow;
-        }
-        if (panel.props.arrow !== void 0) {
-          arrow2 = panel.props.arrow;
-        }
-        return typeof arrow2 === "function" ? arrow2(active) : React$1.createElement("div", {
-          className: classNames(`${classPrefix$W}-arrow`, {
-            [`${classPrefix$W}-arrow-active`]: active
-          })
-        }, arrow2);
-      };
+      const arrow2 = mergeProp(React$1.createElement(DownOutline, null), mergedProps.arrow, mergedProps.arrowIcon, panel.props.arrow, panel.props.arrowIcon);
+      const arrowIcon = typeof arrow2 === "function" ? arrow2(active) : React$1.createElement("div", {
+        className: classNames(`${classPrefix$W}-arrow`, {
+          [`${classPrefix$W}-arrow-active`]: active
+        })
+      }, arrow2);
       return React$1.createElement(React$1.Fragment, {
         key
       }, withNativeProps(panel.props, React$1.createElement(List$1.Item, {
         className: `${classPrefix$W}-panel-header`,
         onClick: handleClick,
         disabled: panel.props.disabled,
-        arrow: renderArrow()
+        arrowIcon
       }, panel.props.title)), React$1.createElement(CollapsePanelContent, {
         visible: active,
         forceRender: !!panel.props.forceRender,
@@ -12989,25 +13011,37 @@ Please add \`${key}Action\` when creating your handler.`);
     confirm: confirm$1,
     clear: clear$2
   });
+  const IconContext = React$1.createContext(null);
   const classPrefix$V = `adm-dropdown-item`;
   const Item = (props) => {
-    var _a;
+    const {
+      dropdown: componentConfig = {}
+    } = useConfig();
+    const mergedProps = mergeProps(componentConfig, props);
+    const {
+      active,
+      highlight,
+      onClick,
+      title
+    } = mergedProps;
     const cls2 = classNames(classPrefix$V, {
-      [`${classPrefix$V}-active`]: props.active,
-      [`${classPrefix$V}-highlight`]: (_a = props.highlight) !== null && _a !== void 0 ? _a : props.active
+      [`${classPrefix$V}-active`]: active,
+      [`${classPrefix$V}-highlight`]: highlight !== null && highlight !== void 0 ? highlight : active
     });
+    const contextArrowIcon = React$1.useContext(IconContext);
+    const mergedArrowIcon = mergeProp(React$1.createElement(DownFill, null), contextArrowIcon, mergedProps.arrow, mergedProps.arrowIcon);
     return withNativeProps(props, React$1.createElement("div", {
       className: cls2,
-      onClick: props.onClick
+      onClick
     }, React$1.createElement("div", {
       className: `${classPrefix$V}-title`
     }, React$1.createElement("span", {
       className: `${classPrefix$V}-title-text`
-    }, props.title), React$1.createElement("span", {
+    }, title), React$1.createElement("span", {
       className: classNames(`${classPrefix$V}-title-arrow`, {
-        [`${classPrefix$V}-title-arrow-active`]: props.active
+        [`${classPrefix$V}-title-arrow-active`]: active
       })
-    }, props.arrow === void 0 ? React$1.createElement(DownFill, null) : props.arrow))));
+    }, mergedArrowIcon))));
   };
   const Item$1 = Item;
   const ItemChildrenWrap = (props) => {
@@ -13030,17 +13064,21 @@ Please add \`${key}Action\` when creating your handler.`);
     closeOnClickAway: false,
     getContainer: defaultPopupBaseProps["getContainer"]
   };
-  const Dropdown = React$1.forwardRef((p, ref) => {
-    const props = mergeProps(defaultProps$H, p);
+  const Dropdown = React$1.forwardRef((props, ref) => {
+    const {
+      dropdown: componentConfig = {}
+    } = useConfig();
+    const mergedProps = mergeProps(defaultProps$H, componentConfig, props);
+    const arrowIcon = mergeProp(componentConfig.arrowIcon, props.arrow, props.arrowIcon);
     const [value, setValue2] = usePropsValue({
-      value: props.activeKey,
-      defaultValue: props.defaultActiveKey,
-      onChange: props.onChange
+      value: mergedProps.activeKey,
+      defaultValue: mergedProps.defaultActiveKey,
+      onChange: mergedProps.onChange
     });
     const navRef = React$1.useRef(null);
     const contentRef = React$1.useRef(null);
     useClickAway(() => {
-      if (!props.closeOnClickAway)
+      if (!mergedProps.closeOnClickAway)
         return;
       setValue2(null);
     }, [navRef, contentRef]);
@@ -13064,7 +13102,7 @@ Please add \`${key}Action\` when creating your handler.`);
     };
     let popupForceRender = false;
     const items = [];
-    const navs = React$1.Children.map(props.children, (child) => {
+    const navs = React$1.Children.map(mergedProps.children, (child) => {
       if (React$1.isValidElement(child)) {
         const childProps = Object.assign(Object.assign({}, child.props), {
           onClick: (event) => {
@@ -13072,8 +13110,7 @@ Please add \`${key}Action\` when creating your handler.`);
             changeActive(child.key);
             (_b = (_a = child.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event);
           },
-          active: child.key === value,
-          arrow: child.props.arrow === void 0 ? props.arrow : child.props.arrow
+          active: child.key === value
         });
         items.push(child);
         if (child.props.forceRender)
@@ -13088,18 +13125,20 @@ Please add \`${key}Action\` when creating your handler.`);
         setValue2(null);
       }
     }), [setValue2]);
-    return withNativeProps(props, React$1.createElement("div", {
+    return withNativeProps(mergedProps, React$1.createElement("div", {
       className: classNames(classPrefix$U, {
         [`${classPrefix$U}-open`]: !!value
       }),
       ref: containerRef
+    }, React$1.createElement(IconContext.Provider, {
+      value: arrowIcon
     }, React$1.createElement("div", {
       className: `${classPrefix$U}-nav`,
       ref: navRef
-    }, navs), React$1.createElement(Popup, {
+    }, navs)), React$1.createElement(Popup, {
       visible: !!value,
       position: "top",
-      getContainer: props.getContainer,
+      getContainer: mergedProps.getContainer,
       className: `${classPrefix$U}-popup`,
       maskClassName: `${classPrefix$U}-popup-mask`,
       bodyClassName: `${classPrefix$U}-popup-body`,
@@ -13107,7 +13146,7 @@ Please add \`${key}Action\` when creating your handler.`);
         top
       },
       forceRender: popupForceRender,
-      onMaskClick: props.closeOnMaskClick ? () => {
+      onMaskClick: mergedProps.closeOnMaskClick ? () => {
         changeActive(null);
       } : void 0
     }, React$1.createElement("div", {
@@ -18320,24 +18359,13 @@ Please add \`${key}Action\` when creating your handler.`);
   });
   var _default = Context;
   default_1 = FieldContext.default = _default;
-  function toArray(candidate) {
-    if (candidate === void 0 || candidate === false)
-      return [];
-    return Array.isArray(candidate) ? candidate : [candidate];
-  }
-  function shouldConstruct(Component) {
-    const prototype = Component.prototype;
-    return !!(prototype && prototype.isReactComponent);
-  }
-  function isSimpleFunctionComponent(type) {
-    return typeof type === "function" && !shouldConstruct(type) && type.defaultProps === void 0;
-  }
-  function isSafeSetRefComponent(component) {
-    if (reactIsExports.isFragment(component))
-      return false;
-    if (reactIsExports.isMemo(component))
-      return isSafeSetRefComponent(component.type);
-    return !isSimpleFunctionComponent(component.type);
+  function undefinedFallback(...items) {
+    let i2;
+    for (i2 = 0; i2 < items.length; i2++) {
+      if (items[i2] !== void 0)
+        break;
+    }
+    return items[i2];
   }
   const Arrow = React$1.memo((props) => {
     return withNativeProps(props, React$1.createElement("svg", {
@@ -19965,13 +19993,24 @@ Please add \`${key}Action\` when creating your handler.`);
   const Popover = attachPropertiesToComponent(Popover$1, {
     Menu: PopoverMenu
   });
-  function undefinedFallback(...items) {
-    let i2;
-    for (i2 = 0; i2 < items.length; i2++) {
-      if (items[i2] !== void 0)
-        break;
-    }
-    return items[i2];
+  function toArray(candidate) {
+    if (candidate === void 0 || candidate === false)
+      return [];
+    return Array.isArray(candidate) ? candidate : [candidate];
+  }
+  function shouldConstruct(Component) {
+    const prototype = Component.prototype;
+    return !!(prototype && prototype.isReactComponent);
+  }
+  function isSimpleFunctionComponent(type) {
+    return typeof type === "function" && !shouldConstruct(type) && type.defaultProps === void 0;
+  }
+  function isSafeSetRefComponent(component) {
+    if (reactIsExports.isFragment(component))
+      return false;
+    if (reactIsExports.isMemo(component))
+      return isSafeSetRefComponent(component.type);
+    return !isSimpleFunctionComponent(component.type);
   }
   const NAME_SPLIT = "__SPLIT__";
   const classPrefix$L = `adm-form-item`;
@@ -19980,22 +20019,25 @@ Please add \`${key}Action\` when creating your handler.`);
   }) => children, (prev, next) => prev.value === next.value && prev.update === next.update);
   const FormItemLayout = (props) => {
     var _a;
+    const {
+      locale,
+      form: componentConfig = {}
+    } = useConfig();
     const {
       style,
       extra,
       label,
       help,
+      helpIcon,
       required,
       children,
       htmlFor,
       hidden,
       arrow: arrow2,
+      arrowIcon,
       childElementPosition = "normal"
-    } = props;
+    } = mergeProps(componentConfig, props);
     const context = React$1.useContext(FormContext);
-    const {
-      locale
-    } = useConfig();
     const hasFeedback = props.hasFeedback !== void 0 ? props.hasFeedback : context.hasFeedback;
     const layout = props.layout || context.layout;
     const disabled = (_a = props.disabled) !== null && _a !== void 0 ? _a : context.disabled;
@@ -20035,7 +20077,7 @@ Please add \`${key}Action\` when creating your handler.`);
         e2.stopPropagation();
         e2.preventDefault();
       }
-    }, React$1.createElement(QuestionCircleOutline, null))));
+    }, helpIcon || React$1.createElement(QuestionCircleOutline, null))));
     const description = (!!props.description || hasFeedback) && React$1.createElement(React$1.Fragment, null, props.description, hasFeedback && React$1.createElement(React$1.Fragment, null, props.errors.map((error, index2) => React$1.createElement("div", {
       key: `error-${index2}`,
       className: `${classPrefix$L}-feedback-error`
@@ -20056,7 +20098,7 @@ Please add \`${key}Action\` when creating your handler.`);
       disabled,
       onClick: props.onClick,
       clickable: props.clickable,
-      arrow: arrow2
+      arrowIcon: arrowIcon || arrow2
     }, React$1.createElement("div", {
       className: classNames(`${classPrefix$L}-child`, `${classPrefix$L}-child-position-${childElementPosition}`)
     }, React$1.createElement("div", {
@@ -20070,6 +20112,7 @@ Please add \`${key}Action\` when creating your handler.`);
       // FormItem 相关
       label,
       help,
+      helpIcon,
       extra,
       hasFeedback,
       name,
@@ -20090,8 +20133,9 @@ Please add \`${key}Action\` when creating your handler.`);
       shouldUpdate,
       dependencies,
       clickable,
-      arrow: arrow2
-    } = props, fieldProps = __rest(props, ["style", "label", "help", "extra", "hasFeedback", "name", "required", "noStyle", "hidden", "layout", "childElementPosition", "description", "disabled", "rules", "children", "messageVariables", "trigger", "validateTrigger", "onClick", "shouldUpdate", "dependencies", "clickable", "arrow"]);
+      arrow: arrow2,
+      arrowIcon
+    } = props, fieldProps = __rest(props, ["style", "label", "help", "helpIcon", "extra", "hasFeedback", "name", "required", "noStyle", "hidden", "layout", "childElementPosition", "description", "disabled", "rules", "children", "messageVariables", "trigger", "validateTrigger", "onClick", "shouldUpdate", "dependencies", "clickable", "arrow", "arrowIcon"]);
     const {
       name: formName
     } = React$1.useContext(FormContext);
@@ -20143,6 +20187,7 @@ Please add \`${key}Action\` when creating your handler.`);
         label,
         extra,
         help,
+        helpIcon,
         description,
         required: isRequired,
         disabled,
@@ -20155,7 +20200,8 @@ Please add \`${key}Action\` when creating your handler.`);
         layout,
         childElementPosition,
         clickable,
-        arrow: arrow2
+        arrow: arrow2,
+        arrowIcon
       }, React$1.createElement(NoStyleItemContext.Provider, {
         value: onSubMetaChange
       }, baseChildren)));
@@ -21382,22 +21428,24 @@ Please add \`${key}Action\` when creating your handler.`);
   const classPrefix$A = `adm-input`;
   const defaultProps$v = {
     defaultValue: "",
+    clearIcon: React$1.createElement(CloseCircleFill, null),
     onlyShowClearWhenFocus: true
   };
-  const Input = React$1.forwardRef((p, ref) => {
-    const props = mergeProps(defaultProps$v, p);
-    const [value, setValue2] = usePropsValue(props);
+  const Input = React$1.forwardRef((props, ref) => {
+    const {
+      locale,
+      input: componentConfig = {}
+    } = useConfig();
+    const mergedProps = mergeProps(defaultProps$v, componentConfig, props);
+    const [value, setValue2] = usePropsValue(mergedProps);
     const [hasFocus, setHasFocus] = React$1.useState(false);
     const compositionStartRef = React$1.useRef(false);
     const nativeInputRef = React$1.useRef(null);
-    const {
-      locale
-    } = useConfig();
     const handleKeydown = useInputHandleKeyDown({
-      onEnterPress: props.onEnterPress,
-      onKeyDown: props.onKeyDown,
+      onEnterPress: mergedProps.onEnterPress,
+      onKeyDown: mergedProps.onKeyDown,
       nativeInputRef,
-      enterKeyHint: props.enterKeyHint
+      enterKeyHint: mergedProps.enterKeyHint
     });
     React$1.useImperativeHandle(ref, () => ({
       clear: () => {
@@ -21417,8 +21465,8 @@ Please add \`${key}Action\` when creating your handler.`);
     }));
     function checkValue() {
       let nextValue = value;
-      if (props.type === "number") {
-        const boundValue = nextValue && bound(parseFloat(nextValue), props.min, props.max).toString();
+      if (mergedProps.type === "number") {
+        const boundValue = nextValue && bound(parseFloat(nextValue), mergedProps.min, mergedProps.max).toString();
         if (Number(nextValue) !== Number(boundValue)) {
           nextValue = boundValue;
         }
@@ -21428,16 +21476,16 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     }
     const shouldShowClear = (() => {
-      if (!props.clearable || !value || props.readOnly)
+      if (!mergedProps.clearable || !value || mergedProps.readOnly)
         return false;
-      if (props.onlyShowClearWhenFocus) {
+      if (mergedProps.onlyShowClearWhenFocus) {
         return hasFocus;
       } else {
         return true;
       }
     })();
-    return withNativeProps(props, React$1.createElement("div", {
-      className: classNames(`${classPrefix$A}`, props.disabled && `${classPrefix$A}-disabled`)
+    return withNativeProps(mergedProps, React$1.createElement("div", {
+      className: classNames(`${classPrefix$A}`, mergedProps.disabled && `${classPrefix$A}-disabled`)
     }, React$1.createElement("input", {
       ref: nativeInputRef,
       className: `${classPrefix$A}-element`,
@@ -21448,50 +21496,50 @@ Please add \`${key}Action\` when creating your handler.`);
       onFocus: (e2) => {
         var _a;
         setHasFocus(true);
-        (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, e2);
+        (_a = mergedProps.onFocus) === null || _a === void 0 ? void 0 : _a.call(mergedProps, e2);
       },
       onBlur: (e2) => {
         var _a;
         setHasFocus(false);
         checkValue();
-        (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, e2);
+        (_a = mergedProps.onBlur) === null || _a === void 0 ? void 0 : _a.call(mergedProps, e2);
       },
-      id: props.id,
-      placeholder: props.placeholder,
-      disabled: props.disabled,
-      readOnly: props.readOnly,
-      maxLength: props.maxLength,
-      minLength: props.minLength,
-      max: props.max,
-      min: props.min,
-      autoComplete: props.autoComplete,
-      enterKeyHint: props.enterKeyHint,
-      autoFocus: props.autoFocus,
-      pattern: props.pattern,
-      inputMode: props.inputMode,
-      type: props.type,
-      name: props.name,
-      autoCapitalize: props.autoCapitalize,
-      autoCorrect: props.autoCorrect,
+      id: mergedProps.id,
+      placeholder: mergedProps.placeholder,
+      disabled: mergedProps.disabled,
+      readOnly: mergedProps.readOnly,
+      maxLength: mergedProps.maxLength,
+      minLength: mergedProps.minLength,
+      max: mergedProps.max,
+      min: mergedProps.min,
+      autoComplete: mergedProps.autoComplete,
+      enterKeyHint: mergedProps.enterKeyHint,
+      autoFocus: mergedProps.autoFocus,
+      pattern: mergedProps.pattern,
+      inputMode: mergedProps.inputMode,
+      type: mergedProps.type,
+      name: mergedProps.name,
+      autoCapitalize: mergedProps.autoCapitalize,
+      autoCorrect: mergedProps.autoCorrect,
       onKeyDown: handleKeydown,
-      onKeyUp: props.onKeyUp,
+      onKeyUp: mergedProps.onKeyUp,
       onCompositionStart: (e2) => {
         var _a;
         compositionStartRef.current = true;
-        (_a = props.onCompositionStart) === null || _a === void 0 ? void 0 : _a.call(props, e2);
+        (_a = mergedProps.onCompositionStart) === null || _a === void 0 ? void 0 : _a.call(mergedProps, e2);
       },
       onCompositionEnd: (e2) => {
         var _a;
         compositionStartRef.current = false;
-        (_a = props.onCompositionEnd) === null || _a === void 0 ? void 0 : _a.call(props, e2);
+        (_a = mergedProps.onCompositionEnd) === null || _a === void 0 ? void 0 : _a.call(mergedProps, e2);
       },
-      onClick: props.onClick,
-      step: props.step,
-      role: props.role,
-      "aria-valuenow": props["aria-valuenow"],
-      "aria-valuemax": props["aria-valuemax"],
-      "aria-valuemin": props["aria-valuemin"],
-      "aria-label": props["aria-label"]
+      onClick: mergedProps.onClick,
+      step: mergedProps.step,
+      role: mergedProps.role,
+      "aria-valuenow": mergedProps["aria-valuenow"],
+      "aria-valuemax": mergedProps["aria-valuemax"],
+      "aria-valuemin": mergedProps["aria-valuemin"],
+      "aria-label": mergedProps["aria-label"]
     }), shouldShowClear && React$1.createElement("div", {
       className: `${classPrefix$A}-clear`,
       onMouseDown: (e2) => {
@@ -21500,14 +21548,14 @@ Please add \`${key}Action\` when creating your handler.`);
       onClick: () => {
         var _a, _b;
         setValue2("");
-        (_a = props.onClear) === null || _a === void 0 ? void 0 : _a.call(props);
+        (_a = mergedProps.onClear) === null || _a === void 0 ? void 0 : _a.call(mergedProps);
         if (isIOS() && compositionStartRef.current) {
           compositionStartRef.current = false;
           (_b = nativeInputRef.current) === null || _b === void 0 ? void 0 : _b.blur();
         }
       },
       "aria-label": locale.Input.clear
-    }, React$1.createElement(CloseCircleFill, null))));
+    }, mergedProps.clearIcon)));
   });
   const classPrefix$z = `adm-jumbo-tabs`;
   const JumboTab = () => {
@@ -21768,50 +21816,60 @@ Please add \`${key}Action\` when creating your handler.`);
   });
   const classPrefix$y = `adm-nav-bar`;
   const defaultProps$s = {
-    backArrow: true
+    backIcon: true
   };
-  const NavBar = (p) => {
-    const props = mergeProps(defaultProps$s, p);
+  const NavBar = (props) => {
+    const {
+      navBar: componentConfig = {}
+    } = useConfig();
+    const mergedProps = mergeProps(defaultProps$s, componentConfig, props);
     const {
       back,
+      backIcon,
       backArrow
-    } = props;
-    return withNativeProps(props, React$1.createElement("div", {
+    } = mergedProps;
+    return withNativeProps(mergedProps, React$1.createElement("div", {
       className: classNames(classPrefix$y)
     }, React$1.createElement("div", {
       className: `${classPrefix$y}-left`,
       role: "button"
     }, back !== null && React$1.createElement("div", {
       className: `${classPrefix$y}-back`,
-      onClick: props.onBack
-    }, backArrow && React$1.createElement("span", {
+      onClick: mergedProps.onBack
+    }, (backIcon || backArrow) && React$1.createElement("span", {
       className: `${classPrefix$y}-back-arrow`
-    }, backArrow === true ? React$1.createElement(LeftOutline, null) : backArrow), React$1.createElement("span", {
+    }, backIcon === true || backArrow === true ? componentConfig.backIcon || React$1.createElement(LeftOutline, null) : backIcon || backArrow), React$1.createElement("span", {
       "aria-hidden": "true"
-    }, back)), props.left), React$1.createElement("div", {
+    }, back)), mergedProps.left), React$1.createElement("div", {
       className: `${classPrefix$y}-title`
-    }, props.children), React$1.createElement("div", {
+    }, mergedProps.children), React$1.createElement("div", {
       className: `${classPrefix$y}-right`
-    }, props.right)));
+    }, mergedProps.right)));
   };
   const classPrefix$x = `adm-notice-bar`;
   const defaultProps$r = {
     color: "default",
     delay: 2e3,
     speed: 50,
-    wrap: false,
-    icon: React$1.createElement(SoundOutline, null)
+    icon: React$1.createElement(SoundOutline, null),
+    wrap: false
   };
-  const NoticeBar = React$1.memo((p) => {
-    const props = mergeProps(defaultProps$r, p);
+  const NoticeBar = React$1.memo((props) => {
+    const {
+      noticeBar: componentConfig = {}
+    } = useConfig();
+    const mergedProps = mergeProps(defaultProps$r, componentConfig, props);
+    const closeIcon = mergeProp(React$1.createElement(CloseOutline, {
+      className: `${classPrefix$x}-close-icon`
+    }), componentConfig.closeIcon, props.closeIcon);
     const containerRef = React$1.useRef(null);
     const textRef = React$1.useRef(null);
     const [visible, setVisible] = React$1.useState(true);
-    const speed = props.speed;
+    const speed = mergedProps.speed;
     const delayLockRef = React$1.useRef(true);
     const animatingRef = React$1.useRef(false);
     function start2() {
-      if (delayLockRef.current || props.wrap)
+      if (delayLockRef.current || mergedProps.wrap)
         return;
       const container = containerRef.current;
       const text = textRef.current;
@@ -21840,7 +21898,7 @@ Please add \`${key}Action\` when creating your handler.`);
     useTimeout$1(() => {
       delayLockRef.current = false;
       start2();
-    }, props.delay);
+    }, mergedProps.delay);
     useResizeEffect(() => {
       start2();
     }, containerRef);
@@ -21853,14 +21911,14 @@ Please add \`${key}Action\` when creating your handler.`);
     });
     if (!visible)
       return null;
-    return withNativeProps(props, React$1.createElement("div", {
-      className: classNames(classPrefix$x, `${classPrefix$x}-${props.color}`, {
-        [`${classPrefix$x}-wrap`]: props.wrap
+    return withNativeProps(mergedProps, React$1.createElement("div", {
+      className: classNames(classPrefix$x, `${classPrefix$x}-${mergedProps.color}`, {
+        [`${classPrefix$x}-wrap`]: mergedProps.wrap
       }),
-      onClick: props.onClick
-    }, props.icon && React$1.createElement("span", {
+      onClick: mergedProps.onClick
+    }, mergedProps.icon && React$1.createElement("span", {
       className: `${classPrefix$x}-left`
-    }, props.icon), React$1.createElement("span", {
+    }, mergedProps.icon), React$1.createElement("span", {
       ref: containerRef,
       className: `${classPrefix$x}-content`
     }, React$1.createElement("span", {
@@ -21870,18 +21928,16 @@ Please add \`${key}Action\` when creating your handler.`);
       },
       ref: textRef,
       className: `${classPrefix$x}-content-inner`
-    }, props.content)), (props.closeable || props.extra) && React$1.createElement("span", {
+    }, mergedProps.content)), (mergedProps.closeable || mergedProps.extra) && React$1.createElement("span", {
       className: `${classPrefix$x}-right`
-    }, props.extra, props.closeable && React$1.createElement("div", {
+    }, mergedProps.extra, mergedProps.closeable && React$1.createElement("div", {
       className: `${classPrefix$x}-close`,
       onClick: () => {
         var _a;
         setVisible(false);
-        (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+        (_a = mergedProps.onClose) === null || _a === void 0 ? void 0 : _a.call(mergedProps);
       }
-    }, React$1.createElement(CloseOutline, {
-      className: `${classPrefix$x}-close-icon`
-    })))));
+    }, closeIcon))));
   });
   function shuffle(array) {
     const result = [...array];
@@ -21940,13 +21996,13 @@ Please add \`${key}Action\` when creating your handler.`);
       var _a;
       (_a = props.onDelete) === null || _a === void 0 ? void 0 : _a.call(props);
     });
-    const onBackspacePressStart = () => {
+    const startContinueClear = () => {
       timeoutRef.current = window.setTimeout(() => {
         onDelete();
         intervalRef.current = window.setInterval(onDelete, 150);
       }, 700);
     };
-    const onBackspacePressEnd = () => {
+    const stopContinueClear = () => {
       clearTimeout(timeoutRef.current);
       clearInterval(intervalRef.current);
     };
@@ -22006,14 +22062,15 @@ Please add \`${key}Action\` when creating your handler.`);
         key,
         className,
         onTouchStart: () => {
+          stopContinueClear();
           if (key === "BACKSPACE") {
-            onBackspacePressStart();
+            startContinueClear();
           }
         },
         onTouchEnd: (e2) => {
           onKeyPress(e2, key);
           if (key === "BACKSPACE") {
-            onBackspacePressEnd();
+            stopContinueClear();
           }
         }
       }, ariaProps), key === "BACKSPACE" ? React$1.createElement(TextDeletionOutline, null) : key);
@@ -22045,11 +22102,11 @@ Please add \`${key}Action\` when creating your handler.`);
     }, React$1.createElement("div", {
       className: `${classPrefix$w}-key ${classPrefix$w}-key-extra ${classPrefix$w}-key-bs`,
       onTouchStart: () => {
-        onBackspacePressStart();
+        startContinueClear();
       },
       onTouchEnd: (e2) => {
         onKeyPress(e2, "BACKSPACE");
-        onBackspacePressEnd();
+        stopContinueClear();
       },
       onContextMenu: (e2) => {
         e2.preventDefault();
@@ -22617,14 +22674,33 @@ Please add \`${key}Action\` when creating your handler.`);
       className: classNames(`${classPrefix$p}-box`)
     }, props.allowHalf && renderStar(i2 + 0.5, true), renderStar(i2 + 1, false)))));
   };
-  const classPrefix$o = `adm-result`;
-  const iconRecord$1 = {
-    success: CheckCircleFill,
-    error: CloseCircleFill,
-    info: InformationCircleFill,
-    waiting: ClockCircleFill,
-    warning: ExclamationCircleFill
+  const useResultIcon = (status) => {
+    const {
+      result: componentConfig = {}
+    } = useConfig();
+    const {
+      successIcon = React$1.createElement(CheckCircleFill, null),
+      errorIcon = React$1.createElement(CloseCircleFill, null),
+      infoIcon = React$1.createElement(InformationCircleFill, null),
+      waitingIcon = React$1.createElement(ClockCircleFill, null),
+      warningIcon = React$1.createElement(ExclamationCircleFill, null)
+    } = componentConfig || {};
+    switch (status) {
+      case "success":
+        return successIcon;
+      case "error":
+        return errorIcon;
+      case "info":
+        return infoIcon;
+      case "waiting":
+        return waitingIcon;
+      case "warning":
+        return warningIcon;
+      default:
+        return null;
+    }
   };
+  const classPrefix$o = `adm-result`;
   const defaultProps$i = {
     status: "info"
   };
@@ -22636,27 +22712,20 @@ Please add \`${key}Action\` when creating your handler.`);
       description,
       icon
     } = props;
+    const fallbackIcon = useResultIcon(status);
     if (!status)
       return null;
-    const resultIcon = icon || React$1.createElement(iconRecord$1[status]);
     return withNativeProps(props, React$1.createElement("div", {
       className: classNames(classPrefix$o, `${classPrefix$o}-${status}`)
     }, React$1.createElement("div", {
       className: `${classPrefix$o}-icon`
-    }, resultIcon), React$1.createElement("div", {
+    }, icon || fallbackIcon), React$1.createElement("div", {
       className: `${classPrefix$o}-title`
     }, title), !!description && React$1.createElement("div", {
       className: `${classPrefix$o}-description`
     }, description)));
   };
   const classPrefix$n = `adm-result-page`;
-  const iconRecord = {
-    success: CheckCircleFill,
-    error: CloseCircleFill,
-    info: InformationCircleFill,
-    waiting: ClockCircleFill,
-    warning: ExclamationCircleFill
-  };
   const defaultProps$h = {
     status: "info",
     details: []
@@ -22674,7 +22743,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onPrimaryButtonClick,
       onSecondaryButtonClick
     } = props;
-    const resultIcon = icon || React$1.createElement(iconRecord[status]);
+    const fallbackIcon = useResultIcon(status);
     const [collapse, setCollapse] = React$1.useState(true);
     const showSecondaryButton = isNodeWithContent(secondaryButtonText);
     const showPrimaryButton = isNodeWithContent(primaryButtonText);
@@ -22684,7 +22753,7 @@ Please add \`${key}Action\` when creating your handler.`);
       className: `${classPrefix$n}-header`
     }, React$1.createElement("div", {
       className: `${classPrefix$n}-icon`
-    }, resultIcon), React$1.createElement("div", {
+    }, icon || fallbackIcon), React$1.createElement("div", {
       className: `${classPrefix$n}-title`
     }, title), isNodeWithContent(description) ? React$1.createElement("div", {
       className: `${classPrefix$n}-description`
@@ -22740,17 +22809,18 @@ Please add \`${key}Action\` when creating your handler.`);
     onlyShowClearWhenFocus: false,
     showCancelButton: false,
     defaultValue: "",
-    clearOnCancel: true,
-    icon: React$1.createElement(SearchOutline, null)
+    clearOnCancel: true
   };
-  const SearchBar = React$1.forwardRef((p, ref) => {
+  const SearchBar = React$1.forwardRef((props, ref) => {
     const {
-      locale
+      locale,
+      searchBar: componentConfig = {}
     } = useConfig();
-    const props = mergeProps(defaultProps$g, {
+    const mergedProps = mergeProps(defaultProps$g, componentConfig, {
       cancelText: locale.common.cancel
-    }, p);
-    const [value, setValue2] = usePropsValue(props);
+    }, props);
+    const searchIcon = mergeProp(React$1.createElement(SearchOutline, null), componentConfig.searchIcon, props.icon, props.searchIcon);
+    const [value, setValue2] = usePropsValue(mergedProps);
     const [hasFocus, setHasFocus] = React$1.useState(false);
     const inputRef = React$1.useRef(null);
     const composingRef = React$1.useRef(false);
@@ -22774,10 +22844,10 @@ Please add \`${key}Action\` when creating your handler.`);
     }));
     const renderCancelButton = () => {
       let isShowCancel;
-      if (typeof props.showCancelButton === "function") {
-        isShowCancel = props.showCancelButton(hasFocus, value);
+      if (typeof mergedProps.showCancelButton === "function") {
+        isShowCancel = mergedProps.showCancelButton(hasFocus, value);
       } else {
-        isShowCancel = props.showCancelButton && hasFocus;
+        isShowCancel = mergedProps.showCancelButton && hasFocus;
       }
       return isShowCancel && React$1.createElement("div", {
         className: `${classPrefix$l}-suffix`
@@ -22786,66 +22856,66 @@ Please add \`${key}Action\` when creating your handler.`);
         className: `${classPrefix$l}-cancel-button`,
         onClick: () => {
           var _a, _b, _c;
-          if (props.clearOnCancel) {
+          if (mergedProps.clearOnCancel) {
             (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.clear();
           }
           (_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.blur();
-          (_c = props.onCancel) === null || _c === void 0 ? void 0 : _c.call(props);
+          (_c = mergedProps.onCancel) === null || _c === void 0 ? void 0 : _c.call(mergedProps);
         },
         onMouseDown: (e2) => {
           e2.preventDefault();
         }
-      }, props.cancelText));
+      }, mergedProps.cancelText));
     };
-    return withNativeProps(props, React$1.createElement("div", {
+    return withNativeProps(mergedProps, React$1.createElement("div", {
       className: classNames(classPrefix$l, {
         [`${classPrefix$l}-active`]: hasFocus
       })
     }, React$1.createElement("div", {
       className: `${classPrefix$l}-input-box`
-    }, props.icon && React$1.createElement("div", {
+    }, searchIcon && React$1.createElement("div", {
       className: `${classPrefix$l}-input-box-icon`
-    }, props.icon), React$1.createElement(Input, {
+    }, searchIcon), React$1.createElement(Input, {
       ref: inputRef,
       className: classNames(`${classPrefix$l}-input`, {
-        [`${classPrefix$l}-input-without-icon`]: !props.icon
+        [`${classPrefix$l}-input-without-icon`]: !searchIcon
       }),
       value,
       onChange: setValue2,
-      maxLength: props.maxLength,
-      placeholder: props.placeholder,
-      clearable: props.clearable,
-      onlyShowClearWhenFocus: props.onlyShowClearWhenFocus,
+      maxLength: mergedProps.maxLength,
+      placeholder: mergedProps.placeholder,
+      clearable: mergedProps.clearable,
+      onlyShowClearWhenFocus: mergedProps.onlyShowClearWhenFocus,
       onFocus: (e2) => {
         var _a;
         setHasFocus(true);
-        (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, e2);
+        (_a = mergedProps.onFocus) === null || _a === void 0 ? void 0 : _a.call(mergedProps, e2);
       },
       onBlur: (e2) => {
         var _a;
         setHasFocus(false);
-        (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, e2);
+        (_a = mergedProps.onBlur) === null || _a === void 0 ? void 0 : _a.call(mergedProps, e2);
       },
-      onClear: props.onClear,
+      onClear: mergedProps.onClear,
       type: "search",
       enterKeyHint: "search",
       onEnterPress: () => {
         var _a, _b;
         if (!composingRef.current) {
           (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.blur();
-          (_b = props.onSearch) === null || _b === void 0 ? void 0 : _b.call(props, value);
+          (_b = mergedProps.onSearch) === null || _b === void 0 ? void 0 : _b.call(mergedProps, value);
         }
       },
       "aria-label": locale.SearchBar.name,
       onCompositionStart: (e2) => {
         var _a;
         composingRef.current = true;
-        (_a = props.onCompositionStart) === null || _a === void 0 ? void 0 : _a.call(props, e2);
+        (_a = mergedProps.onCompositionStart) === null || _a === void 0 ? void 0 : _a.call(mergedProps, e2);
       },
       onCompositionEnd: (e2) => {
         var _a;
         composingRef.current = false;
-        (_a = props.onCompositionEnd) === null || _a === void 0 ? void 0 : _a.call(props, e2);
+        (_a = mergedProps.onCompositionEnd) === null || _a === void 0 ? void 0 : _a.call(mergedProps, e2);
       }
     })), renderCancelButton()));
   });
@@ -25444,15 +25514,17 @@ Please add \`${key}Action\` when creating your handler.`);
   const defaultProps$2 = {
     defaultValue: ""
   };
-  const VirtualInput = React$1.forwardRef((p, ref) => {
-    const props = mergeProps(defaultProps$2, p);
-    const [value, setValue2] = usePropsValue(props);
+  const VirtualInput = React$1.forwardRef((props, ref) => {
+    const {
+      locale,
+      input: componentConfig = {}
+    } = useConfig();
+    const mergedProps = mergeProps(defaultProps$2, componentConfig, props);
+    const [value, setValue2] = usePropsValue(mergedProps);
     const rootRef = React$1.useRef(null);
     const contentRef = React$1.useRef(null);
     const [hasFocus, setHasFocus] = React$1.useState(false);
-    const {
-      locale
-    } = useConfig();
+    const clearIcon = mergeProp(React$1.createElement(CloseCircleFill, null), componentConfig.clearIcon, props.clearIcon);
     function scrollToEnd() {
       const root2 = rootRef.current;
       if (!root2)
@@ -25486,14 +25558,14 @@ Please add \`${key}Action\` when creating your handler.`);
     function onFocus() {
       var _a;
       setHasFocus(true);
-      (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props);
+      (_a = mergedProps.onFocus) === null || _a === void 0 ? void 0 : _a.call(mergedProps);
     }
     function onBlur() {
       var _a;
       setHasFocus(false);
-      (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props);
+      (_a = mergedProps.onBlur) === null || _a === void 0 ? void 0 : _a.call(mergedProps);
     }
-    const keyboard = props.keyboard;
+    const keyboard = mergedProps.keyboard;
     const keyboardElement = keyboard && React$1.cloneElement(keyboard, {
       onInput: (v) => {
         var _a, _b;
@@ -25518,38 +25590,38 @@ Please add \`${key}Action\` when creating your handler.`);
       },
       getContainer: null
     });
-    return withNativeProps(props, React$1.createElement("div", {
+    return withNativeProps(mergedProps, React$1.createElement("div", {
       ref: rootRef,
       className: classNames(classPrefix$2, {
-        [`${classPrefix$2}-disabled`]: props.disabled
+        [`${classPrefix$2}-disabled`]: mergedProps.disabled
       }),
-      tabIndex: props.disabled ? void 0 : 0,
+      tabIndex: mergedProps.disabled ? void 0 : 0,
       role: "textbox",
       onFocus,
       onBlur,
-      onClick: props.onClick
+      onClick: mergedProps.onClick
     }, React$1.createElement("div", {
       className: `${classPrefix$2}-content`,
       ref: contentRef,
-      "aria-disabled": props.disabled,
-      "aria-label": props.placeholder
+      "aria-disabled": mergedProps.disabled,
+      "aria-label": mergedProps.placeholder
     }, value, React$1.createElement("div", {
       className: `${classPrefix$2}-caret-container`
     }, hasFocus && React$1.createElement("div", {
       className: `${classPrefix$2}-caret`
-    }))), props.clearable && !!value && hasFocus && React$1.createElement("div", {
+    }))), mergedProps.clearable && !!value && hasFocus && React$1.createElement("div", {
       className: `${classPrefix$2}-clear`,
       onClick: (e2) => {
         var _a;
         e2.stopPropagation();
         setValue2("");
-        (_a = props.onClear) === null || _a === void 0 ? void 0 : _a.call(props);
+        (_a = mergedProps.onClear) === null || _a === void 0 ? void 0 : _a.call(mergedProps);
       },
       role: "button",
       "aria-label": locale.Input.clear
-    }, React$1.createElement(CloseCircleFill, null)), [void 0, null, ""].includes(value) && React$1.createElement("div", {
+    }, clearIcon), [void 0, null, ""].includes(value) && React$1.createElement("div", {
       className: `${classPrefix$2}-placeholder`
-    }, props.placeholder), keyboardElement));
+    }, mergedProps.placeholder), keyboardElement));
   });
   const classPrefix$1 = `adm-water-mark`;
   const defaultProps$1 = {