@payment-kit-js/vanilla 0.5.5 → 0.5.7
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.
- package/dist/cdn/paymentkit.js +7 -3
- package/dist/cdn/paymentkit.js.map +2 -2
- package/dist/cdn/paymentkit.min.js +3 -3
- package/dist/cdn/paymentkit.min.js.map +2 -2
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +1 -1
- package/dist/payment-methods/card.mjs +1 -1
- package/dist/payment-methods/vgs-collect-loader.mjs +1 -1
- package/dist/{vgs-collect-loader-CKN0_QV6.mjs → vgs-collect-loader-3Z4IWCA6.mjs} +12 -2
- package/dist/vgs-collect-loader-3Z4IWCA6.mjs.map +1 -0
- package/package.json +2 -2
- package/dist/vgs-collect-loader-CKN0_QV6.mjs.map +0 -1
package/dist/index.mjs
CHANGED
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":["STATIC_ENVIRONMENT_URLS: Record<Exclude<PaymentKitEnvironment, \"tunnel\">, EnvironmentUrls>","PaymentKit: PaymentKitType","PACKAGE_VERSION","externalFuncsMapByPm: ExternalFuncsMapByPm<PaymentMethods>","submit: PaymentKitReturnType[\"submit\"]"],"sources":["../package.json","../src/analytics/mock-adapter.ts","../src/analytics/posthog-adapter.ts","../src/analytics/service.ts","../src/analytics/checkout-timing.ts","../src/types.ts","../src/index.ts"],"sourcesContent":["{\n \"name\": \"@payment-kit-js/vanilla\",\n \"version\": \"0.5.5\",\n \"main\": \"./dist/index.mjs\",\n \"types\": \"./dist/index.d.mts\",\n \"module\": \"./dist/index.mjs\",\n \"exports\": {\n \".\": \"./dist/index.mjs\",\n \"./payment-methods/airwallex-apple-pay-adapter\": \"./dist/payment-methods/airwallex-apple-pay-adapter.mjs\",\n \"./payment-methods/airwallex-google-pay-adapter\": \"./dist/payment-methods/airwallex-google-pay-adapter.mjs\",\n \"./payment-methods/apple-pay\": \"./dist/payment-methods/apple-pay.mjs\",\n \"./payment-methods/card\": \"./dist/payment-methods/card.mjs\",\n \"./payment-methods/google-pay\": \"./dist/payment-methods/google-pay.mjs\",\n \"./payment-methods/next-action-handlers\": \"./dist/payment-methods/next-action-handlers.mjs\",\n \"./payment-methods/paypal\": \"./dist/payment-methods/paypal.mjs\",\n \"./payment-methods/stripe-apple-pay-adapter\": \"./dist/payment-methods/stripe-apple-pay-adapter.mjs\",\n \"./payment-methods/stripe-google-pay-adapter\": \"./dist/payment-methods/stripe-google-pay-adapter.mjs\",\n \"./payment-methods/vgs-collect-loader\": \"./dist/payment-methods/vgs-collect-loader.mjs\",\n \"./penpal/connect-card\": \"./dist/penpal/connect-card.mjs\",\n \"./penpal/connect-tunnel-x\": \"./dist/penpal/connect-tunnel-x.mjs\",\n \"./package.json\": \"./package.json\"\n },\n \"license\": \"MIT\",\n \"description\": \"Vanilla package for PaymentKit\",\n \"files\": [\n \"dist\",\n \"dist/cdn\"\n ],\n \"scripts\": {\n \"dev\": \"yarn tsdown --watch ./src\",\n \"build:npm\": \"yarn tsdown\",\n \"build:cdn\": \"node build-cdn.mjs\",\n \"build\": \"yarn build:npm && yarn build:cdn\"\n },\n \"packageManager\": \"yarn@4.10.3\",\n \"dependencies\": {\n \"nanoid\": \"^5.0.7\",\n \"penpal\": \"^7.0.4\",\n \"posthog-js\": \"^1.196.0\",\n \"valibot\": \"^1.1.0\"\n },\n \"devDependencies\": {\n \"@pkg/sdk\": \"workspace:*\",\n \"@pkg/tsconfig\": \"workspace:*\",\n \"@stripe/stripe-js\": \"^8.6.1\",\n \"@types/applepayjs\": \"^14.0.9\",\n \"esbuild\": \"^0.24.2\",\n \"tsdown\": \"^0.15.10\",\n \"typescript\": \"^5.9.3\"\n },\n \"stableVersion\": \"0.5.5\"\n}\n","import type { AnalyticsAdapter, CapturedEvent } from \"./types\";\n\n/**\n * Mock analytics adapter for testing.\n *\n * Records all captured events for assertion in tests.\n */\nexport class MockAnalyticsAdapter implements AnalyticsAdapter {\n private events: CapturedEvent[] = [];\n private distinctId: string | null = null;\n\n identify(distinctId: string): void {\n this.distinctId = distinctId;\n }\n\n capture(event: string, properties?: Record<string, unknown>): void {\n this.events.push({\n event,\n distinct_id: this.distinctId,\n properties,\n timestamp: Date.now(),\n });\n }\n\n isInitialized(): boolean {\n return true;\n }\n\n // Test helper methods\n\n /**\n * Get all captured events.\n */\n getEvents(): CapturedEvent[] {\n return [...this.events];\n }\n\n /**\n * Get events by name.\n */\n getEventsByName(eventName: string): CapturedEvent[] {\n return this.events.filter((e) => e.event === eventName);\n }\n\n /**\n * Clear all captured events.\n */\n clear(): void {\n this.events = [];\n }\n}\n","import posthog from \"posthog-js\";\nimport type { AnalyticsAdapter } from \"./types\";\n\n// PostHog API key (PaymentKit internal)\nconst POSTHOG_API_KEY = \"phc_u9YDYUeUxo3CYn16XGrrwpVb8ycXgcjz5DarvIKRAAG\";\n\n/**\n * PostHog implementation of the analytics adapter.\n *\n * Singleton stored in window to ensure only one instance exists across\n * all script loads. Configures PostHog to use the reverse proxy at\n * /ingest to avoid ad blockers.\n */\nexport class PostHogAdapter implements AnalyticsAdapter {\n private initialized = false;\n\n /**\n * Get or create the PostHog adapter singleton (stored in window).\n *\n * @param apiBaseUrl - The API base URL for the reverse proxy\n * @throws Error if called with a different apiBaseUrl than the first call\n */\n static getInstance(apiBaseUrl: string): PostHogAdapter {\n if (typeof window === \"undefined\") {\n throw new Error(\"[PaymentKit Analytics] PostHog requires a browser environment\");\n }\n\n const existing = window.__paymentKitPostHog__;\n if (existing) {\n if (existing.apiBaseUrl !== apiBaseUrl) {\n throw new Error(\n `[PaymentKit Analytics] PostHog already initialized with apiBaseUrl \"${existing.apiBaseUrl}\", ` +\n `cannot re-initialize with different apiBaseUrl \"${apiBaseUrl}\"`,\n );\n }\n return existing.instance;\n }\n\n const instance = new PostHogAdapter(apiBaseUrl);\n window.__paymentKitPostHog__ = { instance, apiBaseUrl };\n return instance;\n }\n\n private constructor(apiBaseUrl: string) {\n this.initPostHog(apiBaseUrl);\n }\n\n private initPostHog(apiBaseUrl: string): void {\n try {\n posthog.init(POSTHOG_API_KEY, {\n // Use reverse proxy to avoid ad blockers\n api_host: `${apiBaseUrl}/ingest`,\n // PostHog UI host (for toolbar, if ever needed)\n ui_host: \"https://us.posthog.com\",\n // Memory persistence - no cookies in embedded checkout iframe\n persistence: \"memory\",\n // Disable session recording - not needed for metrics\n disable_session_recording: true,\n // Manual events only - no autocapture\n autocapture: false,\n // Manual pageview control\n capture_pageview: false,\n // Disable batching - send events immediately to avoid data loss on page close\n request_batching: false,\n // Disable bot detection - allows events from automated tests and debugging environments\n // PostHog detects Playwright/headless browsers as bots by default\n opt_out_useragent_filter: true,\n // Callback when PostHog is ready\n loaded: () => {\n this.initialized = true;\n },\n });\n } catch (e) {\n console.warn(\"[PaymentKit Analytics] Failed to initialize PostHog:\", e);\n }\n }\n\n identify(distinctId: string): void {\n try {\n posthog.identify(distinctId);\n } catch (e) {\n // Silent fail - never break checkout\n console.warn(\"[PaymentKit Analytics] Failed to identify:\", e);\n }\n }\n\n capture(event: string, properties?: Record<string, unknown>): void {\n try {\n posthog.capture(event, properties);\n } catch (e) {\n // Silent fail - never break checkout\n console.warn(\"[PaymentKit Analytics] Failed to capture event:\", e);\n }\n }\n\n isInitialized(): boolean {\n return this.initialized;\n }\n}\n","import { MockAnalyticsAdapter } from \"./mock-adapter\";\nimport { PostHogAdapter } from \"./posthog-adapter\";\nimport type { AnalyticsAdapter } from \"./types\";\n\n/**\n * Analytics service singleton.\n *\n * Provides a global interface for capturing analytics events.\n * Supports multiple adapters that receive all events (composite pattern).\n *\n * Usage:\n * // Initialize (typically done once at SDK init)\n * AnalyticsService.init(\"http://localhost:9000\");\n *\n * // Capture events - broadcasts to all registered adapters\n * AnalyticsService.capture(\"checkout_page_ready\", { session_id: \"...\" });\n *\n * // For testing - add a mock adapter\n * import { MockAnalyticsAdapter } from \"./mock-adapter\";\n * const mock = new MockAnalyticsAdapter();\n * AnalyticsService.addAdapter(mock);\n *\n * // Or use the built-in test mock (exposed globally as window.__paymentKitAnalytics__)\n * AnalyticsService.enableTestMode();\n * // Events can be read via window.__paymentKitAnalytics__.getEvents()\n */\nclass AnalyticsServiceClass {\n private adapters: AnalyticsAdapter[] = [];\n private testMock: MockAnalyticsAdapter | null = null;\n\n /**\n * Initialize the analytics service with PostHog.\n *\n * @param apiBaseUrl - The API base URL for the reverse proxy\n * @param enableTestMode - Enable test mode for capturing events in tests\n */\n init(apiBaseUrl: string, enableTestMode?: boolean): void {\n try {\n // Add PostHog adapter (singleton - safe to call multiple times with same URL)\n this.addAdapter(PostHogAdapter.getInstance(apiBaseUrl));\n\n // Enable test mode if explicitly requested\n if (enableTestMode) {\n this.enableTestMode();\n }\n } catch (e) {\n // Silent fail - analytics should never break checkout\n console.warn(\"[PaymentKit Analytics] Init failed:\", e);\n }\n }\n\n /**\n * Enable test mode by adding a mock adapter and exposing it globally.\n * The mock adapter is accessible via window.__paymentKitAnalytics__\n */\n enableTestMode(): void {\n if (this.testMock) return; // Already enabled\n\n this.testMock = new MockAnalyticsAdapter();\n this.addAdapter(this.testMock);\n\n // Expose globally for Playwright/test access\n if (typeof window !== \"undefined\") {\n window.__paymentKitAnalytics__ = this.testMock;\n }\n }\n\n /**\n * Get the test mock adapter (if test mode is enabled).\n */\n getTestMock(): MockAnalyticsAdapter | null {\n return this.testMock;\n }\n\n /**\n * Add an analytics adapter.\n * Events will be broadcast to all registered adapters.\n * Duplicate adapters (same instance) are ignored.\n *\n * @param adapter - The adapter to add\n */\n addAdapter(adapter: AnalyticsAdapter): void {\n if (!this.adapters.includes(adapter)) {\n this.adapters.push(adapter);\n }\n }\n\n /**\n * Clear all adapters.\n */\n clearAdapters(): void {\n this.adapters = [];\n this.testMock = null;\n if (typeof window !== \"undefined\") {\n delete window.__paymentKitAnalytics__;\n }\n }\n\n /**\n * Set the distinct_id for all adapters.\n * This is used to correlate frontend events with backend events.\n * Should be called with the checkout session secure token.\n */\n identify(distinctId: string): void {\n for (const adapter of this.adapters) {\n try {\n adapter.identify(distinctId);\n } catch {\n // Silent fail - never break checkout\n }\n }\n }\n\n /**\n * Capture an analytics event.\n * Broadcasts to all registered adapters. Silently fails on errors.\n */\n capture(event: string, properties?: Record<string, unknown>): void {\n for (const adapter of this.adapters) {\n try {\n adapter.capture(event, properties);\n } catch {\n // Silent fail - never break checkout\n }\n }\n }\n\n /**\n * Check if any adapter is initialized.\n */\n isInitialized(): boolean {\n return this.adapters.some((adapter) => adapter.isInitialized());\n }\n}\n\n/**\n * Global analytics service instance.\n */\nexport const AnalyticsService = new AnalyticsServiceClass();\n","import { AnalyticsService } from \"./service\";\n\n/**\n * Tracks timing metrics throughout the checkout flow.\n *\n * Create one instance per checkout session and call the track methods\n * at appropriate points in the checkout flow.\n *\n * Usage:\n * const requestId = getOrCreateCheckoutRequestId(environment);\n * const tracker = new CheckoutTimingTracker(secureToken, requestId);\n * tracker.trackPageReady();\n * // ... iframe loads ...\n * tracker.trackInputReady();\n * // ... user submits ...\n * tracker.trackSubmit();\n * // ... API response ...\n * tracker.trackSuccess(attemptId);\n */\nexport class CheckoutTimingTracker {\n // Class-level guard to prevent duplicate page_ready events across PaymentKit instances\n private static pageReadyTracked = false;\n\n private startTime: number;\n private checkoutSessionId: string;\n private requestId: string;\n private inputReadyTracked = false;\n\n constructor(checkoutSessionId: string, requestId: string) {\n this.startTime = performance.now();\n this.checkoutSessionId = checkoutSessionId;\n this.requestId = requestId;\n }\n\n /**\n * Track when SDK is initialized and ready.\n * Call immediately after PaymentKit() initialization.\n * Only tracks once per page load (subsequent calls are no-ops).\n */\n trackPageReady(): void {\n if (CheckoutTimingTracker.pageReadyTracked) return;\n CheckoutTimingTracker.pageReadyTracked = true;\n\n AnalyticsService.capture(\"checkout_page_ready\", {\n checkout_session_id: this.checkoutSessionId,\n request_id: this.requestId,\n elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Track when card input iframe is loaded and ready for input.\n * Should only be called once (for first iframe, typically card_pan).\n * Subsequent calls are no-ops.\n */\n trackInputReady(): void {\n if (this.inputReadyTracked) return;\n this.inputReadyTracked = true;\n\n AnalyticsService.capture(\"checkout_input_ready\", {\n checkout_session_id: this.checkoutSessionId,\n request_id: this.requestId,\n elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Track when user clicks submit button.\n */\n trackSubmit(): void {\n AnalyticsService.capture(\"checkout_submit\", {\n checkout_session_id: this.checkoutSessionId,\n request_id: this.requestId,\n elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Track successful checkout.\n *\n * @param checkoutAttemptId - The checkout attempt ID\n */\n trackSuccess(checkoutAttemptId: string): void {\n AnalyticsService.capture(\"checkout_success\", {\n checkout_session_id: this.checkoutSessionId,\n checkout_attempt_id: checkoutAttemptId,\n request_id: this.requestId,\n total_elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Track failed checkout.\n *\n * @param checkoutAttemptId - The checkout attempt ID (may be null if failed early)\n * @param errorCode - The error code from the checkout response\n * @param errorMessage - The customer-facing error message\n */\n trackFail(checkoutAttemptId: string | null, errorCode: string | null, errorMessage: string | null): void {\n AnalyticsService.capture(\"checkout_fail\", {\n checkout_session_id: this.checkoutSessionId,\n checkout_attempt_id: checkoutAttemptId,\n request_id: this.requestId,\n error_code: errorCode,\n error_message: errorMessage,\n total_elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Get elapsed time in milliseconds since tracker creation.\n */\n private getElapsedMs(): number {\n return Math.round(performance.now() - this.startTime);\n }\n}\n","import type { CheckoutTimingTracker } from \"./analytics\";\nimport type { CardErrorCode } from \"./penpal/connect-card\";\nimport type { TunnelXIFrameConnection } from \"./penpal/connect-tunnel-x\";\n\nexport type PaymentKitEnvironment = \"local\" | \"tunnel\" | \"sandbox\" | \"production\";\n\ntype EnvironmentUrls = {\n baseUrl: string;\n apiBaseUrl: string;\n};\n\n// TODO: Cleanup this after launch to only use SDK instead of plain fetch.\nconst STATIC_ENVIRONMENT_URLS: Record<Exclude<PaymentKitEnvironment, \"tunnel\">, EnvironmentUrls> = {\n local: {\n baseUrl: \"http://localhost:9101\",\n apiBaseUrl: \"http://localhost:9000\",\n },\n sandbox: {\n baseUrl: \"https://staging.paymentkit.com/customer\",\n apiBaseUrl: \"https://staging.paymentkit.com\",\n },\n production: {\n baseUrl: \"https://paymentkit.com/customer\",\n apiBaseUrl: \"https://paymentkit.com\",\n },\n};\n\nfunction getTunnelUrls(): EnvironmentUrls {\n if (typeof window !== \"undefined\") {\n const params = new URLSearchParams(window.location.search);\n const apiBaseUrl = params.get(\"api_base_url\");\n if (apiBaseUrl) {\n return {\n baseUrl: window.location.origin,\n apiBaseUrl,\n };\n }\n // For loclx-style tunnels where API hostname is derived from the current hostname\n const hostname = window.location.hostname;\n if (hostname.includes(\"loclx.io\")) {\n const apiHostname = hostname.replace(/cportal|playground/, \"api\");\n return {\n baseUrl: `https://${hostname}`,\n apiBaseUrl: `https://${apiHostname}`,\n };\n }\n }\n // Fallback\n return STATIC_ENVIRONMENT_URLS.local;\n}\n\nexport function getUrlsForEnvironment(environment: string): EnvironmentUrls {\n if (environment === \"tunnel\") {\n return getTunnelUrls();\n }\n const env = environment as Exclude<PaymentKitEnvironment, \"tunnel\">;\n const urls = STATIC_ENVIRONMENT_URLS[env];\n if (!urls) {\n throw new Error(`Invalid environment: ${environment}. Must be one of: local, tunnel, sandbox, production`);\n }\n return urls;\n}\n\ntype FormFieldNames = \"customer_name\" | \"customer_email\" | \"customer_country\" | \"customer_zip_code\";\n\nexport type FormErrorCodes = \"required\" | \"invalid\";\n\nexport type TInternalFuncs = {\n submitPayment: (\n fields: PaymentKitFields,\n options?: unknown,\n ) => Promise<{ data: { [key: string]: unknown }; errors?: never } | { data?: never; errors: PaymentKitErrors }>;\n cleanup?: () => void;\n};\n\nexport type PaymentKit = <T extends readonly PaymentMethod<unknown>[]>(options: {\n environment: string;\n secureToken: string;\n paymentMethods: T;\n /** Card tokenization mode from checkout session */\n cardTokenizationMode?: \"direct\" | \"vgs\";\n /** VGS vault ID from checkout session */\n vgsVaultId?: string;\n /** VGS environment from checkout session */\n vgsEnvironment?: string;\n /** @internal Enable analytics test mode for e2e testing */\n __enableAnalyticsTestMode?: boolean;\n}) => ExternalFuncsMapByPm<T> & {\n submit: PaymentKitSubmitHandler<T>;\n cleanup: () => void;\n};\n\ntype PaymentKitSubmitHandler<T extends readonly PaymentMethod<unknown>[]> = <\n N extends keyof ExternalFuncsMapByPm<T>,\n>(options: {\n fields: Partial<PaymentKitFields>;\n paymentMethod: N;\n options?: unknown;\n onError: (error: PaymentKitErrors) => void;\n onSuccess: (data: { [key: string]: unknown }) => void;\n}) => void;\n\nexport type PaymentKitStates = {\n baseUrl: string;\n apiBaseUrl: string;\n secureToken: string;\n environment: string;\n tunnelXConnection: TunnelXIFrameConnection;\n timingTracker: CheckoutTimingTracker;\n /** Checkout request ID for correlating all API calls and analytics events */\n checkoutRequestId: string;\n /** Card tokenization mode: 'direct' (KMS) or 'vgs' (VGS Collect + proxy) */\n cardTokenizationMode?: \"direct\" | \"vgs\";\n /** VGS vault ID (only when cardTokenizationMode is 'vgs') */\n vgsVaultId?: string;\n /** VGS environment: 'sandbox' or 'live' (only when cardTokenizationMode is 'vgs') */\n vgsEnvironment?: string;\n /** @internal Promise that resolves when session config (incl. VGS mode) is auto-detected */\n _sessionConfigReady?: Promise<void>;\n};\n\nexport type PaymentKitErrors = {\n root?: string;\n card_pan?: CardErrorCode;\n card_exp?: CardErrorCode;\n card_cvc?: CardErrorCode;\n paypal?: string;\n google_pay?: string;\n apple_pay?: string;\n processor_id?: string;\n amount?: string;\n currency?: string;\n country?: string;\n} & { [key in FormFieldNames]?: FormErrorCodes | string };\n\nexport type PaymentKitFields = { [key in FormFieldNames]: string };\n\nexport type PaymentMethod<TExternalFuncs = unknown, TName = string> = (paymentKitStates: PaymentKitStates) => {\n name: TName;\n externalFuncs: TExternalFuncs;\n internalFuncs: TInternalFuncs;\n};\n\nexport type ExternalFuncsMapByPm<T extends readonly PaymentMethod<unknown>[]> = {\n [K in T[number] as ReturnType<K>[\"name\"]]: ReturnType<K>[\"externalFuncs\"];\n};\n","import { version as PACKAGE_VERSION } from \"../package.json\";\nimport { AnalyticsService, CheckoutTimingTracker } from \"./analytics\";\nimport { connectToTunnelXIframe } from \"./penpal/connect-tunnel-x\";\nimport type { ExternalFuncsMapByPm, PaymentKitFields, PaymentKit as PaymentKitType } from \"./types\";\nimport { getUrlsForEnvironment } from \"./types\";\nimport { createCheckoutIFrame } from \"./utils\";\nimport { getOrCreateCheckoutRequestId } from \"./utils/checkout-request-id\";\n\ntype PaymentKitReturnType = ReturnType<PaymentKitType>;\n\nconst createTunnelXConnection = (baseUrl: string, apiBaseUrl: string, token: string) => {\n const iframe = createCheckoutIFrame(\"tunnel-x\", baseUrl, {\n checkout_token: token,\n api_base_url: apiBaseUrl,\n });\n document.body.appendChild(iframe);\n\n const connection = connectToTunnelXIframe(iframe, {});\n\n const unmount = () => {\n connection.destroy();\n document.body.removeChild(iframe);\n };\n\n return { unmount, connection };\n};\n\nconst PaymentKit: PaymentKitType = ({\n environment,\n secureToken,\n paymentMethods,\n cardTokenizationMode,\n vgsVaultId,\n vgsEnvironment,\n __enableAnalyticsTestMode,\n}) => {\n type PaymentMethods = typeof paymentMethods;\n\n // Resolve URLs from environment\n const { baseUrl, apiBaseUrl } = getUrlsForEnvironment(environment);\n\n // Log version for debugging\n console.log(`[PaymentKit] v${PACKAGE_VERSION} initialized (env: ${environment})`);\n\n // Generate checkout request ID for correlating all API calls and analytics events\n // This is idempotent - same ID is reused across multiple PaymentKit instantiations\n const checkoutRequestId = getOrCreateCheckoutRequestId(environment);\n console.log(`[PaymentKit] checkout_request_id: ${checkoutRequestId}`);\n\n // Initialize analytics and identify with secure token for correlation\n AnalyticsService.init(apiBaseUrl, __enableAnalyticsTestMode);\n AnalyticsService.identify(secureToken);\n\n // Create timing tracker for this checkout session\n const timingTracker = new CheckoutTimingTracker(secureToken, checkoutRequestId);\n\n // Track page ready immediately\n timingTracker.trackPageReady();\n\n const { connection: tunnelXConnection, unmount: unmountTunnelX } = createTunnelXConnection(\n baseUrl,\n apiBaseUrl,\n secureToken,\n );\n\n const paymentKitStates = {\n baseUrl,\n apiBaseUrl,\n secureToken,\n environment,\n tunnelXConnection,\n timingTracker,\n checkoutRequestId,\n cardTokenizationMode,\n vgsVaultId,\n vgsEnvironment,\n _sessionConfigReady: undefined as Promise<void> | undefined,\n };\n\n // Auto-detect VGS mode from session API if not explicitly provided.\n // The promise resolves before any card mount or submit needs the mode.\n if (cardTokenizationMode === undefined) {\n const sessionConfigUrl = `${apiBaseUrl}/api/checkout-sessions/token/${secureToken}`;\n console.log(\n `[PaymentKit] cardTokenizationMode not provided — auto-detecting from session API: ${sessionConfigUrl}`,\n );\n paymentKitStates._sessionConfigReady = fetch(sessionConfigUrl)\n .then((resp) => {\n if (!resp.ok) {\n console.warn(`[PaymentKit] Session config fetch failed with status ${resp.status}`);\n return null;\n }\n return resp.json();\n })\n .then((session) => {\n if (session && typeof session === \"object\" && typeof session.card_tokenization_mode === \"string\") {\n paymentKitStates.cardTokenizationMode = session.card_tokenization_mode || \"direct\";\n console.log(\n `[PaymentKit] Session config detected — cardTokenizationMode: ${paymentKitStates.cardTokenizationMode}`,\n );\n\n // Validate VGS config from API before trusting it\n const vaultId = session.vgs_vault_id;\n const vgsEnv = session.vgs_environment;\n if (vaultId && /^tnt[a-z0-9]+$/.test(vaultId) && (vgsEnv === \"sandbox\" || vgsEnv === \"live\")) {\n paymentKitStates.vgsVaultId = vaultId;\n paymentKitStates.vgsEnvironment = vgsEnv;\n console.log(`[PaymentKit] VGS config valid — vaultId: ${vaultId}, environment: ${vgsEnv}`);\n } else if (paymentKitStates.cardTokenizationMode === \"vgs\") {\n console.warn(\n `[PaymentKit] Invalid VGS config from session API (vaultId: ${vaultId}, env: ${vgsEnv}), falling back to direct mode`,\n );\n paymentKitStates.cardTokenizationMode = \"direct\";\n }\n } else {\n console.log(\"[PaymentKit] Session response missing card_tokenization_mode — defaulting to direct mode\");\n paymentKitStates.cardTokenizationMode = \"direct\";\n }\n })\n .catch((err) => {\n console.error(\"[PaymentKit] Session config fetch error — falling back to direct mode:\", err);\n paymentKitStates.cardTokenizationMode = \"direct\";\n });\n } else {\n console.log(`[PaymentKit] cardTokenizationMode explicitly set: ${cardTokenizationMode}`);\n }\n\n const pmInstances = paymentMethods.map((paymentMethod) => paymentMethod(paymentKitStates));\n\n const externalFuncsMapByPm: ExternalFuncsMapByPm<PaymentMethods> = pmInstances.reduce(\n (acc, { name, externalFuncs }) => {\n // @ts-expect-error - typecase this better in future\n acc[name] = externalFuncs;\n return acc;\n },\n {} as ExternalFuncsMapByPm<PaymentMethods>,\n );\n\n const submit: PaymentKitReturnType[\"submit\"] = ({\n paymentMethod: paymentMethodName,\n fields,\n options,\n onSuccess,\n onError,\n }) => {\n const paymentMethod = pmInstances.find(({ name }) => name === paymentMethodName);\n if (!paymentMethod) {\n onError({ root: \"payment_method_not_found\" });\n return;\n }\n paymentMethod.internalFuncs\n .submitPayment(fields, options)\n .then(({ data, errors }) => {\n errors ? onError(errors) : onSuccess(data);\n })\n .catch((e) => {\n console.error(\"PaymentKit:submit:catch\", e);\n\n // Try to extract error message from response\n if (e?.response?.data) {\n onError(e.response.data);\n } else if (e?.message) {\n onError({ root: e.message });\n } else {\n onError({ root: \"unknown_error\" });\n }\n });\n };\n\n const cleanup = () => {\n // Clean up all payment method instances\n for (const pm of pmInstances) {\n if (pm.internalFuncs.cleanup) {\n pm.internalFuncs.cleanup();\n }\n }\n unmountTunnelX();\n };\n\n return {\n submit,\n cleanup,\n ...externalFuncsMapByPm,\n };\n};\n\nexport type { PaymentKitFields };\n\nexport default PaymentKit;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.mjs","names":["STATIC_ENVIRONMENT_URLS: Record<Exclude<PaymentKitEnvironment, \"tunnel\">, EnvironmentUrls>","PaymentKit: PaymentKitType","PACKAGE_VERSION","externalFuncsMapByPm: ExternalFuncsMapByPm<PaymentMethods>","submit: PaymentKitReturnType[\"submit\"]"],"sources":["../package.json","../src/analytics/mock-adapter.ts","../src/analytics/posthog-adapter.ts","../src/analytics/service.ts","../src/analytics/checkout-timing.ts","../src/types.ts","../src/index.ts"],"sourcesContent":["{\n \"name\": \"@payment-kit-js/vanilla\",\n \"version\": \"0.5.7\",\n \"main\": \"./dist/index.mjs\",\n \"types\": \"./dist/index.d.mts\",\n \"module\": \"./dist/index.mjs\",\n \"exports\": {\n \".\": \"./dist/index.mjs\",\n \"./payment-methods/airwallex-apple-pay-adapter\": \"./dist/payment-methods/airwallex-apple-pay-adapter.mjs\",\n \"./payment-methods/airwallex-google-pay-adapter\": \"./dist/payment-methods/airwallex-google-pay-adapter.mjs\",\n \"./payment-methods/apple-pay\": \"./dist/payment-methods/apple-pay.mjs\",\n \"./payment-methods/card\": \"./dist/payment-methods/card.mjs\",\n \"./payment-methods/google-pay\": \"./dist/payment-methods/google-pay.mjs\",\n \"./payment-methods/next-action-handlers\": \"./dist/payment-methods/next-action-handlers.mjs\",\n \"./payment-methods/paypal\": \"./dist/payment-methods/paypal.mjs\",\n \"./payment-methods/stripe-apple-pay-adapter\": \"./dist/payment-methods/stripe-apple-pay-adapter.mjs\",\n \"./payment-methods/stripe-google-pay-adapter\": \"./dist/payment-methods/stripe-google-pay-adapter.mjs\",\n \"./payment-methods/vgs-collect-loader\": \"./dist/payment-methods/vgs-collect-loader.mjs\",\n \"./penpal/connect-card\": \"./dist/penpal/connect-card.mjs\",\n \"./penpal/connect-tunnel-x\": \"./dist/penpal/connect-tunnel-x.mjs\",\n \"./package.json\": \"./package.json\"\n },\n \"license\": \"MIT\",\n \"description\": \"Vanilla package for PaymentKit\",\n \"files\": [\n \"dist\",\n \"dist/cdn\"\n ],\n \"scripts\": {\n \"dev\": \"yarn tsdown --watch ./src\",\n \"build:npm\": \"yarn tsdown\",\n \"build:cdn\": \"node build-cdn.mjs\",\n \"build\": \"yarn build:npm && yarn build:cdn\"\n },\n \"packageManager\": \"yarn@4.10.3\",\n \"dependencies\": {\n \"nanoid\": \"^5.0.7\",\n \"penpal\": \"^7.0.4\",\n \"posthog-js\": \"^1.196.0\",\n \"valibot\": \"^1.1.0\"\n },\n \"devDependencies\": {\n \"@pkg/sdk\": \"workspace:*\",\n \"@pkg/tsconfig\": \"workspace:*\",\n \"@stripe/stripe-js\": \"^8.6.1\",\n \"@types/applepayjs\": \"^14.0.9\",\n \"esbuild\": \"^0.24.2\",\n \"tsdown\": \"^0.15.10\",\n \"typescript\": \"^5.9.3\"\n },\n \"stableVersion\": \"0.5.7\"\n}\n","import type { AnalyticsAdapter, CapturedEvent } from \"./types\";\n\n/**\n * Mock analytics adapter for testing.\n *\n * Records all captured events for assertion in tests.\n */\nexport class MockAnalyticsAdapter implements AnalyticsAdapter {\n private events: CapturedEvent[] = [];\n private distinctId: string | null = null;\n\n identify(distinctId: string): void {\n this.distinctId = distinctId;\n }\n\n capture(event: string, properties?: Record<string, unknown>): void {\n this.events.push({\n event,\n distinct_id: this.distinctId,\n properties,\n timestamp: Date.now(),\n });\n }\n\n isInitialized(): boolean {\n return true;\n }\n\n // Test helper methods\n\n /**\n * Get all captured events.\n */\n getEvents(): CapturedEvent[] {\n return [...this.events];\n }\n\n /**\n * Get events by name.\n */\n getEventsByName(eventName: string): CapturedEvent[] {\n return this.events.filter((e) => e.event === eventName);\n }\n\n /**\n * Clear all captured events.\n */\n clear(): void {\n this.events = [];\n }\n}\n","import posthog from \"posthog-js\";\nimport type { AnalyticsAdapter } from \"./types\";\n\n// PostHog API key (PaymentKit internal)\nconst POSTHOG_API_KEY = \"phc_u9YDYUeUxo3CYn16XGrrwpVb8ycXgcjz5DarvIKRAAG\";\n\n/**\n * PostHog implementation of the analytics adapter.\n *\n * Singleton stored in window to ensure only one instance exists across\n * all script loads. Configures PostHog to use the reverse proxy at\n * /ingest to avoid ad blockers.\n */\nexport class PostHogAdapter implements AnalyticsAdapter {\n private initialized = false;\n\n /**\n * Get or create the PostHog adapter singleton (stored in window).\n *\n * @param apiBaseUrl - The API base URL for the reverse proxy\n * @throws Error if called with a different apiBaseUrl than the first call\n */\n static getInstance(apiBaseUrl: string): PostHogAdapter {\n if (typeof window === \"undefined\") {\n throw new Error(\"[PaymentKit Analytics] PostHog requires a browser environment\");\n }\n\n const existing = window.__paymentKitPostHog__;\n if (existing) {\n if (existing.apiBaseUrl !== apiBaseUrl) {\n throw new Error(\n `[PaymentKit Analytics] PostHog already initialized with apiBaseUrl \"${existing.apiBaseUrl}\", ` +\n `cannot re-initialize with different apiBaseUrl \"${apiBaseUrl}\"`,\n );\n }\n return existing.instance;\n }\n\n const instance = new PostHogAdapter(apiBaseUrl);\n window.__paymentKitPostHog__ = { instance, apiBaseUrl };\n return instance;\n }\n\n private constructor(apiBaseUrl: string) {\n this.initPostHog(apiBaseUrl);\n }\n\n private initPostHog(apiBaseUrl: string): void {\n try {\n posthog.init(POSTHOG_API_KEY, {\n // Use reverse proxy to avoid ad blockers\n api_host: `${apiBaseUrl}/ingest`,\n // PostHog UI host (for toolbar, if ever needed)\n ui_host: \"https://us.posthog.com\",\n // Memory persistence - no cookies in embedded checkout iframe\n persistence: \"memory\",\n // Disable session recording - not needed for metrics\n disable_session_recording: true,\n // Manual events only - no autocapture\n autocapture: false,\n // Manual pageview control\n capture_pageview: false,\n // Disable batching - send events immediately to avoid data loss on page close\n request_batching: false,\n // Disable bot detection - allows events from automated tests and debugging environments\n // PostHog detects Playwright/headless browsers as bots by default\n opt_out_useragent_filter: true,\n // Callback when PostHog is ready\n loaded: () => {\n this.initialized = true;\n },\n });\n } catch (e) {\n console.warn(\"[PaymentKit Analytics] Failed to initialize PostHog:\", e);\n }\n }\n\n identify(distinctId: string): void {\n try {\n posthog.identify(distinctId);\n } catch (e) {\n // Silent fail - never break checkout\n console.warn(\"[PaymentKit Analytics] Failed to identify:\", e);\n }\n }\n\n capture(event: string, properties?: Record<string, unknown>): void {\n try {\n posthog.capture(event, properties);\n } catch (e) {\n // Silent fail - never break checkout\n console.warn(\"[PaymentKit Analytics] Failed to capture event:\", e);\n }\n }\n\n isInitialized(): boolean {\n return this.initialized;\n }\n}\n","import { MockAnalyticsAdapter } from \"./mock-adapter\";\nimport { PostHogAdapter } from \"./posthog-adapter\";\nimport type { AnalyticsAdapter } from \"./types\";\n\n/**\n * Analytics service singleton.\n *\n * Provides a global interface for capturing analytics events.\n * Supports multiple adapters that receive all events (composite pattern).\n *\n * Usage:\n * // Initialize (typically done once at SDK init)\n * AnalyticsService.init(\"http://localhost:9000\");\n *\n * // Capture events - broadcasts to all registered adapters\n * AnalyticsService.capture(\"checkout_page_ready\", { session_id: \"...\" });\n *\n * // For testing - add a mock adapter\n * import { MockAnalyticsAdapter } from \"./mock-adapter\";\n * const mock = new MockAnalyticsAdapter();\n * AnalyticsService.addAdapter(mock);\n *\n * // Or use the built-in test mock (exposed globally as window.__paymentKitAnalytics__)\n * AnalyticsService.enableTestMode();\n * // Events can be read via window.__paymentKitAnalytics__.getEvents()\n */\nclass AnalyticsServiceClass {\n private adapters: AnalyticsAdapter[] = [];\n private testMock: MockAnalyticsAdapter | null = null;\n\n /**\n * Initialize the analytics service with PostHog.\n *\n * @param apiBaseUrl - The API base URL for the reverse proxy\n * @param enableTestMode - Enable test mode for capturing events in tests\n */\n init(apiBaseUrl: string, enableTestMode?: boolean): void {\n try {\n // Add PostHog adapter (singleton - safe to call multiple times with same URL)\n this.addAdapter(PostHogAdapter.getInstance(apiBaseUrl));\n\n // Enable test mode if explicitly requested\n if (enableTestMode) {\n this.enableTestMode();\n }\n } catch (e) {\n // Silent fail - analytics should never break checkout\n console.warn(\"[PaymentKit Analytics] Init failed:\", e);\n }\n }\n\n /**\n * Enable test mode by adding a mock adapter and exposing it globally.\n * The mock adapter is accessible via window.__paymentKitAnalytics__\n */\n enableTestMode(): void {\n if (this.testMock) return; // Already enabled\n\n this.testMock = new MockAnalyticsAdapter();\n this.addAdapter(this.testMock);\n\n // Expose globally for Playwright/test access\n if (typeof window !== \"undefined\") {\n window.__paymentKitAnalytics__ = this.testMock;\n }\n }\n\n /**\n * Get the test mock adapter (if test mode is enabled).\n */\n getTestMock(): MockAnalyticsAdapter | null {\n return this.testMock;\n }\n\n /**\n * Add an analytics adapter.\n * Events will be broadcast to all registered adapters.\n * Duplicate adapters (same instance) are ignored.\n *\n * @param adapter - The adapter to add\n */\n addAdapter(adapter: AnalyticsAdapter): void {\n if (!this.adapters.includes(adapter)) {\n this.adapters.push(adapter);\n }\n }\n\n /**\n * Clear all adapters.\n */\n clearAdapters(): void {\n this.adapters = [];\n this.testMock = null;\n if (typeof window !== \"undefined\") {\n delete window.__paymentKitAnalytics__;\n }\n }\n\n /**\n * Set the distinct_id for all adapters.\n * This is used to correlate frontend events with backend events.\n * Should be called with the checkout session secure token.\n */\n identify(distinctId: string): void {\n for (const adapter of this.adapters) {\n try {\n adapter.identify(distinctId);\n } catch {\n // Silent fail - never break checkout\n }\n }\n }\n\n /**\n * Capture an analytics event.\n * Broadcasts to all registered adapters. Silently fails on errors.\n */\n capture(event: string, properties?: Record<string, unknown>): void {\n for (const adapter of this.adapters) {\n try {\n adapter.capture(event, properties);\n } catch {\n // Silent fail - never break checkout\n }\n }\n }\n\n /**\n * Check if any adapter is initialized.\n */\n isInitialized(): boolean {\n return this.adapters.some((adapter) => adapter.isInitialized());\n }\n}\n\n/**\n * Global analytics service instance.\n */\nexport const AnalyticsService = new AnalyticsServiceClass();\n","import { AnalyticsService } from \"./service\";\n\n/**\n * Tracks timing metrics throughout the checkout flow.\n *\n * Create one instance per checkout session and call the track methods\n * at appropriate points in the checkout flow.\n *\n * Usage:\n * const requestId = getOrCreateCheckoutRequestId(environment);\n * const tracker = new CheckoutTimingTracker(secureToken, requestId);\n * tracker.trackPageReady();\n * // ... iframe loads ...\n * tracker.trackInputReady();\n * // ... user submits ...\n * tracker.trackSubmit();\n * // ... API response ...\n * tracker.trackSuccess(attemptId);\n */\nexport class CheckoutTimingTracker {\n // Class-level guard to prevent duplicate page_ready events across PaymentKit instances\n private static pageReadyTracked = false;\n\n private startTime: number;\n private checkoutSessionId: string;\n private requestId: string;\n private inputReadyTracked = false;\n\n constructor(checkoutSessionId: string, requestId: string) {\n this.startTime = performance.now();\n this.checkoutSessionId = checkoutSessionId;\n this.requestId = requestId;\n }\n\n /**\n * Track when SDK is initialized and ready.\n * Call immediately after PaymentKit() initialization.\n * Only tracks once per page load (subsequent calls are no-ops).\n */\n trackPageReady(): void {\n if (CheckoutTimingTracker.pageReadyTracked) return;\n CheckoutTimingTracker.pageReadyTracked = true;\n\n AnalyticsService.capture(\"checkout_page_ready\", {\n checkout_session_id: this.checkoutSessionId,\n request_id: this.requestId,\n elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Track when card input iframe is loaded and ready for input.\n * Should only be called once (for first iframe, typically card_pan).\n * Subsequent calls are no-ops.\n */\n trackInputReady(): void {\n if (this.inputReadyTracked) return;\n this.inputReadyTracked = true;\n\n AnalyticsService.capture(\"checkout_input_ready\", {\n checkout_session_id: this.checkoutSessionId,\n request_id: this.requestId,\n elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Track when user clicks submit button.\n */\n trackSubmit(): void {\n AnalyticsService.capture(\"checkout_submit\", {\n checkout_session_id: this.checkoutSessionId,\n request_id: this.requestId,\n elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Track successful checkout.\n *\n * @param checkoutAttemptId - The checkout attempt ID\n */\n trackSuccess(checkoutAttemptId: string): void {\n AnalyticsService.capture(\"checkout_success\", {\n checkout_session_id: this.checkoutSessionId,\n checkout_attempt_id: checkoutAttemptId,\n request_id: this.requestId,\n total_elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Track failed checkout.\n *\n * @param checkoutAttemptId - The checkout attempt ID (may be null if failed early)\n * @param errorCode - The error code from the checkout response\n * @param errorMessage - The customer-facing error message\n */\n trackFail(checkoutAttemptId: string | null, errorCode: string | null, errorMessage: string | null): void {\n AnalyticsService.capture(\"checkout_fail\", {\n checkout_session_id: this.checkoutSessionId,\n checkout_attempt_id: checkoutAttemptId,\n request_id: this.requestId,\n error_code: errorCode,\n error_message: errorMessage,\n total_elapsed_ms: this.getElapsedMs(),\n });\n }\n\n /**\n * Get elapsed time in milliseconds since tracker creation.\n */\n private getElapsedMs(): number {\n return Math.round(performance.now() - this.startTime);\n }\n}\n","import type { CheckoutTimingTracker } from \"./analytics\";\nimport type { CardErrorCode } from \"./penpal/connect-card\";\nimport type { TunnelXIFrameConnection } from \"./penpal/connect-tunnel-x\";\n\nexport type PaymentKitEnvironment = \"local\" | \"tunnel\" | \"sandbox\" | \"production\";\n\ntype EnvironmentUrls = {\n baseUrl: string;\n apiBaseUrl: string;\n};\n\n// TODO: Cleanup this after launch to only use SDK instead of plain fetch.\nconst STATIC_ENVIRONMENT_URLS: Record<Exclude<PaymentKitEnvironment, \"tunnel\">, EnvironmentUrls> = {\n local: {\n baseUrl: \"http://localhost:9101\",\n apiBaseUrl: \"http://localhost:9000\",\n },\n sandbox: {\n baseUrl: \"https://staging.paymentkit.com/customer\",\n apiBaseUrl: \"https://staging.paymentkit.com\",\n },\n production: {\n baseUrl: \"https://paymentkit.com/customer\",\n apiBaseUrl: \"https://paymentkit.com\",\n },\n};\n\nfunction getTunnelUrls(): EnvironmentUrls {\n if (typeof window !== \"undefined\") {\n const params = new URLSearchParams(window.location.search);\n const apiBaseUrl = params.get(\"api_base_url\");\n if (apiBaseUrl) {\n return {\n baseUrl: window.location.origin,\n apiBaseUrl,\n };\n }\n // For loclx-style tunnels where API hostname is derived from the current hostname\n const hostname = window.location.hostname;\n if (hostname.includes(\"loclx.io\")) {\n const apiHostname = hostname.replace(/cportal|playground/, \"api\");\n return {\n baseUrl: `https://${hostname}`,\n apiBaseUrl: `https://${apiHostname}`,\n };\n }\n }\n // Fallback\n return STATIC_ENVIRONMENT_URLS.local;\n}\n\nexport function getUrlsForEnvironment(environment: string): EnvironmentUrls {\n if (environment === \"tunnel\") {\n return getTunnelUrls();\n }\n const env = environment as Exclude<PaymentKitEnvironment, \"tunnel\">;\n const urls = STATIC_ENVIRONMENT_URLS[env];\n if (!urls) {\n throw new Error(`Invalid environment: ${environment}. Must be one of: local, tunnel, sandbox, production`);\n }\n return urls;\n}\n\ntype FormFieldNames = \"customer_name\" | \"customer_email\" | \"customer_country\" | \"customer_zip_code\";\n\nexport type FormErrorCodes = \"required\" | \"invalid\";\n\nexport type TInternalFuncs = {\n submitPayment: (\n fields: PaymentKitFields,\n options?: unknown,\n ) => Promise<{ data: { [key: string]: unknown }; errors?: never } | { data?: never; errors: PaymentKitErrors }>;\n cleanup?: () => void;\n};\n\nexport type PaymentKit = <T extends readonly PaymentMethod<unknown>[]>(options: {\n environment: string;\n secureToken: string;\n paymentMethods: T;\n /** Card tokenization mode from checkout session */\n cardTokenizationMode?: \"direct\" | \"vgs\";\n /** VGS vault ID from checkout session */\n vgsVaultId?: string;\n /** VGS environment from checkout session */\n vgsEnvironment?: string;\n /** @internal Enable analytics test mode for e2e testing */\n __enableAnalyticsTestMode?: boolean;\n}) => ExternalFuncsMapByPm<T> & {\n submit: PaymentKitSubmitHandler<T>;\n cleanup: () => void;\n};\n\ntype PaymentKitSubmitHandler<T extends readonly PaymentMethod<unknown>[]> = <\n N extends keyof ExternalFuncsMapByPm<T>,\n>(options: {\n fields: Partial<PaymentKitFields>;\n paymentMethod: N;\n options?: unknown;\n onError: (error: PaymentKitErrors) => void;\n onSuccess: (data: { [key: string]: unknown }) => void;\n}) => void;\n\nexport type PaymentKitStates = {\n baseUrl: string;\n apiBaseUrl: string;\n secureToken: string;\n environment: string;\n tunnelXConnection: TunnelXIFrameConnection;\n timingTracker: CheckoutTimingTracker;\n /** Checkout request ID for correlating all API calls and analytics events */\n checkoutRequestId: string;\n /** Card tokenization mode: 'direct' (KMS) or 'vgs' (VGS Collect + proxy) */\n cardTokenizationMode?: \"direct\" | \"vgs\";\n /** VGS vault ID (only when cardTokenizationMode is 'vgs') */\n vgsVaultId?: string;\n /** VGS environment: 'sandbox' or 'live' (only when cardTokenizationMode is 'vgs') */\n vgsEnvironment?: string;\n /** @internal Promise that resolves when session config (incl. VGS mode) is auto-detected */\n _sessionConfigReady?: Promise<void>;\n};\n\nexport type PaymentKitErrors = {\n root?: string;\n card_pan?: CardErrorCode;\n card_exp?: CardErrorCode;\n card_cvc?: CardErrorCode;\n paypal?: string;\n google_pay?: string;\n apple_pay?: string;\n processor_id?: string;\n amount?: string;\n currency?: string;\n country?: string;\n} & { [key in FormFieldNames]?: FormErrorCodes | string };\n\nexport type PaymentKitFields = { [key in FormFieldNames]: string };\n\nexport type PaymentMethod<TExternalFuncs = unknown, TName = string> = (paymentKitStates: PaymentKitStates) => {\n name: TName;\n externalFuncs: TExternalFuncs;\n internalFuncs: TInternalFuncs;\n};\n\nexport type ExternalFuncsMapByPm<T extends readonly PaymentMethod<unknown>[]> = {\n [K in T[number] as ReturnType<K>[\"name\"]]: ReturnType<K>[\"externalFuncs\"];\n};\n","import { version as PACKAGE_VERSION } from \"../package.json\";\nimport { AnalyticsService, CheckoutTimingTracker } from \"./analytics\";\nimport { connectToTunnelXIframe } from \"./penpal/connect-tunnel-x\";\nimport type { ExternalFuncsMapByPm, PaymentKitFields, PaymentKit as PaymentKitType } from \"./types\";\nimport { getUrlsForEnvironment } from \"./types\";\nimport { createCheckoutIFrame } from \"./utils\";\nimport { getOrCreateCheckoutRequestId } from \"./utils/checkout-request-id\";\n\ntype PaymentKitReturnType = ReturnType<PaymentKitType>;\n\nconst createTunnelXConnection = (baseUrl: string, apiBaseUrl: string, token: string) => {\n const iframe = createCheckoutIFrame(\"tunnel-x\", baseUrl, {\n checkout_token: token,\n api_base_url: apiBaseUrl,\n });\n document.body.appendChild(iframe);\n\n const connection = connectToTunnelXIframe(iframe, {});\n\n const unmount = () => {\n connection.destroy();\n document.body.removeChild(iframe);\n };\n\n return { unmount, connection };\n};\n\nconst PaymentKit: PaymentKitType = ({\n environment,\n secureToken,\n paymentMethods,\n cardTokenizationMode,\n vgsVaultId,\n vgsEnvironment,\n __enableAnalyticsTestMode,\n}) => {\n type PaymentMethods = typeof paymentMethods;\n\n // Resolve URLs from environment\n const { baseUrl, apiBaseUrl } = getUrlsForEnvironment(environment);\n\n // Log version for debugging\n console.log(`[PaymentKit] v${PACKAGE_VERSION} initialized (env: ${environment})`);\n\n // Generate checkout request ID for correlating all API calls and analytics events\n // This is idempotent - same ID is reused across multiple PaymentKit instantiations\n const checkoutRequestId = getOrCreateCheckoutRequestId(environment);\n console.log(`[PaymentKit] checkout_request_id: ${checkoutRequestId}`);\n\n // Initialize analytics and identify with secure token for correlation\n AnalyticsService.init(apiBaseUrl, __enableAnalyticsTestMode);\n AnalyticsService.identify(secureToken);\n\n // Create timing tracker for this checkout session\n const timingTracker = new CheckoutTimingTracker(secureToken, checkoutRequestId);\n\n // Track page ready immediately\n timingTracker.trackPageReady();\n\n const { connection: tunnelXConnection, unmount: unmountTunnelX } = createTunnelXConnection(\n baseUrl,\n apiBaseUrl,\n secureToken,\n );\n\n const paymentKitStates = {\n baseUrl,\n apiBaseUrl,\n secureToken,\n environment,\n tunnelXConnection,\n timingTracker,\n checkoutRequestId,\n cardTokenizationMode,\n vgsVaultId,\n vgsEnvironment,\n _sessionConfigReady: undefined as Promise<void> | undefined,\n };\n\n // Auto-detect VGS mode from session API if not explicitly provided.\n // The promise resolves before any card mount or submit needs the mode.\n if (cardTokenizationMode === undefined) {\n const sessionConfigUrl = `${apiBaseUrl}/api/checkout-sessions/token/${secureToken}`;\n console.log(\n `[PaymentKit] cardTokenizationMode not provided — auto-detecting from session API: ${sessionConfigUrl}`,\n );\n paymentKitStates._sessionConfigReady = fetch(sessionConfigUrl)\n .then((resp) => {\n if (!resp.ok) {\n console.warn(`[PaymentKit] Session config fetch failed with status ${resp.status}`);\n return null;\n }\n return resp.json();\n })\n .then((session) => {\n if (session && typeof session === \"object\" && typeof session.card_tokenization_mode === \"string\") {\n paymentKitStates.cardTokenizationMode = session.card_tokenization_mode || \"direct\";\n console.log(\n `[PaymentKit] Session config detected — cardTokenizationMode: ${paymentKitStates.cardTokenizationMode}`,\n );\n\n // Validate VGS config from API before trusting it\n const vaultId = session.vgs_vault_id;\n const vgsEnv = session.vgs_environment;\n if (vaultId && /^tnt[a-z0-9]+$/.test(vaultId) && (vgsEnv === \"sandbox\" || vgsEnv === \"live\")) {\n paymentKitStates.vgsVaultId = vaultId;\n paymentKitStates.vgsEnvironment = vgsEnv;\n console.log(`[PaymentKit] VGS config valid — vaultId: ${vaultId}, environment: ${vgsEnv}`);\n } else if (paymentKitStates.cardTokenizationMode === \"vgs\") {\n console.warn(\n `[PaymentKit] Invalid VGS config from session API (vaultId: ${vaultId}, env: ${vgsEnv}), falling back to direct mode`,\n );\n paymentKitStates.cardTokenizationMode = \"direct\";\n }\n } else {\n console.log(\"[PaymentKit] Session response missing card_tokenization_mode — defaulting to direct mode\");\n paymentKitStates.cardTokenizationMode = \"direct\";\n }\n })\n .catch((err) => {\n console.error(\"[PaymentKit] Session config fetch error — falling back to direct mode:\", err);\n paymentKitStates.cardTokenizationMode = \"direct\";\n });\n } else {\n console.log(`[PaymentKit] cardTokenizationMode explicitly set: ${cardTokenizationMode}`);\n }\n\n const pmInstances = paymentMethods.map((paymentMethod) => paymentMethod(paymentKitStates));\n\n const externalFuncsMapByPm: ExternalFuncsMapByPm<PaymentMethods> = pmInstances.reduce(\n (acc, { name, externalFuncs }) => {\n // @ts-expect-error - typecase this better in future\n acc[name] = externalFuncs;\n return acc;\n },\n {} as ExternalFuncsMapByPm<PaymentMethods>,\n );\n\n const submit: PaymentKitReturnType[\"submit\"] = ({\n paymentMethod: paymentMethodName,\n fields,\n options,\n onSuccess,\n onError,\n }) => {\n const paymentMethod = pmInstances.find(({ name }) => name === paymentMethodName);\n if (!paymentMethod) {\n onError({ root: \"payment_method_not_found\" });\n return;\n }\n paymentMethod.internalFuncs\n .submitPayment(fields, options)\n .then(({ data, errors }) => {\n errors ? onError(errors) : onSuccess(data);\n })\n .catch((e) => {\n console.error(\"PaymentKit:submit:catch\", e);\n\n // Try to extract error message from response\n if (e?.response?.data) {\n onError(e.response.data);\n } else if (e?.message) {\n onError({ root: e.message });\n } else {\n onError({ root: \"unknown_error\" });\n }\n });\n };\n\n const cleanup = () => {\n // Clean up all payment method instances\n for (const pm of pmInstances) {\n if (pm.internalFuncs.cleanup) {\n pm.internalFuncs.cleanup();\n }\n }\n unmountTunnelX();\n };\n\n return {\n submit,\n cleanup,\n ...externalFuncsMapByPm,\n };\n};\n\nexport type { PaymentKitFields };\n\nexport default PaymentKit;\n"],"mappings":"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"}
|
|
@@ -3,7 +3,7 @@ import { t as TunnelXManager } from "../connect-tunnel-x-BhVAej5Q.mjs";
|
|
|
3
3
|
import { a as validateFormFields, i as definePaymentMethod, n as collectFraudMetadata, r as createCheckoutIFrame, s as withRequestId, t as $ } from "../utils-B70Y8YcZ.mjs";
|
|
4
4
|
import { t as handleNextAction } from "../next-action-handlers-CTx8tRt0.mjs";
|
|
5
5
|
import { t as connectToCardIframe } from "../connect-card-CMZkeppE.mjs";
|
|
6
|
-
import { n as initVgsCollect, r as loadVgsCollectScript, t as createVgsCardFields } from "../vgs-collect-loader-
|
|
6
|
+
import { n as initVgsCollect, r as loadVgsCollectScript, t as createVgsCardFields } from "../vgs-collect-loader-3Z4IWCA6.mjs";
|
|
7
7
|
|
|
8
8
|
//#region src/payment-methods/card.ts
|
|
9
9
|
/**
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { n as initVgsCollect, r as loadVgsCollectScript, t as createVgsCardFields } from "../vgs-collect-loader-
|
|
1
|
+
import { n as initVgsCollect, r as loadVgsCollectScript, t as createVgsCardFields } from "../vgs-collect-loader-3Z4IWCA6.mjs";
|
|
2
2
|
|
|
3
3
|
export { createVgsCardFields, initVgsCollect, loadVgsCollectScript };
|
|
@@ -68,8 +68,18 @@ function createVgsCardFields(form, mountPoints, css, onFocusChangeCallbacks, pla
|
|
|
68
68
|
validations: ["required", "validCardNumber"],
|
|
69
69
|
css: fieldCss
|
|
70
70
|
});
|
|
71
|
-
const expField = form.
|
|
71
|
+
const expField = form.field(mountPoints.exp, {
|
|
72
|
+
type: "card-expiration-date",
|
|
73
|
+
name: "exp-date",
|
|
72
74
|
placeholder: placeholders?.card_exp ?? "MM / YY",
|
|
75
|
+
yearLength: 2,
|
|
76
|
+
serializers: [{
|
|
77
|
+
name: "separate",
|
|
78
|
+
options: {
|
|
79
|
+
monthName: "month",
|
|
80
|
+
yearName: "year"
|
|
81
|
+
}
|
|
82
|
+
}],
|
|
73
83
|
validations: ["required", "validCardExpirationDate"],
|
|
74
84
|
css: fieldCss
|
|
75
85
|
});
|
|
@@ -125,4 +135,4 @@ function createVgsCardFields(form, mountPoints, css, onFocusChangeCallbacks, pla
|
|
|
125
135
|
|
|
126
136
|
//#endregion
|
|
127
137
|
export { initVgsCollect as n, loadVgsCollectScript as r, createVgsCardFields as t };
|
|
128
|
-
//# sourceMappingURL=vgs-collect-loader-
|
|
138
|
+
//# sourceMappingURL=vgs-collect-loader-3Z4IWCA6.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vgs-collect-loader-3Z4IWCA6.mjs","names":["loadPromise: Promise<void> | null","fieldMap: [VGSCollectField, string][]"],"sources":["../src/payment-methods/vgs-collect-loader.ts"],"sourcesContent":["const VGS_COLLECT_CDN = \"https://js.verygoodvault.com/vgs-collect/3.2.1/vgs-collect.js\";\n\nlet loadPromise: Promise<void> | null = null;\n\n/**\n * Loads VGS Collect JS from CDN. Idempotent — subsequent calls return the same promise.\n */\nexport function loadVgsCollectScript(): Promise<void> {\n if (loadPromise) {\n console.log(\"[PaymentKit] VGS Collect CDN load already in progress — reusing promise\");\n return loadPromise;\n }\n\n loadPromise = new Promise<void>((resolve, reject) => {\n if (typeof window !== \"undefined\" && window.VGSCollect) {\n console.log(\"[PaymentKit] VGS Collect JS already available on window\");\n resolve();\n return;\n }\n\n console.log(`[PaymentKit] Loading VGS Collect JS from CDN: ${VGS_COLLECT_CDN}`);\n const script = document.createElement(\"script\");\n script.src = VGS_COLLECT_CDN;\n script.async = true;\n script.onload = () => {\n console.log(\"[PaymentKit] VGS Collect JS loaded successfully from CDN\");\n resolve();\n };\n script.onerror = () => {\n console.error(`[PaymentKit] Failed to load VGS Collect JS from CDN: ${VGS_COLLECT_CDN}`);\n loadPromise = null;\n reject(new Error(\"Failed to load VGS Collect JS\"));\n };\n document.head.appendChild(script);\n });\n\n return loadPromise;\n}\n\n/**\n * Initializes a VGS Collect form instance.\n */\nexport function initVgsCollect(vaultId: string, environment: string): VGSCollectForm {\n if (!window.VGSCollect) {\n throw new Error(\"VGS Collect JS not loaded. Call loadVgsCollectScript() first.\");\n }\n return window.VGSCollect.create(vaultId, environment, () => {});\n}\n\n/**\n * Creates and mounts VGS Collect card fields using CMP-specific field methods.\n *\n * Uses cardNumberField(), cardExpirationDateField(), cardCVCField() which are\n * required for the CMP createCard() flow. After mounting, call form.createCard()\n * to create a card in the VGS vault, which returns aliases for PAN and CVC.\n *\n * @param form - VGS Collect form instance\n * @param mountPoints - CSS selectors for PAN, expiry, and CVC containers\n * @param css - Optional CSS to apply to VGS Collect iframe fields\n */\nexport function createVgsCardFields(\n form: VGSCollectForm,\n mountPoints: { pan: string; exp: string; cvc: string },\n css?: Record<string, string>,\n onFocusChangeCallbacks?: Partial<Record<string, (isFocused: boolean) => void>>,\n placeholders?: Partial<Record<string, string>>,\n) {\n // Read container padding so the VGS input content matches the merchant's\n // visual intent. The iframe uses absolute positioning (inset: 0) to fill\n // the full container, so the input needs its own padding for alignment.\n const sampleContainer = document.querySelector(mountPoints.pan) as HTMLElement | null;\n const containerPadding = sampleContainer ? getComputedStyle(sampleContainer).padding : undefined;\n\n const baseCss = css ?? {\n \"font-size\": \"1rem\",\n color: \"#18181b\",\n \"font-family\": \"ui-sans-serif, system-ui, sans-serif\",\n };\n\n const fieldCss = {\n ...baseCss,\n height: \"100%\",\n \"box-sizing\": \"border-box\",\n ...(containerPadding && containerPadding !== \"0px\" ? { padding: containerPadding } : {}),\n };\n\n const panField = form.cardNumberField(mountPoints.pan, {\n placeholder: placeholders?.card_pan ?? \"Card number\",\n validations: [\"required\", \"validCardNumber\"],\n css: fieldCss,\n });\n\n const expField = form.field(mountPoints.exp, {\n type: \"card-expiration-date\",\n name: \"exp-date\",\n placeholder: placeholders?.card_exp ?? \"MM / YY\",\n yearLength: 2,\n serializers: [{ name: \"separate\", options: { monthName: \"month\", yearName: \"year\" } }],\n validations: [\"required\", \"validCardExpirationDate\"],\n css: fieldCss,\n });\n\n const cvcField = form.cardCVCField(mountPoints.cvc, {\n placeholder: placeholders?.card_cvc ?? \"123\",\n validations: [\"required\", \"validCardSecurityCode\"],\n css: fieldCss,\n });\n\n // VGS Collect doesn't set width/height on its iframes, so they may not\n // fill the merchant's container. Force them to stretch like direct-mode iframes.\n // Iframes may be inserted asynchronously, so use MutationObserver as a fallback.\n for (const selector of [mountPoints.pan, mountPoints.exp, mountPoints.cvc]) {\n const container = document.querySelector(selector);\n if (!container) continue;\n\n const styleIframe = (iframe: HTMLIFrameElement) => {\n // Use absolute positioning so the iframe covers the full container\n // including any padding the merchant's CSS applies.\n const containerEl = container as HTMLElement;\n if (getComputedStyle(containerEl).position === \"static\") {\n containerEl.style.position = \"relative\";\n }\n iframe.style.position = \"absolute\";\n iframe.style.inset = \"0\";\n iframe.style.width = \"100%\";\n iframe.style.height = \"100%\";\n iframe.style.border = \"none\";\n };\n\n const existing = container.querySelector(\"iframe\") as HTMLIFrameElement | null;\n if (existing) {\n styleIframe(existing);\n } else {\n const observer = new MutationObserver((_, obs) => {\n const iframe = container.querySelector(\"iframe\") as HTMLIFrameElement | null;\n if (iframe) {\n styleIframe(iframe);\n obs.disconnect();\n }\n });\n observer.observe(container, { childList: true, subtree: true });\n }\n }\n\n if (onFocusChangeCallbacks) {\n const fieldMap: [VGSCollectField, string][] = [\n [panField, \"card_pan\"],\n [expField, \"card_exp\"],\n [cvcField, \"card_cvc\"],\n ];\n for (const [field, key] of fieldMap) {\n const cb = onFocusChangeCallbacks[key];\n if (cb) {\n field.on(\"focus\", () => cb(true));\n field.on(\"blur\", () => cb(false));\n }\n }\n }\n}\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@payment-kit-js/vanilla",
|
|
3
|
-
"version": "0.5.
|
|
3
|
+
"version": "0.5.7",
|
|
4
4
|
"main": "./dist/index.mjs",
|
|
5
5
|
"types": "./dist/index.d.mts",
|
|
6
6
|
"module": "./dist/index.mjs",
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"tsdown": "^0.15.10",
|
|
49
49
|
"typescript": "^5.9.3"
|
|
50
50
|
},
|
|
51
|
-
"stableVersion": "0.5.
|
|
51
|
+
"stableVersion": "0.5.7"
|
|
52
52
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"vgs-collect-loader-CKN0_QV6.mjs","names":["loadPromise: Promise<void> | null","fieldMap: [VGSCollectField, string][]"],"sources":["../src/payment-methods/vgs-collect-loader.ts"],"sourcesContent":["const VGS_COLLECT_CDN = \"https://js.verygoodvault.com/vgs-collect/3.2.1/vgs-collect.js\";\n\nlet loadPromise: Promise<void> | null = null;\n\n/**\n * Loads VGS Collect JS from CDN. Idempotent — subsequent calls return the same promise.\n */\nexport function loadVgsCollectScript(): Promise<void> {\n if (loadPromise) {\n console.log(\"[PaymentKit] VGS Collect CDN load already in progress — reusing promise\");\n return loadPromise;\n }\n\n loadPromise = new Promise<void>((resolve, reject) => {\n if (typeof window !== \"undefined\" && window.VGSCollect) {\n console.log(\"[PaymentKit] VGS Collect JS already available on window\");\n resolve();\n return;\n }\n\n console.log(`[PaymentKit] Loading VGS Collect JS from CDN: ${VGS_COLLECT_CDN}`);\n const script = document.createElement(\"script\");\n script.src = VGS_COLLECT_CDN;\n script.async = true;\n script.onload = () => {\n console.log(\"[PaymentKit] VGS Collect JS loaded successfully from CDN\");\n resolve();\n };\n script.onerror = () => {\n console.error(`[PaymentKit] Failed to load VGS Collect JS from CDN: ${VGS_COLLECT_CDN}`);\n loadPromise = null;\n reject(new Error(\"Failed to load VGS Collect JS\"));\n };\n document.head.appendChild(script);\n });\n\n return loadPromise;\n}\n\n/**\n * Initializes a VGS Collect form instance.\n */\nexport function initVgsCollect(vaultId: string, environment: string): VGSCollectForm {\n if (!window.VGSCollect) {\n throw new Error(\"VGS Collect JS not loaded. Call loadVgsCollectScript() first.\");\n }\n return window.VGSCollect.create(vaultId, environment, () => {});\n}\n\n/**\n * Creates and mounts VGS Collect card fields using CMP-specific field methods.\n *\n * Uses cardNumberField(), cardExpirationDateField(), cardCVCField() which are\n * required for the CMP createCard() flow. After mounting, call form.createCard()\n * to create a card in the VGS vault, which returns aliases for PAN and CVC.\n *\n * @param form - VGS Collect form instance\n * @param mountPoints - CSS selectors for PAN, expiry, and CVC containers\n * @param css - Optional CSS to apply to VGS Collect iframe fields\n */\nexport function createVgsCardFields(\n form: VGSCollectForm,\n mountPoints: { pan: string; exp: string; cvc: string },\n css?: Record<string, string>,\n onFocusChangeCallbacks?: Partial<Record<string, (isFocused: boolean) => void>>,\n placeholders?: Partial<Record<string, string>>,\n) {\n // Read container padding so the VGS input content matches the merchant's\n // visual intent. The iframe uses absolute positioning (inset: 0) to fill\n // the full container, so the input needs its own padding for alignment.\n const sampleContainer = document.querySelector(mountPoints.pan) as HTMLElement | null;\n const containerPadding = sampleContainer ? getComputedStyle(sampleContainer).padding : undefined;\n\n const baseCss = css ?? {\n \"font-size\": \"1rem\",\n color: \"#18181b\",\n \"font-family\": \"ui-sans-serif, system-ui, sans-serif\",\n };\n\n const fieldCss = {\n ...baseCss,\n height: \"100%\",\n \"box-sizing\": \"border-box\",\n ...(containerPadding && containerPadding !== \"0px\" ? { padding: containerPadding } : {}),\n };\n\n const panField = form.cardNumberField(mountPoints.pan, {\n placeholder: placeholders?.card_pan ?? \"Card number\",\n validations: [\"required\", \"validCardNumber\"],\n css: fieldCss,\n });\n\n const expField = form.cardExpirationDateField(mountPoints.exp, {\n placeholder: placeholders?.card_exp ?? \"MM / YY\",\n validations: [\"required\", \"validCardExpirationDate\"],\n css: fieldCss,\n });\n\n const cvcField = form.cardCVCField(mountPoints.cvc, {\n placeholder: placeholders?.card_cvc ?? \"123\",\n validations: [\"required\", \"validCardSecurityCode\"],\n css: fieldCss,\n });\n\n // VGS Collect doesn't set width/height on its iframes, so they may not\n // fill the merchant's container. Force them to stretch like direct-mode iframes.\n // Iframes may be inserted asynchronously, so use MutationObserver as a fallback.\n for (const selector of [mountPoints.pan, mountPoints.exp, mountPoints.cvc]) {\n const container = document.querySelector(selector);\n if (!container) continue;\n\n const styleIframe = (iframe: HTMLIFrameElement) => {\n // Use absolute positioning so the iframe covers the full container\n // including any padding the merchant's CSS applies.\n const containerEl = container as HTMLElement;\n if (getComputedStyle(containerEl).position === \"static\") {\n containerEl.style.position = \"relative\";\n }\n iframe.style.position = \"absolute\";\n iframe.style.inset = \"0\";\n iframe.style.width = \"100%\";\n iframe.style.height = \"100%\";\n iframe.style.border = \"none\";\n };\n\n const existing = container.querySelector(\"iframe\") as HTMLIFrameElement | null;\n if (existing) {\n styleIframe(existing);\n } else {\n const observer = new MutationObserver((_, obs) => {\n const iframe = container.querySelector(\"iframe\") as HTMLIFrameElement | null;\n if (iframe) {\n styleIframe(iframe);\n obs.disconnect();\n }\n });\n observer.observe(container, { childList: true, subtree: true });\n }\n }\n\n if (onFocusChangeCallbacks) {\n const fieldMap: [VGSCollectField, string][] = [\n [panField, \"card_pan\"],\n [expField, \"card_exp\"],\n [cvcField, \"card_cvc\"],\n ];\n for (const [field, key] of fieldMap) {\n const cb = onFocusChangeCallbacks[key];\n if (cb) {\n field.on(\"focus\", () => cb(true));\n field.on(\"blur\", () => cb(false));\n }\n }\n }\n}\n"],"mappings":";AAAA,MAAM,kBAAkB;AAExB,IAAIA,cAAoC;;;;AAKxC,SAAgB,uBAAsC;AACpD,KAAI,aAAa;AACf,UAAQ,IAAI,0EAA0E;AACtF,SAAO;;AAGT,eAAc,IAAI,SAAe,SAAS,WAAW;AACnD,MAAI,OAAO,WAAW,eAAe,OAAO,YAAY;AACtD,WAAQ,IAAI,0DAA0D;AACtE,YAAS;AACT;;AAGF,UAAQ,IAAI,iDAAiD,kBAAkB;EAC/E,MAAM,SAAS,SAAS,cAAc,SAAS;AAC/C,SAAO,MAAM;AACb,SAAO,QAAQ;AACf,SAAO,eAAe;AACpB,WAAQ,IAAI,2DAA2D;AACvE,YAAS;;AAEX,SAAO,gBAAgB;AACrB,WAAQ,MAAM,wDAAwD,kBAAkB;AACxF,iBAAc;AACd,0BAAO,IAAI,MAAM,gCAAgC,CAAC;;AAEpD,WAAS,KAAK,YAAY,OAAO;GACjC;AAEF,QAAO;;;;;AAMT,SAAgB,eAAe,SAAiB,aAAqC;AACnF,KAAI,CAAC,OAAO,WACV,OAAM,IAAI,MAAM,gEAAgE;AAElF,QAAO,OAAO,WAAW,OAAO,SAAS,mBAAmB,GAAG;;;;;;;;;;;;;AAcjE,SAAgB,oBACd,MACA,aACA,KACA,wBACA,cACA;CAIA,MAAM,kBAAkB,SAAS,cAAc,YAAY,IAAI;CAC/D,MAAM,mBAAmB,kBAAkB,iBAAiB,gBAAgB,CAAC,UAAU;CAQvF,MAAM,WAAW;EACf,GAPc,OAAO;GACrB,aAAa;GACb,OAAO;GACP,eAAe;GAChB;EAIC,QAAQ;EACR,cAAc;EACd,GAAI,oBAAoB,qBAAqB,QAAQ,EAAE,SAAS,kBAAkB,GAAG,EAAE;EACxF;CAED,MAAM,WAAW,KAAK,gBAAgB,YAAY,KAAK;EACrD,aAAa,cAAc,YAAY;EACvC,aAAa,CAAC,YAAY,kBAAkB;EAC5C,KAAK;EACN,CAAC;CAEF,MAAM,WAAW,KAAK,wBAAwB,YAAY,KAAK;EAC7D,aAAa,cAAc,YAAY;EACvC,aAAa,CAAC,YAAY,0BAA0B;EACpD,KAAK;EACN,CAAC;CAEF,MAAM,WAAW,KAAK,aAAa,YAAY,KAAK;EAClD,aAAa,cAAc,YAAY;EACvC,aAAa,CAAC,YAAY,wBAAwB;EAClD,KAAK;EACN,CAAC;AAKF,MAAK,MAAM,YAAY;EAAC,YAAY;EAAK,YAAY;EAAK,YAAY;EAAI,EAAE;EAC1E,MAAM,YAAY,SAAS,cAAc,SAAS;AAClD,MAAI,CAAC,UAAW;EAEhB,MAAM,eAAe,WAA8B;GAGjD,MAAM,cAAc;AACpB,OAAI,iBAAiB,YAAY,CAAC,aAAa,SAC7C,aAAY,MAAM,WAAW;AAE/B,UAAO,MAAM,WAAW;AACxB,UAAO,MAAM,QAAQ;AACrB,UAAO,MAAM,QAAQ;AACrB,UAAO,MAAM,SAAS;AACtB,UAAO,MAAM,SAAS;;EAGxB,MAAM,WAAW,UAAU,cAAc,SAAS;AAClD,MAAI,SACF,aAAY,SAAS;MASrB,CAPiB,IAAI,kBAAkB,GAAG,QAAQ;GAChD,MAAM,SAAS,UAAU,cAAc,SAAS;AAChD,OAAI,QAAQ;AACV,gBAAY,OAAO;AACnB,QAAI,YAAY;;IAElB,CACO,QAAQ,WAAW;GAAE,WAAW;GAAM,SAAS;GAAM,CAAC;;AAInE,KAAI,wBAAwB;EAC1B,MAAMC,WAAwC;GAC5C,CAAC,UAAU,WAAW;GACtB,CAAC,UAAU,WAAW;GACtB,CAAC,UAAU,WAAW;GACvB;AACD,OAAK,MAAM,CAAC,OAAO,QAAQ,UAAU;GACnC,MAAM,KAAK,uBAAuB;AAClC,OAAI,IAAI;AACN,UAAM,GAAG,eAAe,GAAG,KAAK,CAAC;AACjC,UAAM,GAAG,cAAc,GAAG,MAAM,CAAC"}
|