ESC
On this page
Components > Button Checkout
index.tsx
1import ButtonCheckout from "@/components/landing-components/ButtonCheckout.vue";The Button Checkout component is a checkout button that starts a payment process. If the user isn't logged in, it redirects them to the login page, and then to the checkout page (Stripe/LemonSqueezy).
It handles various product options and payment methods and automatically records the
proceed_checkout event in analytics.ButtonCheckout.vue
1const props = defineProps({
2 variantId: { type: Number, required: true },
3 priceId: { type: String, required: true },
4 mode: { type: String as PropType<"payment" | "subscription">, required: false },
5 placement: { type: String as PropType<"inside_app" | "landing_page" | "docs">, required: false },
6 variant: { type: String as PropType<"primary" | "secondary">, required: false },
7 text: { type: String, required: false },
8 withIcon: { type: Boolean, required: false },
9 });