From 92ce3a480cfd553d55836512b500554a780bf9f8 Mon Sep 17 00:00:00 2001
From: Wilbert Mui <wmui51@yahoo.com>
Date: Wed, 23 Aug 2023 23:25:56 -0700
Subject: [PATCH] feat: add buttonRef prop

---
 packages/button/src/Button.js                     | 8 +++++++-
 packages/button/src/presenters/ButtonPresenter.js | 3 +++
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/packages/button/src/Button.js b/packages/button/src/Button.js
index 50da43ce05..4f640dcb69 100644
--- a/packages/button/src/Button.js
+++ b/packages/button/src/Button.js
@@ -14,6 +14,7 @@ import ButtonPresenter from "./presenters/ButtonPresenter";
 
 const Button = (props) => {
   const {
+    buttonRef,
     disabled,
     icon,
     link,
@@ -54,6 +55,7 @@ const Button = (props) => {
         onMouseUp: handleMouseUp,
       }) => (
         <ButtonPresenter
+          buttonRef={buttonRef}
           disabled={disabled}
           hasFocus={hasFocus}
           hasHover={hasHover}
@@ -89,12 +91,16 @@ Button.defaultProps = {
 };
 
 Button.propTypes = {
+  /**
+   * A callback ref that gets passed to the HTML button
+   */
+  buttonRef: PropTypes.func,
   /**
    * Prevents user interaction with the button
    */
   disabled: PropTypes.bool,
   /**
-   * A @hig/icon element
+   * A @weave-design/icon element
    */
   icon: PropTypes.node,
   /**
diff --git a/packages/button/src/presenters/ButtonPresenter.js b/packages/button/src/presenters/ButtonPresenter.js
index 7c0ee27cb9..6f7042ad16 100644
--- a/packages/button/src/presenters/ButtonPresenter.js
+++ b/packages/button/src/presenters/ButtonPresenter.js
@@ -14,6 +14,7 @@ import {
 
 const ButtonPresenter = (props) => {
   const {
+    buttonRef,
     disabled,
     hasFocus,
     hasHover,
@@ -61,6 +62,7 @@ const ButtonPresenter = (props) => {
         return (
           <Wrapper
             {...otherProps}
+            ref={buttonRef}
             className={cx(css(cssStyles.button), className)}
             href={href}
             tabIndex={tabIndex}
@@ -97,6 +99,7 @@ const ButtonPresenter = (props) => {
 ButtonPresenter.displayName = "ButtonPresenter";
 
 ButtonPresenter.propTypes = {
+  buttonRef: PropTypes.func,
   disabled: PropTypes.bool,
   hasFocus: PropTypes.bool,
   hasHover: PropTypes.bool,