@orderingstack/front-components-product-configurator 1.7.0-beta.2 → 2.0.0-beta.0

package/dist/index.es.js

@@ -3,146 +3,115 @@ import { useTransition, animated } from "react-spring";
 import { createPortal } from "react-dom";
 var tailwind = "";
 var main = "";
-function _typeof$1(obj) {
+function _typeof$1(o2) {
   "@babel/helpers - typeof";
-  return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj2) {
-    return typeof obj2;
-  } : function(obj2) {
-    return obj2 && "function" == typeof Symbol && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2;
-  }, _typeof$1(obj);
-}
-function _classCallCheck(instance2, Constructor) {
-  if (!(instance2 instanceof Constructor)) {
+  return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o3) {
+    return typeof o3;
+  } : function(o3) {
+    return o3 && "function" == typeof Symbol && o3.constructor === Symbol && o3 !== Symbol.prototype ? "symbol" : typeof o3;
+  }, _typeof$1(o2);
+}
+function _classCallCheck(a2, n2) {
+  if (!(a2 instanceof n2))
     throw new TypeError("Cannot call a class as a function");
-  }
 }
-function _toPrimitive(input, hint) {
-  if (_typeof$1(input) !== "object" || input === null)
-    return input;
-  var prim = input[Symbol.toPrimitive];
-  if (prim !== void 0) {
-    var res = prim.call(input, hint || "default");
-    if (_typeof$1(res) !== "object")
-      return res;
+function toPrimitive(t2, r2) {
+  if ("object" != _typeof$1(t2) || !t2)
+    return t2;
+  var e2 = t2[Symbol.toPrimitive];
+  if (void 0 !== e2) {
+    var i2 = e2.call(t2, r2 || "default");
+    if ("object" != _typeof$1(i2))
+      return i2;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
-  return (hint === "string" ? String : Number)(input);
+  return ("string" === r2 ? String : Number)(t2);
 }
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return _typeof$1(key) === "symbol" ? key : String(key);
+function toPropertyKey(t2) {
+  var i2 = toPrimitive(t2, "string");
+  return "symbol" == _typeof$1(i2) ? i2 : i2 + "";
 }
-function _defineProperties(target, props) {
-  for (var i2 = 0; i2 < props.length; i2++) {
-    var descriptor = props[i2];
-    descriptor.enumerable = descriptor.enumerable || false;
-    descriptor.configurable = true;
-    if ("value" in descriptor)
-      descriptor.writable = true;
-    Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+function _defineProperties(e2, r2) {
+  for (var t2 = 0; t2 < r2.length; t2++) {
+    var o2 = r2[t2];
+    o2.enumerable = o2.enumerable || false, o2.configurable = true, "value" in o2 && (o2.writable = true), Object.defineProperty(e2, toPropertyKey(o2.key), o2);
   }
 }
-function _createClass(Constructor, protoProps, staticProps) {
-  if (protoProps)
-    _defineProperties(Constructor.prototype, protoProps);
-  if (staticProps)
-    _defineProperties(Constructor, staticProps);
-  Object.defineProperty(Constructor, "prototype", {
+function _createClass(e2, r2, t2) {
+  return r2 && _defineProperties(e2.prototype, r2), t2 && _defineProperties(e2, t2), Object.defineProperty(e2, "prototype", {
     writable: false
-  });
-  return Constructor;
+  }), e2;
 }
-function _assertThisInitialized(self2) {
-  if (self2 === void 0) {
+function _assertThisInitialized(e2) {
+  if (void 0 === e2)
     throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-  }
-  return self2;
+  return e2;
 }
-function _setPrototypeOf(o2, p2) {
-  _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf2(o3, p3) {
-    o3.__proto__ = p3;
-    return o3;
-  };
-  return _setPrototypeOf(o2, p2);
+function _setPrototypeOf(t2, e2) {
+  return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(t3, e3) {
+    return t3.__proto__ = e3, t3;
+  }, _setPrototypeOf(t2, e2);
 }
-function _inherits(subClass, superClass) {
-  if (typeof superClass !== "function" && superClass !== null) {
+function _inherits(t2, e2) {
+  if ("function" != typeof e2 && null !== e2)
     throw new TypeError("Super expression must either be null or a function");
-  }
-  subClass.prototype = Object.create(superClass && superClass.prototype, {
+  t2.prototype = Object.create(e2 && e2.prototype, {
     constructor: {
-      value: subClass,
+      value: t2,
       writable: true,
       configurable: true
     }
-  });
-  Object.defineProperty(subClass, "prototype", {
+  }), Object.defineProperty(t2, "prototype", {
     writable: false
-  });
-  if (superClass)
-    _setPrototypeOf(subClass, superClass);
+  }), e2 && _setPrototypeOf(t2, e2);
 }
-function _possibleConstructorReturn(self2, call) {
-  if (call && (_typeof$1(call) === "object" || typeof call === "function")) {
-    return call;
-  } else if (call !== void 0) {
+function _possibleConstructorReturn(t2, e2) {
+  if (e2 && ("object" == _typeof$1(e2) || "function" == typeof e2))
+    return e2;
+  if (void 0 !== e2)
     throw new TypeError("Derived constructors may only return object or undefined");
-  }
-  return _assertThisInitialized(self2);
-}
-function _getPrototypeOf(o2) {
-  _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf2(o3) {
-    return o3.__proto__ || Object.getPrototypeOf(o3);
-  };
-  return _getPrototypeOf(o2);
-}
-function _defineProperty(obj, key, value) {
-  key = _toPropertyKey(key);
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-  return obj;
+  return _assertThisInitialized(t2);
+}
+function _getPrototypeOf(t2) {
+  return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(t3) {
+    return t3.__proto__ || Object.getPrototypeOf(t3);
+  }, _getPrototypeOf(t2);
+}
+function _defineProperty(e2, r2, t2) {
+  return (r2 = toPropertyKey(r2)) in e2 ? Object.defineProperty(e2, r2, {
+    value: t2,
+    enumerable: true,
+    configurable: true,
+    writable: true
+  }) : e2[r2] = t2, e2;
+}
+function _arrayWithHoles$1(r2) {
+  if (Array.isArray(r2))
+    return r2;
 }
-function _arrayWithHoles$1(arr2) {
-  if (Array.isArray(arr2))
-    return arr2;
+function _iterableToArray$1(r2) {
+  if ("undefined" != typeof Symbol && null != r2[Symbol.iterator] || null != r2["@@iterator"])
+    return Array.from(r2);
 }
-function _iterableToArray$1(iter) {
-  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null)
-    return Array.from(iter);
-}
-function _arrayLikeToArray$1(arr2, len) {
-  if (len == null || len > arr2.length)
-    len = arr2.length;
-  for (var i2 = 0, arr22 = new Array(len); i2 < len; i2++)
-    arr22[i2] = arr2[i2];
-  return arr22;
+function _arrayLikeToArray$1(r2, a2) {
+  (null == a2 || a2 > r2.length) && (a2 = r2.length);
+  for (var e2 = 0, n2 = Array(a2); e2 < a2; e2++)
+    n2[e2] = r2[e2];
+  return n2;
 }
-function _unsupportedIterableToArray$1(o2, minLen) {
-  if (!o2)
-    return;
-  if (typeof o2 === "string")
-    return _arrayLikeToArray$1(o2, minLen);
-  var n2 = Object.prototype.toString.call(o2).slice(8, -1);
-  if (n2 === "Object" && o2.constructor)
-    n2 = o2.constructor.name;
-  if (n2 === "Map" || n2 === "Set")
-    return Array.from(o2);
-  if (n2 === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n2))
-    return _arrayLikeToArray$1(o2, minLen);
+function _unsupportedIterableToArray$1(r2, a2) {
+  if (r2) {
+    if ("string" == typeof r2)
+      return _arrayLikeToArray$1(r2, a2);
+    var t2 = {}.toString.call(r2).slice(8, -1);
+    return "Object" === t2 && r2.constructor && (t2 = r2.constructor.name), "Map" === t2 || "Set" === t2 ? Array.from(r2) : "Arguments" === t2 || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t2) ? _arrayLikeToArray$1(r2, a2) : void 0;
+  }
 }
 function _nonIterableRest$1() {
   throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
-function _toArray$1(arr2) {
-  return _arrayWithHoles$1(arr2) || _iterableToArray$1(arr2) || _unsupportedIterableToArray$1(arr2) || _nonIterableRest$1();
+function _toArray$1(r2) {
+  return _arrayWithHoles$1(r2) || _iterableToArray$1(r2) || _unsupportedIterableToArray$1(r2) || _nonIterableRest$1();
 }
 function ownKeys$2(object, enumerableOnly) {
   var keys2 = Object.keys(object);
@@ -4753,17 +4722,26 @@ var SelMinSelMaxStatus = /* @__PURE__ */ ((SelMinSelMaxStatus2) => {
   return SelMinSelMaxStatus2;
 })(SelMinSelMaxStatus || {});
 const getContexts = (contextName, contextType, product) => {
+  var _a, _b;
   if (contextName === "selected" || contextName === "filter") {
     return [];
   }
   if (product[contextType] === contextName) {
     return [product];
   }
-  let contexts = findContextByName(contextName, contextType, product.items);
+  let contexts = findContextByName(
+    contextName,
+    contextType,
+    (_a = product.items) != null ? _a : []
+  );
   if (contexts == null ? void 0 : contexts.length) {
     return contexts;
   }
-  contexts = findContextInNestedLvl(contextName, contextType, product.items);
+  contexts = findContextInNestedLvl(
+    contextName,
+    contextType,
+    (_b = product.items) != null ? _b : []
+  );
   if (contexts.length === 0)
     ;
   return contexts;
@@ -6328,7 +6306,7 @@ const getGroupBucketSecondChildrenValuesInputChange = (group, clickedProductId,
       secondProduct
     };
   }
-  const isSecondProductInState = !!((_c = selected == null ? void 0 : selected[secondProduct == null ? void 0 : secondProduct.selCtx]) == null ? void 0 : _c[secondProduct == null ? void 0 : secondProduct.id]) && ((_d = selected == null ? void 0 : selected[secondProduct == null ? void 0 : secondProduct.selCtx]) == null ? void 0 : _d[secondProduct == null ? void 0 : secondProduct.id]) !== false;
+  const isSecondProductInState = !!secondProduct && !!((_c = selected == null ? void 0 : selected[secondProduct.selCtx]) == null ? void 0 : _c[secondProduct.id]) && ((_d = selected == null ? void 0 : selected[secondProduct.selCtx]) == null ? void 0 : _d[secondProduct.id]) !== false;
   if (isSecondProductInState) {
     return {
       clickedProductValue: "1",
@@ -6748,7 +6726,9 @@ const validateProductFilter = (product, stateFilter) => {
   const commonFilters = (_a = Object.keys(stateFiltersWithFltCtx)) == null ? void 0 : _a.filter(
     (filterName) => {
       var _a2;
-      const matchingFilters = (_a2 = Object.keys((productFilters == null ? void 0 : productFilters[filterName]) || {})) == null ? void 0 : _a2.filter((x2) => {
+      const matchingFilters = (_a2 = Object.keys(
+        (productFilters == null ? void 0 : productFilters[filterName]) || {}
+      )) == null ? void 0 : _a2.filter((x2) => {
         var _a3;
         if (((_a3 = productFilters == null ? void 0 : productFilters[filterName]) == null ? void 0 : _a3[x2]) === (stateFiltersWithFltCtx == null ? void 0 : stateFiltersWithFltCtx[filterName])) {
           return true;
@@ -6956,7 +6936,7 @@ function InfoLine(props) {
   });
 }
 const checkMarkSVG = /* @__PURE__ */ jsx("svg", {
-  className: "w-6 h-6 text-green-600",
+  className: "size-6 text-green-600",
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
@@ -6969,7 +6949,7 @@ const checkMarkSVG = /* @__PURE__ */ jsx("svg", {
   })
 });
 const exclamationMarkSVG = /* @__PURE__ */ jsx("svg", {
-  className: "w-6 h-6 text-red-500",
+  className: "size-6 text-red-500",
   fill: "none",
   viewBox: "0 0 24 24",
   stroke: "currentColor",
@@ -7755,34 +7735,34 @@ function hasLoadedNamespace(ns, i18n) {
     }
   });
 }
-function _iterableToArrayLimit(arr2, i2) {
-  var _i = null == arr2 ? null : "undefined" != typeof Symbol && arr2[Symbol.iterator] || arr2["@@iterator"];
-  if (null != _i) {
-    var _s, _e2, _x, _r, _arr = [], _n = true, _d = false;
+function _iterableToArrayLimit(r2, l2) {
+  var t2 = null == r2 ? null : "undefined" != typeof Symbol && r2[Symbol.iterator] || r2["@@iterator"];
+  if (null != t2) {
+    var e2, n2, i2, u2, a2 = [], f2 = true, o2 = false;
     try {
-      if (_x = (_i = _i.call(arr2)).next, 0 === i2) {
-        if (Object(_i) !== _i)
+      if (i2 = (t2 = t2.call(r2)).next, 0 === l2) {
+        if (Object(t2) !== t2)
           return;
-        _n = false;
+        f2 = false;
       } else
-        for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i2); _n = true)
+        for (; !(f2 = (e2 = i2.call(t2)).done) && (a2.push(e2.value), a2.length !== l2); f2 = true)
           ;
-    } catch (err) {
-      _d = true, _e2 = err;
+    } catch (r3) {
+      o2 = true, n2 = r3;
     } finally {
       try {
-        if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r))
+        if (!f2 && null != t2["return"] && (u2 = t2["return"](), Object(u2) !== u2))
           return;
       } finally {
-        if (_d)
-          throw _e2;
+        if (o2)
+          throw n2;
       }
     }
-    return _arr;
+    return a2;
   }
 }
-function _slicedToArray(arr2, i2) {
-  return _arrayWithHoles$1(arr2) || _iterableToArrayLimit(arr2, i2) || _unsupportedIterableToArray$1(arr2, i2) || _nonIterableRest$1();
+function _slicedToArray(r2, e2) {
+  return _arrayWithHoles$1(r2) || _iterableToArrayLimit(r2, e2) || _unsupportedIterableToArray$1(r2, e2) || _nonIterableRest$1();
 }
 function ownKeys(object, enumerableOnly) {
   var keys2 = Object.keys(object);
@@ -8473,7 +8453,7 @@ const MenuOptionsDefaultUI = (props) => {
             price: countPrice(selected, optionsItem)
           })
         }), /* @__PURE__ */ jsx("svg", {
-          className: `w-8 h-8 ml-2 text-black cursor-pointer ${!isExpanded && "rotate-180"}`,
+          className: `size-8 ml-2 text-black cursor-pointer ${!isExpanded && "rotate-180"}`,
           viewBox: "0 0 24 24",
           fill: "none",
           stroke: "currentColor",
@@ -8535,7 +8515,7 @@ const MenuOptions = (props) => {
   const {
     MenuOptionsUI
   } = useComponents();
-  if (!isFilterValidated) {
+  if (!isFilterValidated || (optionsItem == null ? void 0 : optionsItem.outsideAvailabilitySlot) === true) {
     return null;
   }
   const MenuItemsDispatcherWrapper = /* @__PURE__ */ jsx(MenuItemsDispatcher, {
@@ -8641,7 +8621,7 @@ const SimpleCheckbox = (props) => {
     }), /* @__PURE__ */ jsx("label", {
       htmlFor: inputId,
       children: /* @__PURE__ */ jsx(Price, {
-        price: parseFloat(price),
+        price: parseFloat(price || "0"),
         addPlusBefore: true,
         showIfPriceZero: true,
         hiddenIfPriceZero: true
@@ -8723,14 +8703,14 @@ function Counter(props) {
     size = "md"
   } = props;
   return /* @__PURE__ */ jsxs("div", {
-    className: `counter counter-${size} flex flex-row justify-center items-center p-1 border-[1px] rounded-md border-[rgba(229,231,235,255)]	 product-quantity`,
+    className: `counter counter-${size} flex flex-row justify-center items-center p-1 border rounded-md border-[rgba(229,231,235,255)]	 product-quantity`,
     children: [/* @__PURE__ */ jsx("button", {
       type: "button",
       className: "quantity-button small",
       onClick: subtract,
       disabled: disabledSubtract,
       children: /* @__PURE__ */ jsxs("svg", {
-        className: "w-4 h-4 text-black",
+        className: "size-4 text-black",
         width: "24",
         height: "24",
         viewBox: "0 0 24 24",
@@ -8758,7 +8738,7 @@ function Counter(props) {
       onClick: add,
       disabled: disabledAdd,
       children: /* @__PURE__ */ jsxs("svg", {
-        className: "w-4 h-4 text-green-600 ",
+        className: "size-4 text-green-600 ",
         width: "24",
         height: "24",
         viewBox: "0 0 24 24",
@@ -8819,12 +8799,14 @@ function useEmitFilter(product, isRadio, nestedLvl) {
         const groupsCntKeys = getValues(groupsPath);
         (_b = Object.keys(emit)) == null ? void 0 : _b.forEach((x2) => {
           var _a2;
-          (_a2 = Object.keys(productGroupCntKeys || {})) == null ? void 0 : _a2.forEach((productGroupCntKey) => {
-            if (!emit[productGroupCntKey]) {
-              unregister(`${fltCtxPath}.${productGroupCntKey}`);
-              unregister(`${groupCntPath}.${productGroupCntKey}`);
+          (_a2 = Object.keys(productGroupCntKeys || {})) == null ? void 0 : _a2.forEach(
+            (productGroupCntKey) => {
+              if (!emit[productGroupCntKey]) {
+                unregister(`${fltCtxPath}.${productGroupCntKey}`);
+                unregister(`${groupCntPath}.${productGroupCntKey}`);
+              }
             }
-          });
+          );
           Object.keys(groupsCntKeys || {}).forEach((groupSelCtx) => {
             if (groupSelCtx !== selCtx && x2 in getValues(groupsPath == null ? void 0 : groupsPath[groupSelCtx])) {
               unregister(`${groupsPath}.${groupSelCtx}.${x2}`);
@@ -8840,7 +8822,10 @@ function useEmitFilter(product, isRadio, nestedLvl) {
       (_c = Object.keys(emit)) == null ? void 0 : _c.forEach((x2) => {
         setValue(`filter.${fltCtx}.${x2}`, emit[x2]);
         const groupKeyCnt = getValues(`${groupCntPath}.${x2}.cnt`) || 0;
-        setValue(`${groupCntPath}.${x2}`, { cnt: groupKeyCnt + 1, value: emit[x2] });
+        setValue(`${groupCntPath}.${x2}`, {
+          cnt: groupKeyCnt + 1,
+          value: emit[x2]
+        });
       });
     }
   }, [value]);
@@ -8939,14 +8924,18 @@ const selectUnselectProduct = (setValue, getValues, product, isChecked, unregist
           } else {
             unregister(`${groupCntPath}.${emitKey}`);
             const groupKeysObj = getValues(groupsPath) || {};
-            const otherGroupsCntKeys = (_a2 = Object.keys(groupKeysObj)) == null ? void 0 : _a2.filter((x2) => x2 !== selCtx);
+            const otherGroupsCntKeys = (_a2 = Object.keys(groupKeysObj)) == null ? void 0 : _a2.filter(
+              (x2) => x2 !== selCtx
+            );
             if (!otherGroupsCntKeys) {
               unregister(`${fltCtxPath}.${emitKey}`);
             } else {
-              const sameKeyOtherGroup = otherGroupsCntKeys == null ? void 0 : otherGroupsCntKeys.find((groupSelCtx) => {
-                var _a3;
-                return !!((_a3 = groupKeysObj == null ? void 0 : groupKeysObj[`${groupSelCtx}`]) == null ? void 0 : _a3[`${emitKey}`]);
-              });
+              const sameKeyOtherGroup = otherGroupsCntKeys == null ? void 0 : otherGroupsCntKeys.find(
+                (groupSelCtx) => {
+                  var _a3;
+                  return !!((_a3 = groupKeysObj == null ? void 0 : groupKeysObj[`${groupSelCtx}`]) == null ? void 0 : _a3[`${emitKey}`]);
+                }
+              );
               if (!sameKeyOtherGroup) {
                 unregister(`${fltCtxPath}.${emitKey}`);
               } else {
@@ -8982,7 +8971,7 @@ const findProductInParentProductBySelCtx = (parent, selCtx) => {
   return null;
 };
 function useMenuProduct(product, parentAttrs, nestedLvl, parentPriduct) {
-  var _a, _b;
+  var _a, _b, _c;
   const { id, selCtx, emit = {}, fltCtx } = product;
   const {
     allowMultiple: parentAllowMultiple,
@@ -9002,8 +8991,8 @@ function useMenuProduct(product, parentAttrs, nestedLvl, parentPriduct) {
   const isBucketCase = isGroupBucketCase(parentPriduct);
   const isCounter = isApiBooleanTrue(parentAllowMultiple);
   const isDecrementEnabled = isBucketCase && valueNumber > 0 || valueNumber > (isRadio ? 1 : 0);
-  const isIncrementEnabled = isBucketCase && valueNumber < ((_a = parentPriduct == null ? void 0 : parentPriduct.attrs) == null ? void 0 : _a.qtyMax) || isInputCounterIncrementEnabled2(product, selected) && (isInputEnabled2(product) || valueNumber);
-  const isChecked = Number(((_b = selected == null ? void 0 : selected[selCtx]) == null ? void 0 : _b[id]) || 0) > 0;
+  const isIncrementEnabled = isBucketCase && valueNumber < Number((_b = (_a = parentPriduct == null ? void 0 : parentPriduct.attrs) == null ? void 0 : _a.qtyMax) != null ? _b : 0) || isInputCounterIncrementEnabled2(product, selected) && (isInputEnabled2(product) || valueNumber);
+  const isChecked = Number(((_c = selected == null ? void 0 : selected[selCtx]) == null ? void 0 : _c[id]) || 0) > 0;
   const isCheckboxEnabled = isBucketCase || isInputEnabled2(product) || valueNumber;
   const registerId = `${isRadio ? "radio" : "selected"}.${selCtx}.${id}`;
   const registerProps = register(registerId, {
@@ -9017,14 +9006,27 @@ function useMenuProduct(product, parentAttrs, nestedLvl, parentPriduct) {
     const isBucketCase2 = isGroupBucketCase(parentPriduct);
     if (isBucketCase2) {
       const { product: secondProduct, value: secondProductValue } = getGroupBucketSecondChildrenValues(parentPriduct, id, valueNumber + 1);
-      setValue(`selected.${secondProduct == null ? void 0 : secondProduct.selCtx}.${secondProduct == null ? void 0 : secondProduct.id}`, secondProductValue);
+      setValue(
+        `selected.${secondProduct == null ? void 0 : secondProduct.selCtx}.${secondProduct == null ? void 0 : secondProduct.id}`,
+        secondProductValue
+      );
       if (secondProductValue === "0" || secondProductValue === false) {
-        selectUnselectProduct(setValue, getValues, secondProduct, false, unregister, nestedLvl);
+        selectUnselectProduct(
+          setValue,
+          getValues,
+          secondProduct,
+          false,
+          unregister,
+          nestedLvl
+        );
       }
     }
     const importantSubProductsInState = (_b2 = (_a2 = Object.keys(selected)) == null ? void 0 : _a2.map((y2) => {
       var _a3;
-      return { key: y2, subProductId: (_a3 = findProductInParentProductBySelCtx(product, y2)) == null ? void 0 : _a3.id };
+      return {
+        key: y2,
+        subProductId: (_a3 = findProductInParentProductBySelCtx(product, y2)) == null ? void 0 : _a3.id
+      };
     })) == null ? void 0 : _b2.filter((x2) => !!x2.subProductId);
     if (valueNumber === 0) {
       importantSubProductsInState == null ? void 0 : importantSubProductsInState.forEach((x2) => {
@@ -9033,19 +9035,32 @@ function useMenuProduct(product, parentAttrs, nestedLvl, parentPriduct) {
     }
   };
   const handleCounterDecrementQty = () => {
-    var _a2, _b2, _c, _d;
+    var _a2, _b2, _c2, _d;
     const decrementedValue = valueNumber - 1;
     setValue(`selected.${selCtx}.${id}`, `${decrementedValue}`);
     if (isBucketCase) {
       const { product: secondProduct, value: secondProductValue } = getGroupBucketSecondChildrenValues(parentPriduct, id, decrementedValue);
-      setValue(`selected.${secondProduct == null ? void 0 : secondProduct.selCtx}.${secondProduct == null ? void 0 : secondProduct.id}`, secondProductValue);
+      setValue(
+        `selected.${secondProduct == null ? void 0 : secondProduct.selCtx}.${secondProduct == null ? void 0 : secondProduct.id}`,
+        secondProductValue
+      );
       if (secondProductValue === "1") {
-        selectUnselectProduct(setValue, getValues, secondProduct, true, unregister, nestedLvl);
+        selectUnselectProduct(
+          setValue,
+          getValues,
+          secondProduct,
+          true,
+          unregister,
+          nestedLvl
+        );
       }
     }
     const importantSubProductsInState = (_b2 = (_a2 = Object.keys(selected)) == null ? void 0 : _a2.map((y2) => {
       var _a3;
-      return { key: y2, subProductId: (_a3 = findProductInParentProductBySelCtx(product, y2)) == null ? void 0 : _a3.id };
+      return {
+        key: y2,
+        subProductId: (_a3 = findProductInParentProductBySelCtx(product, y2)) == null ? void 0 : _a3.id
+      };
     })) == null ? void 0 : _b2.filter((x2) => !!x2.subProductId);
     if (decrementedValue === 0) {
       importantSubProductsInState == null ? void 0 : importantSubProductsInState.forEach((x2) => {
@@ -9054,7 +9069,7 @@ function useMenuProduct(product, parentAttrs, nestedLvl, parentPriduct) {
     }
     if (isCheckbox && decrementedValue === 0) {
       setValue(`selected.${selCtx}.${id}`, false);
-      (_c = Object.keys(emit)) == null ? void 0 : _c.forEach((x2) => {
+      (_c2 = Object.keys(emit)) == null ? void 0 : _c2.forEach((x2) => {
         const formPath = `filterWithCnt.${fltCtx}.${x2}.${emit[x2]}`;
         const cnt = getValues(formPath) || 0;
         if (cnt < 2) {
@@ -9081,7 +9096,7 @@ function useMenuProduct(product, parentAttrs, nestedLvl, parentPriduct) {
         const groupCntPath = `filterWithCnt.${fltCtx}.${selCtx}`;
         const fltCtxPath = `filter.${fltCtx}`;
         (_d = Object.keys(emit)) == null ? void 0 : _d.forEach((emitKey) => {
-          var _a3, _b3, _c2;
+          var _a3, _b3, _c3;
           const groupValue = getValues(`${groupCntPath}.${emitKey}`) || 0;
           if (groupValue) {
             if (groupValue > 1) {
@@ -9089,18 +9104,22 @@ function useMenuProduct(product, parentAttrs, nestedLvl, parentPriduct) {
             } else {
               unregister(`${groupCntPath}.${emitKey}`);
               const groupKeysObj = getValues(groupsPath) || {};
-              const otherGroupsCntKeys = (_a3 = Object.keys(groupKeysObj)) == null ? void 0 : _a3.filter((x2) => x2 !== selCtx);
+              const otherGroupsCntKeys = (_a3 = Object.keys(groupKeysObj)) == null ? void 0 : _a3.filter(
+                (x2) => x2 !== selCtx
+              );
               if (!otherGroupsCntKeys) {
                 unregister(`${fltCtxPath}.${emitKey}`);
               } else {
-                const sameKeyOtherGroup = otherGroupsCntKeys == null ? void 0 : otherGroupsCntKeys.find((groupSelCtx) => {
-                  var _a4;
-                  return !!((_a4 = groupKeysObj == null ? void 0 : groupKeysObj[`${groupSelCtx}`]) == null ? void 0 : _a4[`${emitKey}`]);
-                });
+                const sameKeyOtherGroup = otherGroupsCntKeys == null ? void 0 : otherGroupsCntKeys.find(
+                  (groupSelCtx) => {
+                    var _a4;
+                    return !!((_a4 = groupKeysObj == null ? void 0 : groupKeysObj[`${groupSelCtx}`]) == null ? void 0 : _a4[`${emitKey}`]);
+                  }
+                );
                 if (!sameKeyOtherGroup) {
                   unregister(`${fltCtxPath}.${emitKey}`);
                 } else {
-                  const newValue = (_c2 = (_b3 = groupKeysObj == null ? void 0 : groupKeysObj[`${sameKeyOtherGroup}`]) == null ? void 0 : _b3[`${emitKey}`]) == null ? void 0 : _c2.value;
+                  const newValue = (_c3 = (_b3 = groupKeysObj == null ? void 0 : groupKeysObj[`${sameKeyOtherGroup}`]) == null ? void 0 : _b3[`${emitKey}`]) == null ? void 0 : _c3.value;
                   setValue(`${fltCtxPath}.${emitKey}`, newValue);
                 }
               }
@@ -9116,19 +9135,59 @@ function useMenuProduct(product, parentAttrs, nestedLvl, parentPriduct) {
       target: { checked, name: selCtx2, defaultValue: productId }
     } = e2;
     if (isBucketCase) {
-      const { clickedProductValue, secondProductValue, secondProduct } = getGroupBucketSecondChildrenValuesInputChange(parentPriduct, id, checked, selected);
-      console.log("handleOnInputChange clickedProductValue", clickedProductValue, secondProductValue);
-      setValue(`selected.${product == null ? void 0 : product.selCtx}.${product == null ? void 0 : product.id}`, clickedProductValue);
-      setValue(`selected.${secondProduct == null ? void 0 : secondProduct.selCtx}.${secondProduct == null ? void 0 : secondProduct.id}`, secondProductValue);
-      selectUnselectProduct(setValue, getValues, product, checked, unregister, nestedLvl);
-      selectUnselectProduct(setValue, getValues, secondProduct, secondProductValue !== false, unregister, nestedLvl);
+      const { clickedProductValue, secondProductValue, secondProduct } = getGroupBucketSecondChildrenValuesInputChange(
+        parentPriduct,
+        id,
+        checked,
+        selected
+      );
+      console.log(
+        "handleOnInputChange clickedProductValue",
+        clickedProductValue,
+        secondProductValue
+      );
+      setValue(
+        `selected.${product == null ? void 0 : product.selCtx}.${product == null ? void 0 : product.id}`,
+        clickedProductValue
+      );
+      setValue(
+        `selected.${secondProduct == null ? void 0 : secondProduct.selCtx}.${secondProduct == null ? void 0 : secondProduct.id}`,
+        secondProductValue
+      );
+      selectUnselectProduct(
+        setValue,
+        getValues,
+        product,
+        checked,
+        unregister,
+        nestedLvl
+      );
+      selectUnselectProduct(
+        setValue,
+        getValues,
+        secondProduct,
+        secondProductValue !== false,
+        unregister,
+        nestedLvl
+      );
       return;
     }
-    selectUnselectProduct(setValue, getValues, product, checked, unregister, nestedLvl);
+    selectUnselectProduct(
+      setValue,
+      getValues,
+      product,
+      checked,
+      unregister,
+      nestedLvl
+    );
     if (isRadio) {
-      const otherGroupItems = (_a2 = parentPriduct == null ? void 0 : parentPriduct.items) == null ? void 0 : _a2.filter((x2) => x2.id !== product.id);
+      const otherGroupItems = (_a2 = parentPriduct == null ? void 0 : parentPriduct.items) == null ? void 0 : _a2.filter(
+        (x2) => x2.id !== product.id
+      );
       for (const key of Object.keys(selected || {})) {
-        const isItemToClear = (otherGroupItems == null ? void 0 : otherGroupItems.some((x2) => !!findProductInParentProductBySelCtx(x2, key))) ? key : false;
+        const isItemToClear = (otherGroupItems == null ? void 0 : otherGroupItems.some(
+          (x2) => !!findProductInParentProductBySelCtx(x2, key)
+        )) ? key : false;
         if (isItemToClear) {
           setValue(`selected.${key}`, false);
         }
@@ -9183,6 +9242,9 @@ const MenuProduct = (props) => {
   const {
     MenuProductUI
   } = useComponents();
+  if (product == null ? void 0 : product.outsideAvailabilitySlot) {
+    return /* @__PURE__ */ jsx(Fragment, {});
+  }
   const menuProductProps = {
     product,
     nestedLvl,
@@ -9284,7 +9346,7 @@ const MenuProductDefaultUI = (props) => {
   });
   return /* @__PURE__ */ jsxs("div", {
     children: [renderInput(), showProductItems ? transitions((styles, item) => item && /* @__PURE__ */ jsx(animated.div, {
-      className: `border-l-[2px] border-gray-300 ${nestedLvl >= 1 && "ml-4 pl-4"}`,
+      className: `border-l-2 border-gray-300 ${nestedLvl >= 1 && "ml-4 pl-4"}`,
       style: styles,
       children
     }, nestedLvl + 1)) : null]
@@ -9304,7 +9366,8 @@ function MenuItemsDispatcher(props) {
     productItems,
     nestedLvl = 1,
     parentProduct,
-    rootProduct
+    rootProduct,
+    showOutsideAvailabilitySlotItems
   } = props;
   const {
     attrs: parentAttrs = {},
@@ -9320,7 +9383,7 @@ function MenuItemsDispatcher(props) {
   } = useComponents();
   const renderMenuItem = (productItem) => {
     var _a;
-    if (isAnyGroupOptionKind(productItem.kind) && !((_a = productItem == null ? void 0 : productItem.items) == null ? void 0 : _a.find((x2) => {
+    if (showOutsideAvailabilitySlotItems !== true && (productItem == null ? void 0 : productItem.outsideAvailabilitySlot) === true || isAnyGroupOptionKind(productItem.kind) && !((_a = productItem == null ? void 0 : productItem.items) == null ? void 0 : _a.find((x2) => {
       var _a2, _b;
       return ((_a2 = x2 == null ? void 0 : x2.attrs) == null ? void 0 : _a2.hidden) !== true && ((_b = x2 == null ? void 0 : x2._) == null ? void 0 : _b.hidden) !== "true";
     }))) {
@@ -9398,7 +9461,7 @@ const showMoreLessButton = (text, handleClick, isShowMore) => {
       className: "flex px-2 text-lg font-semibold text-black",
       onClick: handleClick,
       children: [text, /* @__PURE__ */ jsxs("svg", {
-        className: `-mr-2 w-7 h-7 ${!isShowMore && "rotate-180"}`,
+        className: `-mr-2 size-7 ${!isShowMore && "rotate-180"}`,
         width: "24",
         height: "24",
         viewBox: "0 0 24 24",
@@ -9472,7 +9535,7 @@ function SubmitRow(props) {
       className: "inline-flex items-center px-2 py-1 font-bold text-red-600 border-2 border-red-600 border-solid rounded hover:bg-red-200",
       onClick: handleGoBack,
       children: [/* @__PURE__ */ jsxs("svg", {
-        className: "w-5 h-5 text-red-600",
+        className: "size-5 text-red-600",
         width: "24",
         height: "24",
         viewBox: "0 0 24 24",
@@ -9522,7 +9585,7 @@ function SubmitRow(props) {
       disabled: displayPriceFrom,
       onClick: handleOnSubmit,
       children: [/* @__PURE__ */ jsxs("svg", {
-        className: "w-5 h-5 mr-2 text-white",
+        className: "size-5 mr-2 text-white",
         viewBox: "0 0 24 24",
         fill: "none",
         stroke: "currentColor",
@@ -10554,13 +10617,13 @@ function Modal(props) {
             leaveTo: "opacity-0 scale-95",
             children: /* @__PURE__ */ jsxs("div", {
               id: "modal-content",
-              className: `inline-block overflow-hidden sm:rounded-2xl align-middle transition-all bg-white sm:shadow-xl h-[100vh] sm:h-auto sm:max-h-[90vh]  w-full sm:w-[640px]`,
+              className: `inline-block overflow-hidden sm:rounded-2xl align-middle transition-all bg-white sm:shadow-xl h-screen sm:h-auto sm:max-h-[90vh]  w-full sm:w-[640px]`,
               children: [/* @__PURE__ */ jsx("div", {
                 className: "sticky top-0 z-10 flex items-center w-full px-3 text-lg font-medium leading-6 text-gray-900 bg-white h-14 modal-header",
                 children: /* @__PURE__ */ jsx("div", {
                   className: "",
                   children: /* @__PURE__ */ jsxs("svg", {
-                    className: "w-8 h-8 text-black cursor-pointer",
+                    className: "size-8 text-black cursor-pointer",
                     width: "24",
                     height: "24",
                     viewBox: "0 0 24 24",
@@ -10606,7 +10669,7 @@ function Modal(props) {
   });
 }
 function MenuProductRootDefaultUI(props) {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e2, _f, _g, _h, _i, _j;
   const {
     product,
     isOpen,
@@ -10639,8 +10702,8 @@ function MenuProductRootDefaultUI(props) {
     displayPriceFrom,
     formattedEndPrice
   } = formatPriceWithMinPrice(countedProductPrice, minPrice, productQuantity);
-  const formContentRef1 = useRef();
-  const formContentRef2 = useRef();
+  const formContentRef1 = useRef(null);
+  const formContentRef2 = useRef(null);
   const {
     isSm,
     isMobile,
@@ -10652,10 +10715,10 @@ function MenuProductRootDefaultUI(props) {
     children: [/* @__PURE__ */ jsxs("div", {
       className: clsx("px-4 w-full", isSm && "sm:sticky sm:top-0 sm:w-2/5"),
       ref: formContentRef1,
-      children: [product.details.media && product.details.media[0].url && /* @__PURE__ */ jsx("img", {
+      children: [((_a = product.details) == null ? void 0 : _a.media) && product.details.media[0].url && /* @__PURE__ */ jsx("img", {
         className: clsx("mx-auto mt-2 mb-6 max-h-[250px]", isSm && "max-h-[450px]"),
-        alt: product.details.literals.name,
-        src: (_a = product.details) == null ? void 0 : _a.media[0].url
+        alt: (_c = (_b = product.details) == null ? void 0 : _b.literals) == null ? void 0 : _c.name,
+        src: (_d = product.details) == null ? void 0 : _d.media[0].url
       }), /* @__PURE__ */ jsx("div", {
         className: clsx(!showDebugState && "hidden"),
         children: /* @__PURE__ */ jsx(DisplayState, {})
@@ -10669,14 +10732,14 @@ function MenuProductRootDefaultUI(props) {
           className: "flex justify-between w-full mb-4 text-2xl font-semibold",
           children: [/* @__PURE__ */ jsxs("span", {
             className: "",
-            children: [product.details.literals.name, " "]
+            children: [(_f = (_e2 = product.details) == null ? void 0 : _e2.literals) == null ? void 0 : _f.name, " "]
           }), /* @__PURE__ */ jsx(Price, {
             price: props.countedProductPrice,
             minPrice
           })]
         }), /* @__PURE__ */ jsx("span", {
           className: "text-gray-600",
-          children: (_b = product.details.literals) == null ? void 0 : _b.description
+          children: (_h = (_g = product.details) == null ? void 0 : _g.literals) == null ? void 0 : _h.description
         })]
       }), /* @__PURE__ */ jsxs("div", {
         className: `items-center justify-center w-full px-4  product-configuration ${(product == null ? void 0 : product.items) && "py-2 bg-gray-100"}`,
@@ -10689,14 +10752,18 @@ function MenuProductRootDefaultUI(props) {
           finalPrice: formattedEndPrice,
           isBackIcon: false,
           handleGoBack,
-          displayPriceFrom
+          displayPriceFrom,
+          productQuantity,
+          increaseProductQuantity,
+          decreaseProductQuantity,
+          handleOnSubmit
         })
       })]
     })]
   });
-  const height = (_c = formContentRef1 == null ? void 0 : formContentRef1.current) == null ? void 0 : _c.clientHeight;
-  const height2 = (_d = formContentRef2 == null ? void 0 : formContentRef2.current) == null ? void 0 : _d.clientHeight;
-  const modalContentHeight = height + height2;
+  const height = (_i = formContentRef1 == null ? void 0 : formContentRef1.current) == null ? void 0 : _i.clientHeight;
+  const height2 = (_j = formContentRef2 == null ? void 0 : formContentRef2.current) == null ? void 0 : _j.clientHeight;
+  const modalContentHeight = Number(height) + Number(height2);
   if (modalContentHeight > window.innerHeight * 0.8 || isNaN(modalContentHeight)) {
     if (formBodyHeight !== "80vh") {
       setFormBodyHeight("80vh");
@@ -10716,7 +10783,7 @@ function MenuProductRootDefaultUI(props) {
     handleClose: handleGoBack,
     children: /* @__PURE__ */ jsxs("div", {
       id: "product-configurator-view",
-      className: "w-full h-full",
+      className: "size-full",
       style: {
         overflow: "hidden",
         textAlign: "left"
@@ -10822,7 +10889,8 @@ function useGroupsValidation(product) {
 }
 const MenuProductRoot = (props) => {
   const {
-    product
+    product,
+    showOutsideAvailabilitySlotItems
   } = props;
   const {
     MenuProductRootUI
@@ -10833,7 +10901,8 @@ const MenuProductRoot = (props) => {
   const MenuItemsDispatcherWrapper = !isEmpty(product.items) ? /* @__PURE__ */ jsx(MenuItemsDispatcher, {
     productItems: product.items,
     parentProduct: product,
-    rootProduct: product
+    rootProduct: product,
+    showOutsideAvailabilitySlotItems
   }) : /* @__PURE__ */ jsx(Fragment, {});
   if (MenuProductRootUI) {
     return /* @__PURE__ */ jsx(MenuProductRootUI, {
@@ -10877,7 +10946,8 @@ function ProductConfigurator(props) {
     isOpen,
     handleClose,
     currency,
-    showDebugState = false
+    showDebugState = false,
+    showOutsideAvailabilitySlotItems
   } = props;
   const {
     price
@@ -10966,7 +11036,8 @@ function ProductConfigurator(props) {
                 countedProductTotalPrice: countedProductPrice * productQuantity,
                 increaseProductQuantity,
                 decreaseProductQuantity,
-                currency
+                currency,
+                showOutsideAvailabilitySlotItems
               })
             })]
           })
@@ -10976,4 +11047,3 @@ function ProductConfigurator(props) {
   });
 }
 export { ContextType, MainView, ProductConfigurator, ProductKinds, ProductTypes, SelMinSelMaxStatus, getProductToChangeInForm, index_esm as hookForm, selectProductsInForm, unselectProductsInForm, useMenuOptions, useProductData, useStore, validateProductFilter };
-//# sourceMappingURL=index.es.js.map