refactor: remove no longer needed Aura button workaround (#10177)

web-padawan · web-flow · commit 83d91c40a18d · 2025-09-15T17:33:36.000+03:00
diff --git a/packages/aura/src/components/button.css b/packages/aura/src/components/button.css
@@ -3,13 +3,12 @@
   --vaadin-button-shadow: 0 1px 4px -1px hsla(0, 0%, 0%, 0.07);
 }
 
-/* TODO Avoid styling message-input button with :not([slot=button]) */
-:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):where(:not([slot='button'])) {
+:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle) {
   transition: scale 180ms;
   position: relative;
 }
 
-:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):where(:not([slot='button'], [theme~='tertiary'])) {
+:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):where(:not([theme~='tertiary'])) {
   --aura-surface-level: 6;
   --aura-surface-opacity: 0.3;
   box-shadow: var(--vaadin-button-shadow);
@@ -32,20 +31,19 @@ Increase padding, but only for buttons that don't have an icon in the default sl
 Buttons that place an icon in the default slot are assumed to be icon-only buttons.
 */
 /* prettier-ignore */
-:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([slot='button']):not(:has(:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar):not([slot]))) {
+:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not(:has(:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar):not([slot]))) {
   --vaadin-button-padding: round(var(--vaadin-padding-s) / 1.4, 1px)
     max(var(--vaadin-padding-m), round(var(--vaadin-radius-m) / 1.5, 1px));
 }
 
 /* Decrease padding when an icon is placed in the prefix or suffix slot */
-/* prettier-ignore */
-:is(vaadin-button, vaadin-menu-bar-button):not([slot='button']):has([slot='prefix']:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar)),
+:is(vaadin-button, vaadin-menu-bar-button):has([slot='prefix']:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar)),
 vaadin-drawer-toggle:empty {
   padding-inline-start: max(var(--vaadin-padding-s), round(var(--vaadin-radius-m) / 1.75, 1px));
 }
 
 /* prettier-ignore */
-:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([slot='button']):has([slot='suffix']:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar)),
+:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):has([slot='suffix']:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar)),
 vaadin-drawer-toggle:empty,
 vaadin-menu-bar-button[aria-haspopup='true'] {
   padding-inline-end: max(var(--vaadin-padding-s), round(var(--vaadin-radius-m) / 1.75, 1px));
@@ -60,7 +58,7 @@ vaadin-menu-bar-button[aria-haspopup='true'] {
   --vaadin-button-text-color: var(--vaadin-color-subtle);
 }
 
-:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([slot='button'], [disabled])::before {
+:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([disabled])::before {
   content: '';
   position: absolute;
   inset: calc(var(--vaadin-button-border-width, 1px) * -1);
@@ -74,7 +72,7 @@ vaadin-menu-bar-button[aria-haspopup='true'] {
 }
 
 @supports (color: hsl(0 0 0)) {
-  :is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([slot='button'], [disabled])::before {
+  :is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([disabled])::before {
     background-color: oklch(from currentColor calc(l + 0.4 - c) c h);
   }
 }
@@ -92,20 +90,19 @@ vaadin-menu-bar-button[aria-haspopup='true'] {
 
 @media (min-resolution: 2x) {
   /* prettier-ignore */
-  :is(vaadin-button, vaadin-menu-bar-button[first-visible][last-visible], vaadin-drawer-toggle)[active]:not([slot='button'], [disabled], [aria-disabled='true']) {
+  :is(vaadin-button, vaadin-menu-bar-button[first-visible][last-visible], vaadin-drawer-toggle)[active]:not([disabled], [aria-disabled='true']) {
     scale: 0.98;
     transition-duration: 50ms;
   }
 }
 
-:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle)[active]:not([slot='button'], [disabled])::before {
+:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle)[active]:not([disabled])::before {
   transition-duration: 0s;
   opacity: 0.08;
   background: oklch(from currentColor min(c, 1 - l + c) calc(c * 0.9) h);
 }
 
-/* prettier-ignore */
-:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle)[theme~='primary'][active]:not([slot='button'], [disabled])::before {
+:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle)[theme~='primary'][active]:not([disabled])::before {
   opacity: 0.16;
 }
 
