@orderingstack/front-components-product-configurator 1.4.0 → 1.4.2-beta.0

package/dist/index.es.js

@@ -1,148 +1,118 @@
-import React, { useReducer, useRef, useDebugValue, useEffect, useLayoutEffect, useState, useMemo, createContext, useContext, forwardRef, Fragment as Fragment$1, isValidElement, cloneElement, createElement, createRef } from "react";
+import * as React from "react";
+import React__default, { useReducer, useRef, useDebugValue, useEffect, useLayoutEffect, useState, useMemo, createContext, useContext, forwardRef, Fragment as Fragment$1, isValidElement, cloneElement, createElement, createRef, useCallback } from "react";
 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;
-}
-function _arrayWithHoles$1(arr2) {
-  if (Array.isArray(arr2))
-    return arr2;
+  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 _iterableToArray$1(iter) {
-  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null)
-    return Array.from(iter);
+function _iterableToArray$1(r2) {
+  if ("undefined" != typeof Symbol && null != r2[Symbol.iterator] || null != r2["@@iterator"])
+    return Array.from(r2);
 }
-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);
@@ -434,13 +404,13 @@ var chars = [" ", ",", "?", "!", ";"];
 function looksLikeObjectPath(key, nsSeparator, keySeparator) {
   nsSeparator = nsSeparator || "";
   keySeparator = keySeparator || "";
-  var possibleChars = chars.filter(function(c) {
-    return nsSeparator.indexOf(c) < 0 && keySeparator.indexOf(c) < 0;
+  var possibleChars = chars.filter(function(c2) {
+    return nsSeparator.indexOf(c2) < 0 && keySeparator.indexOf(c2) < 0;
   });
   if (possibleChars.length === 0)
     return true;
-  var r2 = new RegExp("(".concat(possibleChars.map(function(c) {
-    return c === "?" ? "\\?" : c;
+  var r2 = new RegExp("(".concat(possibleChars.map(function(c2) {
+    return c2 === "?" ? "\\?" : c2;
   }).join("|"), ")"));
   var matched = !r2.test(key);
   if (!matched) {
@@ -1298,13 +1268,13 @@ var LanguageUtil = function() {
       var _this2 = this;
       var fallbackCodes = this.getFallbackCodes(fallbackCode || this.options.fallbackLng || [], code);
       var codes = [];
-      var addCode = function addCode2(c) {
-        if (!c)
+      var addCode = function addCode2(c2) {
+        if (!c2)
           return;
-        if (_this2.isSupportedCode(c)) {
-          codes.push(c);
+        if (_this2.isSupportedCode(c2)) {
+          codes.push(c2);
         } else {
-          _this2.logger.warn("rejecting language code not found in supportedLngs: ".concat(c));
+          _this2.logger.warn("rejecting language code not found in supportedLngs: ".concat(c2));
         }
       };
       if (typeof code === "string" && code.indexOf("-") > -1) {
@@ -1801,9 +1771,9 @@ var Interpolator = function() {
         var sep = this.nestingOptionsSeparator;
         if (key.indexOf(sep) < 0)
           return key;
-        var c = key.split(new RegExp("".concat(sep, "[ ]*{")));
-        var optionsString = "{".concat(c[1]);
-        key = c[0];
+        var c2 = key.split(new RegExp("".concat(sep, "[ ]*{")));
+        var optionsString = "{".concat(c2[1]);
+        key = c2[0];
         optionsString = this.interpolate(optionsString, clonedOptions);
         var matchedSingleQuotes = optionsString.match(/'/g);
         var matchedDoubleQuotes = optionsString.match(/"/g);
@@ -2651,7 +2621,7 @@ var I18n = function(_EventEmitter) {
         if (usedLng && usedLng.toLowerCase() === "cimode")
           return usedCallback();
         var toLoad = [];
-        var append2 = function append3(lng) {
+        var append = function append2(lng) {
           if (!lng)
             return;
           var lngs = _this3.services.languageUtils.toResolveHierarchy(lng);
@@ -2663,14 +2633,14 @@ var I18n = function(_EventEmitter) {
         if (!usedLng) {
           var fallbacks = this.services.languageUtils.getFallbackCodes(this.options.fallbackLng);
           fallbacks.forEach(function(l2) {
-            return append2(l2);
+            return append(l2);
           });
         } else {
-          append2(usedLng);
+          append(usedLng);
         }
         if (this.options.preload) {
           this.options.preload.forEach(function(l2) {
-            return append2(l2);
+            return append(l2);
           });
         }
         this.services.backendConnector.load(toLoad, this.options.ns, function(e2) {
@@ -3017,14 +2987,65 @@ var isObject$1 = (value) => !isNullOrUndefined(value) && !Array.isArray(value) &
 var getEventValue = (event) => isObject$1(event) && event.target ? isCheckBoxInput(event.target) ? event.target.checked : event.target.value : event;
 var getNodeParentName = (name) => name.substring(0, name.search(/\.\d+(\.|$)/)) || name;
 var isNameInFieldArray = (names, name) => names.has(getNodeParentName(name));
+var isPlainObject = (tempObject) => {
+  const prototypeCopy = tempObject.constructor && tempObject.constructor.prototype;
+  return isObject$1(prototypeCopy) && prototypeCopy.hasOwnProperty("isPrototypeOf");
+};
+var isWeb = typeof window !== "undefined" && typeof window.HTMLElement !== "undefined" && typeof document !== "undefined";
+function cloneObject(data) {
+  let copy2;
+  const isArray2 = Array.isArray(data);
+  if (data instanceof Date) {
+    copy2 = new Date(data);
+  } else if (data instanceof Set) {
+    copy2 = new Set(data);
+  } else if (!(isWeb && (data instanceof Blob || data instanceof FileList)) && (isArray2 || isObject$1(data))) {
+    copy2 = isArray2 ? [] : {};
+    if (!isArray2 && !isPlainObject(data)) {
+      copy2 = data;
+    } else {
+      for (const key in data) {
+        if (data.hasOwnProperty(key)) {
+          copy2[key] = cloneObject(data[key]);
+        }
+      }
+    }
+  } else {
+    return data;
+  }
+  return copy2;
+}
 var compact = (value) => Array.isArray(value) ? value.filter(Boolean) : [];
 var isUndefined$2 = (val) => val === void 0;
-var get = (obj, path2, defaultValue) => {
-  if (!path2 || !isObject$1(obj)) {
+var get = (object, path2, defaultValue) => {
+  if (!path2 || !isObject$1(object)) {
     return defaultValue;
   }
-  const result = compact(path2.split(/[,[\].]+?/)).reduce((result2, key) => isNullOrUndefined(result2) ? result2 : result2[key], obj);
-  return isUndefined$2(result) || result === obj ? isUndefined$2(obj[path2]) ? defaultValue : obj[path2] : result;
+  const result = compact(path2.split(/[,[\].]+?/)).reduce((result2, key) => isNullOrUndefined(result2) ? result2 : result2[key], object);
+  return isUndefined$2(result) || result === object ? isUndefined$2(object[path2]) ? defaultValue : object[path2] : result;
+};
+var isBoolean = (value) => typeof value === "boolean";
+var isKey = (value) => /^\w*$/.test(value);
+var stringToPath = (input) => compact(input.replace(/["|']|\]/g, "").split(/\.|\[/));
+var set = (object, path2, value) => {
+  let index = -1;
+  const tempPath = isKey(path2) ? [path2] : stringToPath(path2);
+  const length = tempPath.length;
+  const lastIndex = length - 1;
+  while (++index < length) {
+    const key = tempPath[index];
+    let newValue = value;
+    if (index !== lastIndex) {
+      const objValue = object[key];
+      newValue = isObject$1(objValue) || Array.isArray(objValue) ? objValue : !isNaN(+tempPath[index + 1]) ? [] : {};
+    }
+    if (key === "__proto__") {
+      return;
+    }
+    object[key] = newValue;
+    object = object[key];
+  }
+  return object;
 };
 const EVENTS = {
   BLUR: "blur",
@@ -3047,11 +3068,11 @@ const INPUT_VALIDATION_RULES = {
   required: "required",
   validate: "validate"
 };
-const HookFormContext = React.createContext(null);
-const useFormContext = () => React.useContext(HookFormContext);
+const HookFormContext = React__default.createContext(null);
+const useFormContext = () => React__default.useContext(HookFormContext);
 const FormProvider = (props) => {
   const { children, ...data } = props;
-  return React.createElement(HookFormContext.Provider, { value: data }, children);
+  return React__default.createElement(HookFormContext.Provider, { value: data }, children);
 };
 var getProxyFormState = (formState, control, localProxyFormState, isRoot = true) => {
   const result = {
@@ -3072,17 +3093,18 @@ var getProxyFormState = (formState, control, localProxyFormState, isRoot = true)
   return result;
 };
 var isEmptyObject = (value) => isObject$1(value) && !Object.keys(value).length;
-var shouldRenderFormState = (formStateData, _proxyFormState, isRoot) => {
+var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => {
+  updateFormState(formStateData);
   const { name, ...formState } = formStateData;
   return isEmptyObject(formState) || Object.keys(formState).length >= Object.keys(_proxyFormState).length || Object.keys(formState).find((key) => _proxyFormState[key] === (!isRoot || VALIDATION_MODE.all));
 };
 var convertToArrayPayload = (value) => Array.isArray(value) ? value : [value];
-var shouldSubscribeByName = (name, signalName, exact) => exact && signalName ? name === signalName : !name || !signalName || name === signalName || convertToArrayPayload(name).some((currentName) => currentName && (currentName.startsWith(signalName) || signalName.startsWith(currentName)));
+var shouldSubscribeByName = (name, signalName, exact) => !name || !signalName || name === signalName || convertToArrayPayload(name).some((currentName) => currentName && (exact ? currentName === signalName : currentName.startsWith(signalName) || signalName.startsWith(currentName)));
 function useSubscribe(props) {
-  const _props = React.useRef(props);
+  const _props = React__default.useRef(props);
   _props.current = props;
-  React.useEffect(() => {
-    const subscription = !props.disabled && _props.current.subject.subscribe({
+  React__default.useEffect(() => {
+    const subscription = !props.disabled && _props.current.subject && _props.current.subject.subscribe({
       next: _props.current.next
     });
     return () => {
@@ -3093,36 +3115,31 @@ function useSubscribe(props) {
 function useFormState(props) {
   const methods = useFormContext();
   const { control = methods.control, disabled, name, exact } = props || {};
-  const [formState, updateFormState] = React.useState(control._formState);
-  const _mounted = React.useRef(true);
-  const _localProxyFormState = React.useRef({
+  const [formState, updateFormState] = React__default.useState(control._formState);
+  const _mounted = React__default.useRef(true);
+  const _localProxyFormState = React__default.useRef({
     isDirty: false,
     isLoading: false,
     dirtyFields: false,
     touchedFields: false,
+    validatingFields: false,
     isValidating: false,
     isValid: false,
     errors: false
   });
-  const _name = React.useRef(name);
+  const _name = React__default.useRef(name);
   _name.current = name;
   useSubscribe({
     disabled,
-    next: (value) => _mounted.current && shouldSubscribeByName(_name.current, value.name, exact) && shouldRenderFormState(value, _localProxyFormState.current) && updateFormState({
+    next: (value) => _mounted.current && shouldSubscribeByName(_name.current, value.name, exact) && shouldRenderFormState(value, _localProxyFormState.current, control._updateFormState) && updateFormState({
       ...control._formState,
       ...value
     }),
     subject: control._subjects.state
   });
-  React.useEffect(() => {
+  React__default.useEffect(() => {
     _mounted.current = true;
-    const isDirty = control._proxyFormState.isDirty && control._getDirty();
-    if (isDirty !== control._formState.isDirty) {
-      control._subjects.state.next({
-        isDirty
-      });
-    }
-    control._updateValid();
+    _localProxyFormState.current.isValid && control._updateValid(true);
     return () => {
       _mounted.current = false;
     };
@@ -3141,53 +3158,27 @@ var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) =>
   isGlobal && (_names.watchAll = true);
   return formValues;
 };
-var isPlainObject = (tempObject) => {
-  const prototypeCopy = tempObject.constructor && tempObject.constructor.prototype;
-  return isObject$1(prototypeCopy) && prototypeCopy.hasOwnProperty("isPrototypeOf");
-};
-var isWeb = typeof window !== "undefined" && typeof window.HTMLElement !== "undefined" && typeof document !== "undefined";
-function cloneObject(data) {
-  let copy2;
-  const isArray2 = Array.isArray(data);
-  if (data instanceof Date) {
-    copy2 = new Date(data);
-  } else if (data instanceof Set) {
-    copy2 = new Set(data);
-  } else if (!(isWeb && (data instanceof Blob || data instanceof FileList)) && (isArray2 || isObject$1(data))) {
-    copy2 = isArray2 ? [] : {};
-    if (!Array.isArray(data) && !isPlainObject(data)) {
-      copy2 = data;
-    } else {
-      for (const key in data) {
-        copy2[key] = cloneObject(data[key]);
-      }
-    }
-  } else {
-    return data;
-  }
-  return copy2;
-}
 function useWatch(props) {
   const methods = useFormContext();
   const { control = methods.control, name, defaultValue, disabled, exact } = props || {};
-  const _name = React.useRef(name);
+  const _name = React__default.useRef(name);
   _name.current = name;
   useSubscribe({
     disabled,
-    subject: control._subjects.watch,
+    subject: control._subjects.values,
     next: (formState) => {
       if (shouldSubscribeByName(_name.current, formState.name, exact)) {
         updateValue(cloneObject(generateWatchOutput(_name.current, control._names, formState.values || control._formValues, false, defaultValue)));
       }
     }
   });
-  const [value, updateValue] = React.useState(control._getWatch(name, defaultValue));
-  React.useEffect(() => control._removeUnmounted());
+  const [value, updateValue] = React__default.useState(control._getWatch(name, defaultValue));
+  React__default.useEffect(() => control._removeUnmounted());
   return value;
 }
 function useController(props) {
   const methods = useFormContext();
-  const { name, control = methods.control, shouldUnregister } = props;
+  const { name, disabled, control = methods.control, shouldUnregister } = props;
   const isArrayField = isNameInFieldArray(control._names.array, name);
   const value = useWatch({
     control,
@@ -3199,35 +3190,54 @@ function useController(props) {
     control,
     name
   });
-  const _registerProps = React.useRef(control.register(name, {
+  const _registerProps = React__default.useRef(control.register(name, {
     ...props.rules,
-    value
+    value,
+    ...isBoolean(props.disabled) ? { disabled: props.disabled } : {}
   }));
-  React.useEffect(() => {
+  React__default.useEffect(() => {
+    const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
     const updateMounted = (name2, value2) => {
       const field = get(control._fields, name2);
-      if (field) {
+      if (field && field._f) {
         field._f.mount = value2;
       }
     };
     updateMounted(name, true);
+    if (_shouldUnregisterField) {
+      const value2 = cloneObject(get(control._options.defaultValues, name));
+      set(control._defaultValues, name, value2);
+      if (isUndefined$2(get(control._formValues, name))) {
+        set(control._formValues, name, value2);
+      }
+    }
     return () => {
-      const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
-      (isArrayField ? _shouldUnregisterField && !control._stateFlags.action : _shouldUnregisterField) ? control.unregister(name) : updateMounted(name, false);
+      (isArrayField ? _shouldUnregisterField && !control._state.action : _shouldUnregisterField) ? control.unregister(name) : updateMounted(name, false);
     };
   }, [name, control, isArrayField, shouldUnregister]);
+  React__default.useEffect(() => {
+    if (get(control._fields, name)) {
+      control._updateDisabledField({
+        disabled,
+        fields: control._fields,
+        name,
+        value: get(control._fields, name)._f.value
+      });
+    }
+  }, [disabled, name, control]);
   return {
     field: {
       name,
       value,
-      onChange: React.useCallback((event) => _registerProps.current.onChange({
+      ...isBoolean(disabled) || formState.disabled ? { disabled: formState.disabled || disabled } : {},
+      onChange: React__default.useCallback((event) => _registerProps.current.onChange({
         target: {
           value: getEventValue(event),
           name
         },
         type: EVENTS.CHANGE
       }), [name]),
-      onBlur: React.useCallback(() => _registerProps.current.onBlur({
+      onBlur: React__default.useCallback(() => _registerProps.current.onBlur({
         target: {
           value: get(control._formValues, name),
           name
@@ -3260,6 +3270,10 @@ function useController(props) {
         enumerable: true,
         get: () => !!get(formState.touchedFields, name)
       },
+      isValidating: {
+        enumerable: true,
+        get: () => !!get(formState.validatingFields, name)
+      },
       error: {
         enumerable: true,
         get: () => get(formState.errors, name)
@@ -3268,6 +3282,76 @@ function useController(props) {
   };
 }
 const Controller = (props) => props.render(useController(props));
+const POST_REQUEST = "post";
+function Form(props) {
+  const methods = useFormContext();
+  const [mounted, setMounted] = React__default.useState(false);
+  const { control = methods.control, onSubmit, children, action, method = POST_REQUEST, headers, encType, onError, render, onSuccess, validateStatus, ...rest } = props;
+  const submit = async (event) => {
+    let hasError = false;
+    let type = "";
+    await control.handleSubmit(async (data) => {
+      const formData = new FormData();
+      let formDataJson = "";
+      try {
+        formDataJson = JSON.stringify(data);
+      } catch (_a) {
+      }
+      for (const name of control._names.mount) {
+        formData.append(name, get(data, name));
+      }
+      if (onSubmit) {
+        await onSubmit({
+          data,
+          event,
+          method,
+          formData,
+          formDataJson
+        });
+      }
+      if (action) {
+        try {
+          const shouldStringifySubmissionData = [
+            headers && headers["Content-Type"],
+            encType
+          ].some((value) => value && value.includes("json"));
+          const response = await fetch(action, {
+            method,
+            headers: {
+              ...headers,
+              ...encType ? { "Content-Type": encType } : {}
+            },
+            body: shouldStringifySubmissionData ? formDataJson : formData
+          });
+          if (response && (validateStatus ? !validateStatus(response.status) : response.status < 200 || response.status >= 300)) {
+            hasError = true;
+            onError && onError({ response });
+            type = String(response.status);
+          } else {
+            onSuccess && onSuccess({ response });
+          }
+        } catch (error2) {
+          hasError = true;
+          onError && onError({ error: error2 });
+        }
+      }
+    })(event);
+    if (hasError && props.control) {
+      props.control._subjects.state.next({
+        isSubmitSuccessful: false
+      });
+      props.control.setError("root.server", {
+        type
+      });
+    }
+  };
+  React__default.useEffect(() => {
+    setMounted(true);
+  }, []);
+  return render ? React__default.createElement(React__default.Fragment, null, render({
+    submit
+  })) : React__default.createElement("form", { noValidate: mounted, action, method, encType, onSubmit: submit, ...rest }, children);
+}
 var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => validateAllFieldCriteria ? {
   ...errors[name],
   types: {
@@ -3275,49 +3359,11 @@ var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => va
     [type]: message || true
   }
 } : {};
-var isKey = (value) => /^\w*$/.test(value);
-var stringToPath = (input) => compact(input.replace(/["|']|\]/g, "").split(/\.|\[/));
-function set(object, path2, value) {
-  let index = -1;
-  const tempPath = isKey(path2) ? [path2] : stringToPath(path2);
-  const length = tempPath.length;
-  const lastIndex = length - 1;
-  while (++index < length) {
-    const key = tempPath[index];
-    let newValue = value;
-    if (index !== lastIndex) {
-      const objValue = object[key];
-      newValue = isObject$1(objValue) || Array.isArray(objValue) ? objValue : !isNaN(+tempPath[index + 1]) ? [] : {};
-    }
-    object[key] = newValue;
-    object = object[key];
-  }
-  return object;
-}
-const focusFieldBy = (fields, callback, fieldsNames) => {
-  for (const key of fieldsNames || Object.keys(fields)) {
-    const field = get(fields, key);
-    if (field) {
-      const { _f, ...currentField } = field;
-      if (_f && callback(_f.name)) {
-        if (_f.ref.focus) {
-          _f.ref.focus();
-          break;
-        } else if (_f.refs && _f.refs[0].focus) {
-          _f.refs[0].focus();
-          break;
-        }
-      } else if (isObject$1(currentField)) {
-        focusFieldBy(currentField, callback);
-      }
-    }
-  }
-};
 var generateId = () => {
   const d2 = typeof performance === "undefined" ? Date.now() : performance.now() * 1e3;
-  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c2) => {
     const r2 = (Math.random() * 16 + d2) % 16 | 0;
-    return (c == "x" ? r2 : r2 & 3 | 8).toString(16);
+    return (c2 == "x" ? r2 : r2 & 3 | 8).toString(16);
   });
 };
 var getFocusFieldName = (name, index, options = {}) => options.shouldFocus || isUndefined$2(options.shouldFocus) ? options.focusName || `${name}.${isUndefined$2(options.focusIndex) ? index : options.focusIndex}.` : "";
@@ -3329,13 +3375,31 @@ var getValidationModes = (mode) => ({
   isOnTouch: mode === VALIDATION_MODE.onTouched
 });
 var isWatched = (name, _names, isBlurEvent) => !isBlurEvent && (_names.watchAll || _names.watch.has(name) || [..._names.watch].some((watchName) => name.startsWith(watchName) && /^\.\w+/.test(name.slice(watchName.length))));
+const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
+  for (const key of fieldsNames || Object.keys(fields)) {
+    const field = get(fields, key);
+    if (field) {
+      const { _f, ...currentField } = field;
+      if (_f) {
+        if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
+          break;
+        } else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
+          break;
+        } else {
+          iterateFieldsByAction(currentField, action);
+        }
+      } else if (isObject$1(currentField)) {
+        iterateFieldsByAction(currentField, action);
+      }
+    }
+  }
+};
 var updateFieldArrayRootError = (errors, error2, name) => {
-  const fieldArrayErrors = compact(get(errors, name));
+  const fieldArrayErrors = convertToArrayPayload(get(errors, name));
   set(fieldArrayErrors, "root", error2[name]);
   set(errors, name, fieldArrayErrors);
   return errors;
 };
-var isBoolean = (value) => typeof value === "boolean";
 var isFileInput = (element) => element.type === "file";
 var isFunction$1 = (value) => typeof value === "function";
 var isHTMLElement = (value) => {
@@ -3345,7 +3409,7 @@ var isHTMLElement = (value) => {
   const owner = value ? value.ownerDocument : 0;
   return value instanceof (owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement);
 };
-var isMessage = (value) => isString(value) || React.isValidElement(value);
+var isMessage = (value) => isString(value);
 var isRadioInput = (element) => element.type === "radio";
 var isRegex = (value) => value instanceof RegExp;
 const defaultResult = {
@@ -3384,8 +3448,9 @@ var getValueAndMessage = (validationData) => isObject$1(validationData) && !isRe
   value: validationData,
   message: ""
 };
-var validateField = async (field, inputValue, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
+var validateField = async (field, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
   const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount, disabled } = field._f;
+  const inputValue = get(formValues, name);
   if (!mount || disabled) {
     return {};
   }
@@ -3462,8 +3527,8 @@ var validateField = async (field, inputValue, validateAllFieldCriteria, shouldUs
   if ((maxLength || minLength) && !isEmpty2 && (isString(inputValue) || isFieldArray && Array.isArray(inputValue))) {
     const maxLengthOutput = getValueAndMessage(maxLength);
     const minLengthOutput = getValueAndMessage(minLength);
-    const exceedMax = !isNullOrUndefined(maxLengthOutput.value) && inputValue.length > maxLengthOutput.value;
-    const exceedMin = !isNullOrUndefined(minLengthOutput.value) && inputValue.length < minLengthOutput.value;
+    const exceedMax = !isNullOrUndefined(maxLengthOutput.value) && inputValue.length > +maxLengthOutput.value;
+    const exceedMin = !isNullOrUndefined(minLengthOutput.value) && inputValue.length < +minLengthOutput.value;
     if (exceedMax || exceedMin) {
       getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
       if (!validateAllFieldCriteria) {
@@ -3489,7 +3554,7 @@ var validateField = async (field, inputValue, validateAllFieldCriteria, shouldUs
   }
   if (validate) {
     if (isFunction$1(validate)) {
-      const result = await validate(inputValue);
+      const result = await validate(inputValue, formValues);
       const validateError = getValidateError(result, inputRef);
       if (validateError) {
         error2[name] = {
@@ -3507,7 +3572,7 @@ var validateField = async (field, inputValue, validateAllFieldCriteria, shouldUs
         if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
           break;
         }
-        const validateError = getValidateError(await validate[key](inputValue), inputRef, key);
+        const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);
         if (validateError) {
           validationResult = {
             ...validateError,
@@ -3533,9 +3598,10 @@ var validateField = async (field, inputValue, validateAllFieldCriteria, shouldUs
   setCustomValidity(true);
   return error2;
 };
-function append(data, value) {
-  return [...data, ...convertToArrayPayload(value)];
-}
+var appendAt = (data, value) => [
+  ...data,
+  ...convertToArrayPayload(value)
+];
 var fillEmptyArray = (value) => Array.isArray(value) ? value.map(() => void 0) : void 0;
 function insert(data, index, value) {
   return [
@@ -3554,9 +3620,10 @@ var moveArrayAt = (data, from, to) => {
   data.splice(to, 0, data.splice(from, 1)[0]);
   return data;
 };
-function prepend(data, value) {
-  return [...convertToArrayPayload(value), ...convertToArrayPayload(data)];
-}
+var prependAt = (data, value) => [
+  ...convertToArrayPayload(value),
+  ...convertToArrayPayload(data)
+];
 function removeAtIndexes(data, indexes) {
   let i2 = 0;
   const temp = [...data];
@@ -3566,9 +3633,9 @@ function removeAtIndexes(data, indexes) {
   }
   return compact(temp).length ? temp : [];
 }
-var removeArrayAt = (data, index) => isUndefined$2(index) ? [] : removeAtIndexes(data, convertToArrayPayload(index).sort((a2, b) => a2 - b));
+var removeArrayAt = (data, index) => isUndefined$2(index) ? [] : removeAtIndexes(data, convertToArrayPayload(index).sort((a2, b2) => a2 - b2));
 var swapArrayAt = (data, indexA, indexB) => {
-  data[indexA] = [data[indexB], data[indexB] = data[indexA]][0];
+  [data[indexA], data[indexB]] = [data[indexB], data[indexA]];
 };
 function baseGet(object, updatePath) {
   const length = updatePath.slice(0, -1).length;
@@ -3580,36 +3647,22 @@ function baseGet(object, updatePath) {
 }
 function isEmptyArray(obj) {
   for (const key in obj) {
-    if (!isUndefined$2(obj[key])) {
+    if (obj.hasOwnProperty(key) && !isUndefined$2(obj[key])) {
       return false;
     }
   }
   return true;
 }
 function unset(object, path2) {
-  const updatePath = isKey(path2) ? [path2] : stringToPath(path2);
-  const childObject = updatePath.length == 1 ? object : baseGet(object, updatePath);
-  const key = updatePath[updatePath.length - 1];
-  let previousObjRef;
+  const paths = Array.isArray(path2) ? path2 : isKey(path2) ? [path2] : stringToPath(path2);
+  const childObject = paths.length === 1 ? object : baseGet(object, paths);
+  const index = paths.length - 1;
+  const key = paths[index];
   if (childObject) {
     delete childObject[key];
   }
-  for (let k2 = 0; k2 < updatePath.slice(0, -1).length; k2++) {
-    let index = -1;
-    let objectRef;
-    const currentPaths = updatePath.slice(0, -(k2 + 1));
-    const currentPathsLength = currentPaths.length - 1;
-    if (k2 > 0) {
-      previousObjRef = object;
-    }
-    while (++index < currentPaths.length) {
-      const item = currentPaths[index];
-      objectRef = objectRef ? objectRef[item] : object[item];
-      if (currentPathsLength === index && (isObject$1(objectRef) && isEmptyObject(objectRef) || Array.isArray(objectRef) && isEmptyArray(objectRef))) {
-        previousObjRef ? delete previousObjRef[item] : delete object[item];
-      }
-      previousObjRef = objectRef;
-    }
+  if (index !== 0 && (isObject$1(childObject) && isEmptyObject(childObject) || Array.isArray(childObject) && isEmptyArray(childObject))) {
+    unset(object, paths.slice(0, -1));
   }
   return object;
 }
@@ -3620,11 +3673,11 @@ var updateAt = (fieldValues, index, value) => {
 function useFieldArray(props) {
   const methods = useFormContext();
   const { control = methods.control, name, keyName = "id", shouldUnregister } = props;
-  const [fields, setFields] = React.useState(control._getFieldArray(name));
-  const ids = React.useRef(control._getFieldArray(name).map(generateId));
-  const _fieldIds = React.useRef(fields);
-  const _name = React.useRef(name);
-  const _actioned = React.useRef(false);
+  const [fields, setFields] = React__default.useState(control._getFieldArray(name));
+  const ids = React__default.useRef(control._getFieldArray(name).map(generateId));
+  const _fieldIds = React__default.useRef(fields);
+  const _name = React__default.useRef(name);
+  const _actioned = React__default.useRef(false);
   _name.current = name;
   _fieldIds.current = fields;
   control._names.array.add(name);
@@ -3641,29 +3694,29 @@ function useFieldArray(props) {
     },
     subject: control._subjects.array
   });
-  const updateValues = React.useCallback((updatedFieldArrayValues) => {
+  const updateValues = React__default.useCallback((updatedFieldArrayValues) => {
     _actioned.current = true;
     control._updateFieldArray(name, updatedFieldArrayValues);
   }, [control, name]);
-  const append$1 = (value, options) => {
+  const append = (value, options) => {
     const appendValue = convertToArrayPayload(cloneObject(value));
-    const updatedFieldArrayValues = append(control._getFieldArray(name), appendValue);
+    const updatedFieldArrayValues = appendAt(control._getFieldArray(name), appendValue);
     control._names.focus = getFocusFieldName(name, updatedFieldArrayValues.length - 1, options);
-    ids.current = append(ids.current, appendValue.map(generateId));
+    ids.current = appendAt(ids.current, appendValue.map(generateId));
     updateValues(updatedFieldArrayValues);
     setFields(updatedFieldArrayValues);
-    control._updateFieldArray(name, updatedFieldArrayValues, append, {
+    control._updateFieldArray(name, updatedFieldArrayValues, appendAt, {
       argA: fillEmptyArray(value)
     });
   };
-  const prepend$1 = (value, options) => {
+  const prepend = (value, options) => {
     const prependValue = convertToArrayPayload(cloneObject(value));
-    const updatedFieldArrayValues = prepend(control._getFieldArray(name), prependValue);
+    const updatedFieldArrayValues = prependAt(control._getFieldArray(name), prependValue);
     control._names.focus = getFocusFieldName(name, 0, options);
-    ids.current = prepend(ids.current, prependValue.map(generateId));
+    ids.current = prependAt(ids.current, prependValue.map(generateId));
     updateValues(updatedFieldArrayValues);
     setFields(updatedFieldArrayValues);
-    control._updateFieldArray(name, updatedFieldArrayValues, prepend, {
+    control._updateFieldArray(name, updatedFieldArrayValues, prependAt, {
       argA: fillEmptyArray(value)
     });
   };
@@ -3728,15 +3781,17 @@ function useFieldArray(props) {
     setFields([...updatedFieldArrayValues]);
     control._updateFieldArray(name, [...updatedFieldArrayValues], (data) => data, {}, true, false);
   };
-  React.useEffect(() => {
-    control._stateFlags.action = false;
-    isWatched(name, control._names) && control._subjects.state.next({});
+  React__default.useEffect(() => {
+    control._state.action = false;
+    isWatched(name, control._names) && control._subjects.state.next({
+      ...control._formState
+    });
     if (_actioned.current && (!getValidationModes(control._options.mode).isOnSubmit || control._formState.isSubmitted)) {
       if (control._options.resolver) {
         control._executeSchema([name]).then((result) => {
           const error2 = get(result.errors, name);
           const existingError = get(control._formState.errors, name);
-          if (existingError ? !error2 && existingError.type : error2 && error2.type) {
+          if (existingError ? !error2 && existingError.type || error2 && (existingError.type !== error2.type || existingError.message !== error2.message) : error2 && error2.type) {
             error2 ? set(control._formState.errors, name, error2) : unset(control._formState.errors, name);
             control._subjects.state.next({
               errors: control._formState.errors
@@ -3745,47 +3800,54 @@ function useFieldArray(props) {
         });
       } else {
         const field = get(control._fields, name);
-        if (field && field._f) {
-          validateField(field, get(control._formValues, name), control._options.criteriaMode === VALIDATION_MODE.all, control._options.shouldUseNativeValidation, true).then((error2) => !isEmptyObject(error2) && control._subjects.state.next({
+        if (field && field._f && !(getValidationModes(control._options.reValidateMode).isOnSubmit && getValidationModes(control._options.mode).isOnSubmit)) {
+          validateField(field, control._formValues, control._options.criteriaMode === VALIDATION_MODE.all, control._options.shouldUseNativeValidation, true).then((error2) => !isEmptyObject(error2) && control._subjects.state.next({
             errors: updateFieldArrayRootError(control._formState.errors, error2, name)
           }));
         }
       }
     }
-    control._subjects.watch.next({
+    control._subjects.values.next({
       name,
-      values: control._formValues
+      values: { ...control._formValues }
+    });
+    control._names.focus && iterateFieldsByAction(control._fields, (ref, key) => {
+      if (control._names.focus && key.startsWith(control._names.focus) && ref.focus) {
+        ref.focus();
+        return 1;
+      }
+      return;
     });
-    control._names.focus && focusFieldBy(control._fields, (key) => !!key && key.startsWith(control._names.focus || ""));
     control._names.focus = "";
-    control._proxyFormState.isValid && control._updateValid();
+    control._updateValid();
+    _actioned.current = false;
   }, [fields, name, control]);
-  React.useEffect(() => {
+  React__default.useEffect(() => {
     !get(control._formValues, name) && control._updateFieldArray(name);
     return () => {
       (control._options.shouldUnregister || shouldUnregister) && control.unregister(name);
     };
   }, [name, control, keyName, shouldUnregister]);
   return {
-    swap: React.useCallback(swap, [updateValues, name, control]),
-    move: React.useCallback(move, [updateValues, name, control]),
-    prepend: React.useCallback(prepend$1, [updateValues, name, control]),
-    append: React.useCallback(append$1, [updateValues, name, control]),
-    remove: React.useCallback(remove2, [updateValues, name, control]),
-    insert: React.useCallback(insert$1, [updateValues, name, control]),
-    update: React.useCallback(update, [updateValues, name, control]),
-    replace: React.useCallback(replace, [updateValues, name, control]),
-    fields: React.useMemo(() => fields.map((field, index) => ({
+    swap: React__default.useCallback(swap, [updateValues, name, control]),
+    move: React__default.useCallback(move, [updateValues, name, control]),
+    prepend: React__default.useCallback(prepend, [updateValues, name, control]),
+    append: React__default.useCallback(append, [updateValues, name, control]),
+    remove: React__default.useCallback(remove2, [updateValues, name, control]),
+    insert: React__default.useCallback(insert$1, [updateValues, name, control]),
+    update: React__default.useCallback(update, [updateValues, name, control]),
+    replace: React__default.useCallback(replace, [updateValues, name, control]),
+    fields: React__default.useMemo(() => fields.map((field, index) => ({
       ...field,
       [keyName]: ids.current[index] || generateId()
     })), [fields, keyName])
   };
 }
-function createSubject() {
+var createSubject = () => {
   let _observers = [];
   const next = (value) => {
     for (const observer of _observers) {
-      observer.next(value);
+      observer.next && observer.next(value);
     }
   };
   const subscribe = (observer) => {
@@ -3807,7 +3869,7 @@ function createSubject() {
     subscribe,
     unsubscribe
   };
-}
+};
 var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
 function deepEqual(object1, object2) {
   if (isPrimitive(object1) || isPrimitive(object2)) {
@@ -3871,7 +3933,7 @@ function getDirtyFieldsFromDefaultValues(data, formValues, dirtyFieldsFromValues
           getDirtyFieldsFromDefaultValues(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
         }
       } else {
-        deepEqual(data[key], formValues[key]) ? delete dirtyFieldsFromValues[key] : dirtyFieldsFromValues[key] = true;
+        dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);
       }
     }
   }
@@ -3959,16 +4021,15 @@ const defaultOptions$1 = {
   reValidateMode: VALIDATION_MODE.onChange,
   shouldFocusError: true
 };
-function createFormControl(props = {}, flushRootRender) {
+function createFormControl(props = {}) {
   let _options = {
     ...defaultOptions$1,
     ...props
   };
-  const shouldCaptureDirtyFields = props.resetOptions && props.resetOptions.keepDirtyValues;
   let _formState = {
     submitCount: 0,
     isDirty: false,
-    isLoading: true,
+    isLoading: isFunction$1(_options.defaultValues),
     isValidating: false,
     isSubmitted: false,
     isSubmitting: false,
@@ -3976,12 +4037,14 @@ function createFormControl(props = {}, flushRootRender) {
     isValid: false,
     touchedFields: {},
     dirtyFields: {},
-    errors: {}
+    validatingFields: {},
+    errors: _options.errors || {},
+    disabled: _options.disabled || false
   };
   let _fields = {};
-  let _defaultValues = isObject$1(_options.defaultValues) ? cloneObject(_options.defaultValues) || {} : {};
+  let _defaultValues = isObject$1(_options.defaultValues) || isObject$1(_options.values) ? cloneObject(_options.defaultValues || _options.values) || {} : {};
   let _formValues = _options.shouldUnregister ? {} : cloneObject(_defaultValues);
-  let _stateFlags = {
+  let _state = {
     action: false,
     mount: false,
     watch: false
@@ -3997,13 +4060,14 @@ function createFormControl(props = {}, flushRootRender) {
   const _proxyFormState = {
     isDirty: false,
     dirtyFields: false,
+    validatingFields: false,
     touchedFields: false,
     isValidating: false,
     isValid: false,
     errors: false
   };
   const _subjects = {
-    watch: createSubject(),
+    values: createSubject(),
     array: createSubject(),
     state: createSubject()
   };
@@ -4012,25 +4076,34 @@ function createFormControl(props = {}, flushRootRender) {
   const shouldDisplayAllAssociatedErrors = _options.criteriaMode === VALIDATION_MODE.all;
   const debounce = (callback) => (wait) => {
     clearTimeout(timer);
-    timer = window.setTimeout(callback, wait);
+    timer = setTimeout(callback, wait);
   };
-  const _updateValid = async () => {
-    if (_proxyFormState.isValid) {
+  const _updateValid = async (shouldUpdateValid) => {
+    if (_proxyFormState.isValid || shouldUpdateValid) {
       const isValid = _options.resolver ? isEmptyObject((await _executeSchema()).errors) : await executeBuiltInValidation(_fields, true);
       if (isValid !== _formState.isValid) {
-        _formState.isValid = isValid;
         _subjects.state.next({
           isValid
         });
       }
     }
   };
-  const _updateIsValidating = (value) => _proxyFormState.isValidating && _subjects.state.next({
-    isValidating: value
-  });
+  const _updateIsValidating = (names, isValidating) => {
+    if (_proxyFormState.isValidating || _proxyFormState.validatingFields) {
+      (names || Array.from(_names.mount)).forEach((name) => {
+        if (name) {
+          isValidating ? set(_formState.validatingFields, name, isValidating) : unset(_formState.validatingFields, name);
+        }
+      });
+      _subjects.state.next({
+        validatingFields: _formState.validatingFields,
+        isValidating: !isEmptyObject(_formState.validatingFields)
+      });
+    }
+  };
   const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
     if (args && method) {
-      _stateFlags.action = true;
+      _state.action = true;
       if (shouldUpdateFieldsAndState && Array.isArray(get(_fields, name))) {
         const fieldValues = method(get(_fields, name), args.argA, args.argB);
         shouldSetValues && set(_fields, name, fieldValues);
@@ -4064,12 +4137,19 @@ function createFormControl(props = {}, flushRootRender) {
       errors: _formState.errors
     });
   };
+  const _setErrors = (errors) => {
+    _formState.errors = errors;
+    _subjects.state.next({
+      errors: _formState.errors,
+      isValid: false
+    });
+  };
   const updateValidAndValue = (name, shouldSkipSetValueAs, value, ref) => {
     const field = get(_fields, name);
     if (field) {
       const defaultValue = get(_formValues, name, isUndefined$2(value) ? get(_defaultValues, name) : value);
       isUndefined$2(defaultValue) || ref && ref.defaultChecked || shouldSkipSetValueAs ? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f)) : setFieldValue(name, defaultValue);
-      _stateFlags.mount && _updateValid();
+      _state.mount && _updateValid();
     }
   };
   const updateTouchAndDirty = (name, fieldValue, isBlurEvent, shouldDirty, shouldRender) => {
@@ -4078,15 +4158,16 @@ function createFormControl(props = {}, flushRootRender) {
     const output2 = {
       name
     };
+    const disabledField = !!(get(_fields, name) && get(_fields, name)._f && get(_fields, name)._f.disabled);
     if (!isBlurEvent || shouldDirty) {
       if (_proxyFormState.isDirty) {
         isPreviousDirty = _formState.isDirty;
         _formState.isDirty = output2.isDirty = _getDirty();
         shouldUpdateField = isPreviousDirty !== output2.isDirty;
       }
-      const isCurrentFieldPristine = deepEqual(get(_defaultValues, name), fieldValue);
-      isPreviousDirty = get(_formState.dirtyFields, name);
-      isCurrentFieldPristine ? unset(_formState.dirtyFields, name) : set(_formState.dirtyFields, name, true);
+      const isCurrentFieldPristine = disabledField || deepEqual(get(_defaultValues, name), fieldValue);
+      isPreviousDirty = !!(!disabledField && get(_formState.dirtyFields, name));
+      isCurrentFieldPristine || disabledField ? unset(_formState.dirtyFields, name) : set(_formState.dirtyFields, name, true);
       output2.dirtyFields = _formState.dirtyFields;
       shouldUpdateField = shouldUpdateField || _proxyFormState.dirtyFields && isPreviousDirty !== !isCurrentFieldPristine;
     }
@@ -4125,11 +4206,15 @@ function createFormControl(props = {}, flushRootRender) {
       };
       _subjects.state.next(updatedFormState);
     }
-    _updateIsValidating(false);
   };
-  const _executeSchema = async (name) => await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
+  const _executeSchema = async (name) => {
+    _updateIsValidating(name, true);
+    const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
+    _updateIsValidating(name);
+    return result;
+  };
   const executeSchemaAndUpdateState = async (names) => {
-    const { errors } = await _executeSchema();
+    const { errors } = await _executeSchema(names);
     if (names) {
       for (const name of names) {
         const error2 = get(errors, name);
@@ -4149,7 +4234,9 @@ function createFormControl(props = {}, flushRootRender) {
         const { _f, ...fieldValue } = field;
         if (_f) {
           const isFieldArrayRoot = _names.array.has(_f.name);
-          const fieldError = await validateField(field, get(_formValues, _f.name), shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation, isFieldArrayRoot);
+          _updateIsValidating([name], true);
+          const fieldError = await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot);
+          _updateIsValidating([name]);
           if (fieldError[_f.name]) {
             context.valid = false;
             if (shouldOnlyCheckValid) {
@@ -4172,9 +4259,9 @@ function createFormControl(props = {}, flushRootRender) {
   };
   const _getDirty = (name, data) => (name && data && set(_formValues, name, data), !deepEqual(getValues(), _defaultValues));
   const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
-    ..._stateFlags.mount ? _formValues : isUndefined$2(defaultValue) ? _defaultValues : isString(names) ? { [names]: defaultValue } : defaultValue
+    ..._state.mount ? _formValues : isUndefined$2(defaultValue) ? _defaultValues : isString(names) ? { [names]: defaultValue } : defaultValue
   }, isGlobal, defaultValue);
-  const _getFieldArray = (name) => compact(get(_stateFlags.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get(_defaultValues, name, []) : []));
+  const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get(_defaultValues, name, []) : []));
   const setFieldValue = (name, value, options = {}) => {
     const field = get(_fields, name);
     let fieldValue = value;
@@ -4196,8 +4283,9 @@ function createFormControl(props = {}, flushRootRender) {
         } else {
           fieldReference.ref.value = fieldValue;
           if (!fieldReference.ref.type) {
-            _subjects.watch.next({
-              name
+            _subjects.values.next({
+              name,
+              values: { ..._formValues }
             });
           }
         }
@@ -4222,30 +4310,34 @@ function createFormControl(props = {}, flushRootRender) {
     if (isFieldArray) {
       _subjects.array.next({
         name,
-        values: _formValues
+        values: { ..._formValues }
       });
       if ((_proxyFormState.isDirty || _proxyFormState.dirtyFields) && options.shouldDirty) {
-        _formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);
         _subjects.state.next({
           name,
-          dirtyFields: _formState.dirtyFields,
+          dirtyFields: getDirtyFields(_defaultValues, _formValues),
           isDirty: _getDirty(name, cloneValue)
         });
       }
     } else {
       field && !field._f && !isNullOrUndefined(cloneValue) ? setValues(name, cloneValue, options) : setFieldValue(name, cloneValue, options);
     }
-    isWatched(name, _names) && _subjects.state.next({});
-    _subjects.watch.next({
-      name
+    isWatched(name, _names) && _subjects.state.next({ ..._formState });
+    _subjects.values.next({
+      name: _state.mount ? name : void 0,
+      values: { ..._formValues }
     });
-    !_stateFlags.mount && flushRootRender();
   };
   const onChange = async (event) => {
+    _state.mount = true;
     const target = event.target;
     let name = target.name;
+    let isFieldValueUpdated = true;
     const field = get(_fields, name);
     const getCurrentFieldValue = () => target.type ? getFieldValue(field._f) : getEventValue(event);
+    const _updateIsFieldValueUpdated = (fieldValue) => {
+      isFieldValueUpdated = Number.isNaN(fieldValue) || fieldValue === get(_formValues, name, fieldValue);
+    };
     if (field) {
       let error2;
       let isValid;
@@ -4262,40 +4354,56 @@ function createFormControl(props = {}, flushRootRender) {
       }
       const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent, false);
       const shouldRender = !isEmptyObject(fieldState) || watched;
-      !isBlurEvent && _subjects.watch.next({
+      !isBlurEvent && _subjects.values.next({
         name,
-        type: event.type
+        type: event.type,
+        values: { ..._formValues }
       });
       if (shouldSkipValidation) {
         _proxyFormState.isValid && _updateValid();
         return shouldRender && _subjects.state.next({ name, ...watched ? {} : fieldState });
       }
-      !isBlurEvent && watched && _subjects.state.next({});
-      _updateIsValidating(true);
+      !isBlurEvent && watched && _subjects.state.next({ ..._formState });
       if (_options.resolver) {
         const { errors } = await _executeSchema([name]);
-        const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
-        const errorLookupResult = schemaErrorLookup(errors, _fields, previousErrorLookupResult.name || name);
-        error2 = errorLookupResult.error;
-        name = errorLookupResult.name;
-        isValid = isEmptyObject(errors);
+        _updateIsFieldValueUpdated(fieldValue);
+        if (isFieldValueUpdated) {
+          const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
+          const errorLookupResult = schemaErrorLookup(errors, _fields, previousErrorLookupResult.name || name);
+          error2 = errorLookupResult.error;
+          name = errorLookupResult.name;
+          isValid = isEmptyObject(errors);
+        }
       } else {
-        error2 = (await validateField(field, get(_formValues, name), shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
-        if (error2) {
-          isValid = false;
-        } else if (_proxyFormState.isValid) {
-          isValid = await executeBuiltInValidation(_fields, true);
+        _updateIsValidating([name], true);
+        error2 = (await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
+        _updateIsValidating([name]);
+        _updateIsFieldValueUpdated(fieldValue);
+        if (isFieldValueUpdated) {
+          if (error2) {
+            isValid = false;
+          } else if (_proxyFormState.isValid) {
+            isValid = await executeBuiltInValidation(_fields, true);
+          }
         }
       }
-      field._f.deps && trigger(field._f.deps);
-      shouldRenderByError(name, isValid, error2, fieldState);
+      if (isFieldValueUpdated) {
+        field._f.deps && trigger(field._f.deps);
+        shouldRenderByError(name, isValid, error2, fieldState);
+      }
+    }
+  };
+  const _focusInput = (ref, key) => {
+    if (get(_formState.errors, key) && ref.focus) {
+      ref.focus();
+      return 1;
     }
+    return;
   };
   const trigger = async (name, options = {}) => {
     let isValid;
     let validationResult;
     const fieldNames = convertToArrayPayload(name);
-    _updateIsValidating(true);
     if (_options.resolver) {
       const errors = await executeSchemaAndUpdateState(isUndefined$2(name) ? name : fieldNames);
       isValid = isEmptyObject(errors);
@@ -4312,34 +4420,36 @@ function createFormControl(props = {}, flushRootRender) {
     _subjects.state.next({
       ...!isString(name) || _proxyFormState.isValid && isValid !== _formState.isValid ? {} : { name },
       ..._options.resolver || !name ? { isValid } : {},
-      errors: _formState.errors,
-      isValidating: false
+      errors: _formState.errors
     });
-    options.shouldFocus && !validationResult && focusFieldBy(_fields, (key) => key && get(_formState.errors, key), name ? fieldNames : _names.mount);
+    options.shouldFocus && !validationResult && iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);
     return validationResult;
   };
   const getValues = (fieldNames) => {
     const values = {
-      ..._defaultValues,
-      ..._stateFlags.mount ? _formValues : {}
+      ..._state.mount ? _formValues : _defaultValues
     };
     return isUndefined$2(fieldNames) ? values : isString(fieldNames) ? get(values, fieldNames) : fieldNames.map((name) => get(values, name));
   };
   const getFieldState = (name, formState) => ({
     invalid: !!get((formState || _formState).errors, name),
     isDirty: !!get((formState || _formState).dirtyFields, name),
-    isTouched: !!get((formState || _formState).touchedFields, name),
-    error: get((formState || _formState).errors, name)
+    error: get((formState || _formState).errors, name),
+    isValidating: !!get(_formState.validatingFields, name),
+    isTouched: !!get((formState || _formState).touchedFields, name)
   });
   const clearErrors = (name) => {
-    name ? convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName)) : _formState.errors = {};
+    name && convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName));
     _subjects.state.next({
-      errors: _formState.errors
+      errors: name ? _formState.errors : {}
     });
   };
   const setError = (name, error2, options) => {
     const ref = (get(_fields, name, { _f: {} })._f || {}).ref;
+    const currentError = get(_formState.errors, name) || {};
+    const { ref: currentRef, message, type, ...restOfErrorTree } = currentError;
     set(_formState.errors, name, {
+      ...restOfErrorTree,
       ...error2,
       ref
     });
@@ -4350,31 +4460,39 @@ function createFormControl(props = {}, flushRootRender) {
     });
     options && options.shouldFocus && ref && ref.focus && ref.focus();
   };
-  const watch = (name, defaultValue) => isFunction$1(name) ? _subjects.watch.subscribe({
+  const watch = (name, defaultValue) => isFunction$1(name) ? _subjects.values.subscribe({
     next: (payload) => name(_getWatch(void 0, defaultValue), payload)
   }) : _getWatch(name, defaultValue, true);
   const unregister = (name, options = {}) => {
     for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) {
       _names.mount.delete(fieldName);
       _names.array.delete(fieldName);
-      if (get(_fields, fieldName)) {
-        if (!options.keepValue) {
-          unset(_fields, fieldName);
-          unset(_formValues, fieldName);
-        }
-        !options.keepError && unset(_formState.errors, fieldName);
-        !options.keepDirty && unset(_formState.dirtyFields, fieldName);
-        !options.keepTouched && unset(_formState.touchedFields, fieldName);
-        !_options.shouldUnregister && !options.keepDefaultValue && unset(_defaultValues, fieldName);
-      }
-    }
-    _subjects.watch.next({});
+      if (!options.keepValue) {
+        unset(_fields, fieldName);
+        unset(_formValues, fieldName);
+      }
+      !options.keepError && unset(_formState.errors, fieldName);
+      !options.keepDirty && unset(_formState.dirtyFields, fieldName);
+      !options.keepTouched && unset(_formState.touchedFields, fieldName);
+      !options.keepIsValidating && unset(_formState.validatingFields, fieldName);
+      !_options.shouldUnregister && !options.keepDefaultValue && unset(_defaultValues, fieldName);
+    }
+    _subjects.values.next({
+      values: { ..._formValues }
+    });
     _subjects.state.next({
       ..._formState,
       ...!options.keepDirty ? {} : { isDirty: _getDirty() }
     });
     !options.keepIsValid && _updateValid();
   };
+  const _updateDisabledField = ({ disabled, name, field, fields, value }) => {
+    if (isBoolean(disabled) && _state.mount || !!disabled) {
+      const inputValue = disabled ? void 0 : isUndefined$2(value) ? getFieldValue(field ? field._f : get(fields, name)._f) : value;
+      set(_formValues, name, inputValue);
+      updateTouchAndDirty(name, inputValue, false, false, true);
+    }
+  };
   const register = (name, options = {}) => {
     let field = get(_fields, name);
     const disabledIsDefined = isBoolean(options.disabled);
@@ -4388,10 +4506,19 @@ function createFormControl(props = {}, flushRootRender) {
       }
     });
     _names.mount.add(name);
-    field ? disabledIsDefined && set(_formValues, name, options.disabled ? void 0 : get(_formValues, name, getFieldValue(field._f))) : updateValidAndValue(name, true, options.value);
+    if (field) {
+      _updateDisabledField({
+        field,
+        disabled: options.disabled,
+        name,
+        value: options.value
+      });
+    } else {
+      updateValidAndValue(name, true, options.value);
+    }
     return {
       ...disabledIsDefined ? { disabled: options.disabled } : {},
-      ..._options.shouldUseNativeValidation ? {
+      ..._options.progressive ? {
         required: !!options.required,
         min: getRuleValue(options.min),
         max: getRuleValue(options.max),
@@ -4431,70 +4558,87 @@ function createFormControl(props = {}, flushRootRender) {
           if (field._f) {
             field._f.mount = false;
           }
-          (_options.shouldUnregister || options.shouldUnregister) && !(isNameInFieldArray(_names.array, name) && _stateFlags.action) && _names.unMount.add(name);
+          (_options.shouldUnregister || options.shouldUnregister) && !(isNameInFieldArray(_names.array, name) && _state.action) && _names.unMount.add(name);
         }
       }
     };
   };
-  const _focusError = () => _options.shouldFocusError && focusFieldBy(_fields, (key) => key && get(_formState.errors, key), _names.mount);
+  const _focusError = () => _options.shouldFocusError && iterateFieldsByAction(_fields, _focusInput, _names.mount);
+  const _disableForm = (disabled) => {
+    if (isBoolean(disabled)) {
+      _subjects.state.next({ disabled });
+      iterateFieldsByAction(_fields, (ref, name) => {
+        const currentField = get(_fields, name);
+        if (currentField) {
+          ref.disabled = currentField._f.disabled || disabled;
+          if (Array.isArray(currentField._f.refs)) {
+            currentField._f.refs.forEach((inputRef) => {
+              inputRef.disabled = currentField._f.disabled || disabled;
+            });
+          }
+        }
+      }, 0, false);
+    }
+  };
   const handleSubmit = (onValid, onInvalid) => async (e2) => {
+    let onValidError = void 0;
     if (e2) {
       e2.preventDefault && e2.preventDefault();
       e2.persist && e2.persist();
     }
-    let hasNoPromiseError = true;
     let fieldValues = cloneObject(_formValues);
     _subjects.state.next({
       isSubmitting: true
     });
-    try {
-      if (_options.resolver) {
-        const { errors, values } = await _executeSchema();
-        _formState.errors = errors;
-        fieldValues = values;
-      } else {
-        await executeBuiltInValidation(_fields);
-      }
-      if (isEmptyObject(_formState.errors)) {
-        _subjects.state.next({
-          errors: {},
-          isSubmitting: true
-        });
-        await onValid(fieldValues, e2);
-      } else {
-        if (onInvalid) {
-          await onInvalid({ ..._formState.errors }, e2);
-        }
-        _focusError();
-      }
-    } catch (err) {
-      hasNoPromiseError = false;
-      throw err;
-    } finally {
-      _formState.isSubmitted = true;
+    if (_options.resolver) {
+      const { errors, values } = await _executeSchema();
+      _formState.errors = errors;
+      fieldValues = values;
+    } else {
+      await executeBuiltInValidation(_fields);
+    }
+    unset(_formState.errors, "root");
+    if (isEmptyObject(_formState.errors)) {
       _subjects.state.next({
-        isSubmitted: true,
-        isSubmitting: false,
-        isSubmitSuccessful: isEmptyObject(_formState.errors) && hasNoPromiseError,
-        submitCount: _formState.submitCount + 1,
-        errors: _formState.errors
+        errors: {}
       });
-    }
-  };
-  const resetField = (name, options = {}) => {
-    if (get(_fields, name)) {
+      try {
+        await onValid(fieldValues, e2);
+      } catch (error2) {
+        onValidError = error2;
+      }
+    } else {
+      if (onInvalid) {
+        await onInvalid({ ..._formState.errors }, e2);
+      }
+      _focusError();
+      setTimeout(_focusError);
+    }
+    _subjects.state.next({
+      isSubmitted: true,
+      isSubmitting: false,
+      isSubmitSuccessful: isEmptyObject(_formState.errors) && !onValidError,
+      submitCount: _formState.submitCount + 1,
+      errors: _formState.errors
+    });
+    if (onValidError) {
+      throw onValidError;
+    }
+  };
+  const resetField = (name, options = {}) => {
+    if (get(_fields, name)) {
       if (isUndefined$2(options.defaultValue)) {
-        setValue(name, get(_defaultValues, name));
+        setValue(name, cloneObject(get(_defaultValues, name)));
       } else {
         setValue(name, options.defaultValue);
-        set(_defaultValues, name, options.defaultValue);
+        set(_defaultValues, name, cloneObject(options.defaultValue));
       }
       if (!options.keepTouched) {
         unset(_formState.touchedFields, name);
       }
       if (!options.keepDirty) {
         unset(_formState.dirtyFields, name);
-        _formState.isDirty = options.defaultValue ? _getDirty(name, get(_defaultValues, name)) : _getDirty();
+        _formState.isDirty = options.defaultValue ? _getDirty(name, cloneObject(get(_defaultValues, name))) : _getDirty();
       }
       if (!options.keepError) {
         unset(_formState.errors, name);
@@ -4504,14 +4648,15 @@ function createFormControl(props = {}, flushRootRender) {
     }
   };
   const _reset = (formValues, keepStateOptions = {}) => {
-    const updatedValues = formValues || _defaultValues;
+    const updatedValues = formValues ? cloneObject(formValues) : _defaultValues;
     const cloneUpdatedValues = cloneObject(updatedValues);
-    const values = formValues && !isEmptyObject(formValues) ? cloneUpdatedValues : _defaultValues;
+    const isEmptyResetValues = isEmptyObject(formValues);
+    const values = isEmptyResetValues ? _defaultValues : cloneUpdatedValues;
     if (!keepStateOptions.keepDefaultValues) {
       _defaultValues = updatedValues;
     }
     if (!keepStateOptions.keepValues) {
-      if (keepStateOptions.keepDirtyValues || shouldCaptureDirtyFields) {
+      if (keepStateOptions.keepDirtyValues) {
         for (const fieldName of _names.mount) {
           get(_formState.dirtyFields, fieldName) ? set(values, fieldName, get(_formValues, fieldName)) : setValue(fieldName, get(values, fieldName));
         }
@@ -4533,34 +4678,33 @@ function createFormControl(props = {}, flushRootRender) {
         }
         _fields = {};
       }
-      _formValues = props.shouldUnregister ? keepStateOptions.keepDefaultValues ? cloneObject(_defaultValues) : {} : cloneUpdatedValues;
+      _formValues = props.shouldUnregister ? keepStateOptions.keepDefaultValues ? cloneObject(_defaultValues) : {} : cloneObject(values);
       _subjects.array.next({
-        values
+        values: { ...values }
       });
-      _subjects.watch.next({
-        values
+      _subjects.values.next({
+        values: { ...values }
       });
     }
     _names = {
-      mount: /* @__PURE__ */ new Set(),
+      mount: keepStateOptions.keepDirtyValues ? _names.mount : /* @__PURE__ */ new Set(),
       unMount: /* @__PURE__ */ new Set(),
       array: /* @__PURE__ */ new Set(),
       watch: /* @__PURE__ */ new Set(),
       watchAll: false,
       focus: ""
     };
-    !_stateFlags.mount && flushRootRender();
-    _stateFlags.mount = !_proxyFormState.isValid || !!keepStateOptions.keepIsValid;
-    _stateFlags.watch = !!props.shouldUnregister;
+    _state.mount = !_proxyFormState.isValid || !!keepStateOptions.keepIsValid || !!keepStateOptions.keepDirtyValues;
+    _state.watch = !!props.shouldUnregister;
     _subjects.state.next({
       submitCount: keepStateOptions.keepSubmitCount ? _formState.submitCount : 0,
-      isDirty: keepStateOptions.keepDirty || keepStateOptions.keepDirtyValues ? _formState.isDirty : !!(keepStateOptions.keepDefaultValues && !deepEqual(formValues, _defaultValues)),
+      isDirty: isEmptyResetValues ? false : keepStateOptions.keepDirty ? _formState.isDirty : !!(keepStateOptions.keepDefaultValues && !deepEqual(formValues, _defaultValues)),
       isSubmitted: keepStateOptions.keepIsSubmitted ? _formState.isSubmitted : false,
-      dirtyFields: keepStateOptions.keepDirty || keepStateOptions.keepDirtyValues ? _formState.dirtyFields : keepStateOptions.keepDefaultValues && formValues ? getDirtyFields(_defaultValues, formValues) : {},
+      dirtyFields: isEmptyResetValues ? {} : keepStateOptions.keepDirtyValues ? keepStateOptions.keepDefaultValues && _formValues ? getDirtyFields(_defaultValues, _formValues) : _formState.dirtyFields : keepStateOptions.keepDefaultValues && formValues ? getDirtyFields(_defaultValues, formValues) : keepStateOptions.keepDirty ? _formState.dirtyFields : {},
       touchedFields: keepStateOptions.keepTouched ? _formState.touchedFields : {},
       errors: keepStateOptions.keepErrors ? _formState.errors : {},
-      isSubmitting: false,
-      isSubmitSuccessful: false
+      isSubmitSuccessful: keepStateOptions.keepIsSubmitSuccessful ? _formState.isSubmitSuccessful : false,
+      isSubmitting: false
     });
   };
   const reset = (formValues, keepStateOptions) => _reset(isFunction$1(formValues) ? formValues(_formValues) : formValues, keepStateOptions);
@@ -4575,41 +4719,51 @@ function createFormControl(props = {}, flushRootRender) {
       }
     }
   };
-  if (isFunction$1(_options.defaultValues)) {
-    _options.defaultValues().then((values) => {
-      reset(values, _options.resetOptions);
-      _subjects.state.next({
-        isLoading: false
-      });
+  const _updateFormState = (updatedFormState) => {
+    _formState = {
+      ..._formState,
+      ...updatedFormState
+    };
+  };
+  const _resetDefaultValues = () => isFunction$1(_options.defaultValues) && _options.defaultValues().then((values) => {
+    reset(values, _options.resetOptions);
+    _subjects.state.next({
+      isLoading: false
     });
-  }
+  });
   return {
     control: {
       register,
       unregister,
       getFieldState,
+      handleSubmit,
+      setError,
       _executeSchema,
-      _focusError,
       _getWatch,
       _getDirty,
       _updateValid,
       _removeUnmounted,
       _updateFieldArray,
+      _updateDisabledField,
       _getFieldArray,
       _reset,
+      _resetDefaultValues,
+      _updateFormState,
+      _disableForm,
       _subjects,
       _proxyFormState,
+      _setErrors,
       get _fields() {
         return _fields;
       },
       get _formValues() {
         return _formValues;
       },
-      get _stateFlags() {
-        return _stateFlags;
+      get _state() {
+        return _state;
       },
-      set _stateFlags(value) {
-        _stateFlags = value;
+      set _state(value) {
+        _state = value;
       },
       get _defaultValues() {
         return _defaultValues;
@@ -4652,11 +4806,12 @@ function createFormControl(props = {}, flushRootRender) {
   };
 }
 function useForm(props = {}) {
-  const _formControl = React.useRef();
-  const [formState, updateFormState] = React.useState({
+  const _formControl = React__default.useRef();
+  const _values = React__default.useRef();
+  const [formState, updateFormState] = React__default.useState({
     isDirty: false,
     isValidating: false,
-    isLoading: true,
+    isLoading: isFunction$1(props.defaultValues),
     isSubmitted: false,
     isSubmitting: false,
     isSubmitSuccessful: false,
@@ -4664,12 +4819,14 @@ function useForm(props = {}) {
     submitCount: 0,
     dirtyFields: {},
     touchedFields: {},
-    errors: {},
+    validatingFields: {},
+    errors: props.errors || {},
+    disabled: props.disabled || false,
     defaultValues: isFunction$1(props.defaultValues) ? void 0 : props.defaultValues
   });
   if (!_formControl.current) {
     _formControl.current = {
-      ...createFormControl(props, () => updateFormState((formState2) => ({ ...formState2 }))),
+      ...createFormControl(props),
       formState
     };
   }
@@ -4678,40 +4835,59 @@ function useForm(props = {}) {
   useSubscribe({
     subject: control._subjects.state,
     next: (value) => {
-      if (shouldRenderFormState(value, control._proxyFormState, true)) {
-        control._formState = {
-          ...control._formState,
-          ...value
-        };
+      if (shouldRenderFormState(value, control._proxyFormState, control._updateFormState, true)) {
         updateFormState({ ...control._formState });
       }
     }
   });
-  React.useEffect(() => {
-    if (!control._stateFlags.mount) {
-      control._proxyFormState.isValid && control._updateValid();
-      control._stateFlags.mount = true;
-    }
-    if (control._stateFlags.watch) {
-      control._stateFlags.watch = false;
-      control._subjects.state.next({});
+  React__default.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
+  React__default.useEffect(() => {
+    if (control._proxyFormState.isDirty) {
+      const isDirty = control._getDirty();
+      if (isDirty !== formState.isDirty) {
+        control._subjects.state.next({
+          isDirty
+        });
+      }
     }
-    control._removeUnmounted();
-  });
-  React.useEffect(() => {
-    if (props.values && !deepEqual(props.values, control._defaultValues)) {
+  }, [control, formState.isDirty]);
+  React__default.useEffect(() => {
+    if (props.values && !deepEqual(props.values, _values.current)) {
       control._reset(props.values, control._options.resetOptions);
+      _values.current = props.values;
+      updateFormState((state) => ({ ...state }));
+    } else {
+      control._resetDefaultValues();
     }
   }, [props.values, control]);
-  React.useEffect(() => {
-    formState.submitCount && control._focusError();
-  }, [control, formState.submitCount]);
+  React__default.useEffect(() => {
+    if (props.errors) {
+      control._setErrors(props.errors);
+    }
+  }, [props.errors, control]);
+  React__default.useEffect(() => {
+    if (!control._state.mount) {
+      control._updateValid();
+      control._state.mount = true;
+    }
+    if (control._state.watch) {
+      control._state.watch = false;
+      control._subjects.state.next({ ...control._formState });
+    }
+    control._removeUnmounted();
+  });
+  React__default.useEffect(() => {
+    props.shouldUnregister && control._subjects.values.next({
+      values: control._getWatch()
+    });
+  }, [props.shouldUnregister, control]);
   _formControl.current.formState = getProxyFormState(formState, control);
   return _formControl.current;
 }
 var index_esm = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   Controller,
+  Form,
   FormProvider,
   appendErrors,
   get,
@@ -4915,11 +5091,11 @@ var root$1 = root;
 var Symbol$1 = root$1.Symbol;
 var Symbol$2 = Symbol$1;
 var objectProto$f = Object.prototype;
-var hasOwnProperty$d = objectProto$f.hasOwnProperty;
+var hasOwnProperty$c = objectProto$f.hasOwnProperty;
 var nativeObjectToString$1 = objectProto$f.toString;
 var symToStringTag$1 = Symbol$2 ? Symbol$2.toStringTag : void 0;
 function getRawTag(value) {
-  var isOwn = hasOwnProperty$d.call(value, symToStringTag$1), tag = value[symToStringTag$1];
+  var isOwn = hasOwnProperty$c.call(value, symToStringTag$1), tag = value[symToStringTag$1];
   try {
     value[symToStringTag$1] = void 0;
     var unmasked = true;
@@ -5043,9 +5219,9 @@ var reRegExpChar = /[\\^$.*+?()[\]{}|]/g;
 var reIsHostCtor = /^\[object .+?Constructor\]$/;
 var funcProto = Function.prototype, objectProto$d = Object.prototype;
 var funcToString = funcProto.toString;
-var hasOwnProperty$c = objectProto$d.hasOwnProperty;
+var hasOwnProperty$b = objectProto$d.hasOwnProperty;
 var reIsNative = RegExp(
-  "^" + funcToString.call(hasOwnProperty$c).replace(reRegExpChar, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$"
+  "^" + funcToString.call(hasOwnProperty$b).replace(reRegExpChar, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$"
 );
 function baseIsNative(value) {
   if (!isObject(value) || isMasked(value)) {
@@ -5130,10 +5306,10 @@ function eq(value, other) {
   return value === other || value !== value && other !== other;
 }
 var objectProto$c = Object.prototype;
-var hasOwnProperty$b = objectProto$c.hasOwnProperty;
+var hasOwnProperty$a = objectProto$c.hasOwnProperty;
 function assignValue(object, key, value) {
   var objValue = object[key];
-  if (!(hasOwnProperty$b.call(object, key) && eq(objValue, value)) || value === void 0 && !(key in object)) {
+  if (!(hasOwnProperty$a.call(object, key) && eq(objValue, value)) || value === void 0 && !(key in object)) {
     baseAssignValue(object, key, value);
   }
 }
@@ -5179,12 +5355,12 @@ function baseIsArguments(value) {
   return isObjectLike(value) && baseGetTag(value) == argsTag$3;
 }
 var objectProto$a = Object.prototype;
-var hasOwnProperty$a = objectProto$a.hasOwnProperty;
+var hasOwnProperty$9 = objectProto$a.hasOwnProperty;
 var propertyIsEnumerable$1 = objectProto$a.propertyIsEnumerable;
 var isArguments = baseIsArguments(function() {
   return arguments;
 }()) ? baseIsArguments : function(value) {
-  return isObjectLike(value) && hasOwnProperty$a.call(value, "callee") && !propertyIsEnumerable$1.call(value, "callee");
+  return isObjectLike(value) && hasOwnProperty$9.call(value, "callee") && !propertyIsEnumerable$1.call(value, "callee");
 };
 var isArguments$1 = isArguments;
 function stubFalse() {
@@ -5229,11 +5405,11 @@ var nodeIsTypedArray = nodeUtil$1 && nodeUtil$1.isTypedArray;
 var isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;
 var isTypedArray$1 = isTypedArray;
 var objectProto$9 = Object.prototype;
-var hasOwnProperty$9 = objectProto$9.hasOwnProperty;
+var hasOwnProperty$8 = objectProto$9.hasOwnProperty;
 function arrayLikeKeys(value, inherited) {
   var isArr = isArray$1(value), isArg = !isArr && isArguments$1(value), isBuff = !isArr && !isArg && isBuffer$1(value), isType = !isArr && !isArg && !isBuff && isTypedArray$1(value), skipIndexes = isArr || isArg || isBuff || isType, result = skipIndexes ? baseTimes(value.length, String) : [], length = result.length;
   for (var key in value) {
-    if ((inherited || hasOwnProperty$9.call(value, key)) && !(skipIndexes && (key == "length" || isBuff && (key == "offset" || key == "parent") || isType && (key == "buffer" || key == "byteLength" || key == "byteOffset") || isIndex(key, length)))) {
+    if ((inherited || hasOwnProperty$8.call(value, key)) && !(skipIndexes && (key == "length" || isBuff && (key == "offset" || key == "parent") || isType && (key == "buffer" || key == "byteLength" || key == "byteOffset") || isIndex(key, length)))) {
       result.push(key);
     }
   }
@@ -5247,14 +5423,14 @@ function overArg(func, transform) {
 var nativeKeys = overArg(Object.keys, Object);
 var nativeKeys$1 = nativeKeys;
 var objectProto$8 = Object.prototype;
-var hasOwnProperty$8 = objectProto$8.hasOwnProperty;
+var hasOwnProperty$7 = objectProto$8.hasOwnProperty;
 function baseKeys(object) {
   if (!isPrototype(object)) {
     return nativeKeys$1(object);
   }
   var result = [];
   for (var key in Object(object)) {
-    if (hasOwnProperty$8.call(object, key) && key != "constructor") {
+    if (hasOwnProperty$7.call(object, key) && key != "constructor") {
       result.push(key);
     }
   }
@@ -5273,14 +5449,14 @@ function nativeKeysIn(object) {
   return result;
 }
 var objectProto$7 = Object.prototype;
-var hasOwnProperty$7 = objectProto$7.hasOwnProperty;
+var hasOwnProperty$6 = objectProto$7.hasOwnProperty;
 function baseKeysIn(object) {
   if (!isObject(object)) {
     return nativeKeysIn(object);
   }
   var isProto = isPrototype(object), result = [];
   for (var key in object) {
-    if (!(key == "constructor" && (isProto || !hasOwnProperty$7.call(object, key)))) {
+    if (!(key == "constructor" && (isProto || !hasOwnProperty$6.call(object, key)))) {
       result.push(key);
     }
   }
@@ -5302,20 +5478,20 @@ function hashDelete(key) {
 }
 var HASH_UNDEFINED$2 = "__lodash_hash_undefined__";
 var objectProto$6 = Object.prototype;
-var hasOwnProperty$6 = objectProto$6.hasOwnProperty;
+var hasOwnProperty$5 = objectProto$6.hasOwnProperty;
 function hashGet(key) {
   var data = this.__data__;
   if (nativeCreate$1) {
     var result = data[key];
     return result === HASH_UNDEFINED$2 ? void 0 : result;
   }
-  return hasOwnProperty$6.call(data, key) ? data[key] : void 0;
+  return hasOwnProperty$5.call(data, key) ? data[key] : void 0;
 }
 var objectProto$5 = Object.prototype;
-var hasOwnProperty$5 = objectProto$5.hasOwnProperty;
+var hasOwnProperty$4 = objectProto$5.hasOwnProperty;
 function hashHas(key) {
   var data = this.__data__;
-  return nativeCreate$1 ? data[key] !== void 0 : hasOwnProperty$5.call(data, key);
+  return nativeCreate$1 ? data[key] !== void 0 : hasOwnProperty$4.call(data, key);
 }
 var HASH_UNDEFINED$1 = "__lodash_hash_undefined__";
 function hashSet(key, value) {
@@ -5595,10 +5771,10 @@ if (DataView$1 && getTag(new DataView$1(new ArrayBuffer(1))) != dataViewTag$3 ||
 }
 var getTag$1 = getTag;
 var objectProto$3 = Object.prototype;
-var hasOwnProperty$4 = objectProto$3.hasOwnProperty;
+var hasOwnProperty$3 = objectProto$3.hasOwnProperty;
 function initCloneArray(array) {
   var length = array.length, result = new array.constructor(length);
-  if (length && typeof array[0] == "string" && hasOwnProperty$4.call(array, "index")) {
+  if (length && typeof array[0] == "string" && hasOwnProperty$3.call(array, "index")) {
     result.index = array.index;
     result.input = array.input;
   }
@@ -5890,7 +6066,7 @@ function equalByTag(object, other, tag, bitmask, customizer, equalFunc, stack) {
 }
 var COMPARE_PARTIAL_FLAG$1 = 1;
 var objectProto$2 = Object.prototype;
-var hasOwnProperty$3 = objectProto$2.hasOwnProperty;
+var hasOwnProperty$2 = objectProto$2.hasOwnProperty;
 function equalObjects(object, other, bitmask, customizer, equalFunc, stack) {
   var isPartial = bitmask & COMPARE_PARTIAL_FLAG$1, objProps = getAllKeys(object), objLength = objProps.length, othProps = getAllKeys(other), othLength = othProps.length;
   if (objLength != othLength && !isPartial) {
@@ -5899,7 +6075,7 @@ function equalObjects(object, other, bitmask, customizer, equalFunc, stack) {
   var index = objLength;
   while (index--) {
     var key = objProps[index];
-    if (!(isPartial ? key in other : hasOwnProperty$3.call(other, key))) {
+    if (!(isPartial ? key in other : hasOwnProperty$2.call(other, key))) {
       return false;
     }
   }
@@ -5937,7 +6113,7 @@ function equalObjects(object, other, bitmask, customizer, equalFunc, stack) {
 var COMPARE_PARTIAL_FLAG = 1;
 var argsTag = "[object Arguments]", arrayTag = "[object Array]", objectTag = "[object Object]";
 var objectProto$1 = Object.prototype;
-var hasOwnProperty$2 = objectProto$1.hasOwnProperty;
+var hasOwnProperty$1 = objectProto$1.hasOwnProperty;
 function baseIsEqualDeep(object, other, bitmask, customizer, equalFunc, stack) {
   var objIsArr = isArray$1(object), othIsArr = isArray$1(other), objTag = objIsArr ? arrayTag : getTag$1(object), othTag = othIsArr ? arrayTag : getTag$1(other);
   objTag = objTag == argsTag ? objectTag : objTag;
@@ -5955,7 +6131,7 @@ function baseIsEqualDeep(object, other, bitmask, customizer, equalFunc, stack) {
     return objIsArr || isTypedArray$1(object) ? equalArrays(object, other, bitmask, customizer, equalFunc, stack) : equalByTag(object, other, objTag, bitmask, customizer, equalFunc, stack);
   }
   if (!(bitmask & COMPARE_PARTIAL_FLAG)) {
-    var objIsWrapped = objIsObj && hasOwnProperty$2.call(object, "__wrapped__"), othIsWrapped = othIsObj && hasOwnProperty$2.call(other, "__wrapped__");
+    var objIsWrapped = objIsObj && hasOwnProperty$1.call(object, "__wrapped__"), othIsWrapped = othIsObj && hasOwnProperty$1.call(other, "__wrapped__");
     if (objIsWrapped || othIsWrapped) {
       var objUnwrapped = objIsWrapped ? object.value() : object, othUnwrapped = othIsWrapped ? other.value() : other;
       stack || (stack = new Stack());
@@ -5994,7 +6170,7 @@ function inRange(number, start, end) {
 }
 var mapTag = "[object Map]", setTag = "[object Set]";
 var objectProto = Object.prototype;
-var hasOwnProperty$1 = objectProto.hasOwnProperty;
+var hasOwnProperty = objectProto.hasOwnProperty;
 function isEmpty(value) {
   if (value == null) {
     return true;
@@ -6010,7 +6186,7 @@ function isEmpty(value) {
     return !baseKeys(value).length;
   }
   for (var key in value) {
-    if (hasOwnProperty$1.call(value, key)) {
+    if (hasOwnProperty.call(value, key)) {
       return false;
     }
   }
@@ -6168,7 +6344,7 @@ const useIsomorphicLayoutEffect = isSSR ? useEffect : useLayoutEffect;
 function create(createState) {
   const api = typeof createState === "function" ? createStore(createState) : createState;
   const useStore2 = (selector = api.getState, equalityFn = Object.is) => {
-    const [, forceUpdate] = useReducer((c) => c + 1, 0);
+    const [, forceUpdate] = useReducer((c2) => c2 + 1, 0);
     const state = api.getState();
     const stateRef = useRef(state);
     const selectorRef = useRef(selector);
@@ -6273,7 +6449,7 @@ const isInputCounterIncrementEnabled = (item, itemActualQty, validationMap) => {
   }
 };
 const isProductQtyCntAllowedToIncrement = (item, itemActualQty) => {
-  const { attrs: { qtyMax } = {} } = item;
+  const { qtyMax } = item;
   return Number(itemActualQty) < Number(qtyMax || Number.MAX_SAFE_INTEGER);
 };
 const checkSelCtxParam = (item, validationMap, param) => {
@@ -6548,12 +6724,25 @@ var EProductKind;
   EProductKind2["STATIC"] = "3e/static";
   EProductKind2["REF"] = "3e/ref";
   EProductKind2["QUERY"] = "3e/query";
+  EProductKind2["CMS"] = "3e/cms";
 })(EProductKind || (EProductKind = {}));
 var EProductKindBucket;
 (function(EProductKindBucket2) {
   EProductKindBucket2["GROUP"] = "group";
   EProductKindBucket2["PRODUCT"] = "product";
 })(EProductKindBucket || (EProductKindBucket = {}));
+var EOrderUserRole;
+(function(EOrderUserRole2) {
+  EOrderUserRole2["CREATOR"] = "CREATOR";
+  EOrderUserRole2["CUSTOMER"] = "CUSTOMER";
+  EOrderUserRole2["COUPONS"] = "COUPON";
+  EOrderUserRole2["KIOSK"] = "KIOSK";
+  EOrderUserRole2["WAITER"] = "WAITER";
+  EOrderUserRole2["MANAGER"] = "MANAGER";
+  EOrderUserRole2["VIEWER"] = "VIEWER";
+  EOrderUserRole2["DRIVER"] = "DRIVER";
+  EOrderUserRole2["STAFF"] = "STAFF";
+})(EOrderUserRole || (EOrderUserRole = {}));
 var EOrderType;
 (function(EOrderType2) {
   EOrderType2["TAKE_AWAY"] = "TAKE_AWAY";
@@ -6567,12 +6756,45 @@ var EOrderType;
   EOrderType2["UBER_DELIVERY"] = "UBER_DELIVERY";
   EOrderType2["UBER_TAKE_AWAY"] = "UBER_TAKE_AWAY";
   EOrderType2["UBER_DINE_IN"] = "UBER_DINE_IN";
-  EOrderType2["BOLT_DELIVERY"] = "BOLT_DELIVERY";
-  EOrderType2["BOLT_TAKE_AWAY"] = "BOLT_TAKE_AWAY";
   EOrderType2["WOLT_DELIVERY"] = "WOLT_DELIVERY";
   EOrderType2["WOLT_TAKE_AWAY"] = "WOLT_TAKE_AWAY";
   EOrderType2["WOLT_DINE_IN"] = "WOLT_DINE_IN";
+  EOrderType2["BOLT_DELIVERY"] = "BOLT_DELIVERY";
+  EOrderType2["BOLT_TAKE_AWAY"] = "BOLT_TAKE_AWAY";
+  EOrderType2["BOLT_DINE_IN"] = "BOLT_DINE_IN";
+  EOrderType2["TAZZ_DELIVERY"] = "TAZZ_DELIVERY";
+  EOrderType2["TAZZ_TAKE_AWAY"] = "TAZZ_TAKE_AWAY";
+  EOrderType2["UPMENU_DELIVERY"] = "UPMENU_DELIVERY";
+  EOrderType2["UPMENU_TAKE_AWAY"] = "UPMENU_TAKE_AWAY";
+  EOrderType2["UPMENU_DINE_IN"] = "UPMENU_DINE_IN";
 })(EOrderType || (EOrderType = {}));
+var EOrderSource;
+(function(EOrderSource2) {
+  EOrderSource2["KIOSK"] = "KIOSK";
+  EOrderSource2["WEB"] = "WEB";
+  EOrderSource2["JUST_EAT_TAKE_AWAY"] = "JUSTEATTAKEAWAY";
+  EOrderSource2["GLOVO"] = "GLOVO";
+  EOrderSource2["PYSZNE"] = "PYSZNE";
+  EOrderSource2["WOLT"] = "WOLT";
+  EOrderSource2["UBER"] = "UBER";
+  EOrderSource2["BOLT"] = "BOLT";
+  EOrderSource2["TAZZ"] = "TAZZ";
+  EOrderSource2["POS"] = "POS";
+  EOrderSource2["UPMENU"] = "UPMENU";
+})(EOrderSource || (EOrderSource = {}));
+var EChannelName;
+(function(EChannelName2) {
+  EChannelName2["DINE_IN"] = "DINE_IN";
+  EChannelName2["TAKE_AWAY"] = "TAKE_AWAY";
+  EChannelName2["DELIVERY"] = "DELIVERY";
+  EChannelName2["GLOVO"] = "GLOVO";
+  EChannelName2["JUSTEAT"] = "JUSTEAT";
+  EChannelName2["UBER"] = "UBER";
+  EChannelName2["BOLT"] = "BOLT";
+  EChannelName2["WOLT"] = "WOLT";
+  EChannelName2["TAZZ"] = "TAZZ";
+  EChannelName2["UPMENU"] = "UPMENU";
+})(EChannelName || (EChannelName = {}));
 var EOrderStatus;
 (function(EOrderStatus2) {
   EOrderStatus2["NEW"] = "NEW";
@@ -6598,17 +6820,14 @@ var EOrderPaymentType;
   EOrderPaymentType2["RETURN"] = "RETURN";
   EOrderPaymentType2["EXTERNAL"] = "EXTERNAL";
 })(EOrderPaymentType || (EOrderPaymentType = {}));
-var EOrderSource;
-(function(EOrderSource2) {
-  EOrderSource2["KIOSK"] = "KIOSK";
-  EOrderSource2["WEB"] = "WEB";
-  EOrderSource2["JUST_EAT_TAKE_AWAY"] = "JUSTEATTAKEAWAY";
-  EOrderSource2["GLOVO"] = "GLOVO";
-  EOrderSource2["PYSZNE"] = "PYSZNE";
-  EOrderSource2["WOLT"] = "WOLT";
-  EOrderSource2["UBER"] = "UBER";
-  EOrderSource2["BOLT"] = "BOLT";
-})(EOrderSource || (EOrderSource = {}));
+var ERbiOrderExtra;
+(function(ERbiOrderExtra2) {
+  ERbiOrderExtra2["POINTS_TOTAL"] = "x-rbi-loyalty-points";
+  ERbiOrderExtra2["POINTS_EARNED"] = "x-rbi-points-earned";
+  ERbiOrderExtra2["REWARDS"] = "x-rbi-rewards";
+  ERbiOrderExtra2["OFFERS"] = "x-rbi-offers";
+  ERbiOrderExtra2["CUSTOMER_NAME"] = "x-customer-name";
+})(ERbiOrderExtra || (ERbiOrderExtra = {}));
 var EOrderLineStatus;
 (function(EOrderLineStatus2) {
   EOrderLineStatus2["NEW"] = "NEW";
@@ -6624,17 +6843,6 @@ var EOrderProductKind;
   EOrderProductKind2["GROUP"] = "group";
   EOrderProductKind2["PRODUCT"] = "product";
 })(EOrderProductKind || (EOrderProductKind = {}));
-var EChannelName;
-(function(EChannelName2) {
-  EChannelName2["DINE_IN"] = "DINE_IN";
-  EChannelName2["TAKE_AWAY"] = "TAKE_AWAY";
-  EChannelName2["DELIVERY"] = "DELIVERY";
-  EChannelName2["GLOVO"] = "GLOVO";
-  EChannelName2["JUSTEAT"] = "JUSTEAT";
-  EChannelName2["UBER"] = "UBER";
-  EChannelName2["BOLT"] = "BOLT";
-  EChannelName2["WOLT"] = "WOLT";
-})(EChannelName || (EChannelName = {}));
 var ENotificationType;
 (function(ENotificationType2) {
   ENotificationType2["ORDER_EVENT_ERROR"] = "OrderEventError";
@@ -6647,6 +6855,7 @@ const validateProductFilter = (product, stateFilter) => {
   const stateFiltersWithFltCtx = stateFilter[fltCtx];
   const hasProductFilters = !!Object.keys(productFilters).length;
   if (hasProductFilters && stateFiltersWithFltCtx) {
+    console.log("12345", productFilters);
     const commonFilters = Object.keys(stateFiltersWithFltCtx).filter(
       (filterName) => Object.keys(productFilters).includes(filterName) && productFilters[filterName].includes(stateFiltersWithFltCtx[filterName])
     );
@@ -6737,75 +6946,8 @@ function useMenuOptions(product, nestedLvl, parentKind, parentSelCtx) {
 }
 var jsxRuntime = { exports: {} };
 var reactJsxRuntime_production_min = {};
-/*
-object-assign
-(c) Sindre Sorhus
-@license MIT
-*/
-var getOwnPropertySymbols = Object.getOwnPropertySymbols;
-var hasOwnProperty = Object.prototype.hasOwnProperty;
-var propIsEnumerable = Object.prototype.propertyIsEnumerable;
-function toObject(val) {
-  if (val === null || val === void 0) {
-    throw new TypeError("Object.assign cannot be called with null or undefined");
-  }
-  return Object(val);
-}
-function shouldUseNative() {
-  try {
-    if (!Object.assign) {
-      return false;
-    }
-    var test1 = new String("abc");
-    test1[5] = "de";
-    if (Object.getOwnPropertyNames(test1)[0] === "5") {
-      return false;
-    }
-    var test2 = {};
-    for (var i2 = 0; i2 < 10; i2++) {
-      test2["_" + String.fromCharCode(i2)] = i2;
-    }
-    var order2 = Object.getOwnPropertyNames(test2).map(function(n2) {
-      return test2[n2];
-    });
-    if (order2.join("") !== "0123456789") {
-      return false;
-    }
-    var test3 = {};
-    "abcdefghijklmnopqrst".split("").forEach(function(letter) {
-      test3[letter] = letter;
-    });
-    if (Object.keys(Object.assign({}, test3)).join("") !== "abcdefghijklmnopqrst") {
-      return false;
-    }
-    return true;
-  } catch (err) {
-    return false;
-  }
-}
-shouldUseNative() ? Object.assign : function(target, source) {
-  var from;
-  var to = toObject(target);
-  var symbols;
-  for (var s2 = 1; s2 < arguments.length; s2++) {
-    from = Object(arguments[s2]);
-    for (var key in from) {
-      if (hasOwnProperty.call(from, key)) {
-        to[key] = from[key];
-      }
-    }
-    if (getOwnPropertySymbols) {
-      symbols = getOwnPropertySymbols(from);
-      for (var i2 = 0; i2 < symbols.length; i2++) {
-        if (propIsEnumerable.call(from, symbols[i2])) {
-          to[symbols[i2]] = from[symbols[i2]];
-        }
-      }
-    }
-  }
-  return to;
-};
-/** @license React v17.0.2
+/**
+ * @license React
  * react-jsx-runtime.production.min.js
  *
  * Copyright (c) Facebook, Inc. and its affiliates.
@@ -6813,28 +6955,22 @@ shouldUseNative() ? Object.assign : function(target, source) {
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var f$3 = React, g = 60103;
-reactJsxRuntime_production_min.Fragment = 60107;
-if ("function" === typeof Symbol && Symbol.for) {
-  var h$3 = Symbol.for;
-  g = h$3("react.element");
-  reactJsxRuntime_production_min.Fragment = h$3("react.fragment");
-}
-var m$3 = f$3.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, n$2 = Object.prototype.hasOwnProperty, p$3 = { key: true, ref: true, __self: true, __source: true };
-function q(c, a2, k2) {
-  var b, d2 = {}, e2 = null, l2 = null;
-  void 0 !== k2 && (e2 = "" + k2);
+var f$5 = React__default, k$1 = Symbol.for("react.element"), l$6 = Symbol.for("react.fragment"), m$3 = Object.prototype.hasOwnProperty, n$4 = f$5.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p$4 = { key: true, ref: true, __self: true, __source: true };
+function q$1(c2, a2, g2) {
+  var b2, d2 = {}, e2 = null, h2 = null;
+  void 0 !== g2 && (e2 = "" + g2);
   void 0 !== a2.key && (e2 = "" + a2.key);
-  void 0 !== a2.ref && (l2 = a2.ref);
-  for (b in a2)
-    n$2.call(a2, b) && !p$3.hasOwnProperty(b) && (d2[b] = a2[b]);
-  if (c && c.defaultProps)
-    for (b in a2 = c.defaultProps, a2)
-      void 0 === d2[b] && (d2[b] = a2[b]);
-  return { $$typeof: g, type: c, key: e2, ref: l2, props: d2, _owner: m$3.current };
-}
-reactJsxRuntime_production_min.jsx = q;
-reactJsxRuntime_production_min.jsxs = q;
+  void 0 !== a2.ref && (h2 = a2.ref);
+  for (b2 in a2)
+    m$3.call(a2, b2) && !p$4.hasOwnProperty(b2) && (d2[b2] = a2[b2]);
+  if (c2 && c2.defaultProps)
+    for (b2 in a2 = c2.defaultProps, a2)
+      void 0 === d2[b2] && (d2[b2] = a2[b2]);
+  return { $$typeof: k$1, type: c2, key: e2, ref: h2, props: d2, _owner: n$4.current };
+}
+reactJsxRuntime_production_min.Fragment = l$6;
+reactJsxRuntime_production_min.jsx = q$1;
+reactJsxRuntime_production_min.jsxs = q$1;
 {
   jsxRuntime.exports = reactJsxRuntime_production_min;
 }
@@ -6943,8 +7079,8 @@ function _nonIterableRest() {
 }
 var Static = {
   normalizePrecision: function normalizePrecision(objects) {
-    var highestPrecision = objects.reduce(function(a2, b) {
-      return Math.max(a2.getPrecision(), b.getPrecision());
+    var highestPrecision = objects.reduce(function(a2, b2) {
+      return Math.max(a2.getPrecision(), b2.getPrecision());
     });
     return objects.map(function(object) {
       return object.getPrecision() !== highestPrecision ? object.convertPrecision(highestPrecision) : object;
@@ -7049,12 +7185,12 @@ function isThenable(value) {
   return Boolean(value) && (_typeof(value) === "object" || typeof value === "function") && typeof value.then === "function";
 }
 function Calculator() {
-  var floatMultiply = function floatMultiply2(a2, b) {
+  var floatMultiply = function floatMultiply2(a2, b2) {
     var getFactor = function getFactor2(number) {
       return Math.pow(10, countFractionDigits(number));
     };
-    var factor = Math.max(getFactor(a2), getFactor(b));
-    return Math.round(a2 * factor) * Math.round(b * factor) / (factor * factor);
+    var factor = Math.max(getFactor(a2), getFactor(b2));
+    return Math.round(a2 * factor) * Math.round(b2 * factor) / (factor * factor);
   };
   var roundingModes = {
     HALF_ODD: function HALF_ODD(number) {
@@ -7082,20 +7218,20 @@ function Calculator() {
     }
   };
   return {
-    add: function add(a2, b) {
-      return a2 + b;
+    add: function add(a2, b2) {
+      return a2 + b2;
     },
-    subtract: function subtract(a2, b) {
-      return a2 - b;
+    subtract: function subtract(a2, b2) {
+      return a2 - b2;
     },
-    multiply: function multiply(a2, b) {
-      return isFloat(a2) || isFloat(b) ? floatMultiply(a2, b) : a2 * b;
+    multiply: function multiply(a2, b2) {
+      return isFloat(a2) || isFloat(b2) ? floatMultiply(a2, b2) : a2 * b2;
     },
-    divide: function divide(a2, b) {
-      return a2 / b;
+    divide: function divide(a2, b2) {
+      return a2 / b2;
     },
-    modulo: function modulo(a2, b) {
-      return a2 % b;
+    modulo: function modulo(a2, b2) {
+      return a2 % b2;
     },
     round: function round(number) {
       var roundingMode = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "HALF_EVEN";
@@ -7277,8 +7413,8 @@ var Dinero = function Dinero2(options) {
     allocate: function allocate(ratios) {
       var _this = this;
       assertValidRatios(ratios);
-      var total = ratios.reduce(function(a2, b) {
-        return calculator$1.add(a2, b);
+      var total = ratios.reduce(function(a2, b2) {
+        return calculator$1.add(a2, b2);
       });
       var remainder = this.getAmount();
       var shares = ratios.map(function(ratio) {
@@ -7382,7 +7518,7 @@ var Dinero = function Dinero2(options) {
       var factor = Math.pow(10, digits);
       return calculator$1.divide(calculator$1.round(calculator$1.multiply(this.toUnit(), factor), roundingMode), factor);
     },
-    toObject: function toObject2() {
+    toObject: function toObject() {
       return {
         amount,
         currency,
@@ -7652,34 +7788,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);
@@ -7894,12 +8030,12 @@ var cookie = {
     var nameEQ = "".concat(name, "=");
     var ca = document.cookie.split(";");
     for (var i2 = 0; i2 < ca.length; i2++) {
-      var c = ca[i2];
-      while (c.charAt(0) === " ") {
-        c = c.substring(1, c.length);
+      var c2 = ca[i2];
+      while (c2.charAt(0) === " ") {
+        c2 = c2.substring(1, c2.length);
       }
-      if (c.indexOf(nameEQ) === 0)
-        return c.substring(nameEQ.length, c.length);
+      if (c2.indexOf(nameEQ) === 0)
+        return c2.substring(nameEQ.length, c2.length);
     }
     return null;
   },
@@ -7912,9 +8048,9 @@ var cookie$1 = {
   lookup: function lookup(options) {
     var found;
     if (options.lookupCookie && typeof document !== "undefined") {
-      var c = cookie.read(options.lookupCookie);
-      if (c)
-        found = c;
+      var c2 = cookie.read(options.lookupCookie);
+      if (c2)
+        found = c2;
     }
     return found;
   },
@@ -8405,7 +8541,7 @@ const MenuOptionsDefaultUI = (props) => {
     })]
   });
 };
-const ComponentsContext = React.createContext(null);
+const ComponentsContext = React__default.createContext(null);
 function useComponents() {
   const context = useContext(ComponentsContext);
   if (!context) {
@@ -8664,6 +8800,9 @@ function useEmitFilter(product) {
   const setFilter = useStore((state) => state.setFilter);
   const { id, selCtx, emit = {}, fltCtx } = product;
   const value = watch(`selected.${selCtx}.${id}`);
+  if (id === "MI1001001") {
+    console.log("use emit filter", value, fltCtx, emit);
+  }
   useEffect(() => {
     if (value && fltCtx && !isEmpty(emit)) {
       setFilter(fltCtx, emit);
@@ -8703,7 +8842,7 @@ const selectUnselectProduct = (setValue, getValues, items, isChecked, state) =>
   if (isChecked) {
     addProductToState(selected, setValue);
     const checkSubProducts = (items2) => {
-      if (!Array.isArray(items2))
+      if (!Array.isArray(items2) || isEmpty(state == null ? void 0 : state.selected))
         return;
       items2.map((product) => {
         if (product.state && "selected" in product.state) {
@@ -9069,11 +9208,14 @@ const DisplayState = () => {
   const {
     watch
   } = useFormContext();
+  const form = useFormContext();
   const selected = watch("selected");
+  const filter = form.getValues("filter");
   const validationMap = useStore((state) => state.validationMap);
   console.log({
     selected,
-    validationMap
+    validationMap,
+    filter
   });
   return /* @__PURE__ */ jsxs("div", {
     className: "flex flex-col items-center py-4",
@@ -9085,7 +9227,7 @@ const DisplayState = () => {
         children: [/* @__PURE__ */ jsxs("p", {
           className: "text-lg font-semibold",
           children: [selCtx, ":"]
-        }), Object.keys(selected[selCtx]).map((id) => /* @__PURE__ */ jsx(React.Fragment, {
+        }), Object.keys(selected[selCtx]).map((id) => /* @__PURE__ */ jsx(React__default.Fragment, {
           children: selected[selCtx][id] && /* @__PURE__ */ jsxs("p", {
             children: [id, ":", selected[selCtx][id].toString()]
           })
@@ -9241,24 +9383,62 @@ function clsx() {
     (e2 = arguments[f2++]) && (t2 = r$4(e2)) && (n2 && (n2 += " "), n2 += t2);
   return n2;
 }
-const e$3 = typeof window == "undefined" || typeof document == "undefined";
-let s$6 = e$3 ? useEffect : useLayoutEffect;
-function s$5(e2) {
+var i$3 = Object.defineProperty;
+var d$5 = (t2, e2, n2) => e2 in t2 ? i$3(t2, e2, { enumerable: true, configurable: true, writable: true, value: n2 }) : t2[e2] = n2;
+var r$3 = (t2, e2, n2) => (d$5(t2, typeof e2 != "symbol" ? e2 + "" : e2, n2), n2);
+class o$5 {
+  constructor() {
+    r$3(this, "current", this.detect());
+    r$3(this, "handoffState", "pending");
+    r$3(this, "currentId", 0);
+  }
+  set(e2) {
+    this.current !== e2 && (this.handoffState = "pending", this.currentId = 0, this.current = e2);
+  }
+  reset() {
+    this.set(this.detect());
+  }
+  nextId() {
+    return ++this.currentId;
+  }
+  get isServer() {
+    return this.current === "server";
+  }
+  get isClient() {
+    return this.current === "client";
+  }
+  detect() {
+    return typeof window == "undefined" || typeof document == "undefined" ? "server" : "client";
+  }
+  handoff() {
+    this.handoffState === "pending" && (this.handoffState = "complete");
+  }
+  get isHandoffComplete() {
+    return this.handoffState === "complete";
+  }
+}
+let s$8 = new o$5();
+let l$5 = (e2, f2) => {
+  s$8.isServer ? useEffect(e2, f2) : useLayoutEffect(e2, f2);
+};
+function s$7(e2) {
   let r2 = useRef(e2);
-  return s$6(() => {
+  return l$5(() => {
     r2.current = e2;
   }, [e2]), r2;
 }
-function t(e2) {
+let o$4 = function(t2) {
+  let e2 = s$7(t2);
+  return React__default.useCallback((...r2) => e2.current(...r2), [e2]);
+};
+function t$6(e2) {
   typeof queueMicrotask == "function" ? queueMicrotask(e2) : Promise.resolve().then(e2).catch((o2) => setTimeout(() => {
     throw o2;
   }));
 }
-function m$2() {
-  let n2 = [], i2 = [], r2 = { enqueue(e2) {
-    i2.push(e2);
-  }, addEventListener(e2, t2, a2, o2) {
-    return e2.addEventListener(t2, a2, o2), r2.add(() => e2.removeEventListener(t2, a2, o2));
+function o$3() {
+  let n2 = [], r2 = { addEventListener(e2, t2, s2, a2) {
+    return e2.addEventListener(t2, s2, a2), r2.add(() => e2.removeEventListener(t2, s2, a2));
   }, requestAnimationFrame(...e2) {
     let t2 = requestAnimationFrame(...e2);
     return r2.add(() => cancelAnimationFrame(t2));
@@ -9268,130 +9448,134 @@ function m$2() {
     let t2 = setTimeout(...e2);
     return r2.add(() => clearTimeout(t2));
   }, microTask(...e2) {
-    let t$1 = { current: true };
-    return t(() => {
-      t$1.current && e2[0]();
+    let t2 = { current: true };
+    return t$6(() => {
+      t2.current && e2[0]();
     }), r2.add(() => {
-      t$1.current = false;
+      t2.current = false;
     });
+  }, style(e2, t2, s2) {
+    let a2 = e2.style.getPropertyValue(t2);
+    return Object.assign(e2.style, { [t2]: s2 }), this.add(() => {
+      Object.assign(e2.style, { [t2]: a2 });
+    });
+  }, group(e2) {
+    let t2 = o$3();
+    return e2(t2), this.add(() => t2.dispose());
   }, add(e2) {
     return n2.push(e2), () => {
       let t2 = n2.indexOf(e2);
-      if (t2 >= 0) {
-        let [a2] = n2.splice(t2, 1);
-        a2();
-      }
+      if (t2 >= 0)
+        for (let s2 of n2.splice(t2, 1))
+          s2();
     };
   }, dispose() {
     for (let e2 of n2.splice(0))
       e2();
-  }, async workQueue() {
-    for (let e2 of i2.splice(0))
-      await e2();
   } };
   return r2;
 }
-function p$2() {
-  let [e2] = useState(m$2);
+function p$3() {
+  let [e2] = useState(o$3);
   return useEffect(() => () => e2.dispose(), [e2]), e2;
 }
-let o$3 = function(t2) {
-  let e2 = s$5(t2);
-  return React.useCallback((...r2) => e2.current(...r2), [e2]);
-};
-let r$3 = { serverHandoffComplete: false };
-function a$2() {
-  let [e2, f2] = useState(r$3.serverHandoffComplete);
-  return useEffect(() => {
-    e2 !== true && f2(true);
-  }, [e2]), useEffect(() => {
-    r$3.serverHandoffComplete === false && (r$3.serverHandoffComplete = true);
-  }, []), e2;
-}
-var u$4;
-let l$3 = 0;
-function r$2() {
-  return ++l$3;
-}
-let I$2 = (u$4 = React.useId) != null ? u$4 : function() {
-  let n2 = a$2(), [e2, o2] = React.useState(n2 ? r$2 : null);
-  return s$6(() => {
-    e2 === null && o2(r$2());
+function s$6() {
+  let r2 = typeof document == "undefined";
+  return "useSyncExternalStore" in React ? ((o2) => o2.useSyncExternalStore)(React)(() => () => {
+  }, () => false, () => !r2) : false;
+}
+function l$4() {
+  let r2 = s$6(), [e2, n2] = React.useState(s$8.isHandoffComplete);
+  return e2 && s$8.isHandoffComplete === false && n2(false), React.useEffect(() => {
+    e2 !== true && n2(true);
+  }, [e2]), React.useEffect(() => s$8.handoff(), []), r2 ? false : e2;
+}
+var o$2;
+let I$5 = (o$2 = React__default.useId) != null ? o$2 : function() {
+  let n2 = l$4(), [e2, u2] = React__default.useState(n2 ? () => s$8.nextId() : null);
+  return l$5(() => {
+    e2 === null && u2(s$8.nextId());
   }, [e2]), e2 != null ? "" + e2 : void 0;
 };
-function u$3(r2, n2, ...a2) {
+function u$5(r2, n2, ...a2) {
   if (r2 in n2) {
     let e2 = n2[r2];
     return typeof e2 == "function" ? e2(...a2) : e2;
   }
   let t2 = new Error(`Tried to handle "${r2}" but there is no handler defined. Only defined handlers are: ${Object.keys(n2).map((e2) => `"${e2}"`).join(", ")}.`);
-  throw Error.captureStackTrace && Error.captureStackTrace(t2, u$3), t2;
+  throw Error.captureStackTrace && Error.captureStackTrace(t2, u$5), t2;
 }
-function e$2(r2) {
-  return e$3 ? null : r2 instanceof Node ? r2.ownerDocument : r2 != null && r2.hasOwnProperty("current") && r2.current instanceof Node ? r2.current.ownerDocument : document;
+function o$1(r2) {
+  return s$8.isServer ? null : r2 instanceof Node ? r2.ownerDocument : r2 != null && r2.hasOwnProperty("current") && r2.current instanceof Node ? r2.current.ownerDocument : document;
 }
-let f$2 = ["[contentEditable=true]", "[tabindex]", "a[href]", "area[href]", "button:not([disabled])", "iframe", "input:not([disabled])", "select:not([disabled])", "textarea:not([disabled])"].map((e2) => `${e2}:not([tabindex='-1'])`).join(",");
-var L$1 = ((n2) => (n2[n2.First = 1] = "First", n2[n2.Previous = 2] = "Previous", n2[n2.Next = 4] = "Next", n2[n2.Last = 8] = "Last", n2[n2.WrapAround = 16] = "WrapAround", n2[n2.NoScroll = 32] = "NoScroll", n2))(L$1 || {}), N = ((o2) => (o2[o2.Error = 0] = "Error", o2[o2.Overflow = 1] = "Overflow", o2[o2.Success = 2] = "Success", o2[o2.Underflow = 3] = "Underflow", o2))(N || {}), T$2 = ((r2) => (r2[r2.Previous = -1] = "Previous", r2[r2.Next = 1] = "Next", r2))(T$2 || {});
-function E$1(e2 = document.body) {
-  return e2 == null ? [] : Array.from(e2.querySelectorAll(f$2)).sort((t2, r2) => Math.sign((t2.tabIndex || Number.MAX_SAFE_INTEGER) - (r2.tabIndex || Number.MAX_SAFE_INTEGER)));
+let c$4 = ["[contentEditable=true]", "[tabindex]", "a[href]", "area[href]", "button:not([disabled])", "iframe", "input:not([disabled])", "select:not([disabled])", "textarea:not([disabled])"].map((e2) => `${e2}:not([tabindex='-1'])`).join(",");
+var M$2 = ((n2) => (n2[n2.First = 1] = "First", n2[n2.Previous = 2] = "Previous", n2[n2.Next = 4] = "Next", n2[n2.Last = 8] = "Last", n2[n2.WrapAround = 16] = "WrapAround", n2[n2.NoScroll = 32] = "NoScroll", n2))(M$2 || {}), N$2 = ((o2) => (o2[o2.Error = 0] = "Error", o2[o2.Overflow = 1] = "Overflow", o2[o2.Success = 2] = "Success", o2[o2.Underflow = 3] = "Underflow", o2))(N$2 || {}), F$2 = ((t2) => (t2[t2.Previous = -1] = "Previous", t2[t2.Next = 1] = "Next", t2))(F$2 || {});
+function f$4(e2 = document.body) {
+  return e2 == null ? [] : Array.from(e2.querySelectorAll(c$4)).sort((r2, t2) => Math.sign((r2.tabIndex || Number.MAX_SAFE_INTEGER) - (t2.tabIndex || Number.MAX_SAFE_INTEGER)));
 }
-var F$4 = ((r2) => (r2[r2.Strict = 0] = "Strict", r2[r2.Loose = 1] = "Loose", r2))(F$4 || {});
-function h$2(e2, t2 = 0) {
-  var r2;
-  return e2 === ((r2 = e$2(e2)) == null ? void 0 : r2.body) ? false : u$3(t2, { [0]() {
-    return e2.matches(f$2);
+var T$1 = ((t2) => (t2[t2.Strict = 0] = "Strict", t2[t2.Loose = 1] = "Loose", t2))(T$1 || {});
+function h$2(e2, r2 = 0) {
+  var t2;
+  return e2 === ((t2 = o$1(e2)) == null ? void 0 : t2.body) ? false : u$5(r2, { [0]() {
+    return e2.matches(c$4);
   }, [1]() {
     let l2 = e2;
     for (; l2 !== null; ) {
-      if (l2.matches(f$2))
+      if (l2.matches(c$4))
         return true;
       l2 = l2.parentElement;
     }
     return false;
   } });
 }
-function S$2(e2) {
+var w$1 = ((t2) => (t2[t2.Keyboard = 0] = "Keyboard", t2[t2.Mouse = 1] = "Mouse", t2))(w$1 || {});
+typeof window != "undefined" && typeof document != "undefined" && (document.addEventListener("keydown", (e2) => {
+  e2.metaKey || e2.altKey || e2.ctrlKey || (document.documentElement.dataset.headlessuiFocusVisible = "");
+}, true), document.addEventListener("click", (e2) => {
+  e2.detail === 1 ? delete document.documentElement.dataset.headlessuiFocusVisible : e2.detail === 0 && (document.documentElement.dataset.headlessuiFocusVisible = "");
+}, true));
+function y$3(e2) {
   e2 == null || e2.focus({ preventScroll: true });
 }
-let H$1 = ["textarea", "input"].join(",");
-function w$1(e2) {
-  var t2, r2;
-  return (r2 = (t2 = e2 == null ? void 0 : e2.matches) == null ? void 0 : t2.call(e2, H$1)) != null ? r2 : false;
+let S$5 = ["textarea", "input"].join(",");
+function H(e2) {
+  var r2, t2;
+  return (t2 = (r2 = e2 == null ? void 0 : e2.matches) == null ? void 0 : r2.call(e2, S$5)) != null ? t2 : false;
 }
-function A$3(e2, t2 = (r2) => r2) {
-  return e2.slice().sort((r2, l2) => {
-    let o2 = t2(r2), i2 = t2(l2);
+function I$4(e2, r2 = (t2) => t2) {
+  return e2.slice().sort((t2, l2) => {
+    let o2 = r2(t2), i2 = r2(l2);
     if (o2 === null || i2 === null)
       return 0;
     let n2 = o2.compareDocumentPosition(i2);
     return n2 & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : n2 & Node.DOCUMENT_POSITION_PRECEDING ? 1 : 0;
   });
 }
-function I$1(e2, t2, { sorted: r2 = true, relativeTo: l2 = null, skipElements: o2 = [] } = {}) {
-  let i2 = Array.isArray(e2) ? e2.length > 0 ? e2[0].ownerDocument : document : e2.ownerDocument, n2 = Array.isArray(e2) ? r2 ? A$3(e2) : e2 : E$1(e2);
-  o2.length > 0 && (n2 = n2.filter((s2) => !o2.includes(s2))), l2 = l2 != null ? l2 : i2.activeElement;
-  let d2 = (() => {
-    if (t2 & 5)
+function O$1(e2, r2, { sorted: t2 = true, relativeTo: l2 = null, skipElements: o2 = [] } = {}) {
+  let i2 = Array.isArray(e2) ? e2.length > 0 ? e2[0].ownerDocument : document : e2.ownerDocument, n2 = Array.isArray(e2) ? t2 ? I$4(e2) : e2 : f$4(e2);
+  o2.length > 0 && n2.length > 1 && (n2 = n2.filter((s2) => !o2.includes(s2))), l2 = l2 != null ? l2 : i2.activeElement;
+  let E2 = (() => {
+    if (r2 & 5)
       return 1;
-    if (t2 & 10)
+    if (r2 & 10)
       return -1;
     throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last");
   })(), x2 = (() => {
-    if (t2 & 1)
+    if (r2 & 1)
       return 0;
-    if (t2 & 2)
+    if (r2 & 2)
       return Math.max(0, n2.indexOf(l2)) - 1;
-    if (t2 & 4)
+    if (r2 & 4)
       return Math.max(0, n2.indexOf(l2)) + 1;
-    if (t2 & 8)
+    if (r2 & 8)
       return n2.length - 1;
     throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last");
-  })(), p2 = t2 & 32 ? { preventScroll: true } : {}, c = 0, a2 = n2.length, u2;
+  })(), p2 = r2 & 32 ? { preventScroll: true } : {}, d2 = 0, a2 = n2.length, u2;
   do {
-    if (c >= a2 || c + a2 <= 0)
+    if (d2 >= a2 || d2 + a2 <= 0)
       return 0;
-    let s2 = x2 + c;
-    if (t2 & 16)
+    let s2 = x2 + d2;
+    if (r2 & 16)
       s2 = (s2 + a2) % a2;
     else {
       if (s2 < 0)
@@ -9399,12 +9583,21 @@ function I$1(e2, t2, { sorted: r2 = true, relativeTo: l2 = null, skipElements: o
       if (s2 >= a2)
         return 1;
     }
-    u2 = n2[s2], u2 == null || u2.focus(p2), c += d2;
+    u2 = n2[s2], u2 == null || u2.focus(p2), d2 += E2;
   } while (u2 !== i2.activeElement);
-  return t2 & 6 && w$1(u2) && u2.select(), u2.hasAttribute("tabindex") || u2.setAttribute("tabindex", "0"), 2;
+  return r2 & 6 && H(u2) && u2.select(), 2;
+}
+function t$5() {
+  return /iPhone/gi.test(window.navigator.platform) || /Mac/gi.test(window.navigator.platform) && window.navigator.maxTouchPoints > 0;
+}
+function i$2() {
+  return /Android/gi.test(window.navigator.userAgent);
 }
-function d$1(e2, r2, n2) {
-  let o2 = s$5(r2);
+function n$3() {
+  return t$5() || i$2();
+}
+function d$4(e2, r2, n2) {
+  let o2 = s$7(r2);
   useEffect(() => {
     function t2(u2) {
       o2.current(u2);
@@ -9412,139 +9605,201 @@ function d$1(e2, r2, n2) {
     return document.addEventListener(e2, t2, n2), () => document.removeEventListener(e2, t2, n2);
   }, [e2, n2]);
 }
-function L(m2, E2, c = true) {
+function s$5(e2, r2, n2) {
+  let o2 = s$7(r2);
+  useEffect(() => {
+    function t2(i2) {
+      o2.current(i2);
+    }
+    return window.addEventListener(e2, t2, n2), () => window.removeEventListener(e2, t2, n2);
+  }, [e2, n2]);
+}
+function y$2(s2, m2, a2 = true) {
   let i2 = useRef(false);
   useEffect(() => {
     requestAnimationFrame(() => {
-      i2.current = c;
+      i2.current = a2;
     });
-  }, [c]);
-  function f2(e2, o2) {
+  }, [a2]);
+  function c2(e2, r2) {
     if (!i2.current || e2.defaultPrevented)
       return;
-    let l2 = function r2(t2) {
-      return typeof t2 == "function" ? r2(t2()) : Array.isArray(t2) || t2 instanceof Set ? t2 : [t2];
-    }(m2), n2 = o2(e2);
-    if (n2 !== null && !!n2.getRootNode().contains(n2)) {
-      for (let r2 of l2) {
-        if (r2 === null)
-          continue;
-        let t2 = r2 instanceof HTMLElement ? r2 : r2.current;
-        if (t2 != null && t2.contains(n2) || e2.composed && e2.composedPath().includes(t2))
-          return;
-      }
-      return !h$2(n2, F$4.Loose) && n2.tabIndex !== -1 && e2.preventDefault(), E2(e2, n2);
+    let t2 = r2(e2);
+    if (t2 === null || !t2.getRootNode().contains(t2) || !t2.isConnected)
+      return;
+    let E2 = function u2(n2) {
+      return typeof n2 == "function" ? u2(n2()) : Array.isArray(n2) || n2 instanceof Set ? n2 : [n2];
+    }(s2);
+    for (let u2 of E2) {
+      if (u2 === null)
+        continue;
+      let n2 = u2 instanceof HTMLElement ? u2 : u2.current;
+      if (n2 != null && n2.contains(t2) || e2.composed && e2.composedPath().includes(n2))
+        return;
     }
+    return !h$2(t2, T$1.Loose) && t2.tabIndex !== -1 && e2.preventDefault(), m2(e2, t2);
   }
-  let u2 = useRef(null);
-  d$1("mousedown", (e2) => {
-    var o2, l2;
-    i2.current && (u2.current = ((l2 = (o2 = e2.composedPath) == null ? void 0 : o2.call(e2)) == null ? void 0 : l2[0]) || e2.target);
-  }, true), d$1("click", (e2) => {
-    !u2.current || (f2(e2, () => u2.current), u2.current = null);
-  }, true), d$1("blur", (e2) => f2(e2, () => window.document.activeElement instanceof HTMLIFrameElement ? window.document.activeElement : null), true);
+  let o2 = useRef(null);
+  d$4("pointerdown", (e2) => {
+    var r2, t2;
+    i2.current && (o2.current = ((t2 = (r2 = e2.composedPath) == null ? void 0 : r2.call(e2)) == null ? void 0 : t2[0]) || e2.target);
+  }, true), d$4("mousedown", (e2) => {
+    var r2, t2;
+    i2.current && (o2.current = ((t2 = (r2 = e2.composedPath) == null ? void 0 : r2.call(e2)) == null ? void 0 : t2[0]) || e2.target);
+  }, true), d$4("click", (e2) => {
+    n$3() || o2.current && (c2(e2, () => o2.current), o2.current = null);
+  }, true), d$4("touchend", (e2) => c2(e2, () => e2.target instanceof HTMLElement ? e2.target : null), true), s$5("blur", (e2) => c2(e2, () => window.document.activeElement instanceof HTMLIFrameElement ? window.document.activeElement : null), true);
 }
-let u$2 = Symbol();
-function T$1(t2, n2 = true) {
-  return Object.assign(t2, { [u$2]: n2 });
+function n$2(...e2) {
+  return useMemo(() => o$1(...e2), [...e2]);
 }
-function y(...t2) {
+let u$4 = Symbol();
+function T(t2, n2 = true) {
+  return Object.assign(t2, { [u$4]: n2 });
+}
+function y$1(...t2) {
   let n2 = useRef(t2);
   useEffect(() => {
     n2.current = t2;
   }, [t2]);
-  let c = o$3((e2) => {
+  let c2 = o$4((e2) => {
     for (let o2 of n2.current)
       o2 != null && (typeof o2 == "function" ? o2(e2) : o2.current = e2);
   });
-  return t2.every((e2) => e2 == null || (e2 == null ? void 0 : e2[u$2])) ? void 0 : c;
-}
-var S$1 = ((a2) => (a2[a2.None = 0] = "None", a2[a2.RenderStrategy = 1] = "RenderStrategy", a2[a2.Static = 2] = "Static", a2))(S$1 || {}), j$1 = ((e2) => (e2[e2.Unmount = 0] = "Unmount", e2[e2.Hidden = 1] = "Hidden", e2))(j$1 || {});
-function $$1({ ourProps: r2, theirProps: t2, slot: e2, defaultTag: a2, features: o2, visible: n2 = true, name: l2 }) {
-  let s2 = T(t2, r2);
-  if (n2)
-    return p$1(s2, e2, a2, l2);
-  let u2 = o2 != null ? o2 : 0;
-  if (u2 & 2) {
-    let { static: i2 = false, ...d2 } = s2;
-    if (i2)
-      return p$1(d2, e2, a2, l2);
-  }
-  if (u2 & 1) {
-    let { unmount: i2 = true, ...d2 } = s2;
-    return u$3(i2 ? 0 : 1, { [0]() {
+  return t2.every((e2) => e2 == null || (e2 == null ? void 0 : e2[u$4])) ? void 0 : c2;
+}
+function m$2(u2, t2) {
+  let e2 = useRef([]), r2 = o$4(u2);
+  useEffect(() => {
+    let o2 = [...e2.current];
+    for (let [n2, a2] of t2.entries())
+      if (e2.current[n2] !== a2) {
+        let l2 = r2(t2, o2);
+        return e2.current = t2, l2;
+      }
+  }, [r2, ...t2]);
+}
+function t$4(...r2) {
+  return Array.from(new Set(r2.flatMap((n2) => typeof n2 == "string" ? n2.split(" ") : []))).filter(Boolean).join(" ");
+}
+var O = ((n2) => (n2[n2.None = 0] = "None", n2[n2.RenderStrategy = 1] = "RenderStrategy", n2[n2.Static = 2] = "Static", n2))(O || {}), v$1 = ((e2) => (e2[e2.Unmount = 0] = "Unmount", e2[e2.Hidden = 1] = "Hidden", e2))(v$1 || {});
+function C({ ourProps: r2, theirProps: t2, slot: e2, defaultTag: n2, features: o2, visible: a2 = true, name: f2, mergeRefs: l2 }) {
+  l2 = l2 != null ? l2 : k;
+  let s2 = R(t2, r2);
+  if (a2)
+    return m$1(s2, e2, n2, f2, l2);
+  let y2 = o2 != null ? o2 : 0;
+  if (y2 & 2) {
+    let { static: u2 = false, ...d2 } = s2;
+    if (u2)
+      return m$1(d2, e2, n2, f2, l2);
+  }
+  if (y2 & 1) {
+    let { unmount: u2 = true, ...d2 } = s2;
+    return u$5(u2 ? 0 : 1, { [0]() {
       return null;
     }, [1]() {
-      return p$1({ ...d2, hidden: true, style: { display: "none" } }, e2, a2, l2);
+      return m$1({ ...d2, hidden: true, style: { display: "none" } }, e2, n2, f2, l2);
     } });
   }
-  return p$1(s2, e2, a2, l2);
+  return m$1(s2, e2, n2, f2, l2);
 }
-function p$1(r2, t2 = {}, e2, a2) {
-  let { as: o2 = e2, children: n2, refName: l2 = "ref", ...s2 } = m$1(r2, ["unmount", "static"]), u2 = r2.ref !== void 0 ? { [l2]: r2.ref } : {}, i2 = typeof n2 == "function" ? n2(t2) : n2;
-  s2.className && typeof s2.className == "function" && (s2.className = s2.className(t2));
+function m$1(r2, t2 = {}, e2, n2, o2) {
+  let { as: a2 = e2, children: f2, refName: l2 = "ref", ...s2 } = F$1(r2, ["unmount", "static"]), y2 = r2.ref !== void 0 ? { [l2]: r2.ref } : {}, u2 = typeof f2 == "function" ? f2(t2) : f2;
+  "className" in s2 && s2.className && typeof s2.className == "function" && (s2.className = s2.className(t2));
   let d2 = {};
   if (t2) {
-    let f2 = false, y2 = [];
-    for (let [h2, g2] of Object.entries(t2))
-      typeof g2 == "boolean" && (f2 = true), g2 === true && y2.push(h2);
-    f2 && (d2["data-headlessui-state"] = y2.join(" "));
-  }
-  if (o2 === Fragment$1 && Object.keys(F$3(s2)).length > 0) {
-    if (!isValidElement(i2) || Array.isArray(i2) && i2.length > 1)
-      throw new Error(['Passing props on "Fragment"!', "", `The current component <${a2} /> is rendering a "Fragment".`, "However we need to passthrough the following props:", Object.keys(s2).map((f2) => `  - ${f2}`).join(`
-`), "", "You can apply a few solutions:", ['Add an `as="..."` prop, to ensure that we render an actual element instead of a "Fragment".', "Render a single element as the child so that we can forward the props onto that element."].map((f2) => `  - ${f2}`).join(`
+    let i2 = false, c2 = [];
+    for (let [T2, p2] of Object.entries(t2))
+      typeof p2 == "boolean" && (i2 = true), p2 === true && c2.push(T2);
+    i2 && (d2["data-headlessui-state"] = c2.join(" "));
+  }
+  if (a2 === Fragment$1 && Object.keys(x$1(s2)).length > 0) {
+    if (!isValidElement(u2) || Array.isArray(u2) && u2.length > 1)
+      throw new Error(['Passing props on "Fragment"!', "", `The current component <${n2} /> is rendering a "Fragment".`, "However we need to passthrough the following props:", Object.keys(s2).map((p2) => `  - ${p2}`).join(`
+`), "", "You can apply a few solutions:", ['Add an `as="..."` prop, to ensure that we render an actual element instead of a "Fragment".', "Render a single element as the child so that we can forward the props onto that element."].map((p2) => `  - ${p2}`).join(`
 `)].join(`
 `));
-    return cloneElement(i2, Object.assign({}, T(i2.props, F$3(m$1(s2, ["ref"]))), d2, u2, w(i2.ref, u2.ref)));
+    let i2 = u2.props, c2 = typeof (i2 == null ? void 0 : i2.className) == "function" ? (...p2) => t$4(i2 == null ? void 0 : i2.className(...p2), s2.className) : t$4(i2 == null ? void 0 : i2.className, s2.className), T2 = c2 ? { className: c2 } : {};
+    return cloneElement(u2, Object.assign({}, R(u2.props, x$1(F$1(s2, ["ref"]))), d2, y2, { ref: o2(u2.ref, y2.ref) }, T2));
   }
-  return createElement(o2, Object.assign({}, m$1(s2, ["ref"]), o2 !== Fragment$1 && u2, o2 !== Fragment$1 && d2), i2);
+  return createElement(a2, Object.assign({}, F$1(s2, ["ref"]), a2 !== Fragment$1 && y2, a2 !== Fragment$1 && d2), u2);
 }
-function w(...r2) {
-  return { ref: r2.every((t2) => t2 == null) ? void 0 : (t2) => {
+function k(...r2) {
+  return r2.every((t2) => t2 == null) ? void 0 : (t2) => {
     for (let e2 of r2)
       e2 != null && (typeof e2 == "function" ? e2(t2) : e2.current = t2);
-  } };
+  };
 }
-function T(...r2) {
+function R(...r2) {
   if (r2.length === 0)
     return {};
   if (r2.length === 1)
     return r2[0];
   let t2 = {}, e2 = {};
   for (let o2 of r2)
-    for (let n2 in o2)
-      n2.startsWith("on") && typeof o2[n2] == "function" ? (e2[n2] != null || (e2[n2] = []), e2[n2].push(o2[n2])) : t2[n2] = o2[n2];
+    for (let a2 in o2)
+      a2.startsWith("on") && typeof o2[a2] == "function" ? (e2[a2] != null || (e2[a2] = []), e2[a2].push(o2[a2])) : t2[a2] = o2[a2];
   if (t2.disabled || t2["aria-disabled"])
     return Object.assign(t2, Object.fromEntries(Object.keys(e2).map((o2) => [o2, void 0])));
   for (let o2 in e2)
-    Object.assign(t2, { [o2](n2, ...l2) {
-      let s2 = e2[o2];
-      for (let u2 of s2) {
-        if ((n2 instanceof Event || (n2 == null ? void 0 : n2.nativeEvent) instanceof Event) && n2.defaultPrevented)
+    Object.assign(t2, { [o2](a2, ...f2) {
+      let l2 = e2[o2];
+      for (let s2 of l2) {
+        if ((a2 instanceof Event || (a2 == null ? void 0 : a2.nativeEvent) instanceof Event) && a2.defaultPrevented)
           return;
-        u2(n2, ...l2);
+        s2(a2, ...f2);
       }
     } });
   return t2;
 }
-function C$1(r2) {
+function U$2(r2) {
   var t2;
   return Object.assign(forwardRef(r2), { displayName: (t2 = r2.displayName) != null ? t2 : r2.name });
 }
-function F$3(r2) {
+function x$1(r2) {
   let t2 = Object.assign({}, r2);
   for (let e2 in t2)
     t2[e2] === void 0 && delete t2[e2];
   return t2;
 }
-function m$1(r2, t2 = []) {
+function F$1(r2, t2 = []) {
   let e2 = Object.assign({}, r2);
-  for (let a2 of t2)
-    a2 in e2 && delete e2[a2];
+  for (let n2 of t2)
+    n2 in e2 && delete e2[n2];
   return e2;
 }
-function r$1(n2) {
+let p$2 = "div";
+var s$4 = ((e2) => (e2[e2.None = 1] = "None", e2[e2.Focusable = 2] = "Focusable", e2[e2.Hidden = 4] = "Hidden", e2))(s$4 || {});
+function l$3(d2, o2) {
+  var n2;
+  let { features: t2 = 1, ...e2 } = d2, r2 = { ref: o2, "aria-hidden": (t2 & 2) === 2 ? true : (n2 = e2["aria-hidden"]) != null ? n2 : void 0, hidden: (t2 & 4) === 4 ? true : void 0, style: { position: "fixed", top: 1, left: 1, width: 1, height: 0, padding: 0, margin: -1, overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", borderWidth: "0", ...(t2 & 4) === 4 && (t2 & 2) !== 2 && { display: "none" } } };
+  return C({ ourProps: r2, theirProps: e2, slot: {}, defaultTag: p$2, name: "Hidden" });
+}
+let u$3 = U$2(l$3);
+let n$1 = createContext(null);
+n$1.displayName = "OpenClosedContext";
+var d$3 = ((e2) => (e2[e2.Open = 1] = "Open", e2[e2.Closed = 2] = "Closed", e2[e2.Closing = 4] = "Closing", e2[e2.Opening = 8] = "Opening", e2))(d$3 || {});
+function u$2() {
+  return useContext(n$1);
+}
+function s$3({ value: o2, children: r2 }) {
+  return React__default.createElement(n$1.Provider, { value: o2 }, r2);
+}
+function t$3(n2) {
+  function e2() {
+    document.readyState !== "loading" && (n2(), document.removeEventListener("DOMContentLoaded", e2));
+  }
+  typeof window != "undefined" && typeof document != "undefined" && (document.addEventListener("DOMContentLoaded", e2), e2());
+}
+let t$2 = [];
+t$3(() => {
+  function e2(n2) {
+    n2.target instanceof HTMLElement && n2.target !== document.body && t$2[0] !== n2.target && (t$2.unshift(n2.target), t$2 = t$2.filter((r2) => r2 != null && r2.isConnected), t$2.splice(10));
+  }
+  window.addEventListener("click", e2, { capture: true }), window.addEventListener("mousedown", e2, { capture: true }), window.addEventListener("focus", e2, { capture: true }), document.body.addEventListener("click", e2, { capture: true }), document.body.addEventListener("mousedown", e2, { capture: true }), document.body.addEventListener("focus", e2, { capture: true });
+});
+function r$2(n2) {
   let e2 = n2.parentElement, l2 = null;
   for (; e2 && !(e2 instanceof HTMLFieldSetElement); )
     e2 instanceof HTMLLegendElement && (l2 = e2), e2 = e2.parentElement;
@@ -9562,60 +9817,9 @@ function i$1(n2) {
   }
   return true;
 }
-let a$1 = "div";
-var s$4 = ((e2) => (e2[e2.None = 1] = "None", e2[e2.Focusable = 2] = "Focusable", e2[e2.Hidden = 4] = "Hidden", e2))(s$4 || {});
-let h$1 = C$1(function(t2, o2) {
-  let { features: e2 = 1, ...r2 } = t2, d2 = { ref: o2, "aria-hidden": (e2 & 2) === 2 ? true : void 0, style: { position: "fixed", top: 1, left: 1, width: 1, height: 0, padding: 0, margin: -1, overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", borderWidth: "0", ...(e2 & 4) === 4 && (e2 & 2) !== 2 && { display: "none" } } };
-  return $$1({ ourProps: d2, theirProps: r2, slot: {}, defaultTag: a$1, name: "Hidden" });
-});
-let o$2 = createContext(null);
-o$2.displayName = "OpenClosedContext";
-var p = ((e2) => (e2[e2.Open = 0] = "Open", e2[e2.Closed = 1] = "Closed", e2))(p || {});
-function s$3() {
-  return useContext(o$2);
-}
-function C({ value: t2, children: n2 }) {
-  return React.createElement(o$2.Provider, { value: t2 }, n2);
-}
-var o$1 = ((r2) => (r2.Space = " ", r2.Enter = "Enter", r2.Escape = "Escape", r2.Backspace = "Backspace", r2.Delete = "Delete", r2.ArrowLeft = "ArrowLeft", r2.ArrowUp = "ArrowUp", r2.ArrowRight = "ArrowRight", r2.ArrowDown = "ArrowDown", r2.Home = "Home", r2.End = "End", r2.PageUp = "PageUp", r2.PageDown = "PageDown", r2.Tab = "Tab", r2))(o$1 || {});
-function m(u2, t2) {
-  let e2 = useRef([]), r2 = o$3(u2);
-  useEffect(() => {
-    let o2 = [...e2.current];
-    for (let [n2, a2] of t2.entries())
-      if (e2.current[n2] !== a2) {
-        let l2 = r2(t2, o2);
-        return e2.current = t2, l2;
-      }
-  }, [r2, ...t2]);
-}
-function s$2(e2, r2, n2) {
-  let o2 = s$5(r2);
-  useEffect(() => {
-    function t2(i2) {
-      o2.current(i2);
-    }
-    return window.addEventListener(e2, t2, n2), () => window.removeEventListener(e2, t2, n2);
-  }, [e2, n2]);
-}
-var s$1 = ((r2) => (r2[r2.Forwards = 0] = "Forwards", r2[r2.Backwards = 1] = "Backwards", r2))(s$1 || {});
-function n$1() {
-  let e2 = useRef(0);
-  return s$2("keydown", (o2) => {
-    o2.key === "Tab" && (e2.current = o2.shiftKey ? 1 : 0);
-  }, true), e2;
-}
-function f$1() {
-  let e2 = useRef(false);
-  return s$6(() => (e2.current = true, () => {
-    e2.current = false;
-  }), []), e2;
-}
-function n(...e2) {
-  return useMemo(() => e$2(...e2), [...e2]);
-}
+var o = ((r2) => (r2.Space = " ", r2.Enter = "Enter", r2.Escape = "Escape", r2.Backspace = "Backspace", r2.Delete = "Delete", r2.ArrowLeft = "ArrowLeft", r2.ArrowUp = "ArrowUp", r2.ArrowRight = "ArrowRight", r2.ArrowDown = "ArrowDown", r2.Home = "Home", r2.End = "End", r2.PageUp = "PageUp", r2.PageDown = "PageDown", r2.Tab = "Tab", r2))(o || {});
 function E(n2, e2, a2, t2) {
-  let i2 = s$5(a2);
+  let i2 = s$7(a2);
   useEffect(() => {
     n2 = n2 != null ? n2 : window;
     function r2(o2) {
@@ -9624,203 +9828,372 @@ function E(n2, e2, a2, t2) {
     return n2.addEventListener(e2, r2, t2), () => n2.removeEventListener(e2, r2, t2);
   }, [n2, e2, t2]);
 }
-let z = "div";
-var A$2 = ((t2) => (t2[t2.None = 1] = "None", t2[t2.InitialFocus = 2] = "InitialFocus", t2[t2.TabLock = 4] = "TabLock", t2[t2.FocusLock = 8] = "FocusLock", t2[t2.RestoreFocus = 16] = "RestoreFocus", t2[t2.All = 30] = "All", t2))(A$2 || {});
-let de = Object.assign(C$1(function(u2, e2) {
-  let l2 = useRef(null), a2 = y(l2, e2), { initialFocus: m2, containers: t2, features: n$22 = 30, ...E2 } = u2;
-  a$2() || (n$22 = 1);
-  let s2 = n(l2);
-  J$1({ ownerDocument: s2 }, Boolean(n$22 & 16));
-  let S2 = Q({ ownerDocument: s2, container: l2, initialFocus: m2 }, Boolean(n$22 & 2));
-  X({ ownerDocument: s2, container: l2, containers: t2, previousActiveElement: S2 }, Boolean(n$22 & 8));
-  let H2 = n$1(), R = o$3((o2) => {
-    let c = l2.current;
-    if (!c)
+function f$3() {
+  let e2 = useRef(false);
+  return l$5(() => (e2.current = true, () => {
+    e2.current = false;
+  }), []), e2;
+}
+function c$3(t2) {
+  let r2 = o$4(t2), e2 = useRef(false);
+  useEffect(() => (e2.current = false, () => {
+    e2.current = true, t$6(() => {
+      e2.current && r2();
+    });
+  }), [r2]);
+}
+var s$2 = ((r2) => (r2[r2.Forwards = 0] = "Forwards", r2[r2.Backwards = 1] = "Backwards", r2))(s$2 || {});
+function n() {
+  let e2 = useRef(0);
+  return s$5("keydown", (o2) => {
+    o2.key === "Tab" && (e2.current = o2.shiftKey ? 1 : 0);
+  }, true), e2;
+}
+function P(t2) {
+  if (!t2)
+    return /* @__PURE__ */ new Set();
+  if (typeof t2 == "function")
+    return new Set(t2());
+  let n2 = /* @__PURE__ */ new Set();
+  for (let e2 of t2.current)
+    e2.current instanceof HTMLElement && n2.add(e2.current);
+  return n2;
+}
+let X = "div";
+var _$1 = ((r2) => (r2[r2.None = 1] = "None", r2[r2.InitialFocus = 2] = "InitialFocus", r2[r2.TabLock = 4] = "TabLock", r2[r2.FocusLock = 8] = "FocusLock", r2[r2.RestoreFocus = 16] = "RestoreFocus", r2[r2.All = 30] = "All", r2))(_$1 || {});
+function z(t2, n$12) {
+  let e2 = useRef(null), o2 = y$1(e2, n$12), { initialFocus: l2, containers: c2, features: r2 = 30, ...s2 } = t2;
+  l$4() || (r2 = 1);
+  let i2 = n$2(e2);
+  Y({ ownerDocument: i2 }, Boolean(r2 & 16));
+  let u2 = Z({ ownerDocument: i2, container: e2, initialFocus: l2 }, Boolean(r2 & 2));
+  $({ ownerDocument: i2, container: e2, containers: c2, previousActiveElement: u2 }, Boolean(r2 & 8));
+  let y2 = n(), R2 = o$4((a2) => {
+    let m2 = e2.current;
+    if (!m2)
       return;
-    ((_24) => _24())(() => {
-      u$3(H2.current, { [s$1.Forwards]: () => I$1(c, L$1.First, { skipElements: [o2.relatedTarget] }), [s$1.Backwards]: () => I$1(c, L$1.Last, { skipElements: [o2.relatedTarget] }) });
+    ((B) => B())(() => {
+      u$5(y2.current, { [s$2.Forwards]: () => {
+        O$1(m2, M$2.First, { skipElements: [a2.relatedTarget] });
+      }, [s$2.Backwards]: () => {
+        O$1(m2, M$2.Last, { skipElements: [a2.relatedTarget] });
+      } });
     });
-  }), B = p$2(), L2 = useRef(false), P2 = { ref: a2, onKeyDown(o2) {
-    o2.key == "Tab" && (L2.current = true, B.requestAnimationFrame(() => {
-      L2.current = false;
+  }), h2 = p$3(), H2 = useRef(false), j2 = { ref: o2, onKeyDown(a2) {
+    a2.key == "Tab" && (H2.current = true, h2.requestAnimationFrame(() => {
+      H2.current = false;
     }));
-  }, onBlur(o2) {
-    let c = new Set(t2 == null ? void 0 : t2.current);
-    c.add(l2);
-    let p2 = o2.relatedTarget;
-    !p2 || p2.dataset.headlessuiFocusGuard !== "true" && (h(c, p2) || (L2.current ? I$1(l2.current, u$3(H2.current, { [s$1.Forwards]: () => L$1.Next, [s$1.Backwards]: () => L$1.Previous }) | L$1.WrapAround, { relativeTo: o2.target }) : o2.target instanceof HTMLElement && S$2(o2.target)));
+  }, onBlur(a2) {
+    let m2 = P(c2);
+    e2.current instanceof HTMLElement && m2.add(e2.current);
+    let T2 = a2.relatedTarget;
+    T2 instanceof HTMLElement && T2.dataset.headlessuiFocusGuard !== "true" && (S$4(m2, T2) || (H2.current ? O$1(e2.current, u$5(y2.current, { [s$2.Forwards]: () => M$2.Next, [s$2.Backwards]: () => M$2.Previous }) | M$2.WrapAround, { relativeTo: a2.target }) : a2.target instanceof HTMLElement && y$3(a2.target)));
   } };
-  return React.createElement(React.Fragment, null, Boolean(n$22 & 4) && React.createElement(h$1, { as: "button", type: "button", "data-headlessui-focus-guard": true, onFocus: R, features: s$4.Focusable }), $$1({ ourProps: P2, theirProps: E2, defaultTag: z, name: "FocusTrap" }), Boolean(n$22 & 4) && React.createElement(h$1, { as: "button", type: "button", "data-headlessui-focus-guard": true, onFocus: R, features: s$4.Focusable }));
-}), { features: A$2 });
-function J$1({ ownerDocument: r2 }, u2) {
-  let e2 = useRef(null);
-  E(r2 == null ? void 0 : r2.defaultView, "focusout", (a2) => {
-    !u2 || e2.current || (e2.current = a2.target);
-  }, true), m(() => {
-    u2 || ((r2 == null ? void 0 : r2.activeElement) === (r2 == null ? void 0 : r2.body) && S$2(e2.current), e2.current = null);
-  }, [u2]);
-  let l2 = useRef(false);
-  useEffect(() => (l2.current = false, () => {
-    l2.current = true, t(() => {
-      !l2.current || (S$2(e2.current), e2.current = null);
-    });
-  }), []);
+  return React__default.createElement(React__default.Fragment, null, Boolean(r2 & 4) && React__default.createElement(u$3, { as: "button", type: "button", "data-headlessui-focus-guard": true, onFocus: R2, features: s$4.Focusable }), C({ ourProps: j2, theirProps: s2, defaultTag: X, name: "FocusTrap" }), Boolean(r2 & 4) && React__default.createElement(u$3, { as: "button", type: "button", "data-headlessui-focus-guard": true, onFocus: R2, features: s$4.Focusable }));
+}
+let D$2 = U$2(z), de = Object.assign(D$2, { features: _$1 });
+function Q(t2 = true) {
+  let n2 = useRef(t$2.slice());
+  return m$2(([e2], [o2]) => {
+    o2 === true && e2 === false && t$6(() => {
+      n2.current.splice(0);
+    }), o2 === false && e2 === true && (n2.current = t$2.slice());
+  }, [t2, t$2, n2]), o$4(() => {
+    var e2;
+    return (e2 = n2.current.find((o2) => o2 != null && o2.isConnected)) != null ? e2 : null;
+  });
 }
-function Q({ ownerDocument: r2, container: u2, initialFocus: e2 }, l2) {
-  let a2 = useRef(null), m$12 = f$1();
-  return m(() => {
-    if (!l2)
+function Y({ ownerDocument: t2 }, n2) {
+  let e2 = Q(n2);
+  m$2(() => {
+    n2 || (t2 == null ? void 0 : t2.activeElement) === (t2 == null ? void 0 : t2.body) && y$3(e2());
+  }, [n2]), c$3(() => {
+    n2 && y$3(e2());
+  });
+}
+function Z({ ownerDocument: t2, container: n2, initialFocus: e2 }, o2) {
+  let l2 = useRef(null), c2 = f$3();
+  return m$2(() => {
+    if (!o2)
       return;
-    let t$1 = u2.current;
-    !t$1 || t(() => {
-      if (!m$12.current)
+    let r2 = n2.current;
+    r2 && t$6(() => {
+      if (!c2.current)
         return;
-      let n2 = r2 == null ? void 0 : r2.activeElement;
+      let s2 = t2 == null ? void 0 : t2.activeElement;
       if (e2 != null && e2.current) {
-        if ((e2 == null ? void 0 : e2.current) === n2) {
-          a2.current = n2;
+        if ((e2 == null ? void 0 : e2.current) === s2) {
+          l2.current = s2;
           return;
         }
-      } else if (t$1.contains(n2)) {
-        a2.current = n2;
+      } else if (r2.contains(s2)) {
+        l2.current = s2;
         return;
       }
-      e2 != null && e2.current ? S$2(e2.current) : I$1(t$1, L$1.First) === N.Error && console.warn("There are no focusable elements inside the <FocusTrap />"), a2.current = r2 == null ? void 0 : r2.activeElement;
+      e2 != null && e2.current ? y$3(e2.current) : O$1(r2, M$2.First) === N$2.Error && console.warn("There are no focusable elements inside the <FocusTrap />"), l2.current = t2 == null ? void 0 : t2.activeElement;
     });
-  }, [l2]), a2;
+  }, [o2]), l2;
 }
-function X({ ownerDocument: r2, container: u2, containers: e2, previousActiveElement: l2 }, a2) {
-  let m2 = f$1();
-  E(r2 == null ? void 0 : r2.defaultView, "focus", (t2) => {
-    if (!a2 || !m2.current)
+function $({ ownerDocument: t2, container: n2, containers: e2, previousActiveElement: o2 }, l2) {
+  let c2 = f$3();
+  E(t2 == null ? void 0 : t2.defaultView, "focus", (r2) => {
+    if (!l2 || !c2.current)
       return;
-    let n2 = new Set(e2 == null ? void 0 : e2.current);
-    n2.add(u2);
-    let E2 = l2.current;
-    if (!E2)
+    let s2 = P(e2);
+    n2.current instanceof HTMLElement && s2.add(n2.current);
+    let i2 = o2.current;
+    if (!i2)
       return;
-    let s2 = t2.target;
-    s2 && s2 instanceof HTMLElement ? h(n2, s2) ? (l2.current = s2, S$2(s2)) : (t2.preventDefault(), t2.stopPropagation(), S$2(E2)) : S$2(l2.current);
+    let u2 = r2.target;
+    u2 && u2 instanceof HTMLElement ? S$4(s2, u2) ? (o2.current = u2, y$3(u2)) : (r2.preventDefault(), r2.stopPropagation(), y$3(i2)) : y$3(o2.current);
   }, true);
 }
-function h(r2, u2) {
-  var e2;
-  for (let l2 of r2)
-    if ((e2 = l2.current) != null && e2.contains(u2))
+function S$4(t2, n2) {
+  for (let e2 of t2)
+    if (e2.contains(n2))
       return true;
   return false;
 }
-let i = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Map();
-function u$1(t2) {
-  t2.setAttribute("aria-hidden", "true"), t2.inert = true;
-}
-function l$2(t2) {
-  let n2 = r.get(t2);
-  !n2 || (n2["aria-hidden"] === null ? t2.removeAttribute("aria-hidden") : t2.setAttribute("aria-hidden", n2["aria-hidden"]), t2.inert = n2.inert);
-}
-function M$3(t2, n2 = true) {
-  s$6(() => {
-    if (!n2 || !t2.current)
-      return;
-    let o2 = t2.current, a2 = e$2(o2);
-    if (!!a2) {
-      i.add(o2);
-      for (let e2 of r.keys())
-        e2.contains(o2) && (l$2(e2), r.delete(e2));
-      return a2.querySelectorAll("body > *").forEach((e2) => {
-        if (e2 instanceof HTMLElement) {
-          for (let f2 of i)
-            if (e2.contains(f2))
-              return;
-          i.size === 1 && (r.set(e2, { "aria-hidden": e2.getAttribute("aria-hidden"), inert: e2.inert }), u$1(e2));
-        }
-      }), () => {
-        if (i.delete(o2), i.size > 0)
-          a2.querySelectorAll("body > *").forEach((e2) => {
-            if (e2 instanceof HTMLElement && !r.has(e2)) {
-              for (let f2 of i)
-                if (e2.contains(f2))
-                  return;
-              r.set(e2, { "aria-hidden": e2.getAttribute("aria-hidden"), inert: e2.inert }), u$1(e2);
-            }
-          });
-        else
-          for (let e2 of r.keys())
-            l$2(e2), r.delete(e2);
-      };
-    }
-  }, [n2]);
-}
-let e$1 = createContext(false);
-function l$1() {
-  return useContext(e$1);
+let e = createContext(false);
+function a$4() {
+  return useContext(e);
 }
-function P$1(o2) {
-  return React.createElement(e$1.Provider, { value: o2.force }, o2.children);
+function l$2(o2) {
+  return React__default.createElement(e.Provider, { value: o2.force }, o2.children);
 }
-function x$1(i2) {
-  let u2 = l$1(), o2 = useContext(A$1), e2 = n(i2), [r2, f2] = useState(() => {
-    if (!u2 && o2 !== null || e$3)
+function F(p2) {
+  let n2 = a$4(), l2 = useContext(_23), e2 = n$2(p2), [a2, o2] = useState(() => {
+    if (!n2 && l2 !== null || s$8.isServer)
       return null;
-    let n2 = e2 == null ? void 0 : e2.getElementById("headlessui-portal-root");
-    if (n2)
-      return n2;
+    let t2 = e2 == null ? void 0 : e2.getElementById("headlessui-portal-root");
+    if (t2)
+      return t2;
     if (e2 === null)
       return null;
-    let t2 = e2.createElement("div");
-    return t2.setAttribute("id", "headlessui-portal-root"), e2.body.appendChild(t2);
+    let r2 = e2.createElement("div");
+    return r2.setAttribute("id", "headlessui-portal-root"), e2.body.appendChild(r2);
   });
   return useEffect(() => {
-    r2 !== null && (e2 != null && e2.body.contains(r2) || e2 == null || e2.body.appendChild(r2));
-  }, [r2, e2]), useEffect(() => {
-    u2 || o2 !== null && f2(o2.current);
-  }, [o2, f2, u2]), r2;
-}
-let _23 = Fragment$1, U = C$1(function(u2, o2) {
-  let e2 = u2, r2 = useRef(null), f2 = y(T$1((a2) => {
-    r2.current = a2;
-  }), o2), n$12 = n(r2), t$1 = x$1(r2), [l2] = useState(() => {
-    var a2;
-    return e$3 ? null : (a2 = n$12 == null ? void 0 : n$12.createElement("div")) != null ? a2 : null;
-  }), b = a$2(), p2 = useRef(false);
-  return s$6(() => {
-    if (p2.current = false, !(!t$1 || !l2))
-      return t$1.contains(l2) || (l2.setAttribute("data-headlessui-portal", ""), t$1.appendChild(l2)), () => {
-        p2.current = true, t(() => {
-          var a2;
-          !p2.current || !t$1 || !l2 || (t$1.removeChild(l2), t$1.childNodes.length <= 0 && ((a2 = t$1.parentElement) == null || a2.removeChild(t$1)));
-        });
-      };
-  }, [t$1, l2]), b ? !t$1 || !l2 ? null : createPortal($$1({ ourProps: { ref: f2 }, theirProps: e2, defaultTag: _23, name: "Portal" }), l2) : null;
-}), j = Fragment$1, A$1 = createContext(null), F$2 = C$1(function(u2, o2) {
-  let { target: e2, ...r2 } = u2, n2 = { ref: y(o2) };
-  return React.createElement(A$1.Provider, { value: e2 }, $$1({ ourProps: n2, theirProps: r2, defaultTag: j, name: "Popover.Group" }));
-}), $ = Object.assign(U, { Group: F$2 });
-let d = createContext(null);
-function u() {
-  let n2 = useContext(d);
-  if (n2 === null) {
-    let t2 = new Error("You used a <Description /> component, but it is not inside a relevant parent.");
-    throw Error.captureStackTrace && Error.captureStackTrace(t2, u), t2;
+    a2 !== null && (e2 != null && e2.body.contains(a2) || e2 == null || e2.body.appendChild(a2));
+  }, [a2, e2]), useEffect(() => {
+    n2 || l2 !== null && o2(l2.current);
+  }, [l2, o2, n2]), a2;
+}
+let U$1 = Fragment$1;
+function N$1(p2, n2) {
+  let l2 = p2, e2 = useRef(null), a2 = y$1(T((u2) => {
+    e2.current = u2;
+  }), n2), o2 = n$2(e2), t2 = F(e2), [r2] = useState(() => {
+    var u2;
+    return s$8.isServer ? null : (u2 = o2 == null ? void 0 : o2.createElement("div")) != null ? u2 : null;
+  }), i2 = useContext(f$2), v2 = l$4();
+  return l$5(() => {
+    !t2 || !r2 || t2.contains(r2) || (r2.setAttribute("data-headlessui-portal", ""), t2.appendChild(r2));
+  }, [t2, r2]), l$5(() => {
+    if (r2 && i2)
+      return i2.register(r2);
+  }, [i2, r2]), c$3(() => {
+    var u2;
+    !t2 || !r2 || (r2 instanceof Node && t2.contains(r2) && t2.removeChild(r2), t2.childNodes.length <= 0 && ((u2 = t2.parentElement) == null || u2.removeChild(t2)));
+  }), v2 ? !t2 || !r2 ? null : createPortal(C({ ourProps: { ref: a2 }, theirProps: l2, defaultTag: U$1, name: "Portal" }), r2) : null;
+}
+let S$3 = Fragment$1, _23 = createContext(null);
+function j(p2, n2) {
+  let { target: l2, ...e2 } = p2, o2 = { ref: y$1(n2) };
+  return React__default.createElement(_23.Provider, { value: l2 }, C({ ourProps: o2, theirProps: e2, defaultTag: S$3, name: "Popover.Group" }));
+}
+let f$2 = createContext(null);
+function ee() {
+  let p2 = useContext(f$2), n2 = useRef([]), l2 = o$4((o2) => (n2.current.push(o2), p2 && p2.register(o2), () => e2(o2))), e2 = o$4((o2) => {
+    let t2 = n2.current.indexOf(o2);
+    t2 !== -1 && n2.current.splice(t2, 1), p2 && p2.unregister(o2);
+  }), a2 = useMemo(() => ({ register: l2, unregister: e2, portals: n2 }), [l2, e2, n2]);
+  return [n2, useMemo(() => function({ children: t2 }) {
+    return React__default.createElement(f$2.Provider, { value: a2 }, t2);
+  }, [a2])];
+}
+let D$1 = U$2(N$1), I$3 = U$2(j), te = Object.assign(D$1, { Group: I$3 });
+function i(e2, t2) {
+  return e2 === t2 && (e2 !== 0 || 1 / e2 === 1 / t2) || e2 !== e2 && t2 !== t2;
+}
+const d$2 = typeof Object.is == "function" ? Object.is : i, { useState: u$1, useEffect: h$1, useLayoutEffect: f$1, useDebugValue: p$1 } = React;
+function y(e2, t2, c2) {
+  const a2 = t2(), [{ inst: n2 }, o2] = u$1({ inst: { value: a2, getSnapshot: t2 } });
+  return f$1(() => {
+    n2.value = a2, n2.getSnapshot = t2, r$1(n2) && o2({ inst: n2 });
+  }, [e2, a2, t2]), h$1(() => (r$1(n2) && o2({ inst: n2 }), e2(() => {
+    r$1(n2) && o2({ inst: n2 });
+  })), [e2]), p$1(a2), a2;
+}
+function r$1(e2) {
+  const t2 = e2.getSnapshot, c2 = e2.value;
+  try {
+    const a2 = t2();
+    return !d$2(c2, a2);
+  } catch {
+    return true;
   }
-  return n2;
 }
-function k$1() {
-  let [n2, t2] = useState([]);
-  return [n2.length > 0 ? n2.join(" ") : void 0, useMemo(() => function(e2) {
-    let i2 = o$3((r2) => (t2((o2) => [...o2, r2]), () => t2((o2) => {
-      let s2 = o2.slice(), p2 = s2.indexOf(r2);
-      return p2 !== -1 && s2.splice(p2, 1), s2;
-    }))), a2 = useMemo(() => ({ register: i2, slot: e2.slot, name: e2.name, props: e2.props }), [i2, e2.slot, e2.name, e2.props]);
-    return React.createElement(d.Provider, { value: a2 }, e2.children);
-  }, [t2])];
+function t$1(r2, e2, n2) {
+  return e2();
 }
-let S = "p", F$1 = C$1(function(t2, c) {
-  let e2 = I$2(), { id: i2 = `headlessui-description-${e2}`, ...a2 } = t2, r2 = u(), o2 = y(c);
-  s$6(() => r2.register(i2), [i2, r2.register]);
-  let s2 = { ref: o2, ...r2.props, id: i2 };
-  return $$1({ ourProps: s2, theirProps: a2, slot: r2.slot || {}, defaultTag: S, name: r2.name || "Description" });
+const r = typeof window != "undefined" && typeof window.document != "undefined" && typeof window.document.createElement != "undefined", s$1 = !r, c$2 = s$1 ? t$1 : y, a$3 = "useSyncExternalStore" in React ? ((n2) => n2.useSyncExternalStore)(React) : c$2;
+function S$2(t2) {
+  return a$3(t2.subscribe, t2.getSnapshot, t2.getSnapshot);
+}
+function a$2(o2, r2) {
+  let t2 = o2(), n2 = /* @__PURE__ */ new Set();
+  return { getSnapshot() {
+    return t2;
+  }, subscribe(e2) {
+    return n2.add(e2), () => n2.delete(e2);
+  }, dispatch(e2, ...s2) {
+    let i2 = r2[e2].call(t2, ...s2);
+    i2 && (t2 = i2, n2.forEach((c2) => c2()));
+  } };
+}
+function c$1() {
+  let o2;
+  return { before({ doc: e2 }) {
+    var l2;
+    let n2 = e2.documentElement;
+    o2 = ((l2 = e2.defaultView) != null ? l2 : window).innerWidth - n2.clientWidth;
+  }, after({ doc: e2, d: n2 }) {
+    let t2 = e2.documentElement, l2 = t2.clientWidth - t2.offsetWidth, r2 = o2 - l2;
+    n2.style(t2, "paddingRight", `${r2}px`);
+  } };
+}
+function d$1() {
+  return t$5() ? { before({ doc: r2, d: l2, meta: c2 }) {
+    function o2(a2) {
+      return c2.containers.flatMap((n2) => n2()).some((n2) => n2.contains(a2));
+    }
+    l2.microTask(() => {
+      var s2;
+      if (window.getComputedStyle(r2.documentElement).scrollBehavior !== "auto") {
+        let t2 = o$3();
+        t2.style(r2.documentElement, "scrollBehavior", "auto"), l2.add(() => l2.microTask(() => t2.dispose()));
+      }
+      let a2 = (s2 = window.scrollY) != null ? s2 : window.pageYOffset, n2 = null;
+      l2.addEventListener(r2, "click", (t2) => {
+        if (t2.target instanceof HTMLElement)
+          try {
+            let e2 = t2.target.closest("a");
+            if (!e2)
+              return;
+            let { hash: f2 } = new URL(e2.href), i2 = r2.querySelector(f2);
+            i2 && !o2(i2) && (n2 = i2);
+          } catch {
+          }
+      }, true), l2.addEventListener(r2, "touchstart", (t2) => {
+        if (t2.target instanceof HTMLElement)
+          if (o2(t2.target)) {
+            let e2 = t2.target;
+            for (; e2.parentElement && o2(e2.parentElement); )
+              e2 = e2.parentElement;
+            l2.style(e2, "overscrollBehavior", "contain");
+          } else
+            l2.style(t2.target, "touchAction", "none");
+      }), l2.addEventListener(r2, "touchmove", (t2) => {
+        if (t2.target instanceof HTMLElement)
+          if (o2(t2.target)) {
+            let e2 = t2.target;
+            for (; e2.parentElement && e2.dataset.headlessuiPortal !== "" && !(e2.scrollHeight > e2.clientHeight || e2.scrollWidth > e2.clientWidth); )
+              e2 = e2.parentElement;
+            e2.dataset.headlessuiPortal === "" && t2.preventDefault();
+          } else
+            t2.preventDefault();
+      }, { passive: false }), l2.add(() => {
+        var e2;
+        let t2 = (e2 = window.scrollY) != null ? e2 : window.pageYOffset;
+        a2 !== t2 && window.scrollTo(0, a2), n2 && n2.isConnected && (n2.scrollIntoView({ block: "nearest" }), n2 = null);
+      });
+    });
+  } } : {};
+}
+function l$1() {
+  return { before({ doc: e2, d: o2 }) {
+    o2.style(e2.documentElement, "overflow", "hidden");
+  } };
+}
+function m(e2) {
+  let n2 = {};
+  for (let t2 of e2)
+    Object.assign(n2, t2(n2));
+  return n2;
+}
+let a$1 = a$2(() => /* @__PURE__ */ new Map(), { PUSH(e2, n2) {
+  var o2;
+  let t2 = (o2 = this.get(e2)) != null ? o2 : { doc: e2, count: 0, d: o$3(), meta: /* @__PURE__ */ new Set() };
+  return t2.count++, t2.meta.add(n2), this.set(e2, t2), this;
+}, POP(e2, n2) {
+  let t2 = this.get(e2);
+  return t2 && (t2.count--, t2.meta.delete(n2)), this;
+}, SCROLL_PREVENT({ doc: e2, d: n2, meta: t2 }) {
+  let o2 = { doc: e2, d: n2, meta: m(t2) }, c2 = [d$1(), c$1(), l$1()];
+  c2.forEach(({ before: r2 }) => r2 == null ? void 0 : r2(o2)), c2.forEach(({ after: r2 }) => r2 == null ? void 0 : r2(o2));
+}, SCROLL_ALLOW({ d: e2 }) {
+  e2.dispose();
+}, TEARDOWN({ doc: e2 }) {
+  this.delete(e2);
+} });
+a$1.subscribe(() => {
+  let e2 = a$1.getSnapshot(), n2 = /* @__PURE__ */ new Map();
+  for (let [t2] of e2)
+    n2.set(t2, t2.documentElement.style.overflow);
+  for (let t2 of e2.values()) {
+    let o2 = n2.get(t2.doc) === "hidden", c2 = t2.count !== 0;
+    (c2 && !o2 || !c2 && o2) && a$1.dispatch(t2.count > 0 ? "SCROLL_PREVENT" : "SCROLL_ALLOW", t2), t2.count === 0 && a$1.dispatch("TEARDOWN", t2);
+  }
 });
+function p(e2, r2, n2) {
+  let f2 = S$2(a$1), o2 = e2 ? f2.get(e2) : void 0, i2 = o2 ? o2.count > 0 : false;
+  return l$5(() => {
+    if (!(!e2 || !r2))
+      return a$1.dispatch("PUSH", e2, n2), () => a$1.dispatch("POP", e2, n2);
+  }, [r2, e2]), i2;
+}
+let u = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Map();
+function b$3(r2, l2 = true) {
+  l$5(() => {
+    var o2;
+    if (!l2)
+      return;
+    let e2 = typeof r2 == "function" ? r2() : r2.current;
+    if (!e2)
+      return;
+    function a2() {
+      var d2;
+      if (!e2)
+        return;
+      let i2 = (d2 = t.get(e2)) != null ? d2 : 1;
+      if (i2 === 1 ? t.delete(e2) : t.set(e2, i2 - 1), i2 !== 1)
+        return;
+      let n2 = u.get(e2);
+      n2 && (n2["aria-hidden"] === null ? e2.removeAttribute("aria-hidden") : e2.setAttribute("aria-hidden", n2["aria-hidden"]), e2.inert = n2.inert, u.delete(e2));
+    }
+    let f2 = (o2 = t.get(e2)) != null ? o2 : 0;
+    return t.set(e2, f2 + 1), f2 !== 0 || (u.set(e2, { "aria-hidden": e2.getAttribute("aria-hidden"), inert: e2.inert }), e2.setAttribute("aria-hidden", "true"), e2.inert = true), a2;
+  }, [r2, l2]);
+}
+function N({ defaultContainers: o2 = [], portals: r2, mainTreeNodeRef: u2 } = {}) {
+  var f2;
+  let t2 = useRef((f2 = u2 == null ? void 0 : u2.current) != null ? f2 : null), l2 = n$2(t2), c2 = o$4(() => {
+    var i2, s2, a2;
+    let n2 = [];
+    for (let e2 of o2)
+      e2 !== null && (e2 instanceof HTMLElement ? n2.push(e2) : "current" in e2 && e2.current instanceof HTMLElement && n2.push(e2.current));
+    if (r2 != null && r2.current)
+      for (let e2 of r2.current)
+        n2.push(e2);
+    for (let e2 of (i2 = l2 == null ? void 0 : l2.querySelectorAll("html > *, body > *")) != null ? i2 : [])
+      e2 !== document.body && e2 !== document.head && e2 instanceof HTMLElement && e2.id !== "headlessui-portal-root" && (e2.contains(t2.current) || e2.contains((a2 = (s2 = t2.current) == null ? void 0 : s2.getRootNode()) == null ? void 0 : a2.host) || n2.some((L) => e2.contains(L)) || n2.push(e2));
+    return n2;
+  });
+  return { resolveContainers: c2, contains: o$4((n2) => c2().some((i2) => i2.contains(n2))), mainTreeNodeRef: t2, MainTreeNode: useMemo(() => function() {
+    return u2 != null ? null : React__default.createElement(u$3, { features: s$4.Hidden, ref: t2 });
+  }, [t2, u2]) };
+}
 let a = createContext(() => {
 });
 a.displayName = "StackContext";
@@ -9828,142 +10201,169 @@ var s = ((e2) => (e2[e2.Add = 0] = "Add", e2[e2.Remove = 1] = "Remove", e2))(s |
 function x() {
   return useContext(a);
 }
-function M$2({ children: i2, onUpdate: r2, type: e2, element: n2, enabled: u2 }) {
-  let l2 = x(), o2 = o$3((...t2) => {
+function b$2({ children: i2, onUpdate: r2, type: e2, element: n2, enabled: u2 }) {
+  let l2 = x(), o2 = o$4((...t2) => {
     r2 == null || r2(...t2), l2(...t2);
   });
-  return s$6(() => {
+  return l$5(() => {
     let t2 = u2 === void 0 || u2 === true;
     return t2 && o2(0, e2, n2), () => {
       t2 && o2(1, e2, n2);
     };
-  }, [o2, e2, n2, u2]), React.createElement(a.Provider, { value: o2 }, i2);
+  }, [o2, e2, n2, u2]), React__default.createElement(a.Provider, { value: o2 }, i2);
 }
-function o() {
-  return /iPhone/gi.test(window.navigator.platform) || /Mac/gi.test(window.navigator.platform) && window.navigator.maxTouchPoints > 0;
+let d = createContext(null);
+function f() {
+  let r2 = useContext(d);
+  if (r2 === null) {
+    let t2 = new Error("You used a <Description /> component, but it is not inside a relevant parent.");
+    throw Error.captureStackTrace && Error.captureStackTrace(t2, f), t2;
+  }
+  return r2;
+}
+function w() {
+  let [r2, t2] = useState([]);
+  return [r2.length > 0 ? r2.join(" ") : void 0, useMemo(() => function(e2) {
+    let i2 = o$4((s2) => (t2((o2) => [...o2, s2]), () => t2((o2) => {
+      let p2 = o2.slice(), c2 = p2.indexOf(s2);
+      return c2 !== -1 && p2.splice(c2, 1), p2;
+    }))), n2 = useMemo(() => ({ register: i2, slot: e2.slot, name: e2.name, props: e2.props }), [i2, e2.slot, e2.name, e2.props]);
+    return React__default.createElement(d.Provider, { value: n2 }, e2.children);
+  }, [t2])];
 }
-var be$1 = ((r2) => (r2[r2.Open = 0] = "Open", r2[r2.Closed = 1] = "Closed", r2))(be$1 || {}), ve = ((e2) => (e2[e2.SetTitleId = 0] = "SetTitleId", e2))(ve || {});
-let Ae = { [0](t2, e2) {
-  return t2.titleId === e2.id ? t2 : { ...t2, titleId: e2.id };
-} }, H = createContext(null);
-H.displayName = "DialogContext";
-function k(t2) {
-  let e2 = useContext(H);
+let I$2 = "p";
+function S$1(r2, t2) {
+  let a2 = I$5(), { id: e2 = `headlessui-description-${a2}`, ...i2 } = r2, n2 = f(), s2 = y$1(t2);
+  l$5(() => n2.register(e2), [e2, n2.register]);
+  let o2 = { ref: s2, ...n2.props, id: e2 };
+  return C({ ourProps: o2, theirProps: i2, slot: n2.slot || {}, defaultTag: I$2, name: n2.name || "Description" });
+}
+let h = U$2(S$1), G = Object.assign(h, {});
+var Me = ((r2) => (r2[r2.Open = 0] = "Open", r2[r2.Closed = 1] = "Closed", r2))(Me || {}), we = ((e2) => (e2[e2.SetTitleId = 0] = "SetTitleId", e2))(we || {});
+let He$1 = { [0](o2, e2) {
+  return o2.titleId === e2.id ? o2 : { ...o2, titleId: e2.id };
+} }, I$1 = createContext(null);
+I$1.displayName = "DialogContext";
+function b$1(o2) {
+  let e2 = useContext(I$1);
   if (e2 === null) {
-    let r2 = new Error(`<${t2} /> is missing a parent <Dialog /> component.`);
-    throw Error.captureStackTrace && Error.captureStackTrace(r2, k), r2;
+    let r2 = new Error(`<${o2} /> is missing a parent <Dialog /> component.`);
+    throw Error.captureStackTrace && Error.captureStackTrace(r2, b$1), r2;
   }
   return e2;
 }
-function Oe(t2, e2, r2 = () => [document.body]) {
-  useEffect(() => {
-    var c;
-    if (!e2 || !t2)
-      return;
-    let s2 = m$2(), d2 = window.pageYOffset;
-    function a2(n2, i2, l2) {
-      let P2 = n2.style.getPropertyValue(i2);
-      return Object.assign(n2.style, { [i2]: l2 }), s2.add(() => {
-        Object.assign(n2.style, { [i2]: P2 });
-      });
-    }
-    let o$12 = t2.documentElement, f2 = ((c = t2.defaultView) != null ? c : window).innerWidth - o$12.clientWidth;
-    if (a2(o$12, "overflow", "hidden"), f2 > 0) {
-      let n2 = o$12.clientWidth - o$12.offsetWidth, i2 = f2 - n2;
-      a2(o$12, "paddingRight", `${i2}px`);
-    }
-    if (o()) {
-      a2(t2.body, "marginTop", `-${d2}px`), window.scrollTo(0, 0);
-      let n2 = null;
-      s2.addEventListener(t2, "click", (i2) => {
-        if (i2.target instanceof HTMLElement)
-          try {
-            let l2 = i2.target.closest("a");
-            if (!l2)
-              return;
-            let { hash: P2 } = new URL(l2.href), u2 = t2.querySelector(P2);
-            u2 && !r2().some((_24) => _24.contains(u2)) && (n2 = u2);
-          } catch {
-          }
-      }, true), s2.addEventListener(t2, "touchmove", (i2) => {
-        i2.target instanceof HTMLElement && !r2().some((l2) => l2.contains(i2.target)) && i2.preventDefault();
-      }, { passive: false }), s2.add(() => {
-        window.scrollTo(0, window.pageYOffset + d2), n2 && n2.isConnected && (n2.scrollIntoView({ block: "nearest" }), n2 = null);
-      });
-    }
-    return s2.dispose;
-  }, [t2, e2]);
-}
-function Ce$1(t2, e2) {
-  return u$3(e2.type, Ae, t2, e2);
+function Be(o2, e2, r2 = () => [document.body]) {
+  p(o2, e2, (i2) => {
+    var n2;
+    return { containers: [...(n2 = i2.containers) != null ? n2 : [], r2] };
+  });
 }
-let Se$1 = "div", Le = S$1.RenderStrategy | S$1.Static, Me = C$1(function(e2, r2) {
-  let s$12 = I$2(), { id: d2 = `headlessui-dialog-${s$12}`, open: a2, onClose: o2, initialFocus: p$12, __demoMode: f2 = false, ...c } = e2, [n$12, i2] = useState(0), l2 = s$3();
-  a2 === void 0 && l2 !== null && (a2 = u$3(l2, { [p.Open]: true, [p.Closed]: false }));
-  let P2 = useRef(/* @__PURE__ */ new Set()), u2 = useRef(null), _24 = y(u2, r2), U2 = useRef(null), y$1 = n(u2), $$2 = e2.hasOwnProperty("open") || l2 !== null, Y = e2.hasOwnProperty("onClose");
-  if (!$$2 && !Y)
+function Ge(o2, e2) {
+  return u$5(e2.type, He$1, o2, e2);
+}
+let Ne$1 = "div", Ue = O.RenderStrategy | O.Static;
+function We(o$12, e2) {
+  let r2 = I$5(), { id: i2 = `headlessui-dialog-${r2}`, open: n2, onClose: l2, initialFocus: s$12, role: a2 = "dialog", __demoMode: T2 = false, ...m2 } = o$12, [M2, f2] = useState(0), U2 = useRef(false);
+  a2 = function() {
+    return a2 === "dialog" || a2 === "alertdialog" ? a2 : (U2.current || (U2.current = true, console.warn(`Invalid role [${a2}] passed to <Dialog />. Only \`dialog\` and and \`alertdialog\` are supported. Using \`dialog\` instead.`)), "dialog");
+  }();
+  let E$1 = u$2();
+  n2 === void 0 && E$1 !== null && (n2 = (E$1 & d$3.Open) === d$3.Open);
+  let D2 = useRef(null), ee$1 = y$1(D2, e2), g2 = n$2(D2), W = o$12.hasOwnProperty("open") || E$1 !== null, $2 = o$12.hasOwnProperty("onClose");
+  if (!W && !$2)
     throw new Error("You have to provide an `open` and an `onClose` prop to the `Dialog` component.");
-  if (!$$2)
+  if (!W)
     throw new Error("You provided an `onClose` prop to the `Dialog`, but forgot an `open` prop.");
-  if (!Y)
+  if (!$2)
     throw new Error("You provided an `open` prop to the `Dialog`, but forgot an `onClose` prop.");
-  if (typeof a2 != "boolean")
-    throw new Error(`You provided an \`open\` prop to the \`Dialog\`, but the value is not a boolean. Received: ${a2}`);
-  if (typeof o2 != "function")
-    throw new Error(`You provided an \`onClose\` prop to the \`Dialog\`, but the value is not a function. Received: ${o2}`);
-  let g2 = a2 ? 0 : 1, [h2, Q2] = useReducer(Ce$1, { titleId: null, descriptionId: null, panelRef: createRef() }), R = o$3(() => o2(false)), j2 = o$3((T2) => Q2({ type: 0, id: T2 })), x2 = a$2() ? f2 ? false : g2 === 0 : false, w2 = n$12 > 1, X2 = useContext(H) !== null, Z = w2 ? "parent" : "leaf";
-  M$3(u2, w2 ? x2 : false);
-  let N2 = o$3(() => {
-    var b, D2;
-    return [...Array.from((b = y$1 == null ? void 0 : y$1.querySelectorAll("body > *, [data-headlessui-portal]")) != null ? b : []).filter((E2) => !(!(E2 instanceof HTMLElement) || E2.contains(U2.current) || h2.panelRef.current && E2.contains(h2.panelRef.current))), (D2 = h2.panelRef.current) != null ? D2 : u2.current];
+  if (typeof n2 != "boolean")
+    throw new Error(`You provided an \`open\` prop to the \`Dialog\`, but the value is not a boolean. Received: ${n2}`);
+  if (typeof l2 != "function")
+    throw new Error(`You provided an \`onClose\` prop to the \`Dialog\`, but the value is not a function. Received: ${l2}`);
+  let p2 = n2 ? 0 : 1, [h2, te$1] = useReducer(Ge, { titleId: null, descriptionId: null, panelRef: createRef() }), P2 = o$4(() => l2(false)), Y2 = o$4((t2) => te$1({ type: 0, id: t2 })), S2 = l$4() ? T2 ? false : p2 === 0 : false, x2 = M2 > 1, j2 = useContext(I$1) !== null, [oe, re] = ee(), ne = { get current() {
+    var t2;
+    return (t2 = h2.panelRef.current) != null ? t2 : D2.current;
+  } }, { resolveContainers: w$12, mainTreeNodeRef: L, MainTreeNode: le2 } = N({ portals: oe, defaultContainers: [ne] }), ae2 = x2 ? "parent" : "leaf", J = E$1 !== null ? (E$1 & d$3.Closing) === d$3.Closing : false, ie = (() => j2 || J ? false : S2)(), se2 = useCallback(() => {
+    var t2, c2;
+    return (c2 = Array.from((t2 = g2 == null ? void 0 : g2.querySelectorAll("body > *")) != null ? t2 : []).find((d2) => d2.id === "headlessui-portal-root" ? false : d2.contains(L.current) && d2 instanceof HTMLElement)) != null ? c2 : null;
+  }, [L]);
+  b$3(se2, ie);
+  let pe = (() => x2 ? true : S2)(), de$1 = useCallback(() => {
+    var t2, c2;
+    return (c2 = Array.from((t2 = g2 == null ? void 0 : g2.querySelectorAll("[data-headlessui-portal]")) != null ? t2 : []).find((d2) => d2.contains(L.current) && d2 instanceof HTMLElement)) != null ? c2 : null;
+  }, [L]);
+  b$3(de$1, pe);
+  let ue2 = (() => !(!S2 || x2))();
+  y$2(w$12, (t2) => {
+    t2.preventDefault(), P2();
+  }, ue2);
+  let fe = (() => !(x2 || p2 !== 0))();
+  E(g2 == null ? void 0 : g2.defaultView, "keydown", (t2) => {
+    fe && (t2.defaultPrevented || t2.key === o.Escape && (t2.preventDefault(), t2.stopPropagation(), P2()));
   });
-  L(() => N2(), R, x2 && !w2), E(y$1 == null ? void 0 : y$1.defaultView, "keydown", (T2) => {
-    T2.defaultPrevented || T2.key === o$1.Escape && g2 === 0 && (w2 || (T2.preventDefault(), T2.stopPropagation(), R()));
-  }), Oe(y$1, g2 === 0 && !X2, N2), useEffect(() => {
-    if (g2 !== 0 || !u2.current)
+  let ge = (() => !(J || p2 !== 0 || j2))();
+  Be(g2, ge, w$12), useEffect(() => {
+    if (p2 !== 0 || !D2.current)
       return;
-    let T2 = new IntersectionObserver((b) => {
-      for (let D2 of b)
-        D2.boundingClientRect.x === 0 && D2.boundingClientRect.y === 0 && D2.boundingClientRect.width === 0 && D2.boundingClientRect.height === 0 && R();
+    let t2 = new ResizeObserver((c2) => {
+      for (let d2 of c2) {
+        let F2 = d2.target.getBoundingClientRect();
+        F2.x === 0 && F2.y === 0 && F2.width === 0 && F2.height === 0 && P2();
+      }
     });
-    return T2.observe(u2.current), () => T2.disconnect();
-  }, [g2, u2, R]);
-  let [ee, te] = k$1(), oe2 = useMemo(() => [{ dialogState: g2, close: R, setTitleId: j2 }, h2], [g2, h2, R, j2]), V = useMemo(() => ({ open: g2 === 0 }), [g2]), re2 = { ref: _24, id: d2, role: "dialog", "aria-modal": g2 === 0 ? true : void 0, "aria-labelledby": h2.titleId, "aria-describedby": ee };
-  return React.createElement(M$2, { type: "Dialog", enabled: g2 === 0, element: u2, onUpdate: o$3((T2, b, D2) => {
-    b === "Dialog" && u$3(T2, { [s.Add]() {
-      P2.current.add(D2), i2((E2) => E2 + 1);
-    }, [s.Remove]() {
-      P2.current.add(D2), i2((E2) => E2 - 1);
-    } });
-  }) }, React.createElement(P$1, { force: true }, React.createElement($, null, React.createElement(H.Provider, { value: oe2 }, React.createElement($.Group, { target: u2 }, React.createElement(P$1, { force: false }, React.createElement(te, { slot: V, name: "Dialog.Description" }, React.createElement(de, { initialFocus: p$12, containers: P2, features: x2 ? u$3(Z, { parent: de.features.RestoreFocus, leaf: de.features.All & ~de.features.FocusLock }) : de.features.None }, $$1({ ourProps: re2, theirProps: c, slot: V, defaultTag: Se$1, features: Le, visible: g2 === 0, name: "Dialog" })))))))), React.createElement(h$1, { features: s$4.Hidden, ref: U2 }));
-}), ke = "div", we = C$1(function(e2, r2) {
-  let s2 = I$2(), { id: d2 = `headlessui-dialog-overlay-${s2}`, ...a2 } = e2, [{ dialogState: o2, close: p2 }] = k("Dialog.Overlay"), f2 = y(r2), c = o$3((l2) => {
-    if (l2.target === l2.currentTarget) {
-      if (r$1(l2.currentTarget))
-        return l2.preventDefault();
-      l2.preventDefault(), l2.stopPropagation(), p2();
-    }
-  }), n2 = useMemo(() => ({ open: o2 === 0 }), [o2]);
-  return $$1({ ourProps: { ref: f2, id: d2, "aria-hidden": true, onClick: c }, theirProps: a2, slot: n2, defaultTag: ke, name: "Dialog.Overlay" });
-}), Fe = "div", Ie = C$1(function(e2, r2) {
-  let s2 = I$2(), { id: d2 = `headlessui-dialog-backdrop-${s2}`, ...a2 } = e2, [{ dialogState: o2 }, p2] = k("Dialog.Backdrop"), f2 = y(r2);
+    return t2.observe(D2.current), () => t2.disconnect();
+  }, [p2, D2, P2]);
+  let [Te, ce] = w(), De2 = useMemo(() => [{ dialogState: p2, close: P2, setTitleId: Y2 }, h2], [p2, h2, P2, Y2]), X2 = useMemo(() => ({ open: p2 === 0 }), [p2]), me = { ref: ee$1, id: i2, role: a2, "aria-modal": p2 === 0 ? true : void 0, "aria-labelledby": h2.titleId, "aria-describedby": Te };
+  return React__default.createElement(b$2, { type: "Dialog", enabled: p2 === 0, element: D2, onUpdate: o$4((t2, c2) => {
+    c2 === "Dialog" && u$5(t2, { [s.Add]: () => f2((d2) => d2 + 1), [s.Remove]: () => f2((d2) => d2 - 1) });
+  }) }, React__default.createElement(l$2, { force: true }, React__default.createElement(te, null, React__default.createElement(I$1.Provider, { value: De2 }, React__default.createElement(te.Group, { target: D2 }, React__default.createElement(l$2, { force: false }, React__default.createElement(ce, { slot: X2, name: "Dialog.Description" }, React__default.createElement(de, { initialFocus: s$12, containers: w$12, features: S2 ? u$5(ae2, { parent: de.features.RestoreFocus, leaf: de.features.All & ~de.features.FocusLock }) : de.features.None }, React__default.createElement(re, null, C({ ourProps: me, theirProps: m2, slot: X2, defaultTag: Ne$1, features: Ue, visible: p2 === 0, name: "Dialog" }))))))))), React__default.createElement(le2, null));
+}
+let $e = "div";
+function Ye(o2, e2) {
+  let r2 = I$5(), { id: i2 = `headlessui-dialog-overlay-${r2}`, ...n2 } = o2, [{ dialogState: l2, close: s2 }] = b$1("Dialog.Overlay"), a2 = y$1(e2), T2 = o$4((f2) => {
+    if (f2.target === f2.currentTarget) {
+      if (r$2(f2.currentTarget))
+        return f2.preventDefault();
+      f2.preventDefault(), f2.stopPropagation(), s2();
+    }
+  }), m2 = useMemo(() => ({ open: l2 === 0 }), [l2]);
+  return C({ ourProps: { ref: a2, id: i2, "aria-hidden": true, onClick: T2 }, theirProps: n2, slot: m2, defaultTag: $e, name: "Dialog.Overlay" });
+}
+let je = "div";
+function Je(o2, e2) {
+  let r2 = I$5(), { id: i2 = `headlessui-dialog-backdrop-${r2}`, ...n2 } = o2, [{ dialogState: l2 }, s2] = b$1("Dialog.Backdrop"), a2 = y$1(e2);
   useEffect(() => {
-    if (p2.panelRef.current === null)
+    if (s2.panelRef.current === null)
       throw new Error("A <Dialog.Backdrop /> component is being used, but a <Dialog.Panel /> component is missing.");
-  }, [p2.panelRef]);
-  let c = useMemo(() => ({ open: o2 === 0 }), [o2]);
-  return React.createElement(P$1, { force: true }, React.createElement($, null, $$1({ ourProps: { ref: f2, id: d2, "aria-hidden": true }, theirProps: a2, slot: c, defaultTag: Fe, name: "Dialog.Backdrop" })));
-}), He = "div", _e = C$1(function(e2, r2) {
-  let s2 = I$2(), { id: d2 = `headlessui-dialog-panel-${s2}`, ...a2 } = e2, [{ dialogState: o2 }, p2] = k("Dialog.Panel"), f2 = y(r2, p2.panelRef), c = useMemo(() => ({ open: o2 === 0 }), [o2]), n2 = o$3((l2) => {
-    l2.stopPropagation();
+  }, [s2.panelRef]);
+  let T2 = useMemo(() => ({ open: l2 === 0 }), [l2]);
+  return React__default.createElement(l$2, { force: true }, React__default.createElement(te, null, C({ ourProps: { ref: a2, id: i2, "aria-hidden": true }, theirProps: n2, slot: T2, defaultTag: je, name: "Dialog.Backdrop" })));
+}
+let Xe = "div";
+function Ke(o2, e2) {
+  let r2 = I$5(), { id: i2 = `headlessui-dialog-panel-${r2}`, ...n2 } = o2, [{ dialogState: l2 }, s2] = b$1("Dialog.Panel"), a2 = y$1(e2, s2.panelRef), T2 = useMemo(() => ({ open: l2 === 0 }), [l2]), m2 = o$4((f2) => {
+    f2.stopPropagation();
   });
-  return $$1({ ourProps: { ref: f2, id: d2, onClick: n2 }, theirProps: a2, slot: c, defaultTag: He, name: "Dialog.Panel" });
-}), xe$1 = "h2", We = C$1(function(e2, r2) {
-  let s2 = I$2(), { id: d2 = `headlessui-dialog-title-${s2}`, ...a2 } = e2, [{ dialogState: o2, setTitleId: p2 }] = k("Dialog.Title"), f2 = y(r2);
-  useEffect(() => (p2(d2), () => p2(null)), [d2, p2]);
-  let c = useMemo(() => ({ open: o2 === 0 }), [o2]);
-  return $$1({ ourProps: { ref: f2, id: d2 }, theirProps: a2, slot: c, defaultTag: xe$1, name: "Dialog.Title" });
-}), mt = Object.assign(Me, { Backdrop: Ie, Panel: _e, Overlay: we, Title: We, Description: F$1 });
+  return C({ ourProps: { ref: a2, id: i2, onClick: m2 }, theirProps: n2, slot: T2, defaultTag: Xe, name: "Dialog.Panel" });
+}
+let Ve = "h2";
+function qe$1(o2, e2) {
+  let r2 = I$5(), { id: i2 = `headlessui-dialog-title-${r2}`, ...n2 } = o2, [{ dialogState: l2, setTitleId: s2 }] = b$1("Dialog.Title"), a2 = y$1(e2);
+  useEffect(() => (s2(i2), () => s2(null)), [i2, s2]);
+  let T2 = useMemo(() => ({ open: l2 === 0 }), [l2]);
+  return C({ ourProps: { ref: a2, id: i2 }, theirProps: n2, slot: T2, defaultTag: Ve, name: "Dialog.Title" });
+}
+let ze = U$2(We), Qe = U$2(Je), Ze = U$2(Ke), et = U$2(Ye), tt = U$2(qe$1), _t = Object.assign(ze, { Backdrop: Qe, Panel: Ze, Overlay: et, Title: tt, Description: G });
+function c(a2 = 0) {
+  let [l2, r2] = useState(a2), t2 = f$3(), o2 = useCallback((e2) => {
+    t2.current && r2((u2) => u2 | e2);
+  }, [l2, t2]), m2 = useCallback((e2) => Boolean(l2 & e2), [l2]), s2 = useCallback((e2) => {
+    t2.current && r2((u2) => u2 & ~e2);
+  }, [r2, t2]), g2 = useCallback((e2) => {
+    t2.current && r2((u2) => u2 ^ e2);
+  }, [r2]);
+  return { flags: l2, addFlag: o2, hasFlag: m2, removeFlag: s2, toggleFlag: g2 };
+}
 function l(r2) {
   let e2 = { called: false };
   return (...t2) => {
@@ -9971,181 +10371,204 @@ function l(r2) {
       return e2.called = true, r2(...t2);
   };
 }
-function v(t2, ...e2) {
+function g(t2, ...e2) {
   t2 && e2.length > 0 && t2.classList.add(...e2);
 }
-function f(t2, ...e2) {
+function v(t2, ...e2) {
   t2 && e2.length > 0 && t2.classList.remove(...e2);
 }
-function F(t2, e2) {
-  let n2 = m$2();
+function b(t2, e2) {
+  let n2 = o$3();
   if (!t2)
     return n2.dispose;
-  let { transitionDuration: a2, transitionDelay: i2 } = getComputedStyle(t2), [m2, d2] = [a2, i2].map((o2) => {
-    let [r2 = 0] = o2.split(",").filter(Boolean).map((l2) => l2.includes("ms") ? parseFloat(l2) : parseFloat(l2) * 1e3).sort((l2, g2) => g2 - l2);
+  let { transitionDuration: m2, transitionDelay: a2 } = getComputedStyle(t2), [u2, p2] = [m2, a2].map((l2) => {
+    let [r2 = 0] = l2.split(",").filter(Boolean).map((i2) => i2.includes("ms") ? parseFloat(i2) : parseFloat(i2) * 1e3).sort((i2, T2) => T2 - i2);
     return r2;
-  });
-  if (m2 + d2 !== 0) {
-    let o2 = n2.addEventListener(t2, "transitionend", (r2) => {
-      r2.target === r2.currentTarget && (e2(), o2());
+  }), o2 = u2 + p2;
+  if (o2 !== 0) {
+    n2.group((r2) => {
+      r2.setTimeout(() => {
+        e2(), r2.dispose();
+      }, o2), r2.addEventListener(t2, "transitionrun", (i2) => {
+        i2.target === i2.currentTarget && r2.dispose();
+      });
+    });
+    let l2 = n2.addEventListener(t2, "transitionend", (r2) => {
+      r2.target === r2.currentTarget && (e2(), l2());
     });
   } else
     e2();
   return n2.add(() => e2()), n2.dispose;
 }
-function M$1(t2, e2, n2, a2) {
-  let i2 = n2 ? "enter" : "leave", m2 = m$2(), d2 = a2 !== void 0 ? l(a2) : () => {
+function M$1(t2, e2, n2, m2) {
+  let a2 = n2 ? "enter" : "leave", u2 = o$3(), p2 = m2 !== void 0 ? l(m2) : () => {
   };
-  i2 === "enter" && (t2.removeAttribute("hidden"), t2.style.display = "");
-  let u2 = u$3(i2, { enter: () => e2.enter, leave: () => e2.leave }), o2 = u$3(i2, { enter: () => e2.enterTo, leave: () => e2.leaveTo }), r2 = u$3(i2, { enter: () => e2.enterFrom, leave: () => e2.leaveFrom });
-  return f(t2, ...e2.enter, ...e2.enterTo, ...e2.enterFrom, ...e2.leave, ...e2.leaveFrom, ...e2.leaveTo, ...e2.entered), v(t2, ...u2, ...r2), m2.nextFrame(() => {
-    f(t2, ...r2), v(t2, ...o2), F(t2, () => (f(t2, ...u2), v(t2, ...e2.entered), d2()));
-  }), m2.dispose;
-}
-function D({ container: i2, direction: t2, classes: o2, onStart: s2, onStop: u2 }) {
-  let a2 = f$1(), c = p$2(), r2 = s$5(t2);
-  s$6(() => {
-    let e2 = m$2();
-    c.add(e2.dispose);
-    let n2 = i2.current;
-    if (!!n2 && r2.current !== "idle" && !!a2.current)
-      return e2.dispose(), s2.current(r2.current), e2.add(M$1(n2, o2.current, r2.current === "enter", () => {
-        e2.dispose(), u2.current(r2.current);
-      })), e2.dispose;
-  }, [t2]);
-}
-function e(...n2) {
-  return n2.filter(Boolean).join(" ");
+  a2 === "enter" && (t2.removeAttribute("hidden"), t2.style.display = "");
+  let o2 = u$5(a2, { enter: () => e2.enter, leave: () => e2.leave }), l$12 = u$5(a2, { enter: () => e2.enterTo, leave: () => e2.leaveTo }), r2 = u$5(a2, { enter: () => e2.enterFrom, leave: () => e2.leaveFrom });
+  return v(t2, ...e2.base, ...e2.enter, ...e2.enterTo, ...e2.enterFrom, ...e2.leave, ...e2.leaveFrom, ...e2.leaveTo, ...e2.entered), g(t2, ...e2.base, ...o2, ...r2), u2.nextFrame(() => {
+    v(t2, ...e2.base, ...o2, ...r2), g(t2, ...e2.base, ...o2, ...l$12), b(t2, () => (v(t2, ...e2.base, ...o2), g(t2, ...e2.base, ...e2.entered), p2()));
+  }), u2.dispose;
+}
+function D({ immediate: t2, container: s2, direction: n2, classes: u2, onStart: a2, onStop: c2 }) {
+  let l2 = f$3(), d2 = p$3(), e2 = s$7(n2);
+  l$5(() => {
+    t2 && (e2.current = "enter");
+  }, [t2]), l$5(() => {
+    let r2 = o$3();
+    d2.add(r2.dispose);
+    let i2 = s2.current;
+    if (i2 && e2.current !== "idle" && l2.current)
+      return r2.dispose(), a2.current(e2.current), r2.add(M$1(i2, u2.current, e2.current === "enter", () => {
+        r2.dispose(), c2.current(e2.current);
+      })), r2.dispose;
+  }, [n2]);
 }
-function P(i2 = "") {
-  return i2.split(" ").filter((e2) => e2.trim().length > 1);
+function S(t2 = "") {
+  return t2.split(/\s+/).filter((n2) => n2.length > 1);
 }
-let A = createContext(null);
-A.displayName = "TransitionContext";
-var Ce = ((s2) => (s2.Visible = "visible", s2.Hidden = "hidden", s2))(Ce || {});
-function ge() {
-  let i2 = useContext(A);
-  if (i2 === null)
+let I = createContext(null);
+I.displayName = "TransitionContext";
+var Se = ((r2) => (r2.Visible = "visible", r2.Hidden = "hidden", r2))(Se || {});
+function ye() {
+  let t2 = useContext(I);
+  if (t2 === null)
     throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");
-  return i2;
+  return t2;
 }
-function be() {
-  let i2 = useContext(M);
-  if (i2 === null)
+function xe() {
+  let t2 = useContext(M);
+  if (t2 === null)
     throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");
-  return i2;
+  return t2;
 }
 let M = createContext(null);
 M.displayName = "NestingContext";
-function I(i2) {
-  return "children" in i2 ? I(i2.children) : i2.current.filter(({ el: e2 }) => e2.current !== null).filter(({ state: e2 }) => e2 === "visible").length > 0;
-}
-function ne(i2, e2) {
-  let s2 = s$5(i2), n2 = useRef([]), m2 = f$1(), R = p$2(), b = o$3((l2, r2 = j$1.Hidden) => {
-    let t2 = n2.current.findIndex(({ el: o2 }) => o2 === l2);
-    t2 !== -1 && (u$3(r2, { [j$1.Unmount]() {
-      n2.current.splice(t2, 1);
-    }, [j$1.Hidden]() {
-      n2.current[t2].state = "hidden";
-    } }), R.microTask(() => {
+function U(t2) {
+  return "children" in t2 ? U(t2.children) : t2.current.filter(({ el: n2 }) => n2.current !== null).filter(({ state: n2 }) => n2 === "visible").length > 0;
+}
+function se(t2, n2) {
+  let r2 = s$7(t2), s2 = useRef([]), R2 = f$3(), D2 = p$3(), p2 = o$4((i2, e2 = v$1.Hidden) => {
+    let a2 = s2.current.findIndex(({ el: o2 }) => o2 === i2);
+    a2 !== -1 && (u$5(e2, { [v$1.Unmount]() {
+      s2.current.splice(a2, 1);
+    }, [v$1.Hidden]() {
+      s2.current[a2].state = "hidden";
+    } }), D2.microTask(() => {
       var o2;
-      !I(n2) && m2.current && ((o2 = s2.current) == null || o2.call(s2));
+      !U(s2) && R2.current && ((o2 = r2.current) == null || o2.call(r2));
     }));
-  }), E2 = o$3((l2) => {
-    let r2 = n2.current.find(({ el: t2 }) => t2 === l2);
-    return r2 ? r2.state !== "visible" && (r2.state = "visible") : n2.current.push({ el: l2, state: "visible" }), () => b(l2, j$1.Unmount);
-  }), S2 = useRef([]), u2 = useRef(Promise.resolve()), p2 = useRef({ enter: [], leave: [], idle: [] }), d2 = o$3((l2, r2, t2) => {
-    S2.current.splice(0), e2 && (e2.chains.current[r2] = e2.chains.current[r2].filter(([o2]) => o2 !== l2)), e2 == null || e2.chains.current[r2].push([l2, new Promise((o2) => {
-      S2.current.push(o2);
-    })]), e2 == null || e2.chains.current[r2].push([l2, new Promise((o2) => {
-      Promise.all(p2.current[r2].map(([f2, a2]) => a2)).then(() => o2());
-    })]), r2 === "enter" ? u2.current = u2.current.then(() => e2 == null ? void 0 : e2.wait.current).then(() => t2(r2)) : t2(r2);
-  }), v2 = o$3((l2, r2, t2) => {
-    Promise.all(p2.current[r2].splice(0).map(([o2, f2]) => f2)).then(() => {
+  }), x2 = o$4((i2) => {
+    let e2 = s2.current.find(({ el: a2 }) => a2 === i2);
+    return e2 ? e2.state !== "visible" && (e2.state = "visible") : s2.current.push({ el: i2, state: "visible" }), () => p2(i2, v$1.Unmount);
+  }), h2 = useRef([]), v2 = useRef(Promise.resolve()), u2 = useRef({ enter: [], leave: [], idle: [] }), g2 = o$4((i2, e2, a2) => {
+    h2.current.splice(0), n2 && (n2.chains.current[e2] = n2.chains.current[e2].filter(([o2]) => o2 !== i2)), n2 == null || n2.chains.current[e2].push([i2, new Promise((o2) => {
+      h2.current.push(o2);
+    })]), n2 == null || n2.chains.current[e2].push([i2, new Promise((o2) => {
+      Promise.all(u2.current[e2].map(([f2, N2]) => N2)).then(() => o2());
+    })]), e2 === "enter" ? v2.current = v2.current.then(() => n2 == null ? void 0 : n2.wait.current).then(() => a2(e2)) : a2(e2);
+  }), d2 = o$4((i2, e2, a2) => {
+    Promise.all(u2.current[e2].splice(0).map(([o2, f2]) => f2)).then(() => {
       var o2;
-      (o2 = S2.current.shift()) == null || o2();
-    }).then(() => t2(r2));
+      (o2 = h2.current.shift()) == null || o2();
+    }).then(() => a2(e2));
   });
-  return useMemo(() => ({ children: n2, register: E2, unregister: b, onStart: d2, onStop: v2, wait: u2, chains: p2 }), [E2, b, n2, d2, v2, p2, u2]);
+  return useMemo(() => ({ children: s2, register: x2, unregister: p2, onStart: g2, onStop: d2, wait: v2, chains: u2 }), [x2, p2, s2, g2, d2, u2, v2]);
 }
-function Ee() {
+function Ne() {
 }
-let Se = ["beforeEnter", "afterEnter", "beforeLeave", "afterLeave"];
-function re(i2) {
-  var s2;
-  let e2 = {};
-  for (let n2 of Se)
-    e2[n2] = (s2 = i2[n2]) != null ? s2 : Ee;
-  return e2;
+let Pe = ["beforeEnter", "afterEnter", "beforeLeave", "afterLeave"];
+function ae(t2) {
+  var r2;
+  let n2 = {};
+  for (let s2 of Pe)
+    n2[s2] = (r2 = t2[s2]) != null ? r2 : Ne;
+  return n2;
 }
-function xe(i2) {
-  let e2 = useRef(re(i2));
+function Re(t2) {
+  let n2 = useRef(ae(t2));
   return useEffect(() => {
-    e2.current = re(i2);
-  }, [i2]), e2;
-}
-let Pe = "div", ie = S$1.RenderStrategy, oe = C$1(function(e$12, s2) {
-  let { beforeEnter: n2, afterEnter: m2, beforeLeave: R, afterLeave: b, enter: E2, enterFrom: S2, enterTo: u2, entered: p$12, leave: d2, leaveFrom: v2, leaveTo: l2, ...r2 } = e$12, t2 = useRef(null), o2 = y(t2, s2), f2 = r2.unmount ? j$1.Unmount : j$1.Hidden, { show: a2, appear: x2, initial: se } = ge(), [h2, _24] = useState(a2 ? "visible" : "hidden"), K = be(), { register: D$1, unregister: V } = K, j2 = useRef(null);
-  useEffect(() => D$1(t2), [D$1, t2]), useEffect(() => {
-    if (f2 === j$1.Hidden && !!t2.current) {
-      if (a2 && h2 !== "visible") {
-        _24("visible");
+    n2.current = ae(t2);
+  }, [t2]), n2;
+}
+let De = "div", le = O.RenderStrategy;
+function He(t2, n2) {
+  var Q2, Y2;
+  let { beforeEnter: r2, afterEnter: s2, beforeLeave: R2, afterLeave: D$12, enter: p2, enterFrom: x2, enterTo: h2, entered: v2, leave: u2, leaveFrom: g2, leaveTo: d2, ...i2 } = t2, e2 = useRef(null), a2 = y$1(e2, n2), o2 = (Q2 = i2.unmount) == null || Q2 ? v$1.Unmount : v$1.Hidden, { show: f2, appear: N2, initial: T2 } = ye(), [l2, j2] = useState(f2 ? "visible" : "hidden"), z2 = xe(), { register: L, unregister: O2 } = z2;
+  useEffect(() => L(e2), [L, e2]), useEffect(() => {
+    if (o2 === v$1.Hidden && e2.current) {
+      if (f2 && l2 !== "visible") {
+        j2("visible");
         return;
       }
-      return u$3(h2, { ["hidden"]: () => V(t2), ["visible"]: () => D$1(t2) });
+      return u$5(l2, { ["hidden"]: () => O2(e2), ["visible"]: () => L(e2) });
     }
-  }, [h2, t2, D$1, V, a2, f2]);
-  let U2 = s$5({ enter: P(E2), enterFrom: P(S2), enterTo: P(u2), entered: P(p$12), leave: P(d2), leaveFrom: P(v2), leaveTo: P(l2) }), w2 = xe({ beforeEnter: n2, afterEnter: m2, beforeLeave: R, afterLeave: b }), k2 = a$2();
+  }, [l2, e2, L, O2, f2, o2]);
+  let k2 = s$7({ base: S(i2.className), enter: S(p2), enterFrom: S(x2), enterTo: S(h2), entered: S(v2), leave: S(u2), leaveFrom: S(g2), leaveTo: S(d2) }), V = Re({ beforeEnter: r2, afterEnter: s2, beforeLeave: R2, afterLeave: D$12 }), G2 = l$4();
   useEffect(() => {
-    if (k2 && h2 === "visible" && t2.current === null)
+    if (G2 && l2 === "visible" && e2.current === null)
       throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?");
-  }, [t2, h2, k2]);
-  let G = se && !x2, le = (() => !k2 || G || j2.current === a2 ? "idle" : a2 ? "enter" : "leave")(), ae = o$3((C2) => u$3(C2, { enter: () => w2.current.beforeEnter(), leave: () => w2.current.beforeLeave(), idle: () => {
-  } })), ue = o$3((C2) => u$3(C2, { enter: () => w2.current.afterEnter(), leave: () => w2.current.afterLeave(), idle: () => {
-  } })), L2 = ne(() => {
-    _24("hidden"), V(t2);
-  }, K);
-  D({ container: t2, classes: U2, direction: le, onStart: s$5((C2) => {
-    L2.onStart(t2, C2, ae);
-  }), onStop: s$5((C2) => {
-    L2.onStop(t2, C2, ue), C2 === "leave" && !I(L2) && (_24("hidden"), V(t2));
-  }) }), useEffect(() => {
-    !G || (f2 === j$1.Hidden ? j2.current = null : j2.current = a2);
-  }, [a2, G, h2]);
-  let B = r2, de2 = { ref: o2 };
-  return x2 && a2 && (typeof window == "undefined" || typeof document == "undefined") && (B = { ...B, className: e(r2.className, ...U2.current.enter, ...U2.current.enterFrom) }), React.createElement(M.Provider, { value: L2 }, React.createElement(C, { value: u$3(h2, { ["visible"]: p.Open, ["hidden"]: p.Closed }) }, $$1({ ourProps: de2, theirProps: B, defaultTag: Pe, features: ie, visible: h2 === "visible", name: "Transition.Child" })));
-}), J = C$1(function(e2, s2) {
-  let { show: n2, appear: m2 = false, unmount: R, ...b } = e2, E2 = useRef(null), S2 = y(E2, s2);
-  a$2();
-  let u2 = s$3();
-  if (n2 === void 0 && u2 !== null && (n2 = u$3(u2, { [p.Open]: true, [p.Closed]: false })), ![true, false].includes(n2))
+  }, [e2, l2, G2]);
+  let Te = T2 && !N2, K = N2 && f2 && T2, de2 = (() => !G2 || Te ? "idle" : f2 ? "enter" : "leave")(), H2 = c(0), fe = o$4((C2) => u$5(C2, { enter: () => {
+    H2.addFlag(d$3.Opening), V.current.beforeEnter();
+  }, leave: () => {
+    H2.addFlag(d$3.Closing), V.current.beforeLeave();
+  }, idle: () => {
+  } })), me = o$4((C2) => u$5(C2, { enter: () => {
+    H2.removeFlag(d$3.Opening), V.current.afterEnter();
+  }, leave: () => {
+    H2.removeFlag(d$3.Closing), V.current.afterLeave();
+  }, idle: () => {
+  } })), w2 = se(() => {
+    j2("hidden"), O2(e2);
+  }, z2), B = useRef(false);
+  D({ immediate: K, container: e2, classes: k2, direction: de2, onStart: s$7((C2) => {
+    B.current = true, w2.onStart(e2, C2, fe);
+  }), onStop: s$7((C2) => {
+    B.current = false, w2.onStop(e2, C2, me), C2 === "leave" && !U(w2) && (j2("hidden"), O2(e2));
+  }) });
+  let P2 = i2, ce = { ref: a2 };
+  return K ? P2 = { ...P2, className: t$4(i2.className, ...k2.current.enter, ...k2.current.enterFrom) } : B.current && (P2.className = t$4(i2.className, (Y2 = e2.current) == null ? void 0 : Y2.className), P2.className === "" && delete P2.className), React__default.createElement(M.Provider, { value: w2 }, React__default.createElement(s$3, { value: u$5(l2, { ["visible"]: d$3.Open, ["hidden"]: d$3.Closed }) | H2.flags }, C({ ourProps: ce, theirProps: P2, defaultTag: De, features: le, visible: l2 === "visible", name: "Transition.Child" })));
+}
+function Fe(t2, n2) {
+  let { show: r2, appear: s2 = false, unmount: R2 = true, ...D2 } = t2, p2 = useRef(null), x2 = y$1(p2, n2);
+  l$4();
+  let h2 = u$2();
+  if (r2 === void 0 && h2 !== null && (r2 = (h2 & d$3.Open) === d$3.Open), ![true, false].includes(r2))
     throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");
-  let [p$12, d2] = useState(n2 ? "visible" : "hidden"), v2 = ne(() => {
-    d2("hidden");
-  }), [l2, r2] = useState(true), t2 = useRef([n2]);
-  s$6(() => {
-    l2 !== false && t2.current[t2.current.length - 1] !== n2 && (t2.current.push(n2), r2(false));
-  }, [t2, n2]);
-  let o2 = useMemo(() => ({ show: n2, appear: m2, initial: l2 }), [n2, m2, l2]);
+  let [v2, u2] = useState(r2 ? "visible" : "hidden"), g2 = se(() => {
+    u2("hidden");
+  }), [d2, i2] = useState(true), e2 = useRef([r2]);
+  l$5(() => {
+    d2 !== false && e2.current[e2.current.length - 1] !== r2 && (e2.current.push(r2), i2(false));
+  }, [e2, r2]);
+  let a2 = useMemo(() => ({ show: r2, appear: s2, initial: d2 }), [r2, s2, d2]);
   useEffect(() => {
-    if (n2)
-      d2("visible");
-    else if (!I(v2))
-      d2("hidden");
+    if (r2)
+      u2("visible");
+    else if (!U(g2))
+      u2("hidden");
     else {
-      let a2 = E2.current;
-      if (!a2)
+      let T2 = p2.current;
+      if (!T2)
         return;
-      let x2 = a2.getBoundingClientRect();
-      x2.x === 0 && x2.y === 0 && x2.width === 0 && x2.height === 0 && d2("hidden");
-    }
-  }, [n2, v2]);
-  let f2 = { unmount: R };
-  return React.createElement(M.Provider, { value: v2 }, React.createElement(A.Provider, { value: o2 }, $$1({ ourProps: { ...f2, as: Fragment$1, children: React.createElement(oe, { ref: S2, ...f2, ...b }) }, theirProps: {}, defaultTag: Fragment$1, features: ie, visible: p$12 === "visible", name: "Transition" })));
-}), ye = C$1(function(e2, s2) {
-  let n2 = useContext(A) !== null, m2 = s$3() !== null;
-  return React.createElement(React.Fragment, null, !n2 && m2 ? React.createElement(J, { ref: s2, ...e2 }) : React.createElement(oe, { ref: s2, ...e2 }));
-}), Je = Object.assign(J, { Child: ye, Root: J });
+      let l2 = T2.getBoundingClientRect();
+      l2.x === 0 && l2.y === 0 && l2.width === 0 && l2.height === 0 && u2("hidden");
+    }
+  }, [r2, g2]);
+  let o2 = { unmount: R2 }, f2 = o$4(() => {
+    var T2;
+    d2 && i2(false), (T2 = t2.beforeEnter) == null || T2.call(t2);
+  }), N2 = o$4(() => {
+    var T2;
+    d2 && i2(false), (T2 = t2.beforeLeave) == null || T2.call(t2);
+  });
+  return React__default.createElement(M.Provider, { value: g2 }, React__default.createElement(I.Provider, { value: a2 }, C({ ourProps: { ...o2, as: Fragment$1, children: React__default.createElement(ue, { ref: x2, ...o2, ...D2, beforeEnter: f2, beforeLeave: N2 }) }, theirProps: {}, defaultTag: Fragment$1, features: le, visible: v2 === "visible", name: "Transition" })));
+}
+function _e(t2, n2) {
+  let r2 = useContext(I) !== null, s2 = u$2() !== null;
+  return React__default.createElement(React__default.Fragment, null, !r2 && s2 ? React__default.createElement(q, { ref: n2, ...t2 }) : React__default.createElement(ue, { ref: n2, ...t2 }));
+}
+let q = U$2(Fe), ue = U$2(He), Le = U$2(_e), qe = Object.assign(q, { Child: Le, Root: q });
 function Modal(props) {
   const {
     children,
@@ -10158,11 +10581,11 @@ function Modal(props) {
     isModal: true
   });
   return /* @__PURE__ */ jsx(Fragment, {
-    children: /* @__PURE__ */ jsx(Je, {
+    children: /* @__PURE__ */ jsx(qe, {
       appear: true,
       show: isOpen,
       as: Fragment$1,
-      children: /* @__PURE__ */ jsx(mt, {
+      children: /* @__PURE__ */ jsx(_t, {
         as: "div",
         className: "fixed inset-0 z-10 overflow-y-auto",
         style: {
@@ -10171,7 +10594,7 @@ function Modal(props) {
         onClose: handleClose,
         children: /* @__PURE__ */ jsxs("div", {
           className: "min-h-screen text-center sm:px-4",
-          children: [/* @__PURE__ */ jsx(Je.Child, {
+          children: [/* @__PURE__ */ jsx(qe.Child, {
             as: Fragment$1,
             enter: "ease-out duration-300",
             enterFrom: "opacity-0",
@@ -10179,14 +10602,14 @@ function Modal(props) {
             leave: "ease-in duration-200",
             leaveFrom: "opacity-100",
             leaveTo: "opacity-0",
-            children: /* @__PURE__ */ jsx(mt.Overlay, {
+            children: /* @__PURE__ */ jsx(_t.Overlay, {
               className: "fixed inset-0"
             })
           }), /* @__PURE__ */ jsx("span", {
             className: "inline-block h-screen align-middle",
             "aria-hidden": "true",
             children: "\u200B"
-          }), /* @__PURE__ */ jsx(Je.Child, {
+          }), /* @__PURE__ */ jsx(qe.Child, {
             as: Fragment$1,
             enter: "ease-out duration-300",
             enterFrom: "opacity-0 scale-95",
@@ -10411,7 +10834,7 @@ const MenuProductRoot = (props) => {
   });
 };
 var style = "";
-const ProductDataContext = React.createContext(null);
+const ProductDataContext = React__default.createContext(null);
 function ProductDataProvider({
   rootProduct,
   children
@@ -10489,6 +10912,7 @@ function ProductConfigurator(props) {
       });
     } else {
       console.log("selected", getValues("selected"));
+      console.log("filter", getValues("filter"));
       const decodedCleanedSelected = decodeSelected(cleanSelected(getValues("selected")));
       console.log("decodedCleanedSelected: ", decodedCleanedSelected);
       handleAddToCart({