diff --git a/src/components/BaseElement.tsx b/src/components/BaseElement.tsx
index 244d68b..658a67c 100644
--- a/src/components/BaseElement.tsx
+++ b/src/components/BaseElement.tsx
@@ -14,10 +14,13 @@ export interface BaseElementProps extends React.HTMLProps<any> {
     disabled?: boolean,
     builtinColor?: BuiltinColor,
     customColor?: typeof Color,
+    childRef?: React.RefObject<HTMLElement>,
 }
 
 
-export const BaseElement = React.forwardRef(({kind = "div", bluelibClassNames, disabled = false, builtinColor, customColor, ...props}: BaseElementProps, ref): JSX.Element => {
+// forwardRef has some strange behaviour in TypeScript, so I'm not using it
+
+export const BaseElement = ({kind = "div", bluelibClassNames, disabled = false, builtinColor, customColor, childRef, ...props}: BaseElementProps): JSX.Element => {
     // Set the Bluelib color
     if(customColor) {
         props.style = {...props.style, ...Colors.colorToBluelibStyle("color", customColor)}
@@ -37,7 +40,9 @@ export const BaseElement = React.forwardRef(({kind = "div", bluelibClassNames, d
     props.className = mergeClassNames(props.className, bluelibClassNames)
 
     // Set the ref on the child element
-    props.ref = ref
+    if(childRef) {
+        props.ref = childRef
+    }
 
     return React.createElement(kind, props)
-})
+}
diff --git a/src/components/Bluelib.tsx b/src/components/Bluelib.tsx
index 13aba9e..6b71df4 100644
--- a/src/components/Bluelib.tsx
+++ b/src/components/Bluelib.tsx
@@ -35,7 +35,7 @@ export const Bluelib = (props: BluelibProps): JSX.Element => {
     const element = React.useMemo(
         () => (
             <BaseElement
-                ref={ref}
+                childRef={ref}
                 kind={"div"}
                 bluelibClassNames={"bluelib"}
                 {...baseElementProps}