diff --git a/packages/pro/search/src/ProSearch.tsx b/packages/pro/search/src/ProSearch.tsx index 79091ee6d..462f4cd27 100644 --- a/packages/pro/search/src/ProSearch.tsx +++ b/packages/pro/search/src/ProSearch.tsx @@ -137,6 +137,7 @@ export default defineComponent({ locale: locale.search, mergedPrefixCls, commonOverlayProps, + focused, ...searchStateContext, ...activeSegmentContext, diff --git a/packages/pro/search/src/searchItem/Segment.tsx b/packages/pro/search/src/searchItem/Segment.tsx index f00f4a6f9..74f4d9982 100644 --- a/packages/pro/search/src/searchItem/Segment.tsx +++ b/packages/pro/search/src/searchItem/Segment.tsx @@ -32,7 +32,7 @@ export default defineComponent({ props: segmentProps, setup(props: SegmentProps) { const context = inject(proSearchContext)! - const { mergedPrefixCls, commonOverlayProps, activeSegment, searchStates, setActiveSegment } = context + const { mergedPrefixCls, commonOverlayProps, focused, activeSegment, searchStates, setActiveSegment } = context const overlayRef = ref<ɵOverlayInstance>() const segmentInputRef = ref() const measureSpanRef = ref() @@ -59,7 +59,7 @@ export default defineComponent({ const isActive = computed( () => activeSegment.value?.itemKey === props.itemKey && activeSegment.value.name === props.segment.name, ) - const overlayOpened = computed(() => isActive.value && !!activeSegment.value?.overlayOpened) + const overlayOpened = computed(() => focused.value && isActive.value && !!activeSegment.value?.overlayOpened) const inputWidth = useInputWidth(measureSpanRef) const inputStyle = computed(() => ({ @@ -170,12 +170,8 @@ export default defineComponent({ > ) - const renderContent = () => { - if (!overlayOpened.value) { - return - } - - const renderedContent = props.segment.panelRenderer?.({ + const renderContent = () => + props.segment.panelRenderer?.({ input: props.input ?? '', value: props.value, cancel: handleCancel, @@ -184,9 +180,6 @@ export default defineComponent({ setOnKeyDown: setPanelOnKeyDown, }) - return renderedContent - } - return () => { const { panelRenderer } = props.segment const prefixCls = `${mergedPrefixCls.value}-segment` diff --git a/packages/pro/search/src/token.ts b/packages/pro/search/src/token.ts index 00c0f8bb0..a11c57074 100644 --- a/packages/pro/search/src/token.ts +++ b/packages/pro/search/src/token.ts @@ -21,6 +21,7 @@ export interface ProSearchContext extends SearchStateContext, ActiveSegmentConte locale: ProSearchLocale mergedPrefixCls: ComputedRef commonOverlayProps: ComputedRef<ɵOverlayProps> + focused: ComputedRef } export interface SearchItemContext extends SegmentOverlayUpdateContext, SegmentStatesContext {}