Builds secure, framework-agnostic checkout and payment experiences using Primer's web component library.
This skill provides comprehensive guidance for integrating the @primer-io/primer-js library into modern web applications. It streamlines the implementation of complex payment flows, custom card forms, and multi-method checkouts across React, Next.js, and vanilla JavaScript. By leveraging this skill, developers can correctly handle payment lifecycle events, implement UI theming via CSS custom properties, and navigate the specific API requirements of the v0.7.0+ SDK, ensuring robust and PCI-compliant payment integrations.
Key Features
01Detailed support for v0.7.0+ breaking changes and new callback APIs
020 GitHub stars
03Framework-agnostic integration patterns for React 19, Next.js, and Vanilla JS
04Advanced UI customization using themes and CSS custom properties
05Implementation patterns for payment method vaulting and saved credentials
06Configuration guidance for Card, PayPal, Apple Pay, Google Pay, and Klarna
Use Cases
01Building a production-grade checkout page with multi-provider payment support
02Creating custom-styled card forms with real-time validation and PII filtering
03Migrating legacy payment integrations to the modern Primer SDK Core engine
