Skip to content

Commit

Permalink
fix(material/autocomplete): Optimized performance by first checking i…
Browse files Browse the repository at this point in the history
…f the form field has an outline appearance.

Fix #27476
  • Loading branch information
kharazian committed Aug 31, 2023
1 parent 81b5bef commit c6f883c
Showing 1 changed file with 6 additions and 7 deletions.
13 changes: 6 additions & 7 deletions src/material/autocomplete/autocomplete-trigger.ts
Original file line number Diff line number Diff line change
Expand Up @@ -831,13 +831,12 @@ export class MatAutocompleteTrigger
// border-radius based on the overlay position.
const panelClass = this._aboveClass;

/**
* Calculate the vertical offset for the overlay when the input field has an outline appearance.
* In the outline appearance, the overlay should have extra space to display the label correctly.
*/
const outlineHeight =
this._formField?._floatingLabel?.element.getBoundingClientRect().height || 0;
const offsetY = this._formField?._hasOutline() ? -outlineHeight / 2 : 0;
// Calculate the vertical offset for the overlay when the input field has an outline appearance.
// In the outline appearance, the overlay should have extra space to display the label correctly.
let offsetY = 0;
if (this._formField?._hasOutline()) {
offsetY = -(this._formField?._floatingLabel?.element.getBoundingClientRect().height || 0) / 2;
}

const abovePositions: ConnectedPosition[] = [
{
Expand Down

0 comments on commit c6f883c

Please sign in to comment.