refactor(core): add forward refs to base components

BREAKING CHANGE: base components can hold a ref.
dhis2 · Mar 23, 2020 · 699b194 · 699b194
1 parent 2207bf2
commit 699b194
Showing 1 changed file with 29 additions and 21 deletions.
diff --git a/packages/core/src/ButtonBase/ButtonBase.js b/packages/core/src/ButtonBase/ButtonBase.js
@@ -10,32 +10,40 @@ import styles from './ButtonBase.styles.js'
  * @param {ButtonBase.PropTypes} props
  * @returns {React.Component}
  */
-export const ButtonBase = ({
-    children,
-    className,
-    primary,
-    secondary,
-    destructive,
-    small,
-    large,
-    disabled,
-    ...props
-}) => (
-    <button
-        {...props}
-        className={cx(className, {
+function ButtonBase(
+        {
+            children,
+            className,
             primary,
             secondary,
             destructive,
             small,
             large,
-        })}
-        disabled={disabled}
-    >
-        {children}
-        <style jsx>{styles}</style>
-    </button>
-)
+            disabled,
+            ...props
+        },
+        ref
+    ) {
+        return (
+            <button
+                {...props}
+                className={cx(className, {
+                    primary,
+                    secondary,
+                    destructive,
+                    small,
+                    large,
+                })}
+                disabled={disabled}
+                ref={ref}
+            >
+                {children}
+                <style jsx>{styles}</style>
+            </button>
+        )
+    }
+
+export default React.forwardRef(ButtonBase)
 
 /**
  * @typedef {Object} PropTypes