@funnelfox/billing 0.9.0 → 0.9.1

package/dist/chunk-stripe-card-form.cjs.js

@@ -8,70 +8,9 @@
 'use strict';
 
 var stripeLoader = require('./chunk-stripe-loader.cjs.js');
-var index = require('./chunk-index.cjs.js');
+require('./chunk-index.cjs.js');
 
-const TAX_STYLE_ID = 'ff-stripe-tax-styles';
 const TAX_RECALC_DEBOUNCE_MS = 600;
-// The Stripe card form renders Stripe Elements (not the card skin), so it owns its own subtotal/tax/
-// total summary here — mirroring the hosted card skin so every integration shows tax consistently
-// without the host page reimplementing it.
-function injectTaxStyles() {
-    if (typeof document === 'undefined')
-        return;
-    if (document.getElementById(TAX_STYLE_ID))
-        return;
-    const style = document.createElement('style');
-    style.id = TAX_STYLE_ID;
-    style.textContent = [
-        '.ff-tax-summary{margin-top:12px;padding-top:12px;border-top:1px solid rgb(0 0 0 / 10%);font-size:16px;transition:opacity .2s ease}',
-        '.ff-tax-summary[hidden]{display:none}',
-        '.ff-tax-summary--updating{opacity:.55}',
-        '.ff-tax-row{display:flex;justify-content:space-between;gap:10px;margin-bottom:6px}',
-        '.ff-tax-row.ff-tax-total{margin-top:8px;margin-bottom:0;font-weight:600}',
-    ].join('\n');
-    document.head.appendChild(style);
-}
-function createTaxSummary() {
-    const root = document.createElement('div');
-    root.className = 'ff-tax-summary';
-    root.hidden = true;
-    const makeRow = (label, isTotal = false) => {
-        const rowEl = document.createElement('div');
-        rowEl.className = isTotal ? 'ff-tax-row ff-tax-total' : 'ff-tax-row';
-        const labelEl = document.createElement('span');
-        labelEl.textContent = label;
-        const valueEl = document.createElement('span');
-        rowEl.append(labelEl, valueEl);
-        root.appendChild(rowEl);
-        return valueEl;
-    };
-    const subtotalEl = makeRow('Subtotal');
-    const taxEl = makeRow('Tax');
-    const totalEl = makeRow('Total', true);
-    return {
-        root,
-        // taxAmount is the tax added on top of the price; it is 0 for tax-inclusive pricing and for
-        // non-taxed locations — in both cases there is nothing to itemise, so the summary stays hidden.
-        render(info) {
-            root.classList.remove('ff-tax-summary--updating');
-            if (!info || !(info.taxAmount > 0)) {
-                root.hidden = true;
-                return;
-            }
-            subtotalEl.textContent = index.formatCurrencyAmount(info.amountTotal - info.taxAmount, info.currency);
-            taxEl.textContent = index.formatCurrencyAmount(info.taxAmount, info.currency);
-            totalEl.textContent = index.formatCurrencyAmount(info.amountTotal, info.currency);
-            root.hidden = false;
-        },
-        setPending() {
-            if (!root.hidden)
-                root.classList.add('ff-tax-summary--updating');
-        },
-        setIdle() {
-            root.classList.remove('ff-tax-summary--updating');
-        },
-    };
-}
 async function mountStripeCardForm(element, session, params) {
     const { stripe_public_key, amount, currency, order_id, is_link_enabled, tax_amount, amount_total, } = session.data;
     // Tax flow is driven by the tenant setting (session.tax_enabled); enableTax is a legacy override.
@@ -81,8 +20,6 @@ async function mountStripeCardForm(element, session, params) {
         throw new Error('Failed to load Stripe');
     // Remounting (e.g. picking another price) must replace the form, not stack a second one.
     element.replaceChildren();
-    injectTaxStyles();
-    const taxSummary = createTaxSummary();
     const stripeElements = stripe.elements({
         mode: 'subscription',
         amount,
@@ -105,21 +42,22 @@ async function mountStripeCardForm(element, session, params) {
         terms: { card: 'never' },
         fields: {
             billingDetails: {
-                // In tax mode collect only what the org configured (country and/or postal) and hide the rest
-                // of the address; otherwise use Stripe's default card billing (country + postal).
-                address: taxEnabled
-                    ? {
-                        line1: 'never',
-                        line2: 'never',
-                        city: 'never',
-                        state: 'never',
-                        country: showCountry ? 'auto' : 'never',
-                        postalCode: collectLocation ? 'auto' : 'never',
-                    }
-                    : 'auto',
+                // Field visibility is owned by the org settings (Taxes → Settings) and is independent of
+                // whether tax is enabled: show the country selector and/or postal code only when configured,
+                // and always hide the rest of the address (supplied to createPaymentMethod below). Previously
+                // the untaxed path fell back to Stripe's default billing (country + postal), showing those
+                // fields even when the org had turned them off.
+                address: {
+                    line1: 'never',
+                    line2: 'never',
+                    city: 'never',
+                    state: 'never',
+                    country: showCountry ? 'auto' : 'never',
+                    postalCode: showPostal ? 'auto' : 'never',
+                },
             },
         },
-        ...(session.data.detected_country_code && (!taxEnabled || showCountry)
+        ...(session.data.detected_country_code && showCountry
             ? {
                 defaultValues: {
                     billingDetails: {
@@ -130,16 +68,16 @@ async function mountStripeCardForm(element, session, params) {
             : {}),
     });
     // Address fields we hid (fields=never) must still be supplied to createPaymentMethod. Only country +
-    // postal matter for tax; country is hidden only when the selector is off, postal only when we collect
-    // no location at all.
+    // postal matter for tax; country is supplied when its selector is off, postal when its field is off.
     const hiddenBillingAddress = { line1: '', line2: '', city: '', state: '' };
     if (!showCountry)
         hiddenBillingAddress.country = session.data.detected_country_code ?? '';
-    if (!collectLocation)
+    if (!showPostal)
         hiddenBillingAddress.postal_code = '';
-    // Tax needs only the country + postal code. When the org collects location on the form we read it from
-    // the Payment Element's change events as the buyer types and recalculate tax live, then attach the
-    // calculation id to the charge. When it does not, tax follows the IP-derived session estimate.
+    // Tax needs only the country + postal code. When the org collects location on the form we read it
+    // from the Payment Element's change events as the buyer types, recalculate tax live (reported via
+    // onTaxChange), and attach the calculation id to the charge. When it does not, tax follows the
+    // IP-derived session estimate.
     let taxCalc;
     let recalcSeq = 0;
     if (taxEnabled && session.data.tax_calculation_id) {
@@ -155,7 +93,6 @@ async function mountStripeCardForm(element, session, params) {
         const country = taxAddress.country;
         const postal = taxAddress.postalCode;
         if (!country) {
-            taxSummary.setIdle();
             return;
         }
         const seq = ++recalcSeq;
@@ -169,13 +106,11 @@ async function mountStripeCardForm(element, session, params) {
             if (seq !== recalcSeq)
                 return; // a newer recalc superseded this one
             taxCalc = { id: tax.tax_calculation_id, country, postal };
-            const info = {
+            params.onTaxChange?.({
                 amountTotal: tax.amount_total,
                 taxAmount: tax.tax_amount,
                 currency: tax.currency,
-            };
-            taxSummary.render(info);
-            params.onTaxChange?.(info);
+            });
         }
         catch (err) {
             if (seq !== recalcSeq)
@@ -184,7 +119,6 @@ async function mountStripeCardForm(element, session, params) {
                 taxCalc = undefined;
                 params.onTaxError?.(err);
             }
-            taxSummary.setIdle();
         }
     };
     paymentElement.mount(element);
@@ -209,19 +143,21 @@ async function mountStripeCardForm(element, session, params) {
             };
             if (!taxAddress.country)
                 return;
-            taxSummary.setPending();
             if (debounce)
                 clearTimeout(debounce);
             debounce = setTimeout(runRecalc, TAX_RECALC_DEBOUNCE_MS);
         });
     }
-    // SDK-owned summary lives below the form and reflects the session's tax estimate immediately; when the
-    // org collects location, the Payment Element's fields then keep it in sync as the buyer edits them.
-    element.appendChild(taxSummary.root);
-    taxSummary.render(amount_total != null
-        ? { amountTotal: amount_total, taxAmount: tax_amount ?? 0, currency }
-        : null);
-    // Refine the initial estimate against the pre-filled country right away.
+    // The form renders no tax lines; the host re-renders its own prices off onTaxChange. Report the
+    // session estimate as the first calculation, then (when the org collects location) refine it
+    // against the pre-filled country right away — later address edits keep firing it via the recalc.
+    if (taxEnabled && amount_total != null) {
+        params.onTaxChange?.({
+            amountTotal: amount_total,
+            taxAmount: tax_amount ?? 0,
+            currency,
+        });
+    }
     if (taxEnabled && collectLocation)
         void runRecalc();
     await new Promise((resolve, reject) => {
@@ -243,10 +179,10 @@ async function mountStripeCardForm(element, session, params) {
                 const { error, paymentMethod } = await stripe.createPaymentMethod({
                     elements: stripeElements,
                     // Supply the address fields we hid on the Payment Element (fields=never); Stripe requires
-                    // them here. Country/postal collected by the element are filled by Stripe automatically.
-                    ...(taxEnabled
-                        ? { params: { billing_details: { address: hiddenBillingAddress } } }
-                        : {}),
+                    // them here. We always hide line1/line2/city/state (and country/postal per the org
+                    // settings), so these must be supplied regardless of tax mode. Country/postal shown on the
+                    // element are filled by Stripe automatically.
+                    params: { billing_details: { address: hiddenBillingAddress } },
                 });
                 if (error)
                     throw error;

package/dist/chunk-stripe-card-form.es.js

@@ -6,70 +6,9 @@
  * @license MIT
  */
 import { g as getStripe } from './chunk-stripe-loader.es.js';
-import { f as formatCurrencyAmount } from './chunk-index.es.js';
+import './chunk-index.es.js';
 
-const TAX_STYLE_ID = 'ff-stripe-tax-styles';
 const TAX_RECALC_DEBOUNCE_MS = 600;
-// The Stripe card form renders Stripe Elements (not the card skin), so it owns its own subtotal/tax/
-// total summary here — mirroring the hosted card skin so every integration shows tax consistently
-// without the host page reimplementing it.
-function injectTaxStyles() {
-    if (typeof document === 'undefined')
-        return;
-    if (document.getElementById(TAX_STYLE_ID))
-        return;
-    const style = document.createElement('style');
-    style.id = TAX_STYLE_ID;
-    style.textContent = [
-        '.ff-tax-summary{margin-top:12px;padding-top:12px;border-top:1px solid rgb(0 0 0 / 10%);font-size:16px;transition:opacity .2s ease}',
-        '.ff-tax-summary[hidden]{display:none}',
-        '.ff-tax-summary--updating{opacity:.55}',
-        '.ff-tax-row{display:flex;justify-content:space-between;gap:10px;margin-bottom:6px}',
-        '.ff-tax-row.ff-tax-total{margin-top:8px;margin-bottom:0;font-weight:600}',
-    ].join('\n');
-    document.head.appendChild(style);
-}
-function createTaxSummary() {
-    const root = document.createElement('div');
-    root.className = 'ff-tax-summary';
-    root.hidden = true;
-    const makeRow = (label, isTotal = false) => {
-        const rowEl = document.createElement('div');
-        rowEl.className = isTotal ? 'ff-tax-row ff-tax-total' : 'ff-tax-row';
-        const labelEl = document.createElement('span');
-        labelEl.textContent = label;
-        const valueEl = document.createElement('span');
-        rowEl.append(labelEl, valueEl);
-        root.appendChild(rowEl);
-        return valueEl;
-    };
-    const subtotalEl = makeRow('Subtotal');
-    const taxEl = makeRow('Tax');
-    const totalEl = makeRow('Total', true);
-    return {
-        root,
-        // taxAmount is the tax added on top of the price; it is 0 for tax-inclusive pricing and for
-        // non-taxed locations — in both cases there is nothing to itemise, so the summary stays hidden.
-        render(info) {
-            root.classList.remove('ff-tax-summary--updating');
-            if (!info || !(info.taxAmount > 0)) {
-                root.hidden = true;
-                return;
-            }
-            subtotalEl.textContent = formatCurrencyAmount(info.amountTotal - info.taxAmount, info.currency);
-            taxEl.textContent = formatCurrencyAmount(info.taxAmount, info.currency);
-            totalEl.textContent = formatCurrencyAmount(info.amountTotal, info.currency);
-            root.hidden = false;
-        },
-        setPending() {
-            if (!root.hidden)
-                root.classList.add('ff-tax-summary--updating');
-        },
-        setIdle() {
-            root.classList.remove('ff-tax-summary--updating');
-        },
-    };
-}
 async function mountStripeCardForm(element, session, params) {
     const { stripe_public_key, amount, currency, order_id, is_link_enabled, tax_amount, amount_total, } = session.data;
     // Tax flow is driven by the tenant setting (session.tax_enabled); enableTax is a legacy override.
@@ -79,8 +18,6 @@ async function mountStripeCardForm(element, session, params) {
         throw new Error('Failed to load Stripe');
     // Remounting (e.g. picking another price) must replace the form, not stack a second one.
     element.replaceChildren();
-    injectTaxStyles();
-    const taxSummary = createTaxSummary();
     const stripeElements = stripe.elements({
         mode: 'subscription',
         amount,
@@ -103,21 +40,22 @@ async function mountStripeCardForm(element, session, params) {
         terms: { card: 'never' },
         fields: {
             billingDetails: {
-                // In tax mode collect only what the org configured (country and/or postal) and hide the rest
-                // of the address; otherwise use Stripe's default card billing (country + postal).
-                address: taxEnabled
-                    ? {
-                        line1: 'never',
-                        line2: 'never',
-                        city: 'never',
-                        state: 'never',
-                        country: showCountry ? 'auto' : 'never',
-                        postalCode: collectLocation ? 'auto' : 'never',
-                    }
-                    : 'auto',
+                // Field visibility is owned by the org settings (Taxes → Settings) and is independent of
+                // whether tax is enabled: show the country selector and/or postal code only when configured,
+                // and always hide the rest of the address (supplied to createPaymentMethod below). Previously
+                // the untaxed path fell back to Stripe's default billing (country + postal), showing those
+                // fields even when the org had turned them off.
+                address: {
+                    line1: 'never',
+                    line2: 'never',
+                    city: 'never',
+                    state: 'never',
+                    country: showCountry ? 'auto' : 'never',
+                    postalCode: showPostal ? 'auto' : 'never',
+                },
             },
         },
-        ...(session.data.detected_country_code && (!taxEnabled || showCountry)
+        ...(session.data.detected_country_code && showCountry
             ? {
                 defaultValues: {
                     billingDetails: {
@@ -128,16 +66,16 @@ async function mountStripeCardForm(element, session, params) {
             : {}),
     });
     // Address fields we hid (fields=never) must still be supplied to createPaymentMethod. Only country +
-    // postal matter for tax; country is hidden only when the selector is off, postal only when we collect
-    // no location at all.
+    // postal matter for tax; country is supplied when its selector is off, postal when its field is off.
     const hiddenBillingAddress = { line1: '', line2: '', city: '', state: '' };
     if (!showCountry)
         hiddenBillingAddress.country = session.data.detected_country_code ?? '';
-    if (!collectLocation)
+    if (!showPostal)
         hiddenBillingAddress.postal_code = '';
-    // Tax needs only the country + postal code. When the org collects location on the form we read it from
-    // the Payment Element's change events as the buyer types and recalculate tax live, then attach the
-    // calculation id to the charge. When it does not, tax follows the IP-derived session estimate.
+    // Tax needs only the country + postal code. When the org collects location on the form we read it
+    // from the Payment Element's change events as the buyer types, recalculate tax live (reported via
+    // onTaxChange), and attach the calculation id to the charge. When it does not, tax follows the
+    // IP-derived session estimate.
     let taxCalc;
     let recalcSeq = 0;
     if (taxEnabled && session.data.tax_calculation_id) {
@@ -153,7 +91,6 @@ async function mountStripeCardForm(element, session, params) {
         const country = taxAddress.country;
         const postal = taxAddress.postalCode;
         if (!country) {
-            taxSummary.setIdle();
             return;
         }
         const seq = ++recalcSeq;
@@ -167,13 +104,11 @@ async function mountStripeCardForm(element, session, params) {
             if (seq !== recalcSeq)
                 return; // a newer recalc superseded this one
             taxCalc = { id: tax.tax_calculation_id, country, postal };
-            const info = {
+            params.onTaxChange?.({
                 amountTotal: tax.amount_total,
                 taxAmount: tax.tax_amount,
                 currency: tax.currency,
-            };
-            taxSummary.render(info);
-            params.onTaxChange?.(info);
+            });
         }
         catch (err) {
             if (seq !== recalcSeq)
@@ -182,7 +117,6 @@ async function mountStripeCardForm(element, session, params) {
                 taxCalc = undefined;
                 params.onTaxError?.(err);
             }
-            taxSummary.setIdle();
         }
     };
     paymentElement.mount(element);
@@ -207,19 +141,21 @@ async function mountStripeCardForm(element, session, params) {
             };
             if (!taxAddress.country)
                 return;
-            taxSummary.setPending();
             if (debounce)
                 clearTimeout(debounce);
             debounce = setTimeout(runRecalc, TAX_RECALC_DEBOUNCE_MS);
         });
     }
-    // SDK-owned summary lives below the form and reflects the session's tax estimate immediately; when the
-    // org collects location, the Payment Element's fields then keep it in sync as the buyer edits them.
-    element.appendChild(taxSummary.root);
-    taxSummary.render(amount_total != null
-        ? { amountTotal: amount_total, taxAmount: tax_amount ?? 0, currency }
-        : null);
-    // Refine the initial estimate against the pre-filled country right away.
+    // The form renders no tax lines; the host re-renders its own prices off onTaxChange. Report the
+    // session estimate as the first calculation, then (when the org collects location) refine it
+    // against the pre-filled country right away — later address edits keep firing it via the recalc.
+    if (taxEnabled && amount_total != null) {
+        params.onTaxChange?.({
+            amountTotal: amount_total,
+            taxAmount: tax_amount ?? 0,
+            currency,
+        });
+    }
     if (taxEnabled && collectLocation)
         void runRecalc();
     await new Promise((resolve, reject) => {
@@ -241,10 +177,10 @@ async function mountStripeCardForm(element, session, params) {
                 const { error, paymentMethod } = await stripe.createPaymentMethod({
                     elements: stripeElements,
                     // Supply the address fields we hid on the Payment Element (fields=never); Stripe requires
-                    // them here. Country/postal collected by the element are filled by Stripe automatically.
-                    ...(taxEnabled
-                        ? { params: { billing_details: { address: hiddenBillingAddress } } }
-                        : {}),
+                    // them here. We always hide line1/line2/city/state (and country/postal per the org
+                    // settings), so these must be supplied regardless of tax mode. Country/postal shown on the
+                    // element are filled by Stripe automatically.
+                    params: { billing_details: { address: hiddenBillingAddress } },
                 });
                 if (error)
                     throw error;

package/dist/funnelfox-billing.esm.js

@@ -5,4 +5,4 @@
  * @author Funnelfox
  * @license MIT
  */
-export { A as APIError, B as Billing, d as CHECKOUT_STATES, C as CheckoutError, b as ConfigurationError, c as DEFAULTS, e as ERROR_CODES, E as EVENTS, F as FunnefoxSDKError, N as NetworkError, P as PaymentMethod, a as PrimerError, S as SDK_VERSION, V as ValidationError, g as configure, h as createCheckout, i as createClientSession, B as default, j as getAvailablePaymentMethods } from './chunk-index.es.js';
+export { A as APIError, B as Billing, d as CHECKOUT_STATES, C as CheckoutError, b as ConfigurationError, c as DEFAULTS, e as ERROR_CODES, E as EVENTS, F as FunnefoxSDKError, N as NetworkError, P as PaymentMethod, a as PrimerError, S as SDK_VERSION, V as ValidationError, f as configure, g as createCheckout, h as createClientSession, B as default, i as getAvailablePaymentMethods } from './chunk-index.es.js';