web-manager 4.1.38 → 4.1.40

package/CHANGELOG.md

@@ -14,6 +14,16 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 - `Fixed` for any bug fixes.
 - `Security` in case of vulnerabilities.
 
+---
+## [4.1.40] - 2026-05-10
+### Changed
+- **BREAKING (internal)**: `_resolveUsage()` now reads `config.payment.products` instead of `config.payment.plans`. Aligns with OMEGA's canonical shape (the SSOT) — same key name in BEM, UJM, EM. No backwards-compat shim; consumers must use `payment.products`. Default in `_processConfiguration()` updated from `plans: []` to `products: []`. Renamed local vars `plan`/`plans`/`planConfig` → `productId`/`products`/`product`. CLAUDE.md updated.
+
+---
+## [4.1.39] - 2026-04-10
+### Changed
+- Converted `Utilities` methods to arrow class fields so `this` is permanently bound to the instance, allowing methods to be destructured, aliased, or passed as callbacks without losing context.
+
 ---
 ## [4.1.38] - 2026-04-08
 ### Added

package/CLAUDE.md

@@ -153,7 +153,7 @@ document.body.addEventListener('click', (e) => {
 - **Class**: `Auth`
 - **Key Methods**: `listen(options, callback)`, `isAuthenticated()`, `getUser()`, `signInWithEmailAndPassword()`, `signOut()`, `getIdToken()`, `resolveSubscription(account?)`
 - **Bindings**: Updates `auth` and `usage` context on auth settle
-- **Usage Resolution**: `_resolveUsage(state)` merges `account.usage` (Firestore) with plan limits from `config.payment.plans` to produce the `usage` bindings key (e.g., `{ credits: { monthly: 5, limit: 100 } }`)
+- **Usage Resolution**: `_resolveUsage(state)` merges `account.usage` (Firestore) with product limits from `config.payment.products` (OMEGA-canonical shape — same key name in BEM, UJM, and EM) to produce the `usage` bindings key (e.g., `{ credits: { monthly: 5, limit: 100 } }`)
 
 #### resolveSubscription(account?)
 Derives calculated subscription fields from raw account data. Returns only fields that require derivation logic — raw data (product.id, status, trial, cancellation) lives on `account.subscription` directly.
@@ -269,13 +269,13 @@ Current test coverage is minimal - focuses on configuration and storage.
 
 ### Modifying Configuration Defaults
 1. Edit `_processConfiguration()` in `src/index.js`
-2. Add to `defaults` object (e.g., `payment: { processors: {}, plans: [] }`)
+2. Add to `defaults` object (e.g., `payment: { processors: {}, products: [] }`)
 3. Document in README.md Configuration section
 
 ### Payment Configuration
-Payment config is set in `_config.yml` under `web_manager.payment` and includes:
-- `processors`: Stripe, PayPal, etc. (publishable keys)
-- `plans`: Array of `{ id, limits: { feature: N } }` used to resolve usage limits on the frontend
+Payment config shape mirrors OMEGA (the SSOT) — same key names used in BEM, UJM, and EM:
+- `processors`: Stripe, PayPal, Chargebee, Coinbase (publishable keys / client IDs)
+- `products`: Array of `{ id, name, type, limits: { feature: N }, prices, trial, paypal, stripe, chargebee }` — used to resolve usage limits on the frontend AND drive checkout flows
 
 ### Adding a Data Binding Action
 1. Edit `_executeAction()` in `src/modules/bindings.js`

package/dist/index.js

@@ -298,7 +298,7 @@ class Manager {
       validRedirectHosts: [],
       payment: {
         processors: {},
-        plans: [],
+        products: [],
       },
 
       // Non-configurable defaults

package/dist/modules/auth.js

@@ -256,14 +256,17 @@ class Auth {
     };
   }
 
-  // Resolve usage bindings from account data + plan limits from config.
+  // Resolve usage bindings from account data + product limits from config.
   // Returns: { credits: { monthly: 5, limit: 100 }, ... }
+  //
+  // The product catalog lives at `config.payment.products` (OMEGA canonical
+  // shape — matches BEM, UJM, and EM). Each product entry has `{ id, limits: {...} }`.
   _resolveUsage(state) {
     const accountUsage = state.account?.usage || {};
-    const plan = state.resolved?.plan || 'basic';
-    const plans = this.manager.config.payment?.plans || [];
-    const planConfig = plans.find(p => p.id === plan) || {};
-    const limits = planConfig.limits || {};
+    const productId    = state.resolved?.plan || 'basic';
+    const products     = this.manager.config.payment?.products || [];
+    const product      = products.find(p => p.id === productId) || {};
+    const limits       = product.limits || {};
 
     // Merge current usage with limits for each feature
     const usage = {};

package/dist/modules/utilities.js

@@ -1,10 +1,16 @@
+// Methods are defined as arrow class fields so `this` is permanently bound to the instance.
+// This means consumers can safely alias or destructure methods without losing context:
+//   const { escapeHTML } = webManager.utilities(); // ✓ works
+//   const escape = webManager.utilities().escapeHTML; // ✓ works
+//   items.map(webManager.utilities().escapeHTML); // ✓ works
+// Safe because webManager.utilities() is a singleton — only one instance ever exists.
 class Utilities {
   constructor(manager) {
     this.manager = manager;
   }
 
   // Copy text to clipboard
-  clipboardCopy(input) {
+  clipboardCopy = (input) => {
     // Get the text from the input
     const text = input && input.nodeType
       ? input.value || input.innerText || input.innerHTML
@@ -38,7 +44,7 @@ class Utilities {
 
   // Escape HTML to prevent XSS
   // Accepts a string, object, or array — walks recursively, escaping all string values
-  escapeHTML(input) {
+  escapeHTML = (input) => {
     // Strings — escape and return
     if (typeof input === 'string') {
       this._shadowElement = this._shadowElement || document.createElement('p');
@@ -83,7 +89,7 @@ class Utilities {
 
   // Sanitize URL to prevent javascript:, data:, and other dangerous URI schemes
   // Returns the original URL if safe, or '' if rejected
-  sanitizeURL(url) {
+  sanitizeURL = (url) => {
     if (!url || typeof url !== 'string') {
       return '';
     }
@@ -102,7 +108,7 @@ class Utilities {
   }
 
   // Show notification
-  showNotification(message, options = {}) {
+  showNotification = (message, options = {}) => {
     // Handle different input types
     let text = message;
     let type = options.type || 'info';
@@ -148,7 +154,7 @@ class Utilities {
   }
 
   // Get platform (OS)
-  getPlatform() {
+  getPlatform = () => {
     const ua = navigator.userAgent.toLowerCase();
     const platform = (navigator.userAgentData?.platform || navigator.platform || '').toLowerCase();
 
@@ -178,7 +184,7 @@ class Utilities {
   }
 
   // Get browser name
-  getBrowser() {
+  getBrowser = () => {
     const ua = navigator.userAgent;
 
     // Order matters - check more specific browsers first
@@ -217,7 +223,7 @@ class Utilities {
   }
 
   // Get runtime environment
-  getRuntime() {
+  getRuntime = () => {
     // Use config runtime if provided
     if (this.manager?.config?.runtime) {
       return this.manager.config.runtime;
@@ -237,7 +243,7 @@ class Utilities {
   }
 
   // Check if mobile device
-  isMobile() {
+  isMobile = () => {
     try {
       // Try modern API first
       const m = navigator.userAgentData?.mobile;
@@ -257,7 +263,7 @@ class Utilities {
   }
 
   // Get device based on screen width
-  getDevice() {
+  getDevice = () => {
     const width = window.innerWidth;
 
     // Mobile: < 768px (Bootstrap's md breakpoint)
@@ -275,7 +281,7 @@ class Utilities {
   }
 
   // Get context information
-  getContext() {
+  getContext = () => {
     // Return context information
     return {
       client: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "web-manager",
-  "version": "4.1.38",
+  "version": "4.1.40",
   "description": "Easily access important variables such as the query string, current domain, and current page in a single object.",
   "main": "dist/index.js",
   "module": "src/index.js",