RTL: incorrect overlay position when closer to the left edge of viewport

[Pekka Maanpää]

In RTL mode, when the field is closer to the right edge of the viewport, it works as expected:

When the field is closer to the left edge, the overlay goes to the right side of the viewport:

It's related to the logic for flipping the overlay when closer to the other edge:

vaadin-date-picker/src/vaadin-date-picker-mixin.html

Lines 568 to 579 in 4ce176a

 const rightAlign = inputRect.left + this.clientWidth / 2 > window.innerWidth / 2; 
  
 if (rightAlign) { 
   const viewportWidth = Math.min(window.innerWidth, document.documentElement.clientWidth); 
   this.$.overlay.setAttribute('right-aligned', ''); 
   this.$.overlay.style.removeProperty('left'); 
   this.$.overlay.style.right = (viewportWidth - inputRect.right) + 'px'; 
 } else { 
   this.$.overlay.removeAttribute('right-aligned'); 
   this.$.overlay.style.removeProperty('right'); 
   this.$.overlay.style.left = inputRect.left + 'px'; 
 }