Merge pull request #474 from nyaruka/dropdown-pointer-events

Use zero height instead of pointer-events for dropdowns
nyaruka · Jan 30, 2025 · 8e0587c · 8e0587c
2 parents ad833f6 + 4ba0421
commit 8e0587c
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 5 deletions.
diff --git a/src/dropdown/Dropdown.ts b/src/dropdown/Dropdown.ts
@@ -29,7 +29,8 @@ export class Dropdown extends RapidElement {
       }
 
       .dropdown.dormant {
-        pointer-events: none;
+        height: 0;
+        overflow: hidden;
       }
 
       .dropdown {
@@ -63,7 +64,6 @@ export class Dropdown extends RapidElement {
 
       .open .dropdown {
         opacity: 1;
-        pointer-events: auto;
         transform: translateY(0.5em) scale(1);
       }
 

diff --git a/src/list/TembaMenu.ts b/src/list/TembaMenu.ts
@@ -647,6 +647,13 @@ export class TembaMenu extends ResizeElement {
         padding: 0.4em 0.2em;
       }
 
+      .level-0 temba-dropdown div[slot='dropdown'] .icon-wrapper {
+        padding: 0em !important;
+        align-self: center;
+        margin-right: 0.4em;
+        margin-left: 0.4em;
+      }
+
       temba-workspace-select {
         margin: 0.2em;
         display: block;

diff --git a/src/select/Select.ts b/src/select/Select.ts
@@ -804,9 +804,6 @@ export class Select<T extends SelectOption> extends FormElement {
   }
 
   public handleOptionSelection(event: CustomEvent) {
-    event.preventDefault();
-    event.stopPropagation();
-
     const selected = event.detail.selected;
     // check if we should post it
     if (selected.post && this.endpoint) {