Mini Checkout

Self-contained inline checkout for 1 product or 1 bundle. Customer enters data, picks payment, and submits without leaving the page. Use on landing pages for 'Beli Sekarang' conversion flow.

Type: "miniCheckout"

Self-contained inline checkout for 1 product or 1 bundle. Customer enters data, picks payment, and submits without leaving the page. Use on landing pages for 'Beli Sekarang' conversion flow.

Props

Field	Type	Default	Description
`selectedId`	string (product/bundle id)	—	UUID of the product or bundle
`showPreview`	boolean	`true`	show product preview block
`previewShowTitle`	boolean	`true`	Preview: Judul (shown when `showPreview = true`)
`previewShowImage`	boolean	`true`	Preview: Gambar (shown when `showPreview = true`)
`previewShowPrice`	boolean	`true`	Preview: Harga (shown when `showPreview = true`)
`previewShowDescription`	boolean	`false`	Preview: Deskripsi (shown when `showPreview = true`)
`showQuantity`	boolean	`false`	show qty stepper; false = fixed qty 1
`outOfStockMessage`	string	`"Stok habis"`	Pesan Stok Habis
`requireLogin`	boolean	`false`	force login before checkout
`showNameField`	boolean	`true`	only applies when requireLogin=false (shown when `requireLogin = false`)
`showPhoneField`	boolean	`true`	only applies when requireLogin=false (shown when `requireLogin = false`)
`enableCoupon`	boolean	`true`	Aktifkan Coupon
`showPaymentMethods`	boolean	`true`	show payment method selector
`showSummary`	boolean	`true`	show subtotal & total summary block
`buttonText`	string	`"Bayar Sekarang"`	Teks Tombol
`buttonSize`	'sm'\|'md'\|'lg'	`"md"`	Ukuran Tombol
`buttonBgColor`	CSS color	—	overrides default primary color
`buttonTextColor`	CSS color	—	overrides default white
`width`	'full'\|'normal'\|'narrow'	`"normal"`	Lebar
`enableTerms`	boolean	`false`	Aktifkan T&C
`termsUrl`	string (URL)	—	URL Terms (shown when `enableTerms = true`)
`privacyUrl`	string (URL)	—	URL Privacy (shown when `enableTerms = true`)
`successAction`	'default'\|'custom_url'\|'inline'\|'whatsapp'	`"default"`	Tipe Aksi
`successCustomUrl`	string (URL)	—	used when successAction='custom_url (shown when `successAction = custom_url`)
`successInlineMessage`	string	`"Terima kasih! Pesanan kamu sudah kami terima."`	used when successAction='inline (shown when `successAction = inline`)
`successWhatsappNumber`	string	—	phone without + prefix, used when successAction='whatsapp (shown when `successAction = whatsapp`)
`successWhatsappTemplate`	string	`"Halo, Saya ingin konfirmasi pesanan: {{product_name}} Order ID: {{order_number}} Atas nama {{customer_name}} Total Rp{{total}}"`	supports {{order_number}}, {{customer_name}}, {{total}}, {{product_name}} (shown when `successAction = whatsapp`)
`trackMetaPixel`	boolean	`false`	Aktifkan Meta Pixel
`trackMetaPixelId`	enum	—	override site default Meta Pixel (shown when `trackMetaPixel = true`)
`trackTiktokPixel`	boolean	`false`	Aktifkan TikTok Pixel
`trackTiktokPixelId`	enum	—	override site default TikTok Pixel (shown when `trackTiktokPixel = true`)

Example

{
  "id": "min01abc",
  "type": "miniCheckout",
  "props": {
    "selectedId": "",
    "selectedName": "",
    "selectedThumbnailUrl": "",
    "showPreview": true,
    "previewShowTitle": true,
    "previewShowImage": true,
    "previewShowPrice": true,
    "previewShowDescription": false,
    "showQuantity": false,
    "outOfStockMessage": "Stok habis",
    "requireLogin": false,
    "showNameField": true,
    "showPhoneField": true,
    "enableCoupon": true,
    "showPaymentMethods": true,
    "showSummary": true,
    "buttonText": "Bayar Sekarang",
    "buttonSize": "md",
    "buttonBgColor": "",
    "buttonTextColor": "",
    "width": "normal",
    "enableTerms": false,
    "termsUrl": "",
    "privacyUrl": "",
    "successAction": "default",
    "successCustomUrl": "",
    "successInlineMessage": "Terima kasih! Pesanan kamu sudah kami terima.",
    "successWhatsappNumber": "",
    "successWhatsappTemplate": "Halo,\n\nSaya ingin konfirmasi pesanan:\n\n*{{product_name}}*\n\n*Order ID*: {{order_number}}\n\nAtas nama *{{customer_name}}*\n\nTotal *Rp{{total}}*",
    "trackMetaPixel": false,
    "trackMetaPixelId": "",
    "trackTiktokPixel": false,
    "trackTiktokPixelId": ""
  }
}