From 3d8995f8100743f77e0341448bed7a0dc42a93b4 Mon Sep 17 00:00:00 2001
From: Markus Sanin <markus.sanin@zeppelin-group.com>
Date: Fri, 12 Dec 2025 20:17:13 +0100
Subject: [PATCH 1/2] Add @triggerHtmlTag and remove `htmlTag` from yielded
 trigger component

---
 docs/app/templates/public-pages.gts                   |  3 +--
 .../src/components/basic-dropdown-trigger.gts         |  2 +-
 .../src/components/basic-dropdown.gts                 | 11 ++++++++++-
 .../integration/components/basic-dropdown-test.gts    | 11 +++++------
 4 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/docs/app/templates/public-pages.gts b/docs/app/templates/public-pages.gts
index fb133018..f6192d1a 100644
--- a/docs/app/templates/public-pages.gts
+++ b/docs/app/templates/public-pages.gts
@@ -74,13 +74,12 @@ export default class extends Component {
           >Github</a>
         </div>
         <div class="main-header-logo">
-          <BasicDropdown @calculatePosition={{this.calculatePosition}} as |dd|>
+          <BasicDropdown @triggerHtmlTag="span" @calculatePosition={{this.calculatePosition}} as |dd|>
             <LinkTo @route="public-pages.index" class="home-link">
               <img src="/ember_logo.png" alt="ember" />
               <strong>Basic</strong>
               {{! template-lint-disable no-pointer-down-event-binding }}
               <dd.Trigger
-                @htmlTag="span"
                 {{on "mousedown" this.preventIfNotInIndex}}
                 {{on "touchend" this.preventIfNotInIndex}}
                 class="logo-dropdown-button"
diff --git a/ember-basic-dropdown/src/components/basic-dropdown-trigger.gts b/ember-basic-dropdown/src/components/basic-dropdown-trigger.gts
index 5d3c11a9..9454e79c 100644
--- a/ember-basic-dropdown/src/components/basic-dropdown-trigger.gts
+++ b/ember-basic-dropdown/src/components/basic-dropdown-trigger.gts
@@ -19,7 +19,7 @@ export interface BasicDropdownTriggerSignature {
     hPosition?: HorizontalPosition | null;
     defaultClass?: string;
     renderInPlace?: boolean;
-    htmlTag?: keyof HTMLElementTagNameMap;
+    htmlTag?: keyof HTMLElementTagNameMap | undefined;
     onBlur?: (dropdown?: Dropdown, event?: FocusEvent) => void;
     onClick?: (dropdown?: Dropdown, event?: MouseEvent) => void;
     onFocus?: (dropdown?: Dropdown, event?: FocusEvent) => void;
diff --git a/ember-basic-dropdown/src/components/basic-dropdown.gts b/ember-basic-dropdown/src/components/basic-dropdown.gts
index 33972970..356e1f1d 100644
--- a/ember-basic-dropdown/src/components/basic-dropdown.gts
+++ b/ember-basic-dropdown/src/components/basic-dropdown.gts
@@ -40,7 +40,14 @@ export interface BasicDropdownDefaultBlock {
   disabled: boolean;
   isOpen: boolean;
   actions: DropdownActions;
-  Trigger: ComponentLike<BasicDropdownTriggerSignature>;
+  Trigger: ComponentLike<
+    Omit<BasicDropdownTriggerSignature, 'Args'> & {
+      Args: Omit<
+        BasicDropdownTriggerSignature['Args'],
+        'htmlTag'
+      >;
+    }
+  >;
   Content: ComponentLike<BasicDropdownContentSignature>;
 }
 
@@ -64,6 +71,7 @@ export interface BasicDropdownArgs {
   rootEventType?: TRootEventType;
   preventScroll?: boolean;
   matchTriggerWidth?: boolean;
+  triggerHtmlTag?: keyof HTMLElementTagNameMap;
   onInit?: (dropdown: Dropdown) => void;
   registerAPI?: (dropdown: Dropdown | null) => void;
   onOpen?: (dropdown: Dropdown, e?: Event) => boolean | void;
@@ -517,6 +525,7 @@ export default class BasicDropdown extends Component<BasicDropdownSignature> {
           hPosition=this.hPosition
           renderInPlace=this.renderInPlace
           vPosition=this.vPosition
+          htmlTag=@triggerHtmlTag
         )
         Content=(component
           this.contentComponent
diff --git a/test-app/tests/integration/components/basic-dropdown-test.gts b/test-app/tests/integration/components/basic-dropdown-test.gts
index caf3add5..4aca2704 100644
--- a/test-app/tests/integration/components/basic-dropdown-test.gts
+++ b/test-app/tests/integration/components/basic-dropdown-test.gts
@@ -1325,26 +1325,25 @@ module('Integration | Component | basic-dropdown', function (hooks) {
 
     await render(
       <template>
-        <BasicDropdown as |parent|>
-          <parent.Trigger class="parent" @htmlTag="button">Trigger of the first
+        <BasicDropdown @triggerHtmlTag="button" as |parent|>
+          <parent.Trigger class="parent">Trigger of the first
             dropdown</parent.Trigger>
           <parent.Content @overlay={{true}}>
-            <BasicDropdown as |child|>
+            <BasicDropdown @triggerHtmlTag="button" as |child|>
               <p class="body-parent">
                 <br />First level of the dropdpwn<br />
               </p>
-              <child.Trigger class="child" @htmlTag="button">Trigger of the
+              <child.Trigger class="child">Trigger of the
                 second dropdown</child.Trigger>
               <child.Content @overlay={{true}}>
                 <p class="body-child">
                   <br />Second level of the second<br />
-                  <BasicDropdown as |grandchild|>
+                  <BasicDropdown @triggerHtmlTag="button" as |grandchild|>
                     <p>
                       <br />Second level of the dropdpwn<br />
                     </p>
                     <grandchild.Trigger
                       class="grandchild"
-                      @htmlTag="button"
                     >Trigger of the Third dropdown</grandchild.Trigger>
                     <grandchild.Content @overlay={{true}}>
                       <p class="body-grandchild">

From 514de23c21fa8b6d61085396891d183f4387ef88 Mon Sep 17 00:00:00 2001
From: Markus Sanin <markus.sanin@zeppelin-group.com>
Date: Fri, 12 Dec 2025 20:20:44 +0100
Subject: [PATCH 2/2] Fix lint

---
 docs/app/templates/public-pages.gts                   |  6 +++++-
 .../src/components/basic-dropdown.gts                 |  5 +----
 .../integration/components/basic-dropdown-test.gts    | 11 ++++-------
 3 files changed, 10 insertions(+), 12 deletions(-)

diff --git a/docs/app/templates/public-pages.gts b/docs/app/templates/public-pages.gts
index f6192d1a..c0024538 100644
--- a/docs/app/templates/public-pages.gts
+++ b/docs/app/templates/public-pages.gts
@@ -74,7 +74,11 @@ export default class extends Component {
           >Github</a>
         </div>
         <div class="main-header-logo">
-          <BasicDropdown @triggerHtmlTag="span" @calculatePosition={{this.calculatePosition}} as |dd|>
+          <BasicDropdown
+            @triggerHtmlTag="span"
+            @calculatePosition={{this.calculatePosition}}
+            as |dd|
+          >
             <LinkTo @route="public-pages.index" class="home-link">
               <img src="/ember_logo.png" alt="ember" />
               <strong>Basic</strong>
diff --git a/ember-basic-dropdown/src/components/basic-dropdown.gts b/ember-basic-dropdown/src/components/basic-dropdown.gts
index 356e1f1d..c04c5c42 100644
--- a/ember-basic-dropdown/src/components/basic-dropdown.gts
+++ b/ember-basic-dropdown/src/components/basic-dropdown.gts
@@ -42,10 +42,7 @@ export interface BasicDropdownDefaultBlock {
   actions: DropdownActions;
   Trigger: ComponentLike<
     Omit<BasicDropdownTriggerSignature, 'Args'> & {
-      Args: Omit<
-        BasicDropdownTriggerSignature['Args'],
-        'htmlTag'
-      >;
+      Args: Omit<BasicDropdownTriggerSignature['Args'], 'htmlTag'>;
     }
   >;
   Content: ComponentLike<BasicDropdownContentSignature>;
diff --git a/test-app/tests/integration/components/basic-dropdown-test.gts b/test-app/tests/integration/components/basic-dropdown-test.gts
index 4aca2704..b873b9ba 100644
--- a/test-app/tests/integration/components/basic-dropdown-test.gts
+++ b/test-app/tests/integration/components/basic-dropdown-test.gts
@@ -1326,15 +1326,13 @@ module('Integration | Component | basic-dropdown', function (hooks) {
     await render(
       <template>
         <BasicDropdown @triggerHtmlTag="button" as |parent|>
-          <parent.Trigger class="parent">Trigger of the first
-            dropdown</parent.Trigger>
+          <parent.Trigger class="parent">Trigger of the first dropdown</parent.Trigger>
           <parent.Content @overlay={{true}}>
             <BasicDropdown @triggerHtmlTag="button" as |child|>
               <p class="body-parent">
                 <br />First level of the dropdpwn<br />
               </p>
-              <child.Trigger class="child">Trigger of the
-                second dropdown</child.Trigger>
+              <child.Trigger class="child">Trigger of the second dropdown</child.Trigger>
               <child.Content @overlay={{true}}>
                 <p class="body-child">
                   <br />Second level of the second<br />
@@ -1342,9 +1340,8 @@ module('Integration | Component | basic-dropdown', function (hooks) {
                     <p>
                       <br />Second level of the dropdpwn<br />
                     </p>
-                    <grandchild.Trigger
-                      class="grandchild"
-                    >Trigger of the Third dropdown</grandchild.Trigger>
+                    <grandchild.Trigger class="grandchild">Trigger of the Third
+                      dropdown</grandchild.Trigger>
                     <grandchild.Content @overlay={{true}}>
                       <p class="body-grandchild">
                         <br />Third level of the third<br />