paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-23 16:14:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

typeahead: Fix compose topic typeahead partially hidden.

Browse Source 
The `flip` popper function is not working properly here since
we migrated to use Simplebar (Can be verified by removing
`data-simplebar`).

To fix it, we need to force trigger the function as soon as tippy
is attached to DOM.

(cherry picked from commit 240c870815)
This commit is contained in:
Aman Agrawal
2024-09-02 08:13:08 +00:00
committed by Tim Abbott
parent b10b412bd8
commit aeec61476c
1 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
web/src/bootstrap_typeahead.ts
View File

@@ -455,27 +455,27 @@ export class Typeahead<ItemType extends string | object> {
}
return [0, gap];
},
onShow(instance) {
if (input_element.type === "textarea") {
// Since we use an offset which can partially hide typeahead
// at certain caret positions, we need to push it back into
// view once we have rendered the typeahead. The movement
// feels like an animation to the user.
setTimeout(() => {
// This detects any overflows by default and adjusts
// the placement of typeahead.
void instance.popperInstance?.update();
}, 0);
}
},
// We have event handlers to hide the typeahead, so we
// don't want tippy to hide it for us.
hideOnClick: false,
onMount: () => {
onMount: (instance) => {
// The container has `display: none` as a default style.
// We make sure to display it. For tippy elements, this
// must happen after we insert the typeahead into the DOM.
this.$container.show();
// Reasons to update the position of the typeahead here:
// * Simplebar causes the height of the typeahead to
// change, which can cause the typeahead to go off
// screen like in compose topic typeahead.
// * Since we use an offset which can partially hide
// typeahead at certain caret positions in textarea
// input, we need to push it back into view once we
// have rendered the typeahead.
requestAnimationFrame(() => {
// This detects any overflows by default and adjusts
// the placement of typeahead.
void instance.popperInstance?.update();
});
},
});
}