diff --git a/src/PaymentElementRenderer.res b/src/PaymentElementRenderer.res
index 0a8cef4f3..1bc1a9f82 100644
--- a/src/PaymentElementRenderer.res
+++ b/src/PaymentElementRenderer.res
@@ -25,3 +25,5 @@ let make = (
:
}
}
+
+let default = make
diff --git a/src/PaymentElementRenderer.resi b/src/PaymentElementRenderer.resi
index c91ffa89a..a52c10213 100644
--- a/src/PaymentElementRenderer.resi
+++ b/src/PaymentElementRenderer.resi
@@ -1,5 +1,5 @@
@react.component
-let make: (
+let default: (
~paymentType: CardThemeType.mode,
~cardProps: CardUtils.cardProps,
~expiryProps: CardUtils.expiryProps,
diff --git a/src/PaymentElementRendererLazy.res b/src/PaymentElementRendererLazy.res
new file mode 100644
index 000000000..233aafa9d
--- /dev/null
+++ b/src/PaymentElementRendererLazy.res
@@ -0,0 +1 @@
+let make = React.lazy_(() => Js.import(PaymentElementRenderer.default))
diff --git a/src/RenderPaymentMethods.res b/src/RenderPaymentMethods.res
index a5bf5a21f..368e64c5a 100644
--- a/src/RenderPaymentMethods.res
+++ b/src/RenderPaymentMethods.res
@@ -94,8 +94,8 @@ let make = (
?
: }
}
- componentName="PaymentElementRenderer">
-
+ componentName="PaymentElementRendererLazy">
+
| CardNumberElement =>