@moneybar.online/moneybar 3.3.0 → 3.4.0

package/moneybar-config-template.js

@@ -54,10 +54,11 @@ const VALUE_FIRST_CONFIG = {
     url: 'your-supabase-url',
     anonKey: 'your-anon-key'
   },
-  payment: {
+  payment: [{
+    provider: 'dodo',
     productId: 'your-product-id',
     mode: 'test'
-  },
+  }],
   theme: {
     name: 'emerald', // Trustworthy, fresh
     primaryColor: '#059669'
@@ -86,10 +87,11 @@ const FEEDBACK_INTELLIGENCE_CONFIG = {
     url: 'your-supabase-url',
     anonKey: 'your-anon-key'
   },
-  payment: {
+  payment: [{
+    provider: 'dodo',
     productId: 'your-product-id',
     mode: 'test'
-  },
+  }],
   // KEY FEATURE: Feedback collection on cancel/exit
   feedback: {
     form: {
@@ -136,10 +138,11 @@ const INSTANT_PAYMENT_CONFIG = {
     url: 'your-supabase-url',
     anonKey: 'your-anon-key'
   },
-  payment: {
+  payment: [{
+    provider: 'dodo',
     productId: 'your-product-id',
     mode: 'test'
-  },
+  }],
   theme: {
     name: 'dark', // Modern, premium feel
     primaryColor: '#7c3aed'
@@ -184,10 +187,11 @@ window.APP_CONFIG = {
   },
 
   // REQUIRED: Payment configuration
-  payment: {
+  payment: [{
+    provider: 'dodo',
     productId: 'your-dodo-payments-product-id',
     mode: 'test' // Change to 'live' for production
-  },
+  }],
 
   // OPTIONAL: UI Theme (29 themes available)
   theme: {

package/package.json

@@ -1,17 +1,16 @@
 {
   "name": "@moneybar.online/moneybar",
-  "version": "3.3.0",
+  "version": "3.4.0",
   "description": "The navbar of monetization. Fix the 3 money-blocking stages: forced sign-ins, silent drop-offs, and broken payment flows. Turn browsers into buyers.",
-  "main": "dist/index.cjs.js",
+  "main": "dist/index.esm.js",
   "module": "dist/index.esm.js",
   "browser": "dist/index.browser.js",
-  "unpkg": "dist/index.umd.js",
+  "unpkg": "dist/index.bundle.js",
   "types": "dist/index.d.ts",
   "type": "module",
   "exports": {
     ".": {
       "import": "./dist/index.esm.js",
-      "require": "./dist/index.cjs.js",
       "browser": "./dist/index.browser.js",
       "types": "./dist/index.d.ts"
     }

package/src/index.ts

@@ -333,26 +333,37 @@ export class MoneyBar {
       throw new Error('Payment configuration not provided');
     }
 
+    const payment = this.config.payment?.find(p => p.provider === 'dodo');
+    if (!payment) {
+      throw new Error('No dodo payment provider configured');
+    }
+
     const requestBody = {
       email: this.currentUser.email,
-      product_id: this.config.payment.productId,
-      mode: this.config.payment.mode || 'test',
+      product_id: payment.productId,
+      mode: payment.mode || 'test',
       app_id: this.config.appId,
       return_url: `${window.location.origin}${window.location.pathname}?payment=success`
     };
 
-    console.log(`🔥 [SUPABASE API] createPayment called for email: ${this.currentUser.email} | Time: ${new Date().toISOString()}`);
+    console.log(`🔥 [PAYMENT API] createPayment called for provider: ${payment.provider}, email: ${this.currentUser.email} | Time: ${new Date().toISOString()}`);
 
     try {
-      const response = await fetch(`${this.config.supabase.url}/functions/v1/create-payment`, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-          'Authorization': `Bearer ${this.config.supabase.anonKey}`
-        },
-        body: JSON.stringify(requestBody)
-      });
-      console.log(`🔥 [SUPABASE API] createPayment response: ${response.status}`);
+      // Route to appropriate payment API based on provider
+      let response;
+      if (payment.provider === 'dodo') {
+        response = await fetch(`${this.config.supabase.url}/functions/v1/create-payment`, {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            'Authorization': `Bearer ${this.config.supabase.anonKey}`
+          },
+          body: JSON.stringify(requestBody)
+        });
+      } else {
+        throw new Error(`Payment provider '${payment.provider}' is not yet supported`);
+      }
+      console.log(`🔥 [PAYMENT API] createPayment response for ${payment.provider}: ${response.status}`);
 
       if (this.config.options?.debug) {
         //console.log('🔍 DEBUG: createPayment response status:', response.status);
@@ -3010,7 +3021,15 @@ User Agent: ${feedbackData.userAgent}
     }
 
     // Validate product ID format
-    const productId = this.config.payment.productId;
+    const payment = this.config.payment?.find(p => p.provider === 'dodo');
+    if (!payment) {
+      this.paymentConnectionFailed = true;
+      if (this.config.options?.debug) {
+        console.warn('No dodo payment provider configured');
+      }
+      return;
+    }
+    const productId = payment.productId;
     if (!productId || !productId.startsWith('pdt_') || productId.length < 10) {
       this.paymentConnectionFailed = true;
       if (this.config.options?.debug) {

package/src/types.ts

@@ -11,11 +11,14 @@ export interface MoneyBarConfig {
     anonKey: string;
   };
 
-  /** DodoPayments product configuration */
-  payment?: {
+  /** Payment configuration - extensible for multiple providers */
+  payment?: Array<{
+    provider: 'dodo' | 'stripe' | 'paypal' | 'square' | 'paddle'; // Extensible for future providers
     productId: string;
     mode?: 'test' | 'live';
-  };
+    apiKey?: string; // For providers that need API keys
+    publishableKey?: string; // For client-side keys (Stripe, etc.)
+  }>;
 
   /** Optional: Feedback form configuration */
   feedback?: {