properly add Mit-AdornmentButton class (#1574)

frontends/ol-components/package.json

@@ -20,6 +20,7 @@
     "@types/react-dom": "^18.3.0",
     "@types/tinycolor2": "^1.4.6",
     "api": "workspace:*",
+    "classnames": "^2.5.1",
     "iso-639-1": "^3.1.2",
     "lodash": "^4.17.21",
     "material-ui-popup-state": "^5.1.0",

frontends/ol-components/src/components/Input/Input.tsx

@@ -3,6 +3,7 @@ import styled from "@emotion/styled"
 import InputBase from "@mui/material/InputBase"
 import type { InputBaseProps } from "@mui/material/InputBase"
 import type { Theme } from "@mui/material/styles"
+import ClassNames from "classnames"
 
 type Size = NonNullable<InputBaseProps["size"]>
 
@@ -218,15 +219,19 @@ type AdornmentButtonProps = React.ComponentProps<typeof AdornmentButtonStyled>
  *    click. The button is still focusable via keyboard events. You can override
  *    this behavior by passing your own `onMouseDown` handler.
  */
-const AdornmentButton: React.FC<AdornmentButtonProps> = (props) => {
+const AdornmentButton: React.FC<AdornmentButtonProps> = ({
+  className,
+  ...others
+}) => {
   return (
     <AdornmentButtonStyled
       /**
        * If the input is focused and user clicks the AdornmentButton, we don't
        * want to steal focus from the input.
        */
       onMouseDown={noFocus}
-      {...props}
+      className={ClassNames("Mit-AdornmentButton", className)}
+      {...others}
     />
   )
 }