From 12721881d2fd1e98b6f1c16930e86818a47b4804 Mon Sep 17 00:00:00 2001
From: Carey Gumaer <gumaerc@mit.edu>
Date: Tue, 17 Sep 2024 16:33:38 -0400
Subject: [PATCH] properly add Mit-AdornmentButton class

---
 frontends/ol-components/package.json                   | 1 +
 frontends/ol-components/src/components/Input/Input.tsx | 9 +++++++--
 yarn.lock                                              | 3 ++-
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/frontends/ol-components/package.json b/frontends/ol-components/package.json
index 35c7451f14..8942839161 100644
--- a/frontends/ol-components/package.json
+++ b/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",
diff --git a/frontends/ol-components/src/components/Input/Input.tsx b/frontends/ol-components/src/components/Input/Input.tsx
index 86d7c2f844..a8492e8bb5 100644
--- a/frontends/ol-components/src/components/Input/Input.tsx
+++ b/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,7 +219,10 @@ 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
       /**
@@ -226,7 +230,8 @@ const AdornmentButton: React.FC<AdornmentButtonProps> = (props) => {
        * want to steal focus from the input.
        */
       onMouseDown={noFocus}
-      {...props}
+      className={ClassNames("Mit-AdornmentButton", className)}
+      {...others}
     />
   )
 }
diff --git a/yarn.lock b/yarn.lock
index 0288ed15a1..1e89b14af4 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7565,7 +7565,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"classnames@npm:^2.2.5, classnames@npm:^2.2.6, classnames@npm:^2.3.2":
+"classnames@npm:^2.2.5, classnames@npm:^2.2.6, classnames@npm:^2.3.2, classnames@npm:^2.5.1":
   version: 2.5.1
   resolution: "classnames@npm:2.5.1"
   checksum: 10/58eb394e8817021b153bb6e7d782cfb667e4ab390cb2e9dac2fc7c6b979d1cc2b2a733093955fc5c94aa79ef5c8c89f11ab77780894509be6afbb91dddd79d15
@@ -15402,6 +15402,7 @@ __metadata:
     "@types/react-slick": "npm:^0"
     "@types/tinycolor2": "npm:^1.4.6"
     api: "workspace:*"
+    classnames: "npm:^2.5.1"
     iso-639-1: "npm:^3.1.2"
     lodash: "npm:^4.17.21"
     material-ui-popup-state: "npm:^5.1.0"