fix: handle picker at screen edge (x)

GetmeUK · Mar 13, 2023 · 8835aa1 · 8835aa1
1 parent fbac3de
commit 8835aa1
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/module/time-picker.js b/module/time-picker.js
@@ -342,14 +342,21 @@ export class TimePicker {
         const left = rect.left + window.pageXOffset
 
         const pickerRect = this.picker.getBoundingClientRect()
+        const pickerRight = left + pickerRect.width
         const pickerBottom = top + pickerRect.height
 
+        if (pickerRight > document.body.scrollWidth) {
+            this.picker.style
+                .left = `${document.body.scrollWidth - pickerRect.width}px`
+        } else {
+            this.picker.style.left = `${left}px`
+        }
+
         if (pickerBottom > document.body.scrollHeight) {
             this.picker.style.top = `${top - pickerRect.height - offset}px`
         } else {
             this.picker.style.top = `${top + rect.height + offset}px`
         }
-        this.picker.style.left = `${left}px`
     }
 }
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "manhattan-time-picker",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Time parsing and picking for form fields.",
   "engines": {
     "node": ">=10.16.0"