@primer-io/primer-js 0.6.0 → 0.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -10,15 +10,29 @@ export type CardNetworksContextType = {
10
10
  selectableCardNetworks: CardNetwork[];
11
11
  isLoading: boolean;
12
12
  } | null;
13
+ /**
14
+ * SDK state representation
15
+ */
13
16
  export type SdkState = {
14
17
  isSuccessful: boolean;
15
18
  isProcessing: boolean;
16
- error: Error | null;
19
+ /**
20
+ * SDK/component initialization errors.
21
+ * This represents errors from the Primer JS layer itself (e.g., configuration errors,
22
+ * component initialization failures), not payment processing errors.
23
+ */
24
+ primerJsError: Error | null;
17
25
  isLoading: boolean;
18
- failure: {
26
+ /**
27
+ * Payment processing failure information.
28
+ * Contains structured error details from failed payment attempts.
29
+ * Includes error code, message, diagnostics ID, and additional metadata.
30
+ */
31
+ paymentFailure: {
19
32
  code: string;
20
33
  message: string;
21
- details?: Record<string, unknown>;
34
+ diagnosticsId?: string | null;
35
+ data?: Record<string, unknown>;
22
36
  } | null;
23
37
  };
24
38
  export type SdkStateContextType = SdkState | null;
@@ -176,6 +190,214 @@ declare const PaymentMethodType: {
176
190
  readonly ALMA: "ALMA";
177
191
  };
178
192
  export type PaymentMethodType = (typeof PaymentMethodType)[keyof typeof PaymentMethodType];
193
+ declare const PaymentMethodType$1 = {
194
+ WORLDPAY_IDEAL: "WORLDPAY_IDEAL",
195
+ STRIPE_ACH: "STRIPE_ACH",
196
+ STRIPE_IDEAL: "STRIPE_IDEAL",
197
+ ADYEN_KLARNA: "ADYEN_KLARNA",
198
+ ADYEN_BANCONTACT_CARD: "ADYEN_BANCONTACT_CARD",
199
+ PAY_NL_KAARTDIRECT: "PAY_NL_KAARTDIRECT",
200
+ ADYEN_EPS: "ADYEN_EPS",
201
+ ADYEN_BANCONTACT_PAYCONIQ: "ADYEN_BANCONTACT_PAYCONIQ",
202
+ OMISE_PROMPTPAY: "OMISE_PROMPTPAY",
203
+ OMISE_TRUEMONEY: "OMISE_TRUEMONEY",
204
+ ADYEN_MULTIBANCO: "ADYEN_MULTIBANCO",
205
+ PACYPAY_WECHAT: "PACYPAY_WECHAT",
206
+ PACYPAY_ALIPAY: "PACYPAY_ALIPAY",
207
+ ADYEN_MBWAY: "ADYEN_MBWAY",
208
+ XENDIT_DANA: "XENDIT_DANA",
209
+ XENDIT_SHOPEEPAY: "XENDIT_SHOPEEPAY",
210
+ ADYEN_PAYSHOP: "ADYEN_PAYSHOP",
211
+ ADYEN_PAYTRAIL: "ADYEN_PAYTRAIL",
212
+ CLEARPAY: "CLEARPAY",
213
+ RAPYD_FAST: "RAPYD_FAST",
214
+ RAPYD_PROMPTPAY: "RAPYD_PROMPTPAY",
215
+ RAPYD_GCASH: "RAPYD_GCASH",
216
+ RAPYD_POLI: "RAPYD_POLI",
217
+ RAPYD_GRABPAY: "RAPYD_GRABPAY",
218
+ PRIMER_PAYPAL: "PRIMER_PAYPAL",
219
+ TWOC2P: "TWOC2P",
220
+ NETS: "NETS",
221
+ STRIPE_GIROPAY: "STRIPE_GIROPAY",
222
+ MOLLIE_GIROPAY: "MOLLIE_GIROPAY",
223
+ MOLLIE_EPS: "MOLLIE_EPS",
224
+ PAY_NL_EPS: "PAY_NL_EPS",
225
+ PAY_NL_P24: "PAY_NL_P24",
226
+ MOLLIE_P24: "MOLLIE_P24",
227
+ MOLLIE_SOFORT: "MOLLIE_SOFORT",
228
+ COINBASE: "COINBASE",
229
+ OPENNODE: "OPENNODE",
230
+ MOLLIE_GIFT_CARD: "MOLLIE_GIFTCARD",
231
+ XFERS_PAYNOW: "XFERS_PAYNOW",
232
+ PAYMENT_CARD: "PAYMENT_CARD",
233
+ APPLE_PAY: "APPLE_PAY",
234
+ GOOGLE_PAY: "GOOGLE_PAY",
235
+ PAYPAL: "PAYPAL",
236
+ GO_CARDLESS: "GOCARDLESS",
237
+ KLARNA: "KLARNA",
238
+ PAY_NL_IDEAL: "PAY_NL_IDEAL",
239
+ PAY_NL_SOFORT_BANKING: "PAY_NL_SOFORT_BANKING",
240
+ PAY_NL_BANCONTACT: "PAY_NL_BANCONTACT",
241
+ PAY_NL_PAYPAL: "PAY_NL_PAYPAL",
242
+ PAY_NL_CREDIT_TRANSFER: "PAY_NL_CREDIT_TRANSFER",
243
+ PAY_NL_DIRECT_DEBIT: "PAY_NL_DIRECT_DEBIT",
244
+ PAY_NL_GIROPAY: "PAY_NL_GIROPAY",
245
+ PAY_NL_PAYCONIQ: "PAY_NL_PAYCONIQ",
246
+ PAY_NL_RIVERTY: "PAY_NL_RIVERTY",
247
+ HOOLAH: "HOOLAH",
248
+ ADYEN_BLIK: "ADYEN_BLIK",
249
+ ADYEN_MOBILEPAY: "ADYEN_MOBILEPAY",
250
+ ADYEN_VIPPS: "ADYEN_VIPPS",
251
+ ADYEN_GIROPAY: "ADYEN_GIROPAY",
252
+ ADYEN_SOFORT: "ADYEN_SOFORT",
253
+ ADYEN_IDEAL: "ADYEN_IDEAL",
254
+ ADYEN_TRUSTLY: "ADYEN_TRUSTLY",
255
+ ADYEN_ALIPAY: "ADYEN_ALIPAY",
256
+ ADYEN_TWINT: "ADYEN_TWINT",
257
+ ADYEN_BANK_TRANSFER: "ADYEN_BANK_TRANSFER",
258
+ MOLLIE_BANCONTACT: "MOLLIE_BANCONTACT",
259
+ MOLLIE_IDEAL: "MOLLIE_IDEAL",
260
+ BUCKAROO_GIROPAY: "BUCKAROO_GIROPAY",
261
+ BUCKAROO_EPS: "BUCKAROO_EPS",
262
+ BUCKAROO_SOFORT: "BUCKAROO_SOFORT",
263
+ BUCKAROO_BANCONTACT: "BUCKAROO_BANCONTACT",
264
+ BUCKAROO_IDEAL: "BUCKAROO_IDEAL",
265
+ ATOME: "ATOME",
266
+ DLOCAL_PIX: "DLOCAL_PIX",
267
+ ALMA: "ALMA",
268
+ } as const;
269
+ type PaymentMethodType$1 = (typeof PaymentMethodType$1)[keyof typeof PaymentMethodType$1];
270
+ declare const PaymentInstrumentType$1 = {
271
+ WORLDPAY_IDEAL: "WORLDPAY_IDEAL",
272
+ AUTOMATED_CLEARING_HOUSE: "AUTOMATED_CLEARING_HOUSE",
273
+ ADYEN_KLARNA: "ADYEN_KLARNA",
274
+ ADYEN_BANCONTACT_CARD: "ADYEN_BANCONTACT_CARD",
275
+ PAY_NL_KAARTDIRECT: "PAY_NL_KAARTDIRECT",
276
+ ADYEN_EPS: "ADYEN_EPS",
277
+ ADYEN_BANCONTACT_PAYCONIQ: "ADYEN_BANCONTACT_PAYCONIQ",
278
+ OMISE_PROMPTPAY: "OMISE_PROMPTPAY",
279
+ OMISE_TRUEMONEY: "OMISE_TRUEMONEY",
280
+ ADYEN_MULTIBANCO: "ADYEN_MULTIBANCO",
281
+ PACYPAY_WECHAT: "PACYPAY_WECHAT",
282
+ PACYPAY_ALIPAY: "PACYPAY_ALIPAY",
283
+ ADYEN_MBWAY: "ADYEN_MBWAY",
284
+ XENDIT_DANA: "XENDIT_DANA",
285
+ XENDIT_SHOPEEPAY: "XENDIT_SHOPEEPAY",
286
+ ADYEN_PAYSHOP: "ADYEN_PAYSHOP",
287
+ ADYEN_PAYTRAIL: "ADYEN_PAYTRAIL",
288
+ CLEARPAY: "CLEARPAY",
289
+ RAPYD_FAST: "RAPYD_FAST",
290
+ RAPYD_PROMPTPAY: "RAPYD_PROMPTPAY",
291
+ RAPYD_GCASH: "RAPYD_GCASH",
292
+ RAPYD_POLI: "RAPYD_POLI",
293
+ RAPYD_GRABPAY: "RAPYD_GRABPAY",
294
+ PRIMER_PAYPAL: "PRIMER_PAYPAL",
295
+ TWOC2P: "TWOC2P",
296
+ NETS: "NETS",
297
+ STRIPE_ACH: "STRIPE_ACH",
298
+ STRIPE_GIROPAY: "STRIPE_GIROPAY",
299
+ MOLLIE_GIROPAY: "MOLLIE_GIROPAY",
300
+ MOLLIE_EPS: "MOLLIE_EPS",
301
+ PAY_NL_EPS: "PAY_NL_EPS",
302
+ PAY_NL_P24: "PAY_NL_P24",
303
+ MOLLIE_P24: "MOLLIE_P24",
304
+ MOLLIE_SOFORT: "MOLLIE_SOFORT",
305
+ COINBASE: "COINBASE",
306
+ OPENNODE: "OPENNODE",
307
+ MOLLIE_GIFT_CARD: "MOLLIE_GIFTCARD",
308
+ XFERS_PAYNOW: "XFERS_PAYNOW",
309
+ CARD: "PAYMENT_CARD",
310
+ APPLE_PAY: "APPLE_PAY",
311
+ GOOGLE_PAY: "GOOGLE_PAY",
312
+ PAYPAL: "PAYPAL_ORDER",
313
+ PAYPAL_VAULTED: "PAYPAL_BILLING_AGREEMENT",
314
+ GO_CARDLESS: "GOCARDLESS",
315
+ PAY_NL_IDEAL: "PAY_NL_IDEAL",
316
+ PAY_NL_SOFORT_BANKING: "PAY_NL_SOFORT_BANKING",
317
+ PAY_NL_BANCONTACT: "PAY_NL_BANCONTACT",
318
+ PAY_NL_PAYPAL: "PAY_NL_PAYPAL",
319
+ PAY_NL_CREDIT_TRANSFER: "PAY_NL_CREDIT_TRANSFER",
320
+ PAY_NL_DIRECT_DEBIT: "PAY_NL_DIRECT_DEBIT",
321
+ PAY_NL_GIROPAY: "PAY_NL_GIROPAY",
322
+ PAY_NL_PAYCONIQ: "PAY_NL_PAYCONIQ",
323
+ PAY_NL_RIVERTY: "PAY_NL_RIVERTY",
324
+ HOOLAH: "HOOLAH",
325
+ ADYEN_BLIK: "ADYEN_BLIK",
326
+ ADYEN_VIPPS: "ADYEN_VIPPS",
327
+ ADYEN_GIROPAY: "ADYEN_GIROPAY",
328
+ ADYEN_SOFORT: "ADYEN_SOFORT",
329
+ ADYEN_IDEAL: "ADYEN_IDEAL",
330
+ ADYEN_TRUSTLY: "ADYEN_TRUSTLY",
331
+ ADYEN_ALIPAY: "ADYEN_ALIPAY",
332
+ ADYEN_TWINT: "ADYEN_TWINT",
333
+ ADYEN_MOBILEPAY: "ADYEN_MOBILEPAY",
334
+ MOLLIE_BANCONTACT: "MOLLIE_BANCONTACT",
335
+ MOLLIE_IDEAL: "MOLLIE_IDEAL",
336
+ BUCKAROO_GIROPAY: "BUCKAROO_GIROPAY",
337
+ BUCKAROO_EPS: "BUCKAROO_EPS",
338
+ BUCKAROO_SOFORT: "BUCKAROO_SOFORT",
339
+ BUCKAROO_BANCONTACT: "BUCKAROO_BANCONTACT",
340
+ BUCKAROO_IDEAL: "BUCKAROO_IDEAL",
341
+ ATOME: "ATOME",
342
+ KLARNA_CUSTOMER_TOKEN: "KLARNA_CUSTOMER_TOKEN",
343
+ DLOCAL_PIX: "DLOCAL_PIX",
344
+ ALMA: "ALMA",
345
+ } as const;
346
+ type PaymentInstrumentType$1 = (typeof PaymentInstrumentType$1)[keyof typeof PaymentInstrumentType$1];
347
+ /**
348
+ * Minimal payment summary with reduced PII exposure.
349
+ * Used in events for public data delivery.
350
+ */
351
+ export interface PaymentSummary {
352
+ /** Payment ID from Primer API */
353
+ id: string;
354
+ /** Order ID/reference from merchant */
355
+ orderId: string;
356
+ /** Payment method data with whitelisted fields */
357
+ paymentMethodData?: {
358
+ /** Payment method type (e.g., "PAYMENT_CARD", "PAYPAL") */
359
+ paymentMethodType?: string;
360
+ /** Last 4 digits of card (cards only) */
361
+ last4Digits?: string;
362
+ /** Card network (e.g., "VISA", "MASTERCARD") - cards only */
363
+ network?: string;
364
+ /** Last 4 digits of account number (ACH only) */
365
+ accountNumberLastFourDigits?: string;
366
+ /** Bank name (ACH only) */
367
+ bankName?: string;
368
+ };
369
+ }
370
+ /**
371
+ * Minimal vaulted payment method summary with reduced PII exposure.
372
+ * Used for vault events and callbacks to expose vaulted payment methods safely.
373
+ */
374
+ export interface VaultedPaymentMethodSummary {
375
+ /** Payment instrument ID */
376
+ id: string;
377
+ /** Analytics tracking ID */
378
+ analyticsId: string;
379
+ /** Payment method type (e.g., "PAYMENT_CARD", "PAYPAL") */
380
+ paymentMethodType: PaymentMethodType$1;
381
+ /** Payment instrument type (e.g., "CARD", "PAYPAL_BILLING_AGREEMENT") */
382
+ paymentInstrumentType: PaymentInstrumentType$1;
383
+ /** Payment instrument data with whitelisted safe fields only */
384
+ paymentInstrumentData?: {
385
+ /** Last 4 digits of card (cards only) */
386
+ last4Digits?: string;
387
+ /** Card network (e.g., "VISA", "MASTERCARD") - cards only */
388
+ network?: string;
389
+ /** Last 4 digits of account number (ACH only) */
390
+ accountNumberLastFourDigits?: string;
391
+ /** Bank name (ACH only) */
392
+ bankName?: string;
393
+ /** Account type (ACH only) */
394
+ accountType?: string;
395
+ /** Email for wallet payment methods */
396
+ email?: string;
397
+ };
398
+ /** Optional user-provided description for the payment method */
399
+ userDescription?: string;
400
+ }
179
401
  export type APIVersionOption = "legacy" | "2.4";
180
402
  declare enum HeadlessManagerType {
181
403
  CARD = "CARD",
@@ -1339,7 +1561,7 @@ export interface PrimerCheckoutOptions {
1339
1561
  * ]
1340
1562
  * ```
1341
1563
  */
1342
- enabledPaymentMethods?: typeof PaymentMethodType.PAYMENT_CARD | (typeof PaymentMethodType.ADYEN_BLIK)[];
1564
+ enabledPaymentMethods?: typeof PaymentMethodType.PAYMENT_CARD | typeof PaymentMethodType.PAYPAL | (typeof PaymentMethodType.ADYEN_BLIK)[];
1343
1565
  }
1344
1566
  export type InitializedManager = {
1345
1567
  type: typeof PaymentMethodType.STRIPE_ACH;
@@ -1437,17 +1659,116 @@ export declare class InitializedPayments {
1437
1659
  toArray(): InitializedPaymentMethod[];
1438
1660
  size(): number;
1439
1661
  }
1662
+ /**
1663
+ * Map of vaulted payment method ID to vaulted payment method summary
1664
+ */
1665
+ export type VaultedPaymentMethodsMap = Map<string, VaultedPaymentMethodSummary>;
1666
+ /**
1667
+ * Wrapper class for vaulted payment methods that provides type-safe access
1668
+ * to filtered vaulted payment method data.
1669
+ *
1670
+ * This class mirrors the structure of InitializedPayments but for vault data,
1671
+ * providing a consistent API for merchants to access vaulted payment methods
1672
+ * through events and callbacks.
1673
+ *
1674
+ * @example
1675
+ * ```typescript
1676
+ * // Access via callback
1677
+ * primerJS.onVaultedMethodsUpdate = (data) => {
1678
+ * console.log('Vault size:', data.size());
1679
+ *
1680
+ * // Get specific method by ID
1681
+ * const method = data.get('pm_abc123');
1682
+ * if (method) {
1683
+ * console.log('Last 4:', method.paymentInstrumentData?.last4Digits);
1684
+ * }
1685
+ *
1686
+ * // Get all methods
1687
+ * const allMethods = data.toArray();
1688
+ * allMethods.forEach(method => {
1689
+ * console.log(method.paymentMethodType);
1690
+ * });
1691
+ * };
1692
+ * ```
1693
+ */
1694
+ export declare class InitializedVaultedPayments {
1695
+ private readonly _methods;
1696
+ /**
1697
+ * @param map - Map of vaulted payment method IDs to summaries
1698
+ */
1699
+ constructor(map: VaultedPaymentMethodsMap);
1700
+ /**
1701
+ * Get a vaulted payment method by its ID
1702
+ *
1703
+ * @param id - Payment method ID
1704
+ * @returns Vaulted payment method summary if found, undefined otherwise
1705
+ */
1706
+ get(id: string): VaultedPaymentMethodSummary | undefined;
1707
+ /**
1708
+ * Get all vaulted payment methods as an array
1709
+ *
1710
+ * @returns Array of all vaulted payment method summaries
1711
+ */
1712
+ toArray(): VaultedPaymentMethodSummary[];
1713
+ /**
1714
+ * Get the count of vaulted payment methods
1715
+ *
1716
+ * @returns Number of vaulted payment methods
1717
+ */
1718
+ size(): number;
1719
+ }
1720
+ /**
1721
+ * Payment prepare callback data.
1722
+ * Includes payment method type for validation or abort control flow.
1723
+ */
1440
1724
  export interface PaymentData {
1441
- paymentMethodType: string;
1725
+ /** Payment method type (e.g., "PAYMENT_CARD", "PAYPAL") */
1726
+ paymentMethodType: PaymentMethodType;
1442
1727
  }
1443
1728
  export interface PrepareHandler {
1444
1729
  continuePaymentCreation: () => void;
1445
1730
  abortPaymentCreation: () => void;
1446
1731
  }
1447
- export interface PaymentCompleteData {
1448
- payment: Payment | null;
1449
- status: "success" | "pending" | "error";
1450
- error?: PrimerClientError;
1732
+ /**
1733
+ * Payment success callback data.
1734
+ * Includes minimal payment summary with reduced PII exposure.
1735
+ */
1736
+ export interface PaymentSuccessData {
1737
+ /** Minimal payment summary (ID, orderId, last4, brand) - reduced PII exposure */
1738
+ payment: PaymentSummary;
1739
+ /** Payment method type (e.g., "PAYMENT_CARD", "PAYPAL") */
1740
+ paymentMethodType: string;
1741
+ /** Unix timestamp in seconds */
1742
+ timestamp: number;
1743
+ }
1744
+ /**
1745
+ * Payment failure callback data.
1746
+ * Includes error details and optional payment summary if created before failure.
1747
+ */
1748
+ export interface PaymentFailureData {
1749
+ /** Error details */
1750
+ error: {
1751
+ code: string;
1752
+ message: string;
1753
+ diagnosticsId?: string;
1754
+ data?: Record<string, unknown>;
1755
+ };
1756
+ /** Optional minimal payment summary if payment was created before failure */
1757
+ payment?: PaymentSummary;
1758
+ /** Payment method type (e.g., "PAYMENT_CARD", "PAYPAL") */
1759
+ paymentMethodType: string;
1760
+ /** Unix timestamp in seconds */
1761
+ timestamp: number;
1762
+ }
1763
+ /**
1764
+ * Vault methods update callback data.
1765
+ * Includes filtered vaulted payment methods with minimal PII exposure.
1766
+ */
1767
+ export interface VaultedMethodsUpdateData {
1768
+ /** Wrapper containing filtered vaulted payment methods */
1769
+ vaultedPayments: InitializedVaultedPayments;
1770
+ /** Unix timestamp in seconds */
1771
+ timestamp: number;
1451
1772
  }
1452
1773
  /**
1453
1774
  * PrimerJS is a wrapper class that provides a stable API for interfacing with the Primer SDK
@@ -1456,15 +1777,136 @@ export interface PaymentCompleteData {
1456
1777
  export declare class PrimerJS {
1457
1778
  private headlessInstance;
1458
1779
  private paymentMethods;
1780
+ private paymentManagers;
1781
+ /**
1782
+ * Called when payment flow begins.
1783
+ * Use for analytics tracking or UI updates (e.g., disable form).
1784
+ *
1785
+ * @example
1786
+ * ```typescript
1787
+ * primerJS.onPaymentStart = () => {
1788
+ * analytics.track('payment_started');
1789
+ * disablePaymentForm();
1790
+ * };
1791
+ * ```
1792
+ */
1459
1793
  onPaymentStart?: () => void;
1794
+ /**
1795
+ * Called before payment creation for validation or abort control flow.
1796
+ * Use for last-chance validation or conditional payment creation.
1797
+ *
1798
+ * @param data - Payment method information
1799
+ * @param handler - Control flow handler (continue or abort)
1800
+ *
1801
+ * @example
1802
+ * ```typescript
1803
+ * primerJS.onPaymentPrepare = (data, handler) => {
1804
+ * if (!validateBusinessRules(data.paymentMethodType)) {
1805
+ * handler.abortPaymentCreation();
1806
+ * return;
1807
+ * }
1808
+ * handler.continuePaymentCreation();
1809
+ * };
1810
+ * ```
1811
+ */
1460
1812
  onPaymentPrepare?: (data: PaymentData, handler: PrepareHandler) => void;
1461
- onPaymentComplete?: (data: PaymentCompleteData) => void;
1813
+ /**
1814
+ * Called when payment completes successfully.
1815
+ * Receives minimal payment summary with reduced PII exposure.
1816
+ *
1817
+ * Use for:
1818
+ * - Order confirmation and backend sync
1819
+ * - Receipt generation
1820
+ * - Payment processing with minimal PII exposure
1821
+ *
1822
+ * @param data - Payment success data with PaymentSummary (ID, orderId, last4, brand)
1823
+ *
1824
+ * @example
1825
+ * ```typescript
1826
+ * primerJS.onPaymentSuccess = async ({ payment, paymentMethodType }) => {
1827
+ * // Update backend
1828
+ * await fetch(`/api/orders/${payment.orderId}/complete`, {
1829
+ * method: 'POST',
1830
+ * body: JSON.stringify({ paymentId: payment.id }),
1831
+ * });
1832
+ *
1833
+ * // Redirect to success page
1834
+ * window.location.href = `/order-success?id=${payment.orderId}`;
1835
+ * };
1836
+ * ```
1837
+ */
1838
+ onPaymentSuccess?: (data: PaymentSuccessData) => void;
1839
+ /**
1840
+ * Called when payment fails or is declined.
1841
+ * Receives error details and optional payment summary if created before failure.
1842
+ *
1843
+ * Use for:
1844
+ * - Error handling and user messaging
1845
+ * - Support ticket creation with diagnosticsId
1846
+ * - Retry logic for specific error types
1847
+ *
1848
+ * @param data - Payment failure data with error details and optional PaymentSummary
1849
+ *
1850
+ * @example
1851
+ * ```typescript
1852
+ * primerJS.onPaymentFailure = ({ error, payment }) => {
1853
+ * console.error('Payment failed:', error.code, error.message);
1854
+ *
1855
+ * // Log to error tracking
1856
+ * Sentry.captureException(new Error(error.message), {
1857
+ * extra: {
1858
+ * diagnosticsId: error.diagnosticsId,
1859
+ * paymentId: payment?.id,
1860
+ * },
1861
+ * });
1862
+ *
1863
+ * // Show user-friendly message
1864
+ * showErrorMessage(error.message);
1865
+ * };
1866
+ * ```
1867
+ */
1868
+ onPaymentFailure?: (data: PaymentFailureData) => void;
1869
+ /**
1870
+ * Called when vaulted payment methods are loaded or updated.
1871
+ * Receives filtered vaulted payment method data with minimal PII exposure.
1872
+ *
1873
+ * Use for:
1874
+ * - Building custom vault UI
1875
+ * - Analytics tracking for vault usage
1876
+ * - Syncing vault state with backend
1877
+ *
1878
+ * @param data - Vault methods update data with filtered payment methods
1879
+ *
1880
+ * @example
1881
+ * ```typescript
1882
+ * primerJS.onVaultedMethodsUpdate = ({ vaultedPayments }) => {
1883
+ * console.log(`Vault contains ${vaultedPayments.size()} methods`);
1884
+ *
1885
+ * // Display in custom UI
1886
+ * const methods = vaultedPayments.toArray();
1887
+ * methods.forEach(method => {
1888
+ * displayVaultedMethod({
1889
+ * id: method.id,
1890
+ * type: method.paymentMethodType,
1891
+ * last4: method.paymentInstrumentData?.last4Digits,
1892
+ * network: method.paymentInstrumentData?.network,
1893
+ * });
1894
+ * });
1895
+ * };
1896
+ * ```
1897
+ */
1898
+ onVaultedMethodsUpdate?: (data: VaultedMethodsUpdateData) => void;
1462
1899
  constructor(headlessInstance: PrimerHeadlessCheckout);
1463
1900
  /**
1464
1901
  * Set the initialized payment methods
1465
1902
  * @internal - This is only used internally by the SDK
1466
1903
  */
1467
1904
  setPaymentMethods(methods: InitializedPayments): void;
1905
+ /**
1906
+ * Set the initialized payment managers
1907
+ * @internal - This is only used internally by the SDK
1908
+ */
1909
+ setPaymentManagers(managers: InitializedManagersMap): void;
1468
1910
  /**
1469
1911
  * Refetches a new client session from merchant backend.
1470
1912
  */
@@ -1482,20 +1924,35 @@ export declare class PrimerJS {
1482
1924
  * Internal method to handle the onBeforePaymentCreate callback and transform it to onPaymentPrepare
1483
1925
  * @internal - This is only used internally by the SDK
1484
1926
  */
1485
- handleBeforePaymentCreate(data: PaymentData, originalHandler: {
1927
+ handleBeforePaymentCreate(data: {
1928
+ paymentMethodType: PaymentMethodType;
1929
+ }, originalHandler: {
1486
1930
  continuePaymentCreation: () => void;
1487
1931
  abortPaymentCreation: () => void;
1488
1932
  }): void;
1489
1933
  /**
1490
- * Internal method to handle payment completion (success)
1934
+ * Internal method to handle the onVaultedMethodsUpdate callback
1491
1935
  * @internal - This is only used internally by the SDK
1492
1936
  */
1493
- handlePaymentComplete(payment: Payment | null): void;
1937
+ handleVaultedMethodsUpdate(vaultedPayments: InitializedVaultedPayments): void;
1494
1938
  /**
1495
- * Internal method to handle payment failure
1496
- * @internal - This is only used internally by the SDK
1939
+ * Sets the cardholder name value in the card payment form.
1940
+ *
1941
+ * ⚠️ Must be called after card hosted inputs have been rendered.
1942
+ * Calling too early will log a warning and fail gracefully.
1943
+ *
1944
+ * @param cardholderName - The cardholder name to set
1945
+ *
1946
+ * @example
1947
+ * ```typescript
1948
+ * const checkout = document.querySelector('primer-checkout');
1949
+ * checkout.addEventListener('primer:ready', (event) => {
1950
+ * const primerJS = event.detail;
1951
+ * primerJS.setCardholderName('John Doe');
1952
+ * });
1953
+ * ```
1497
1954
  */
1498
- handlePaymentFailure(error: PrimerClientError, payment?: Payment): void;
1955
+ setCardholderName(cardholderName: string): void;
1499
1956
  }
1500
1957
  export interface CardSubmitResult {
1501
1958
  success?: boolean;
@@ -1528,6 +1985,27 @@ export interface PrimerEvents {
1528
1985
  "primer-ach-bank-details-collected": CustomEvent;
1529
1986
  "primer-ach-mandate-confirmed": CustomEvent;
1530
1987
  "primer-ach-mandate-declined": CustomEvent;
1988
+ "primer:payment-start": CustomEvent<undefined>;
1989
+ "primer:payment-success": CustomEvent<{
1990
+ paymentSummary: PaymentSummary;
1991
+ paymentMethodType: string;
1992
+ timestamp: number;
1993
+ }>;
1994
+ "primer:payment-failure": CustomEvent<{
1995
+ error: {
1996
+ code: string;
1997
+ message: string;
1998
+ diagnosticsId?: string;
1999
+ data?: Record<string, unknown>;
2000
+ };
2001
+ paymentSummary?: PaymentSummary;
2002
+ paymentMethodType: string;
2003
+ timestamp: number;
2004
+ }>;
2005
+ "primer:vault:methods-update": CustomEvent<{
2006
+ vaultedPayments: InitializedVaultedPayments;
2007
+ timestamp: number;
2008
+ }>;
1531
2009
  }
1532
2010
  declare class PrimerEventsController implements ReactiveController {
1533
2011
  host: ReactiveControllerHost & LitElement;
@@ -1556,6 +2034,33 @@ declare class PrimerEventsController implements ReactiveController {
1556
2034
  * @param eventDetails - The event details to forward, including source information
1557
2035
  */
1558
2036
  handleExternalCardSubmit(eventDetails: CardSubmitPayload): void;
2037
+ /**
2038
+ * Dispatch payment start event.
2039
+ * Called when payment flow begins.
2040
+ */
2041
+ dispatchPaymentStart(): void;
2042
+ /**
2043
+ * Dispatch payment success event with minimal payment summary.
2044
+ * Called when payment completes successfully.
2045
+ */
2046
+ dispatchPaymentSuccess(payment: Payment, paymentMethodType: string): void;
2047
+ /**
2048
+ * Dispatch payment failure event.
2049
+ * Called when payment fails or is declined.
2050
+ */
2051
+ dispatchPaymentFailure(error: {
2052
+ code: string;
2053
+ message: string;
2054
+ diagnosticsId?: string;
2055
+ data?: Record<string, unknown>;
2056
+ }, paymentMethodType: string, payment?: Payment): void;
2057
+ /**
2058
+ * Dispatch vault methods update event.
2059
+ * Called when vaulted payment methods are loaded or updated.
2060
+ *
2061
+ * @param vaultedPayments - Wrapper containing filtered vaulted payment methods
2062
+ */
2063
+ dispatchVaultMethodsUpdate(vaultedPayments: InitializedVaultedPayments): void;
1559
2064
  }
1560
2065
  export type AnalyticsContextType = AnalyticsUtils | null;
1561
2066
  export type EventsContextType = PrimerEventsController | null;
@@ -1655,6 +2160,25 @@ declare class VaultManagerController extends CompositeStateController<PrimerChec
1655
2160
  * Lifecycle method called when the host disconnects
1656
2161
  */
1657
2162
  hostDisconnected(): void;
2163
+ /**
2164
+ * Transform raw vault data into filtered, event-ready format.
2165
+ * Applies PII filtering to all vaulted payment methods.
2166
+ *
2167
+ * @param vaultedPaymentMethods - Raw vaulted payment methods from API
2168
+ * @returns InitializedVaultedPayments wrapper with filtered data
2169
+ */
2170
+ private createVaultedPaymentsWrapper;
2171
+ /**
2172
+ * Update vaulted payment methods and dispatch events/callbacks.
2173
+ * This method:
2174
+ * 1. Updates internal state via core controller
2175
+ * 2. Creates filtered wrapper for external APIs
2176
+ * 3. Dispatches event to listeners
2177
+ * 4. Invokes callback if defined
2178
+ *
2179
+ * @param methods - Raw vaulted payment methods from API
2180
+ */
2181
+ private updatePaymentMethodsWithEvents;
1658
2182
  /**
1659
2183
  * Fetch vaulted payment methods from the server
1660
2184
  */
@@ -1739,40 +2263,48 @@ declare class SDKContextController implements ReactiveController {
1739
2263
  setEventsController(value: EventsContextType): void;
1740
2264
  }
1741
2265
  export type SdkStateAction = {
1742
- type: "START_PROCESSING";
1743
- } | {
1744
- type: "START_LOADING";
2266
+ type: "SET_LOADING";
2267
+ payload: boolean;
1745
2268
  } | {
1746
- type: "COMPLETE_PROCESSING";
2269
+ type: "SET_PROCESSING";
2270
+ payload: boolean;
1747
2271
  } | {
1748
- type: "STOP_PROCESSING";
2272
+ type: "SET_SUCCESS";
2273
+ payload: boolean;
1749
2274
  } | {
1750
- type: "SET_ERROR";
1751
- payload: Error;
2275
+ type: "SET_PRIMER_JS_ERROR";
2276
+ payload: Error | null;
1752
2277
  } | {
1753
- type: "SET_FAILURE";
2278
+ type: "SET_PAYMENT_FAILURE";
1754
2279
  payload: {
1755
2280
  code: string;
1756
2281
  message: string;
1757
- details?: Record<string, unknown>;
1758
- };
2282
+ diagnosticsId?: string | null;
2283
+ data?: Record<string, unknown>;
2284
+ } | null;
1759
2285
  } | {
1760
- type: "COMPLETE_LOADING";
2286
+ type: "COMPLETE_PROCESSING";
1761
2287
  } | {
1762
2288
  type: "RESET";
1763
- } | {
1764
- type: "RESET_ERROR";
1765
2289
  };
1766
2290
  declare class SdkStateController extends ReactiveStateController<PrimerCheckoutType, SdkState, SdkStateAction, null> {
1767
2291
  constructor(host: PrimerCheckoutType);
2292
+ setLoading(loading: boolean): void;
2293
+ setProcessing(processing: boolean): void;
2294
+ setSuccess(success: boolean): void;
2295
+ setPrimerJsError(error: Error | null): void;
2296
+ setPaymentFailure(failure: {
2297
+ code: string;
2298
+ message: string;
2299
+ diagnosticsId?: string | null;
2300
+ data?: Record<string, unknown>;
2301
+ } | null): void;
2302
+ completeProcessing(): void;
2303
+ reset(): void;
1768
2304
  startLoading(): void;
2305
+ completeLoading(): void;
1769
2306
  startProcessing(): void;
1770
2307
  stopProcessing(): void;
1771
- completeProcessing(): void;
1772
- completeLoading(): void;
1773
- setError(error: Error): void;
1774
- setFailure(code: string, message: string, details?: Record<string, unknown>): void;
1775
- reset(): void;
1776
2308
  resetError(): void;
1777
2309
  forceCompleteLoading(): void;
1778
2310
  }
@@ -1790,6 +2322,7 @@ export interface PrimerCheckoutType extends ReactiveControllerHost, LitElement {
1790
2322
  primerEventsController: PrimerEventsController;
1791
2323
  vaultManagerController: VaultManagerController;
1792
2324
  cardNetworkController: CardNetworkController;
2325
+ primerJS?: PrimerJS;
1793
2326
  }
1794
2327
  declare class CardNetworkController implements ReactiveController {
1795
2328
  private host;
@@ -1917,6 +2450,50 @@ declare const targetLocales = [
1917
2450
  `zh-TW`,
1918
2451
  ] as const;
1919
2452
  export type LocaleCode = typeof sourceLocale | (typeof targetLocales)[number];
2453
+ declare class HeadlessSdkController implements ReactiveController {
2454
+ host: PrimerCheckoutType;
2455
+ private sdkInstanceTask;
2456
+ private createPaymentMethodManager;
2457
+ private _paymentsList;
2458
+ private currentSdkInstance;
2459
+ private primerJS;
2460
+ private loadingTimeout;
2461
+ private isDisconnected;
2462
+ constructor(host: PrimerCheckoutType);
2463
+ set paymentsList(value: PaymentMethodInfo[]);
2464
+ get paymentsList(): PaymentMethodInfo[];
2465
+ get primerJSInstance(): PrimerJS | null;
2466
+ hostConnected(): void;
2467
+ hostDisconnected(): void;
2468
+ /**
2469
+ * Normalizes options for legacy SDK compatibility.
2470
+ * When cardholder name is visible in Primer.js, it should be required in the legacy SDK
2471
+ * regardless of user's required setting, to ensure proper validation behavior.
2472
+ */
2473
+ private normalizeOptionsForLegacySdk;
2474
+ private setupLoadingTimeout;
2475
+ private clearLoadingTimeout;
2476
+ private cleanupResources;
2477
+ private _loadV2Sdk;
2478
+ initializeHeadless(): ([clientToken, options]: readonly [
2479
+ string | null,
2480
+ PrimerCheckoutOptions | null
2481
+ ]) => Promise<PrimerHeadlessCheckout | typeof initialState>;
2482
+ initializeLitContext(): ([sdkInstance, paymentsList]: readonly [
2483
+ PrimerHeadlessCheckout | null | undefined,
2484
+ PaymentMethodInfo[]
2485
+ ]) => Promise<InitializedPaymentMethodMap | typeof initialState | null>;
2486
+ initializePaymentMethodManager(paymentMethod: PaymentMethodInfo): () => Promise<{
2487
+ type: PaymentMethodType;
2488
+ manager: IKlarnaPaymentMethodManager;
2489
+ } | {
2490
+ type: PaymentMethodType;
2491
+ manager: ICardPaymentMethodManager;
2492
+ } | {
2493
+ type: PaymentMethodType;
2494
+ manager: IRedirectPaymentMethodManager;
2495
+ } | null>;
2496
+ }
1920
2497
  declare global {
1921
2498
  interface HTMLElementTagNameMap {
1922
2499
  "primer-checkout": PrimerCheckoutComponent;
@@ -1948,6 +2525,7 @@ declare class AchPaymentEventsController implements ReactiveController {
1948
2525
  export declare class PrimerCheckoutComponent extends LitElement implements PrimerCheckoutType {
1949
2526
  set jsInitialized(value: boolean);
1950
2527
  get jsInitialized(): boolean;
2528
+ get primerJS(): PrimerJS | undefined;
1951
2529
  static styles: CSSResult[];
1952
2530
  customStyles: string;
1953
2531
  clientToken: string;
@@ -1973,6 +2551,7 @@ export declare class PrimerCheckoutComponent extends LitElement implements Prime
1973
2551
  vaultManagerController: VaultManagerController;
1974
2552
  cardNetworkController: CardNetworkController;
1975
2553
  achPaymentEventsController: AchPaymentEventsController;
2554
+ headlessSdkController: HeadlessSdkController;
1976
2555
  constructor();
1977
2556
  connectedCallback(): void;
1978
2557
  attributeChangedCallback(attrName: string, oldVal: string, newVal: string): void;