diff --git a/src/components/dropdown/dropdown.css b/src/components/dropdown/dropdown.css
index eef5d4788..02458086b 100644
--- a/src/components/dropdown/dropdown.css
+++ b/src/components/dropdown/dropdown.css
@@ -2,6 +2,7 @@
--box-shadow: var(--wa-shadow-m);
display: inline-block;
+ border-radius: var(--wa-form-control-border-radius);
}
.dropdown::part(popup) {
@@ -24,8 +25,14 @@
transform-origin: left;
}
-.trigger {
- display: block;
+#trigger {
+ display: block; /* for boundingClientRect */
+
+ &,
+ &::slotted(*) {
+ /* Otherwise button groups don't work well with dropdown, see #348 */
+ border-radius: inherit !important;
+ }
}
.panel {
diff --git a/src/components/dropdown/dropdown.ts b/src/components/dropdown/dropdown.ts
index a41e4b536..9e50b9baa 100644
--- a/src/components/dropdown/dropdown.ts
+++ b/src/components/dropdown/dropdown.ts
@@ -46,7 +46,7 @@ export default class WaDropdown extends WebAwesomeElement {
static shadowStyle = styles;
@query('.dropdown') popup: WaPopup;
- @query('.trigger') trigger: HTMLSlotElement;
+ @query('#trigger') trigger: HTMLSlotElement;
@query('.panel') panel: HTMLSlotElement;
private closeWatcher: CloseWatcher | null;
@@ -409,10 +409,20 @@ export default class WaDropdown extends WebAwesomeElement {
render() {
return html`
+
-
-