@sazito/checkout 0.1.1 → 0.2.0

package/README.md

@@ -77,6 +77,10 @@ export default function Checkout() {
 | `summaryBackground` | `--szc-summary-bg` | Summary sidebar |
 | `danger` | `--szc-danger` | Errors and destructive states |
 | `success` | `--szc-success` | Completed and success states |
+| `successForeground` | `--szc-success-foreground` | Text/icons on solid success surfaces |
+| `logoBackground` | `--szc-logo-bg` | Plate behind shipping-provider logos |
+| `shippingNeutral` | `--szc-shipping-neutral` | Neutral surface for white shipping colors |
+| `shippingNeutralForeground` | `--szc-shipping-neutral-foreground` | Foreground on the neutral shipping surface |
 
 `radius` and `fontFamily` remain available for shape and typography. Shipping-rate icon colors continue to come from the shipping API.
 

package/dist/chunks/{labels-BDeABGTD.js → labels-ByA_yGKl.js}

@@ -200,6 +200,30 @@ function createBrowserEffectExecutor(config) {
 const noopEffectExecutor = () => { };
 
 const idStr = (value) => String(value);
+function cartItemCreatedAt(item) {
+    if (!item.createdAt)
+        return null;
+    const timestamp = Date.parse(item.createdAt);
+    return Number.isFinite(timestamp) ? timestamp : null;
+}
+/** Return cart lines newest-first without mutating SDK state. */
+function sortCartItemsNewestFirst(items) {
+    return [...items].sort((a, b) => {
+        const aCreatedAt = cartItemCreatedAt(a);
+        const bCreatedAt = cartItemCreatedAt(b);
+        if (aCreatedAt != null || bCreatedAt != null) {
+            if (aCreatedAt == null)
+                return 1;
+            if (bCreatedAt == null)
+                return -1;
+            if (aCreatedAt !== bCreatedAt)
+                return bCreatedAt - aCreatedAt;
+        }
+        const aId = Number(a.id);
+        const bId = Number(b.id);
+        return Number.isFinite(aId) && Number.isFinite(bId) ? bId - aId : 0;
+    });
+}
 function emptyAddressForm() {
     return {
         firstName: '',
@@ -298,6 +322,28 @@ function uniqueRates(rates) {
     }
     return out;
 }
+function isDigitalServiceLabel(value) {
+    if (!value)
+        return false;
+    const normalized = value.trim().toLocaleLowerCase('en-US');
+    return (normalized.includes('digital') ||
+        normalized.includes('service') ||
+        normalized.includes('دیجیتال') ||
+        normalized.includes('خدمات') ||
+        normalized.includes('خدمت'));
+}
+function isDigitalServiceItem(item) {
+    return isDigitalServiceLabel(item.productType);
+}
+/** True for the API's automatic digital/service delivery group. */
+function isDigitalServiceGroup(group) {
+    if (isDigitalServiceLabel(group.key) || isDigitalServiceLabel(group.title)) {
+        return true;
+    }
+    const ratesAreDigitalService = group.rates.length > 0 &&
+        group.rates.every((rate) => isDigitalServiceLabel(rate.type) || isDigitalServiceLabel(rate.name));
+    return ratesAreDigitalService || (group.items.length > 0 && group.items.every(isDigitalServiceItem));
+}
 /**
  * Group invoice items into shippable bundles with their switchable rates and
  * the currently selected rate. Digital-only invoices yield an empty list.
@@ -317,10 +363,12 @@ function deriveShippingGroups(invoice, applicable) {
         return [];
     }
     const itemById = new Map(invoice.items.map((item) => [idStr(item.id), item]));
-    // Exclude digital items — they never go through physical shipping groups.
+    // The API's plain `digital` products never receive a shipping assignment.
+    // Other digital/service variants may arrive through an automatic fulfillment
+    // rate; retain those groups for the API assignment and hide them in the UI.
     const physicalItemsRate = (applicable.itemsShippingRate ?? []).filter((isr) => {
         const item = itemById.get(idStr(isr.invoiceItemId));
-        return !item || item.productType !== 'digital';
+        return !item || item.productType?.trim().toLocaleLowerCase('en-US') !== 'digital';
     });
     if (physicalItemsRate.length === 0)
         return [];
@@ -419,24 +467,27 @@ function deriveShippingGroups(invoice, applicable) {
         }
     ];
 }
-/** Build the API payload from the current group selections. */
+/** Build the API payload from physical shipping selections. */
 function buildShippingAssignments(groups) {
     return groups
-        .filter((group) => group.selectedRateId != null)
+        .filter((group) => !isDigitalServiceGroup(group) && group.selectedRateId != null)
         .map((group) => ({
         rateId: group.selectedRateId,
         invoiceItemIds: group.itemIds
     }));
 }
-/** True once every shippable group has a selected rate. */
+/** True once every physical shipping group has a selected rate. */
 function isShippingComplete(invoice, groups) {
     if (!invoice?.needsShipping) {
         return true;
     }
-    if (groups.length === 0) {
-        return false;
+    const physicalGroups = groups.filter((group) => !isDigitalServiceGroup(group));
+    if (physicalGroups.length === 0) {
+        // The API may set needsShipping for an automatic Digital/Service group.
+        // It is fulfillment metadata, not a customer-selectable shipping method.
+        return groups.length > 0 && groups.every(isDigitalServiceGroup);
     }
-    return groups.every((group) => group.selectedRateId != null);
+    return physicalGroups.every((group) => group.selectedRateId != null);
 }
 const codeDiscountTotal = (invoice) => (invoice.couponTotal || 0) + (invoice.discountTotal || 0);
 /**
@@ -540,14 +591,22 @@ function selectDigitalItems(invoice, groups, applicable) {
     // Before shipping methods are loaded, only explicitly-digital items are known.
     // Showing everything as "digital" when applicable is null would be wrong.
     if (applicable == null) {
-        return invoice.items.filter((item) => item.productType === 'digital');
+        return invoice.items.filter(isDigitalServiceItem);
     }
-    // After shipping methods load: items absent from all groups are non-shippable.
-    const shippable = new Set(groups.flatMap((g) => g.itemIds.map(idStr)));
-    return invoice.items.filter((item) => !shippable.has(idStr(item.id)));
+    // The backend may model digital/service fulfillment as an automatic zero-cost
+    // shipping group. Treat its products as non-shippable in the UI while keeping
+    // the group in state so its assignment can still be submitted.
+    const digitalGroupItems = new Set(groups
+        .filter(isDigitalServiceGroup)
+        .flatMap((group) => group.itemIds.map(idStr)));
+    const groupedItems = new Set(groups.flatMap((group) => group.itemIds.map(idStr)));
+    return invoice.items.filter((item) => isDigitalServiceItem(item) ||
+        digitalGroupItems.has(idStr(item.id)) ||
+        !groupedItems.has(idStr(item.id)));
 }
 
 const STEP_ORDER = ['cart', 'shipping', 'payment', 'result'];
+const ADDRESS_AUTOSUBMIT_DEBOUNCE_MS = 350;
 function initialFlags() {
     return {
         bootstrapping: false,
@@ -594,6 +653,7 @@ function createCheckoutEngine(options) {
     let effectExecutor = noopEffectExecutor;
     let lock = Promise.resolve();
     let addressRevision = 0;
+    let addressAutoSubmitTimer = null;
     // ---- internal helpers -------------------------------------------------
     const get = () => store.getState();
     const set = store.setState;
@@ -614,6 +674,19 @@ function createCheckoutEngine(options) {
         lock = next.then(() => undefined, () => undefined);
         return next;
     }
+    function clearAddressAutoSubmit() {
+        if (addressAutoSubmitTimer) {
+            clearTimeout(addressAutoSubmitTimer);
+            addressAutoSubmitTimer = null;
+        }
+    }
+    function scheduleAddressAutoSubmit(delay = ADDRESS_AUTOSUBMIT_DEBOUNCE_MS) {
+        clearAddressAutoSubmit();
+        addressAutoSubmitTimer = setTimeout(() => {
+            addressAutoSubmitTimer = null;
+            void withLock(submitAddressInternal);
+        }, delay);
+    }
     function recomputeGroups() {
         const { invoice, applicable } = get();
         const groups = deriveShippingGroups(invoice, applicable);
@@ -809,13 +882,17 @@ function createCheckoutEngine(options) {
     }
     // ---- public actions ---------------------------------------------------
     function goToStep(step) {
+        if (step !== 'shipping') {
+            clearAddressAutoSubmit();
+        }
         set({ step, error: null });
         emit('step_viewed', { step });
         // When landing on shipping with a complete address but no methods fetched yet,
         // auto-submit so methods appear without requiring a manual Continue press.
         if (step === 'shipping') {
-            const { addressForm, invoice, applicable } = get();
-            if (!applicable && isAddressComplete(addressForm, invoice?.needsShipping ?? true, get().postalCodeMandatory, get().emailMandatory)) {
+            const { addressForm, addressDirty, invoice, applicable, shippingGroups } = get();
+            const methodsUnresolved = Boolean(invoice?.needsShipping) && shippingGroups.length === 0;
+            if ((addressDirty || !applicable || methodsUnresolved) && isAddressComplete(addressForm, invoice?.needsShipping ?? true, get().postalCodeMandatory, get().emailMandatory)) {
                 void withLock(submitAddressInternal);
             }
         }
@@ -918,13 +995,18 @@ function createCheckoutEngine(options) {
                         // the Shipping step becomes visible.
                         const invoice = get().invoice;
                         if (isUsableSavedAddress(invoice?.shippingAddress)) {
-                            set({ addressForm: addressFormFromInvoice(invoice) });
+                            const addressForm = reconcileAddressWithRegions(addressFormFromInvoice(invoice), get().regions, savedAddressCityName(invoice?.shippingAddress));
+                            set({
+                                addressForm,
+                                addressDirty: isAddressDirty(addressForm, invoice)
+                            });
                         }
                         goToStep('shipping');
                     }
                     return;
                 }
                 if (state.step === 'shipping') {
+                    clearAddressAutoSubmit();
                     // Phase 1: address not saved yet (or changed) → save it and reveal the
                     // shipping methods, staying on the shipping step.
                     const needsSave = state.addressDirty || !state.applicable;
@@ -994,6 +1076,7 @@ function createCheckoutEngine(options) {
         setAddressField(key, value) {
             const before = get().addressForm;
             const changed = before[key] !== value || (key === 'regionId' && before.cityId !== null);
+            const destinationChanged = changed && (key === 'regionId' || key === 'cityId');
             if (changed) {
                 addressRevision += 1;
             }
@@ -1007,22 +1090,28 @@ function createCheckoutEngine(options) {
                 return {
                     addressForm,
                     addressDirty,
-                    // Rates are derived from the address snapshot. Never keep showing or
-                    // accepting rates fetched for a different form value.
-                    ...(addressDirty ? { applicable: null, shippingGroups: [] } : {})
+                    // Shipping rates depend on region/city. Contact and street edits must
+                    // not discard valid methods for the same destination.
+                    ...(destinationChanged ? { applicable: null, shippingGroups: [] } : {})
                 };
             });
-            // City selection is a discrete destination change, so refresh rates
-            // automatically. Text inputs still wait for Save/Continue to avoid an
-            // address creation and shipping request on every keystroke.
-            if (changed && key === 'cityId' && value != null && get().step === 'shipping') {
+            // Browser autofill often populates the selects before the final required
+            // text field. Once the form becomes complete, debounce text changes and
+            // submit automatically; a discrete city selection can submit immediately.
+            if (changed && get().step === 'shipping') {
                 const state = get();
-                if (isAddressComplete(state.addressForm, state.invoice?.needsShipping ?? true, state.postalCodeMandatory, state.emailMandatory)) {
-                    void withLock(submitAddressInternal);
+                const methodsUnresolved = !state.applicable
+                    || (Boolean(state.invoice?.needsShipping) && state.shippingGroups.length === 0);
+                if (isAddressComplete(state.addressForm, state.invoice?.needsShipping ?? true, state.postalCodeMandatory, state.emailMandatory) && (destinationChanged || methodsUnresolved)) {
+                    scheduleAddressAutoSubmit(key === 'cityId' ? 0 : undefined);
+                }
+                else if (!isAddressComplete(state.addressForm, state.invoice?.needsShipping ?? true, state.postalCodeMandatory, state.emailMandatory)) {
+                    clearAddressAutoSubmit();
                 }
             }
         },
         async submitAddress() {
+            clearAddressAutoSubmit();
             return withLock(submitAddressInternal);
         },
         async selectShippingRate(groupKey, rateId) {
@@ -1144,6 +1233,8 @@ function createCheckoutEngine(options) {
         const state = get();
         const submittedAddressRevision = addressRevision;
         const needsShipping = state.invoice?.needsShipping ?? true;
+        const shouldReloadShipping = needsShipping
+            && (!state.applicable || state.shippingGroups.length === 0);
         const abandonStaleSubmission = (invoice) => {
             set({
                 ...(invoice ? { invoice } : {}),
@@ -1188,7 +1279,15 @@ function createCheckoutEngine(options) {
         }
         set({ invoice: linkRes.data, addressDirty: false });
         if (needsShipping) {
-            const ok = await loadApplicableShipping(submittedAddressRevision);
+            let ok = true;
+            if (shouldReloadShipping) {
+                ok = await loadApplicableShipping(submittedAddressRevision);
+            }
+            else if (recomputeGroups().length === 0) {
+                // Invoice item IDs can change when the new address snapshot is linked.
+                // Reload only if the existing applicable data can no longer form groups.
+                ok = await loadApplicableShipping(submittedAddressRevision);
+            }
             if (ok) {
                 await assignCurrentShipping();
                 if (addressRevision !== submittedAddressRevision) {
@@ -1215,6 +1314,7 @@ function createCheckoutEngine(options) {
             effectExecutor = executor;
         },
         destroy() {
+            clearAddressAutoSubmit();
             effectExecutor = noopEffectExecutor;
         }
     };
@@ -1427,7 +1527,8 @@ const fa = {
     shippingMethod: 'روش ارسال',
     shippingMethods: 'روش‌های ارسال',
     shippingMethodsHint: 'پس از ثبت نشانی، روش‌های قابل استفاده نمایش داده می‌شوند.',
-    digitalNoShipping: 'محصول دیجیتال — بدون نیاز به ارسال',
+    digitalNoShipping: 'محصولات دیجیتال و خدمات',
+    digitalNoShippingHint: 'این موارد به ارسال فیزیکی نیاز ندارند.',
     errorRequired: 'این فیلد اجباری است',
     errorMobilePhone: 'شماره موبایل معتبر وارد کنید (مثلاً ۰۹۱۲۳۴۵۶۷۸۹)',
     errorEmail: 'آدرس ایمیل معتبر نیست',
@@ -1507,7 +1608,8 @@ const en = {
     shippingMethod: 'Shipping method',
     shippingMethods: 'Shipping methods',
     shippingMethodsHint: 'Available delivery options will appear after you save this address.',
-    digitalNoShipping: 'Digital product — no shipping required',
+    digitalNoShipping: 'Digital products and services',
+    digitalNoShippingHint: 'These items do not require physical delivery.',
     errorRequired: 'This field is required',
     errorMobilePhone: 'Enter a valid mobile number (e.g. 09123456789)',
     errorEmail: 'Enter a valid email address',
@@ -1585,5 +1687,5 @@ function paymentMethodInfo(code, locale) {
     };
 }
 
-export { paymentMethodLabel as A, selectDigitalItems as B, selectSummary as C, strings as D, toEnglishDigits as E, toPersianDigits as F, addressFormFromInvoice as a, buildShippingAssignments as b, classifyAppliedDiscount as c, createBrowserEffectExecutor as d, createCheckoutEngine as e, createSdkBinding as f, createStore as g, defaultCurrencyLabel as h, deriveShippingGroups as i, emptyAddressForm as j, formatMoney as k, formatNumber as l, formatPercent as m, formatPrice as n, fromSdkError as o, isAddressComplete as p, isAddressDirty as q, isShippingComplete as r, isValidIranianMobile as s, isValidIranianPhone as t, makeError as u, makeEvent as v, messageForCode as w, noopEffectExecutor as x, normalizeIranianPhone as y, paymentMethodInfo as z };
-//# sourceMappingURL=labels-BDeABGTD.js.map
+export { paymentMethodInfo as A, paymentMethodLabel as B, selectDigitalItems as C, selectSummary as D, sortCartItemsNewestFirst as E, strings as F, toEnglishDigits as G, toPersianDigits as H, addressFormFromInvoice as a, buildShippingAssignments as b, classifyAppliedDiscount as c, createBrowserEffectExecutor as d, createCheckoutEngine as e, createSdkBinding as f, createStore as g, defaultCurrencyLabel as h, deriveShippingGroups as i, emptyAddressForm as j, formatMoney as k, formatNumber as l, formatPercent as m, formatPrice as n, fromSdkError as o, isAddressComplete as p, isAddressDirty as q, isDigitalServiceGroup as r, isShippingComplete as s, isValidIranianMobile as t, isValidIranianPhone as u, makeError as v, makeEvent as w, messageForCode as x, noopEffectExecutor as y, normalizeIranianPhone as z };
+//# sourceMappingURL=labels-ByA_yGKl.js.map