Contineo Platform

Payment Button

A sophisticated payment gateway integration component designed to streamline online transaction processes. Provides a secure, customizable button for initiating payments with comprehensive event handling, API integration, and support for complex payment scenarios including partial payments. Ideal for e-commerce, subscription services, and financial applications.

Extends: baseComponent

Fields

Name	Code	Data Type	Description
Label	`label`	multi-locale	The text displayed on the payment button (supports multilingual labels)
Resource ID	`resourceId`	text	Unique identifier for the payment button component
Style Classes	`styleClasses`	text	Additional CSS classes to customize button appearance
Width Class	`widthClass`	text	Controls the width of the button using predefined CSS classes
Visibility	`isVisible`	boolean	Controls whether the payment button is displayed or hidden
Enabled	`enabled`	boolean	Determines if the payment button is interactive or disabled
Loading	`loading`	boolean	Shows loading state during payment processing
Color	`color`	text	Sets the color theme of the payment button
Icon	`icon`	text	Icon to display before the button label
Right Icon	`iconRight`	text	Icon to display after the button label
Size	`size`	text	Sets the size of the button component
Flat	`flat`	boolean	Removes button background when enabled
Outline	`outline`	boolean	Shows button with outlined style
Round	`round`	boolean	Makes the button completely circular
Rounded	`rounded`	boolean	Adds rounded corners to the button
No Caps	`noCaps`	boolean	Prevents automatic text capitalization
Show Tooltip	`showToolTip`	boolean	Enables tooltip display on hover
Tooltip Style Classes	`styleClassToolTip`	text	CSS classes for styling the tooltip
Tooltip Value	`toolTipValue`	text	Text content displayed in the tooltip
Business Name	`buisnessName`	text	Name of the business displayed in the payment gateway interface
Company Logo	`companyLogo`	text	URL of the company logo shown in the payment window
Theme	`theme`	text	Custom theme configuration for payment gateway user interface
Payment Action API	`paymentApi`	text	Resource ID for the API used to initiate payment
Payment Failure API	`paymentFaliedApi`	text	Resource ID for handling payment failure scenarios
Payment Success API	`paymentSuccessApi`	text	Resource ID for processing successful payment transactions
Amount	`amount`	text	Monetary amount to be processed in the payment
Currency	`currency`	text	Currency code for the payment transaction
Receipt ID	`receipt`	text	Unique identifier for the payment receipt
Notes	`notes`	text	Additional notes or comments for the payment transaction
Partial Payment	`partial_payment`	boolean	Enables support for partial payment options
First Payment Minimum Amount	`first_payment_min_amount`	text	Minimum amount required for the initial partial payment

Methods

Name	Description
`doPayment`	Initiates the payment process by creating an order and starting the gateway
`createOrder`	Generates a payment order by calling the specified initiation API
`startPayement`	Opens the payment gateway interface with configured payment parameters
`onPaymentSuccess`	Handles successful payment processing and calls the success API
`onPaymentFailed`	Manages payment failure scenarios and calls the failure handling API
`validatePayment`	Performs additional validation of the payment transaction

Events

Name	Description
`onPayementStarted`	Triggered when the payment process is initiated
`onPaymentSuccess`	Triggered when the payment is completed successfully
`onPaymentFailed`	Triggered when the payment process encounters an error or fails