UX Components
Shuttle provides a set of ready-made UX components that you can embed directly into your platform. Each component is delivered as an iFrame via shuttle.js and handles its own PCI DSS scope, keeping card data out of your platform entirely.
All components are instantiated via a server-side deep link that encodes the context and user session. The deep link ID is then passed to a data-shuttle-embed attribute on your page, and shuttle.js handles the rest.
Components
Allows a merchant to connect and configure their payment processor(s). Presented in your merchant admin interface, it handles processor selection, OAuth or API key authentication, checkout customisation, and fraud tool configuration. Shuttle manages the T&Cs on your behalf, or you can incorporate them into your own.
Captures payment details from your customers. Renders as a modal popup or inline within your page, supporting one-time payments, recurring contracts, saved payment methods, and wallet payments. Communicates back to your page via JavaScript window.postMessage events or redirect URLs.
Integrates wallet-based express checkout buttons (e.g. PayPal) directly into your page. The merchant's connected gateway authenticates the customer and returns an account, shipping address, and payment token — your server then completes the payment via the REST API. Requires shuttle.js 1.3 or later.
Injects buy-now-pay-later marketing messages from connected providers (e.g. Klarna, Affirm, PayPal Credit) onto your product and checkout pages. If the merchant has no connected BNPL providers, nothing is rendered. Requires shuttle.js 1.3 or later.
Embeds a searchable view of payment activity — transactions, accounts, and recurring schedules — directly into your platform. Can be scoped to a specific account or contract, making it suitable for embedding in merchant admin portals or your own support tooling.
Updated about 21 hours ago