From 9d97d61ef3b165a8468a7455738ccafcd0ccb93b Mon Sep 17 00:00:00 2001
From: sunhao <sunhao@easycorp.ltd>
Date: Fri, 16 Aug 2024 16:34:43 +0800
Subject: [PATCH]  * menu: add headerClass and footerClass to searchMenu.

---
 lib/menu/src/component/search-menu.tsx    | 8 ++++----
 lib/menu/src/types/search-menu-options.ts | 3 +++
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/lib/menu/src/component/search-menu.tsx b/lib/menu/src/component/search-menu.tsx
index c114c2d57b..80a1473df7 100644
--- a/lib/menu/src/component/search-menu.tsx
+++ b/lib/menu/src/component/search-menu.tsx
@@ -157,14 +157,14 @@ export class SearchMenu<T extends SearchMenuOptions = SearchMenuOptions> extends
 
     protected _renderWrapperHeader(props: RenderableProps<T>): ComponentChildren {
         const hasHeader = props.header;
-        const {noMatchHint, searchBox, searchPlacement, nestedSearch} = props;
+        const {noMatchHint, searchBox, searchPlacement, nestedSearch, headerClass} = props;
         const hasTopSearchBox = (!nestedSearch || this.isRoot) && searchBox && searchPlacement !== 'bottom';
         if (!hasHeader && !hasTopSearchBox && !noMatchHint) {
             return null;
         }
         return [
             noMatchHint ? <div key="noMatchHint" className="search-menu-no-match-hint">{noMatchHint}</div> : null,
-            (hasHeader || hasTopSearchBox) ? (<header key="header" className="search-menu-header">
+            (hasHeader || hasTopSearchBox) ? (<header key="header" className={classes('search-menu-header', headerClass)}>
                 {hasHeader ? super._renderWrapperHeader(props) : null}
                 {hasTopSearchBox ? this._renderSearchBox(props) : null}
             </header>) : null,
@@ -173,13 +173,13 @@ export class SearchMenu<T extends SearchMenuOptions = SearchMenuOptions> extends
 
     protected _renderWrapperFooter(props: RenderableProps<T>): ComponentChildren {
         const hasFooter = props.footer;
-        const {searchBox, searchPlacement, nestedSearch} = props;
+        const {searchBox, searchPlacement, nestedSearch, footerClass} = props;
         const hasBottomSearchBox = (!nestedSearch || this.isRoot) && searchBox && searchPlacement === 'bottom';
         if (!hasFooter && !hasBottomSearchBox) {
             return null;
         }
         return (
-            <footer key="footer" className="search-menu-footer">
+            <footer key="footer" className={classes('search-menu-footer', footerClass)}>
                 {hasFooter ? super._renderWrapperFooter(props) : null}
                 {hasBottomSearchBox ? this._renderSearchBox(props) : null}
             </footer>
diff --git a/lib/menu/src/types/search-menu-options.ts b/lib/menu/src/types/search-menu-options.ts
index 22458688fd..971be31d4b 100644
--- a/lib/menu/src/types/search-menu-options.ts
+++ b/lib/menu/src/types/search-menu-options.ts
@@ -1,3 +1,4 @@
+import type {ClassNameLike} from '@zui/core';
 import type {SearchBoxOptions} from '@zui/search-box';
 import type {MenuOptions} from './menu-options';
 import type {ItemKey} from '@zui/common-list';
@@ -13,6 +14,8 @@ export interface SearchMenuOptions<T extends NestedItem = NestedListItem> extend
     underlineKeys?: boolean;
     searchProps?: string[];
     noMatchHint?: string;
+    headerClass?: ClassNameLike;
+    footerClass?: ClassNameLike;
     limit?: number;
     isItemMatch?: (item: NestedItem, searchKeys: string[], index: number, parentKey: ItemKey | undefined) => boolean;
 }