diff --git a/packages/pro/search/src/ProSearch.tsx b/packages/pro/search/src/ProSearch.tsx index 2bcb2d3f9..ff7999bb5 100644 --- a/packages/pro/search/src/ProSearch.tsx +++ b/packages/pro/search/src/ProSearch.tsx @@ -98,6 +98,17 @@ export default defineComponent({ zIndex: currentZIndex.value, }), ) + const searchItemContainerStyle = computed(() => { + if (!focused.value) { + return normalizeStyle({ + height: 0, + width: 0, + opacity: 0, + }) + } + + return undefined + }) expose({ focus, blur }) @@ -167,7 +178,7 @@ export default defineComponent({ getKey={item => item.key} maxLabel={props.maxLabel} /> -
+
{searchItems.value?.map(item => ( ))} diff --git a/packages/pro/search/src/composables/useFocusedState.ts b/packages/pro/search/src/composables/useFocusedState.ts index b4ee40992..def9d0b33 100644 --- a/packages/pro/search/src/composables/useFocusedState.ts +++ b/packages/pro/search/src/composables/useFocusedState.ts @@ -62,15 +62,20 @@ export function useFocusedState( setFocused(false) } - registerHandlers(elementRef, () => getContainerEl(commonOverlayProps.value.container), _handleFocus, handleBlur) + registerHandlers(elementRef, () => getContainerEl(commonOverlayProps.value), _handleFocus, handleBlur) return { focused, focus, blur } } -function getContainerEl(containerProp: ɵOverlayProps['container']): HTMLElement | null { - const container = isFunction(containerProp) ? containerProp() : containerProp +function getContainerEl(commonOverlayProps: ɵOverlayProps): HTMLElement | null { + const container = isFunction(commonOverlayProps.container) + ? commonOverlayProps.container() + : commonOverlayProps.container + const resolvedContainer = container ?? commonOverlayProps.containerFallback - return isString(container) ? document.querySelector(/^[.#]/.test(container) ? container : `.${container}`) : container + return isString(resolvedContainer) + ? document.querySelector(/^[.#]/.test(resolvedContainer) ? resolvedContainer : `.${resolvedContainer}`) + : resolvedContainer } function useFocusHandlers( diff --git a/packages/pro/search/src/searchItem/SearchItem.tsx b/packages/pro/search/src/searchItem/SearchItem.tsx index 0293e2e2b..282691d00 100644 --- a/packages/pro/search/src/searchItem/SearchItem.tsx +++ b/packages/pro/search/src/searchItem/SearchItem.tsx @@ -54,7 +54,6 @@ export default defineComponent({ const classes = computed(() => { return normalizeClass({ [prefixCls.value]: true, - [`${prefixCls.value}-tag`]: !isActive.value, [`${prefixCls.value}-invalid`]: !!props.searchItem?.error, }) })