Working with components

Suggest Edits

Rainforest components are pre-built form templates designed to simplify your integration to Rainforest while retaining your platform's look and feel and control of your merchant and user's experience.


JavaScript bundles

The Rainforest components are defined in the JavaScript bundles. Once one of the Rainforest JS bundles has been initialized, you can embed any of the components into your platform.

<html>
    <head>
        <script type="module" src="https://static.rainforestpay.com/sandbox.payment.js"></script>
    </head>
    <body>
        <rainforest-example-component></rainforest-example-component>
    </body>
</html>

Props

Props are set directly on the components through valid attributes. Props are used for business logic and to pass custom CSS styling to the components. Head over to one of the component guides to learn about valid props.

<rainforest-example-component 
    example-prop="example-prop-value"
></rainforest-example-component>

Authentication

All Rainforest components require a valid session-key to access data and/or perform actions within our components. See component sessions to learn how to create a temporary session.

<rainforest-example-component 
    session-key="your-session-key"
></rainforest-example-component>

Component studio

Each of our components has a studio to help make designing your components easy. Head over to the payment component studio to start designing the embedded payment component to look and feel like your platform.

Updated 3 months ago