tf-checkout-react 1.7.19 → 1.7.23

package/dist/tf-checkout-react.esm.js

@@ -3603,16 +3603,37 @@ var AddonStepper = function AddonStepper(_ref) {
   var id = _ref.id,
     selectOptions = _ref.selectOptions,
     handleAddonChange = _ref.handleAddonChange,
-    classNamePrefix = _ref.classNamePrefix;
+    classNamePrefix = _ref.classNamePrefix,
+    _ref$siblingIds = _ref.siblingIds,
+    siblingIds = _ref$siblingIds === void 0 ? [] : _ref$siblingIds,
+    _ref$allAddonIds = _ref.allAddonIds,
+    allAddonIds = _ref$allAddonIds === void 0 ? [] : _ref$allAddonIds,
+    maxTotalQuantity = _ref.maxTotalQuantity;
   var _useFormikContext = useFormikContext(),
     values = _useFormikContext.values,
     setFieldValue = _useFormikContext.setFieldValue;
   var qty = Number((_values$id = values[id]) != null ? _values$id : 0);
   var max = (selectOptions == null ? void 0 : selectOptions.length) > 0 ? selectOptions[selectOptions.length - 1].value : 0;
+  var totalSelected = allAddonIds.length > 0 ? allAddonIds.reduce(function (sum, aid) {
+    var _values$aid;
+    return sum + Number((_values$aid = values[aid]) != null ? _values$aid : 0);
+  }, 0) : 0;
   var change = function change(next) {
+    if (next > qty) {
+      if (maxTotalQuantity != null) {
+        allAddonIds.forEach(function (aid) {
+          if (aid !== id) setFieldValue(aid, 0);
+        });
+      } else {
+        siblingIds.forEach(function (siblingId) {
+          return setFieldValue(siblingId, 0);
+        });
+      }
+    }
     setFieldValue(id, next);
     handleAddonChange(id, next);
   };
+  var incrementDisabled = qty >= max || maxTotalQuantity != null && totalSelected >= maxTotalQuantity && qty === 0;
   return React.createElement("div", {
     className: classNamePrefix + "_stepper"
   }, React.createElement("button", {
@@ -3631,7 +3652,7 @@ var AddonStepper = function AddonStepper(_ref) {
     onClick: function onClick() {
       return change(qty + 1);
     },
-    disabled: qty >= max,
+    disabled: incrementDisabled,
     "aria-label": "Increase quantity"
   }, "+"));
 };
@@ -3648,6 +3669,11 @@ var AddonComponent = function AddonComponent(_ref2) {
     errors = _ref2.errors,
     _ref2$useStepperQty = _ref2.useStepperQty,
     useStepperQty = _ref2$useStepperQty === void 0 ? false : _ref2$useStepperQty,
+    _ref2$siblingIds = _ref2.siblingIds,
+    siblingIds = _ref2$siblingIds === void 0 ? [] : _ref2$siblingIds,
+    _ref2$allAddonIds = _ref2.allAddonIds,
+    allAddonIds = _ref2$allAddonIds === void 0 ? [] : _ref2$allAddonIds,
+    maxTotalQuantity = _ref2.maxTotalQuantity,
     _ref2$onCustomFieldCh = _ref2.onCustomFieldChange,
     onCustomFieldChange = _ref2$onCustomFieldCh === void 0 ? _identity : _ref2$onCustomFieldCh;
   var id = data.id,
@@ -3680,7 +3706,10 @@ var AddonComponent = function AddonComponent(_ref2) {
     id: id,
     selectOptions: selectOptions,
     handleAddonChange: handleAddonChange,
-    classNamePrefix: classNamePrefix
+    classNamePrefix: classNamePrefix,
+    siblingIds: siblingIds,
+    allAddonIds: allAddonIds,
+    maxTotalQuantity: maxTotalQuantity
   })) : React.createElement(Field, {
     name: id,
     selectOptions: selectOptions,
@@ -4402,6 +4431,11 @@ var AddonsContainter = function AddonsContainter(_ref) {
             data: variant,
             selectOptions: addonsOptions[variant.id],
             classNamePrefix: classNamePrefix,
+            siblingIds: addon.variants.map(function (v) {
+              return v.id;
+            }).filter(function (vid) {
+              return vid !== variant.id;
+            }),
             handleAddonChange: function handleAddonChange(id, value) {
               onAddOnSelect(id, value, addon);
               onFieldChange(id, value, addon);
@@ -4463,6 +4497,7 @@ var SimpleAddonsContainer = function SimpleAddonsContainer(_ref) {
     eventId = _ref.eventId,
     _ref$useStepperQty = _ref.useStepperQty,
     useStepperQty = _ref$useStepperQty === void 0 ? false : _ref$useStepperQty,
+    addonMaxQuantityGroups = _ref.addonMaxQuantityGroups,
     _ref$onAddOnSelect = _ref.onAddOnSelect,
     onAddOnSelect = _ref$onAddOnSelect === void 0 ? _identity : _ref$onAddOnSelect,
     _ref$handleConfirm = _ref.handleConfirm,
@@ -4479,12 +4514,15 @@ var SimpleAddonsContainer = function SimpleAddonsContainer(_ref) {
   var _useState4 = useState({}),
     groupsWithInitialVariantsValues = _useState4[0],
     setGroupsWithInitialVariantsValues = _useState4[1];
-  var _useState5 = useState(true),
-    loading = _useState5[0],
-    setLoading = _useState5[1];
-  var _useState6 = useState(null),
-    visibleDescription = _useState6[0],
-    setVisibleDescription = _useState6[1];
+  var _useState5 = useState({}),
+    crossGroupSelections = _useState5[0],
+    setCrossGroupSelections = _useState5[1];
+  var _useState6 = useState(true),
+    loading = _useState6[0],
+    setLoading = _useState6[1];
+  var _useState7 = useState(null),
+    visibleDescription = _useState7[0],
+    setVisibleDescription = _useState7[1];
   var handleDescriptionToggle = function handleDescriptionToggle(ticketId) {
     setVisibleDescription(function (current) {
       return current === ticketId ? null : ticketId;
@@ -4613,6 +4651,37 @@ var SimpleAddonsContainer = function SimpleAddonsContainer(_ref) {
       recreateGroupVariantsSelectOptions(currGroupId, updatedGroupsWithSelectedVariants[currGroupId]);
     }
   };
+  // Cross-group cap: when addonMaxQuantityGroups is set, limits total selections
+  // across ALL addon groups to that number by capping each stepper's max.
+  var effectiveAddonsOptions = useMemo(function () {
+    if (!addonMaxQuantityGroups) return addonsOptions;
+    var totalSelected = Object.values(crossGroupSelections).reduce(function (sum, v) {
+      return sum + Number(v);
+    }, 0);
+    var globalRemaining = addonMaxQuantityGroups - totalSelected;
+    var result = {};
+    var _loop = function _loop() {
+      var opts = addonsOptions[id] || [];
+      var sdkMax = opts.length ? opts[opts.length - 1].value : 0;
+      var currSelected = Number(crossGroupSelections[id] || 0);
+      var allowedMax = Math.max(0, Math.min(sdkMax, globalRemaining + currSelected));
+      result[id] = opts.filter(function (opt) {
+        return opt.value <= allowedMax;
+      });
+    };
+    for (var id in addonsOptions) {
+      _loop();
+    }
+    return result;
+  }, [addonsOptions, crossGroupSelections, addonMaxQuantityGroups]);
+  var handleCrossGroupChange = function handleCrossGroupChange(id, value) {
+    if (addonMaxQuantityGroups) {
+      setCrossGroupSelections(function (prev) {
+        var _extends6;
+        return _extends({}, prev, (_extends6 = {}, _extends6[id] = Number(value), _extends6));
+      });
+    }
+  };
   var initialValues = useMemo(function () {
     var _addOnDataWithCustomF2;
     var addOnsData = {};
@@ -4722,10 +4791,15 @@ var SimpleAddonsContainer = function SimpleAddonsContainer(_ref) {
           React.createElement(AddonComponent, {
             key: variant.id,
             data: variant,
-            selectOptions: addonsOptions[variant.id],
+            selectOptions: effectiveAddonsOptions[variant.id],
             classNamePrefix: classNamePrefix,
+            siblingIds: addon.variants.filter(function (v) {
+              return v.id !== variant.id;
+            }).map(function (v) {
+              return v.id;
+            }),
             handleAddonChange: function handleAddonChange(id, value) {
-              console.log('handleAddonChange', id, value);
+              handleCrossGroupChange(id, value);
               onFieldChange(id, value, addon);
               var fieldUpdates = collectAddonFieldUpdates(addon, values);
               onAddOnSelect(id, value, addon, fieldUpdates);
@@ -4743,9 +4817,10 @@ var SimpleAddonsContainer = function SimpleAddonsContainer(_ref) {
       React.createElement(AddonComponent, {
         key: addon.id,
         data: addon,
-        selectOptions: addonsOptions[addon.id],
+        selectOptions: effectiveAddonsOptions[addon.id],
         classNamePrefix: classNamePrefix,
         handleAddonChange: function handleAddonChange(id, value) {
+          handleCrossGroupChange(id, value);
           onFieldChange(id, value, addon);
           var fieldUpdates = collectAddonFieldUpdates(addon, values);
           onAddOnSelect(id, value, addon, fieldUpdates);