@trafilea/afrodita-components 5.0.0-beta.33 → 5.0.0-beta.37

package/build/index.js

@@ -498,8 +498,8 @@ var Icon = {
     Emoji: Emoji,
 };
 
-function _extends$1() {
-  _extends$1 = Object.assign || function (target) {
+function _extends$2() {
+  _extends$2 = Object.assign || function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
 
@@ -513,7 +513,7 @@ function _extends$1() {
     return target;
   };
 
-  return _extends$1.apply(this, arguments);
+  return _extends$2.apply(this, arguments);
 }
 
 function memoize(fn) {
@@ -714,7 +714,7 @@ var from = String.fromCharCode;
  * @param {object}
  * @return {object}
  */
-var assign = Object.assign;
+var assign$1 = Object.assign;
 
 /**
  * @param {string} value
@@ -840,7 +840,7 @@ function node$1 (value, root, parent, type, props, children, length) {
  * @return {object}
  */
 function copy (root, props) {
-	return assign(node$1('', null, null, '', null, null, 0), root, {length: -root.length}, props)
+	return assign$1(node$1('', null, null, '', null, null, 0), root, {length: -root.length}, props)
 }
 
 /**
@@ -1844,9 +1844,9 @@ var createCache = function createCache(options) {
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
-var reactIs$1 = {exports: {}};
+var reactIs$2 = {exports: {}};
 
-var reactIs_production_min = {};
+var reactIs_production_min$1 = {};
 
 /** @license React v16.13.1
  * react-is.production.min.js
@@ -1856,14 +1856,14 @@ var reactIs_production_min = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k$1=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q$1=b?
-Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w$1=b?Symbol.for("react.fundamental"):60117,x$1=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
-function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k$1:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A$1(a){return z(a)===m}reactIs_production_min.AsyncMode=l;reactIs_production_min.ConcurrentMode=m;reactIs_production_min.ContextConsumer=k$1;reactIs_production_min.ContextProvider=h;reactIs_production_min.Element=c;reactIs_production_min.ForwardRef=n;reactIs_production_min.Fragment=e;reactIs_production_min.Lazy=t;reactIs_production_min.Memo=r;reactIs_production_min.Portal=d;
-reactIs_production_min.Profiler=g;reactIs_production_min.StrictMode=f;reactIs_production_min.Suspense=p;reactIs_production_min.isAsyncMode=function(a){return A$1(a)||z(a)===l};reactIs_production_min.isConcurrentMode=A$1;reactIs_production_min.isContextConsumer=function(a){return z(a)===k$1};reactIs_production_min.isContextProvider=function(a){return z(a)===h};reactIs_production_min.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};reactIs_production_min.isForwardRef=function(a){return z(a)===n};reactIs_production_min.isFragment=function(a){return z(a)===e};reactIs_production_min.isLazy=function(a){return z(a)===t};
-reactIs_production_min.isMemo=function(a){return z(a)===r};reactIs_production_min.isPortal=function(a){return z(a)===d};reactIs_production_min.isProfiler=function(a){return z(a)===g};reactIs_production_min.isStrictMode=function(a){return z(a)===f};reactIs_production_min.isSuspense=function(a){return z(a)===p};
-reactIs_production_min.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q$1||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k$1||a.$$typeof===n||a.$$typeof===w$1||a.$$typeof===x$1||a.$$typeof===y||a.$$typeof===v)};reactIs_production_min.typeOf=z;
+var b$1="function"===typeof Symbol&&Symbol.for,c$1=b$1?Symbol.for("react.element"):60103,d$1=b$1?Symbol.for("react.portal"):60106,e$1=b$1?Symbol.for("react.fragment"):60107,f$1=b$1?Symbol.for("react.strict_mode"):60108,g$1=b$1?Symbol.for("react.profiler"):60114,h$1=b$1?Symbol.for("react.provider"):60109,k$2=b$1?Symbol.for("react.context"):60110,l$1=b$1?Symbol.for("react.async_mode"):60111,m$1=b$1?Symbol.for("react.concurrent_mode"):60111,n$1=b$1?Symbol.for("react.forward_ref"):60112,p$1=b$1?Symbol.for("react.suspense"):60113,q$2=b$1?
+Symbol.for("react.suspense_list"):60120,r$1=b$1?Symbol.for("react.memo"):60115,t$1=b$1?Symbol.for("react.lazy"):60116,v$1=b$1?Symbol.for("react.block"):60121,w$2=b$1?Symbol.for("react.fundamental"):60117,x$2=b$1?Symbol.for("react.responder"):60118,y$1=b$1?Symbol.for("react.scope"):60119;
+function z$1(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c$1:switch(a=a.type,a){case l$1:case m$1:case e$1:case g$1:case f$1:case p$1:return a;default:switch(a=a&&a.$$typeof,a){case k$2:case n$1:case t$1:case r$1:case h$1:return a;default:return u}}case d$1:return u}}}function A$2(a){return z$1(a)===m$1}reactIs_production_min$1.AsyncMode=l$1;reactIs_production_min$1.ConcurrentMode=m$1;reactIs_production_min$1.ContextConsumer=k$2;reactIs_production_min$1.ContextProvider=h$1;reactIs_production_min$1.Element=c$1;reactIs_production_min$1.ForwardRef=n$1;reactIs_production_min$1.Fragment=e$1;reactIs_production_min$1.Lazy=t$1;reactIs_production_min$1.Memo=r$1;reactIs_production_min$1.Portal=d$1;
+reactIs_production_min$1.Profiler=g$1;reactIs_production_min$1.StrictMode=f$1;reactIs_production_min$1.Suspense=p$1;reactIs_production_min$1.isAsyncMode=function(a){return A$2(a)||z$1(a)===l$1};reactIs_production_min$1.isConcurrentMode=A$2;reactIs_production_min$1.isContextConsumer=function(a){return z$1(a)===k$2};reactIs_production_min$1.isContextProvider=function(a){return z$1(a)===h$1};reactIs_production_min$1.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c$1};reactIs_production_min$1.isForwardRef=function(a){return z$1(a)===n$1};reactIs_production_min$1.isFragment=function(a){return z$1(a)===e$1};reactIs_production_min$1.isLazy=function(a){return z$1(a)===t$1};
+reactIs_production_min$1.isMemo=function(a){return z$1(a)===r$1};reactIs_production_min$1.isPortal=function(a){return z$1(a)===d$1};reactIs_production_min$1.isProfiler=function(a){return z$1(a)===g$1};reactIs_production_min$1.isStrictMode=function(a){return z$1(a)===f$1};reactIs_production_min$1.isSuspense=function(a){return z$1(a)===p$1};
+reactIs_production_min$1.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e$1||a===m$1||a===g$1||a===f$1||a===p$1||a===q$2||"object"===typeof a&&null!==a&&(a.$$typeof===t$1||a.$$typeof===r$1||a.$$typeof===h$1||a.$$typeof===k$2||a.$$typeof===n$1||a.$$typeof===w$2||a.$$typeof===x$2||a.$$typeof===y$1||a.$$typeof===v$1)};reactIs_production_min$1.typeOf=z$1;
 
-var reactIs_development = {};
+var reactIs_development$1 = {};
 
 /** @license React v16.13.1
  * react-is.development.js
@@ -2013,44 +2013,44 @@ function isSuspense(object) {
   return typeOf(object) === REACT_SUSPENSE_TYPE;
 }
 
-reactIs_development.AsyncMode = AsyncMode;
-reactIs_development.ConcurrentMode = ConcurrentMode;
-reactIs_development.ContextConsumer = ContextConsumer;
-reactIs_development.ContextProvider = ContextProvider;
-reactIs_development.Element = Element;
-reactIs_development.ForwardRef = ForwardRef;
-reactIs_development.Fragment = Fragment;
-reactIs_development.Lazy = Lazy;
-reactIs_development.Memo = Memo;
-reactIs_development.Portal = Portal;
-reactIs_development.Profiler = Profiler;
-reactIs_development.StrictMode = StrictMode;
-reactIs_development.Suspense = Suspense;
-reactIs_development.isAsyncMode = isAsyncMode;
-reactIs_development.isConcurrentMode = isConcurrentMode;
-reactIs_development.isContextConsumer = isContextConsumer;
-reactIs_development.isContextProvider = isContextProvider;
-reactIs_development.isElement = isElement;
-reactIs_development.isForwardRef = isForwardRef;
-reactIs_development.isFragment = isFragment;
-reactIs_development.isLazy = isLazy;
-reactIs_development.isMemo = isMemo;
-reactIs_development.isPortal = isPortal;
-reactIs_development.isProfiler = isProfiler;
-reactIs_development.isStrictMode = isStrictMode;
-reactIs_development.isSuspense = isSuspense;
-reactIs_development.isValidElementType = isValidElementType;
-reactIs_development.typeOf = typeOf;
+reactIs_development$1.AsyncMode = AsyncMode;
+reactIs_development$1.ConcurrentMode = ConcurrentMode;
+reactIs_development$1.ContextConsumer = ContextConsumer;
+reactIs_development$1.ContextProvider = ContextProvider;
+reactIs_development$1.Element = Element;
+reactIs_development$1.ForwardRef = ForwardRef;
+reactIs_development$1.Fragment = Fragment;
+reactIs_development$1.Lazy = Lazy;
+reactIs_development$1.Memo = Memo;
+reactIs_development$1.Portal = Portal;
+reactIs_development$1.Profiler = Profiler;
+reactIs_development$1.StrictMode = StrictMode;
+reactIs_development$1.Suspense = Suspense;
+reactIs_development$1.isAsyncMode = isAsyncMode;
+reactIs_development$1.isConcurrentMode = isConcurrentMode;
+reactIs_development$1.isContextConsumer = isContextConsumer;
+reactIs_development$1.isContextProvider = isContextProvider;
+reactIs_development$1.isElement = isElement;
+reactIs_development$1.isForwardRef = isForwardRef;
+reactIs_development$1.isFragment = isFragment;
+reactIs_development$1.isLazy = isLazy;
+reactIs_development$1.isMemo = isMemo;
+reactIs_development$1.isPortal = isPortal;
+reactIs_development$1.isProfiler = isProfiler;
+reactIs_development$1.isStrictMode = isStrictMode;
+reactIs_development$1.isSuspense = isSuspense;
+reactIs_development$1.isValidElementType = isValidElementType;
+reactIs_development$1.typeOf = typeOf;
   })();
 }
 
 if (process.env.NODE_ENV === 'production') {
-  reactIs$1.exports = reactIs_production_min;
+  reactIs$2.exports = reactIs_production_min$1;
 } else {
-  reactIs$1.exports = reactIs_development;
+  reactIs$2.exports = reactIs_development$1;
 }
 
-var reactIs = reactIs$1.exports;
+var reactIs$1 = reactIs$2.exports;
 var FORWARD_REF_STATICS = {
   '$$typeof': true,
   render: true,
@@ -2067,8 +2067,8 @@ var MEMO_STATICS = {
   type: true
 };
 var TYPE_STATICS = {};
-TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;
-TYPE_STATICS[reactIs.Memo] = MEMO_STATICS;
+TYPE_STATICS[reactIs$1.ForwardRef] = FORWARD_REF_STATICS;
+TYPE_STATICS[reactIs$1.Memo] = MEMO_STATICS;
 
 var isBrowser$4 = typeof document !== 'undefined';
 function getRegisteredStyles(registered, registeredStyles, classNames) {
@@ -2535,7 +2535,7 @@ var serializeStyles = function serializeStyles(args, registered, mergedProps) {
 };
 
 var isBrowser$3 = typeof document !== 'undefined';
-var hasOwnProperty$1 = {}.hasOwnProperty;
+var hasOwnProperty$2 = {}.hasOwnProperty;
 
 var EmotionCacheContext = /* #__PURE__ */React$2.createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case
 // because this module is primarily intended for the browser and node
@@ -2611,7 +2611,7 @@ var getTheme = function getTheme(outerTheme, theme) {
     throw new Error('[ThemeProvider] Please make your theme prop a plain object');
   }
 
-  return _extends$1({}, outerTheme, theme);
+  return _extends$2({}, outerTheme, theme);
 };
 
 var createCacheWithTheme = /* #__PURE__ */weakMemoize(function (outerTheme) {
@@ -2697,7 +2697,7 @@ var createEmotionProps = function createEmotionProps(type, props) {
   var newProps = {};
 
   for (var key in props) {
-    if (hasOwnProperty$1.call(props, key)) {
+    if (hasOwnProperty$2.call(props, key)) {
       newProps[key] = props[key];
     }
   }
@@ -2774,7 +2774,7 @@ var Emotion = /* #__PURE__ */withEmotionCache(function (props, cache, ref) {
   var newProps = {};
 
   for (var key in props) {
-    if (hasOwnProperty$1.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {
+    if (hasOwnProperty$2.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {
       newProps[key] = props[key];
     }
   }
@@ -3338,7 +3338,7 @@ var createStyled = function createStyled(tag, options) {
     });
 
     Styled.withComponent = function (nextTag, nextOptions) {
-      return createStyled(nextTag, _extends$1({}, options, nextOptions, {
+      return createStyled(nextTag, _extends$2({}, options, nextOptions, {
         shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)
       })).apply(void 0, styles);
     };
@@ -3569,14 +3569,14 @@ var templateObject_1$17;
 
 var Fragment = jsxRuntime.Fragment;
 function jsx(type, props, key) {
-  if (!hasOwnProperty$1.call(props, 'css')) {
+  if (!hasOwnProperty$2.call(props, 'css')) {
     return jsxRuntime.jsx(type, props, key);
   }
 
   return jsxRuntime.jsx(Emotion, createEmotionProps(type, props), key);
 }
 function jsxs(type, props, key) {
-  if (!hasOwnProperty$1.call(props, 'css')) {
+  if (!hasOwnProperty$2.call(props, 'css')) {
     return jsxRuntime.jsxs(type, props, key);
   }
 
@@ -3685,10 +3685,10 @@ var ButtonSecondaryOutline = function (props) {
         } }), void 0));
 };
 
-function k(){let e=[],t=[],r={enqueue(o){t.push(o);},requestAnimationFrame(...o){let n=requestAnimationFrame(...o);r.add(()=>cancelAnimationFrame(n));},nextFrame(...o){r.requestAnimationFrame(()=>{r.requestAnimationFrame(...o);});},setTimeout(...o){let n=setTimeout(...o);r.add(()=>clearTimeout(n));},add(o){e.push(o);},dispose(){for(let o of e.splice(0))o();},async workQueue(){for(let o of t.splice(0))await o();}};return r}function Q(){let[e]=React$2.useState(k);return React$2.useEffect(()=>()=>e.dispose(),[e]),e}var x=typeof window!="undefined"?React$2.useLayoutEffect:React$2.useEffect;var yt={serverHandoffComplete:!1};function q(){let[e,t]=React$2.useState(yt.serverHandoffComplete);return React$2.useEffect(()=>{e!==!0&&t(!0);},[e]),React$2.useEffect(()=>{yt.serverHandoffComplete===!1&&(yt.serverHandoffComplete=!0);},[]),e}var or=0;function to(){return ++or}function A(){let e=q(),[t,r]=React$2.useState(e?to:null);return x(()=>{t===null&&r(to());},[t]),t!=null?""+t:void 0}function ke(e){let t=React$2.useRef(e);return React$2.useEffect(()=>{t.current=e;},[e]),t}function ee(e,t){let[r,o]=React$2.useState(e),n=ke(e);return x(()=>o(n.current),[n,o,...t]),r}function I(...e){let t=React$2.useRef(e);return React$2.useEffect(()=>{t.current=e;},[e]),React$2.useCallback(r=>{for(let o of t.current)o!=null&&(typeof o=="function"?o(r):o.current=r);},[t])}function S(e,t,...r){if(e in t){let n=t[e];return typeof n=="function"?n(...r):n}let o=new Error(`Tried to handle "${e}" but there is no handler defined. Only defined handlers are: ${Object.keys(t).map(n=>`"${n}"`).join(", ")}.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,S),o}function E({props:e,slot:t,defaultTag:r,features:o,visible:n=!0,name:i}){if(n)return _e(e,t,r,i);let a=o!=null?o:0;if(a&2){let{static:l=!1,...s}=e;if(l)return _e(s,t,r,i)}if(a&1){let{unmount:l=!0,...s}=e;return S(l?0:1,{[0](){return null},[1](){return _e({...s,hidden:!0,style:{display:"none"}},t,r,i)}})}return _e(e,t,r,i)}function _e(e,t={},r,o){let{as:n=r,children:i,refName:a="ref",...l}=gt(e,["unmount","static"]),s=e.ref!==void 0?{[a]:e.ref}:{},u=typeof i=="function"?i(t):i;if(l.className&&typeof l.className=="function"&&(l.className=l.className(t)),n===React$2.Fragment&&Object.keys(l).length>0){if(!React$2.isValidElement(u)||Array.isArray(u)&&u.length>1)throw new Error(['Passing props on "Fragment"!',"",`The current component <${o} /> is rendering a "Fragment".`,"However we need to passthrough the following props:",Object.keys(l).map(c=>`  - ${c}`).join(`
+function k$1(){let e=[],t=[],r={enqueue(o){t.push(o);},requestAnimationFrame(...o){let n=requestAnimationFrame(...o);r.add(()=>cancelAnimationFrame(n));},nextFrame(...o){r.requestAnimationFrame(()=>{r.requestAnimationFrame(...o);});},setTimeout(...o){let n=setTimeout(...o);r.add(()=>clearTimeout(n));},add(o){e.push(o);},dispose(){for(let o of e.splice(0))o();},async workQueue(){for(let o of t.splice(0))await o();}};return r}function Q(){let[e]=React$2.useState(k$1);return React$2.useEffect(()=>()=>e.dispose(),[e]),e}var x$1=typeof window!="undefined"?React$2.useLayoutEffect:React$2.useEffect;var yt={serverHandoffComplete:!1};function q$1(){let[e,t]=React$2.useState(yt.serverHandoffComplete);return React$2.useEffect(()=>{e!==!0&&t(!0);},[e]),React$2.useEffect(()=>{yt.serverHandoffComplete===!1&&(yt.serverHandoffComplete=!0);},[]),e}var or=0;function to(){return ++or}function A$1(){let e=q$1(),[t,r]=React$2.useState(e?to:null);return x$1(()=>{t===null&&r(to());},[t]),t!=null?""+t:void 0}function ke(e){let t=React$2.useRef(e);return React$2.useEffect(()=>{t.current=e;},[e]),t}function ee(e,t){let[r,o]=React$2.useState(e),n=ke(e);return x$1(()=>o(n.current),[n,o,...t]),r}function I(...e){let t=React$2.useRef(e);return React$2.useEffect(()=>{t.current=e;},[e]),React$2.useCallback(r=>{for(let o of t.current)o!=null&&(typeof o=="function"?o(r):o.current=r);},[t])}function S(e,t,...r){if(e in t){let n=t[e];return typeof n=="function"?n(...r):n}let o=new Error(`Tried to handle "${e}" but there is no handler defined. Only defined handlers are: ${Object.keys(t).map(n=>`"${n}"`).join(", ")}.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,S),o}function E({props:e,slot:t,defaultTag:r,features:o,visible:n=!0,name:i}){if(n)return _e(e,t,r,i);let a=o!=null?o:0;if(a&2){let{static:l=!1,...s}=e;if(l)return _e(s,t,r,i)}if(a&1){let{unmount:l=!0,...s}=e;return S(l?0:1,{[0](){return null},[1](){return _e({...s,hidden:!0,style:{display:"none"}},t,r,i)}})}return _e(e,t,r,i)}function _e(e,t={},r,o){let{as:n=r,children:i,refName:a="ref",...l}=gt(e,["unmount","static"]),s=e.ref!==void 0?{[a]:e.ref}:{},u=typeof i=="function"?i(t):i;if(l.className&&typeof l.className=="function"&&(l.className=l.className(t)),n===React$2.Fragment&&Object.keys(l).length>0){if(!React$2.isValidElement(u)||Array.isArray(u)&&u.length>1)throw new Error(['Passing props on "Fragment"!',"",`The current component <${o} /> is rendering a "Fragment".`,"However we need to passthrough the following props:",Object.keys(l).map(c=>`  - ${c}`).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(c=>`  - ${c}`).join(`
 `)].join(`
-`));return React$2.cloneElement(u,Object.assign({},fr(mr(gt(l,["ref"])),u.props,["onClick"]),s))}return React$2.createElement(n,Object.assign({},gt(l,["ref"]),n!==React$2.Fragment&&s),u)}function fr(e,t,r){let o=Object.assign({},e);for(let n of r)e[n]!==void 0&&t[n]!==void 0&&Object.assign(o,{[n](i){i.defaultPrevented||e[n](i),i.defaultPrevented||t[n](i);}});return o}function D(e){var t;return Object.assign(React$2.forwardRef(e),{displayName:(t=e.displayName)!=null?t:e.name})}function mr(e){let t=Object.assign({},e);for(let r in t)t[r]===void 0&&delete t[r];return t}function gt(e,t=[]){let r=Object.assign({},e);for(let o of t)o in r&&delete r[o];return r}function br(e){throw new Error("Unexpected object: "+e)}function ae(e,t){let r=t.resolveItems();if(r.length<=0)return null;let o=t.resolveActiveIndex(),n=o!=null?o:-1,i=(()=>{switch(e.focus){case 0:return r.findIndex(a=>!t.resolveDisabled(a));case 1:{let a=r.slice().reverse().findIndex((l,s,u)=>n!==-1&&u.length-s-1>=n?!1:!t.resolveDisabled(l));return a===-1?a:r.length-1-a}case 2:return r.findIndex((a,l)=>l<=n?!1:!t.resolveDisabled(a));case 3:{let a=r.slice().reverse().findIndex(l=>!t.resolveDisabled(l));return a===-1?a:r.length-1-a}case 4:return r.findIndex(a=>t.resolveId(a)===e.id);case 5:return null;default:br(e);}})();return i===-1?o:i}function G(e){let t=e.parentElement,r=null;for(;t&&!(t instanceof HTMLFieldSetElement);)t instanceof HTMLLegendElement&&(r=t),t=t.parentElement;let o=(t==null?void 0:t.getAttribute("disabled"))==="";return o&&Tr(r)?!1:o}function Tr(e){if(!e)return !1;let t=e.previousElementSibling;for(;t!==null;){if(t instanceof HTMLLegendElement)return !1;t=t.previousElementSibling;}return !0}function w(e,t,r){let o=React$2.useRef(t);o.current=t,React$2.useEffect(()=>{function n(i){o.current.call(window,i);}return window.addEventListener(e,n,r),()=>window.removeEventListener(e,n,r)},[e,r]);}var Pt=React$2.createContext(null);Pt.displayName="OpenClosedContext";function _(){return React$2.useContext(Pt)}function W({value:e,children:t}){return React__default["default"].createElement(Pt.Provider,{value:e},t)}function ro(e){var r;if(e.type)return e.type;let t=(r=e.as)!=null?r:"button";if(typeof t=="string"&&t.toLowerCase()==="button")return "button"}function U(e,t){let[r,o]=React$2.useState(()=>ro(e));return x(()=>{o(ro(e));},[e.type,e.as]),x(()=>{r||!t.current||t.current instanceof HTMLButtonElement&&!t.current.hasAttribute("type")&&o("button");},[r,t]),r}function se({container:e,accept:t,walk:r,enabled:o=!0}){let n=React$2.useRef(t),i=React$2.useRef(r);React$2.useEffect(()=>{n.current=t,i.current=r;},[t,r]),x(()=>{if(!e||!o)return;let a=n.current,l=i.current,s=Object.assign(c=>a(c),{acceptNode:a}),u=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,s,!1);for(;u.nextNode();)l(u.currentNode);},[e,o,n,i]);}var Ar={[1](e){return e.disabled||e.comboboxState===1?e:{...e,activeOptionIndex:null,comboboxState:1}},[0](e){return e.disabled||e.comboboxState===0?e:{...e,comboboxState:0}},[2](e,t){return e.disabled===t.disabled?e:{...e,disabled:t.disabled}},[3](e,t){if(e.disabled||e.optionsRef.current&&!e.optionsPropsRef.current.static&&e.comboboxState===1)return e;let r=ae(t,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:o=>o.id,resolveDisabled:o=>o.dataRef.current.disabled});return e.activeOptionIndex===r?e:{...e,activeOptionIndex:r}},[4]:(e,t)=>{var i;let r=e.activeOptionIndex!==null?e.options[e.activeOptionIndex]:null,o=Array.from((i=e.optionsRef.current)==null?void 0:i.querySelectorAll('[id^="headlessui-combobox-option-"]')).reduce((a,l,s)=>Object.assign(a,{[l.id]:s}),{}),n=[...e.options,{id:t.id,dataRef:t.dataRef}].sort((a,l)=>o[a.id]-o[l.id]);return {...e,options:n,activeOptionIndex:(()=>r===null?null:n.indexOf(r))()}},[5]:(e,t)=>{let r=e.options.slice(),o=e.activeOptionIndex!==null?r[e.activeOptionIndex]:null,n=r.findIndex(i=>i.id===t.id);return n!==-1&&r.splice(n,1),{...e,options:r,activeOptionIndex:(()=>n===e.activeOptionIndex||o===null?null:r.indexOf(o))()}}},vt=React$2.createContext(null);vt.displayName="ComboboxContext";function pe(e){let t=React$2.useContext(vt);if(t===null){let r=new Error(`<${e} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,pe),r}return t}var Rt=React$2.createContext(null);Rt.displayName="ComboboxActions";function Ue(){let e=React$2.useContext(Rt);if(e===null){let t=new Error("ComboboxActions is missing a parent <Combobox /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(t,Ue),t}return e}function hr(e,t){return S(t.type,Ar,e,t)}var Or=React$2.Fragment,Ir=D(function(t,r){let{value:o,onChange:n,disabled:i=!1,...a}=t,l=React$2.useRef({value:o,onChange:n}),s=React$2.useRef({static:!1,hold:!1}),u=React$2.useRef({displayValue:void 0}),c=React$2.useReducer(hr,{comboboxState:1,comboboxPropsRef:l,optionsPropsRef:s,inputPropsRef:u,labelRef:React$2.createRef(),inputRef:React$2.createRef(),buttonRef:React$2.createRef(),optionsRef:React$2.createRef(),disabled:i,options:[],activeOptionIndex:null}),[{comboboxState:m,options:b,activeOptionIndex:T,optionsRef:y,inputRef:p,buttonRef:f},d]=c;x(()=>{l.current.value=o;},[o,l]),x(()=>{l.current.onChange=n;},[n,l]),x(()=>d({type:2,disabled:i}),[i]),w("mousedown",O=>{var N,K,V;let L=O.target;m===0&&(((N=f.current)==null?void 0:N.contains(L))||((K=p.current)==null?void 0:K.contains(L))||((V=y.current)==null?void 0:V.contains(L))||d({type:1}));});let P=T===null?null:b[T].dataRef.current.value,C=React$2.useMemo(()=>({open:m===0,disabled:i,activeIndex:T,activeOption:P}),[m,i,b,T]),R=React$2.useCallback(()=>{if(!p.current||o===void 0)return;let O=u.current.displayValue;typeof O=="function"?p.current.value=O(o):typeof o=="string"&&(p.current.value=o);},[o,p,u]),g=React$2.useCallback(O=>{let L=b.find(K=>K.id===O);if(!L)return;let{dataRef:N}=L;l.current.onChange(N.current.value),R();},[b,l,p]),v=React$2.useCallback(()=>{if(T!==null){let{dataRef:O}=b[T];l.current.onChange(O.current.value),R();}},[T,b,l,p]),h=React$2.useMemo(()=>({selectOption:g,selectActiveOption:v}),[g,v]);return x(()=>{m===1&&R();},[R,m]),x(R,[R]),React__default["default"].createElement(Rt.Provider,{value:h},React__default["default"].createElement(vt.Provider,{value:c},React__default["default"].createElement(W,{value:S(m,{[0]:0,[1]:1})},E({props:r===null?a:{...a,ref:r},slot:C,defaultTag:Or,name:"Combobox"}))))}),Lr="input",Dr=D(function(t,r){var R,g;let{value:o,onChange:n,displayValue:i,...a}=t,[l,s]=pe("Combobox.Input"),u=Ue(),c=I(l.inputRef,r),m=l.inputPropsRef,b=`headlessui-combobox-input-${A()}`,T=Q(),y=ke(n);x(()=>{m.current.displayValue=i;},[i,m]);let p=React$2.useCallback(v=>{switch(v.key){case"Enter":v.preventDefault(),v.stopPropagation(),u.selectActiveOption(),s({type:1});break;case"ArrowDown":return v.preventDefault(),v.stopPropagation(),S(l.comboboxState,{[0]:()=>s({type:3,focus:2}),[1]:()=>{s({type:0}),T.nextFrame(()=>{l.comboboxPropsRef.current.value||s({type:3,focus:0});});}});case"ArrowUp":return v.preventDefault(),v.stopPropagation(),S(l.comboboxState,{[0]:()=>s({type:3,focus:1}),[1]:()=>{s({type:0}),T.nextFrame(()=>{l.comboboxPropsRef.current.value||s({type:3,focus:3});});}});case"Home":case"PageUp":return v.preventDefault(),v.stopPropagation(),s({type:3,focus:0});case"End":case"PageDown":return v.preventDefault(),v.stopPropagation(),s({type:3,focus:3});case"Escape":return v.preventDefault(),l.optionsRef.current&&!l.optionsPropsRef.current.static&&v.stopPropagation(),s({type:1});case"Tab":u.selectActiveOption(),s({type:1});break}},[T,s,l,u]),f=React$2.useCallback(v=>{var h;s({type:0}),(h=y.current)==null||h.call(y,v);},[s,y]),d=ee(()=>{if(!!l.labelRef.current)return [l.labelRef.current.id].join(" ")},[l.labelRef.current]),P=React$2.useMemo(()=>({open:l.comboboxState===0,disabled:l.disabled}),[l]),C={ref:c,id:b,role:"combobox",type:"text","aria-controls":(R=l.optionsRef.current)==null?void 0:R.id,"aria-expanded":l.disabled?void 0:l.comboboxState===0,"aria-activedescendant":l.activeOptionIndex===null||(g=l.options[l.activeOptionIndex])==null?void 0:g.id,"aria-labelledby":d,disabled:l.disabled,onKeyDown:p,onChange:f};return E({props:{...a,...C},slot:P,defaultTag:Lr,name:"Combobox.Input"})}),Mr="button",Fr=D(function(t,r){var p;let[o,n]=pe("Combobox.Button"),i=Ue(),a=I(o.buttonRef,r),l=`headlessui-combobox-button-${A()}`,s=Q(),u=React$2.useCallback(f=>{switch(f.key){case"ArrowDown":return f.preventDefault(),f.stopPropagation(),o.comboboxState===1&&(n({type:0}),s.nextFrame(()=>{o.comboboxPropsRef.current.value||n({type:3,focus:0});})),s.nextFrame(()=>{var d;return (d=o.inputRef.current)==null?void 0:d.focus({preventScroll:!0})});case"ArrowUp":return f.preventDefault(),f.stopPropagation(),o.comboboxState===1&&(n({type:0}),s.nextFrame(()=>{o.comboboxPropsRef.current.value||n({type:3,focus:3});})),s.nextFrame(()=>{var d;return (d=o.inputRef.current)==null?void 0:d.focus({preventScroll:!0})});case"Escape":return f.preventDefault(),o.optionsRef.current&&!o.optionsPropsRef.current.static&&f.stopPropagation(),n({type:1}),s.nextFrame(()=>{var d;return (d=o.inputRef.current)==null?void 0:d.focus({preventScroll:!0})})}},[s,n,o,i]),c=React$2.useCallback(f=>{if(G(f.currentTarget))return f.preventDefault();o.comboboxState===0?n({type:1}):(f.preventDefault(),n({type:0})),s.nextFrame(()=>{var d;return (d=o.inputRef.current)==null?void 0:d.focus({preventScroll:!0})});},[n,s,o]),m=ee(()=>{if(!!o.labelRef.current)return [o.labelRef.current.id,l].join(" ")},[o.labelRef.current,l]),b=React$2.useMemo(()=>({open:o.comboboxState===0,disabled:o.disabled}),[o]),T=t,y={ref:a,id:l,type:U(t,o.buttonRef),tabIndex:-1,"aria-haspopup":!0,"aria-controls":(p=o.optionsRef.current)==null?void 0:p.id,"aria-expanded":o.disabled?void 0:o.comboboxState===0,"aria-labelledby":m,disabled:o.disabled,onClick:c,onKeyDown:u};return E({props:{...T,...y},slot:b,defaultTag:Mr,name:"Combobox.Button"})}),wr="label";function kr(e){let[t]=pe("Combobox.Label"),r=`headlessui-combobox-label-${A()}`,o=React$2.useCallback(()=>{var a;return (a=t.inputRef.current)==null?void 0:a.focus({preventScroll:!0})},[t.inputRef]),n=React$2.useMemo(()=>({open:t.comboboxState===0,disabled:t.disabled}),[t]),i={ref:t.labelRef,id:r,onClick:o};return E({props:{...e,...i},slot:n,defaultTag:wr,name:"Combobox.Label"})}var _r="ul",Gr=1|2,Hr=D(function(t,r){var y;let{hold:o=!1,...n}=t,[i]=pe("Combobox.Options"),{optionsPropsRef:a}=i,l=I(i.optionsRef,r),s=`headlessui-combobox-options-${A()}`,u=_(),c=(()=>u!==null?u===0:i.comboboxState===0)();x(()=>{var p;a.current.static=(p=t.static)!=null?p:!1;},[a,t.static]),x(()=>{a.current.hold=o;},[o,a]),se({container:i.optionsRef.current,enabled:i.comboboxState===0,accept(p){return p.getAttribute("role")==="option"?NodeFilter.FILTER_REJECT:p.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(p){p.setAttribute("role","none");}});let m=ee(()=>{var p,f,d;return (d=(p=i.labelRef.current)==null?void 0:p.id)!=null?d:(f=i.buttonRef.current)==null?void 0:f.id},[i.labelRef.current,i.buttonRef.current]),b=React$2.useMemo(()=>({open:i.comboboxState===0}),[i]),T={"aria-activedescendant":i.activeOptionIndex===null||(y=i.options[i.activeOptionIndex])==null?void 0:y.id,"aria-labelledby":m,role:"listbox",id:s,ref:l};return E({props:{...n,...T},slot:b,defaultTag:_r,features:Gr,visible:c,name:"Combobox.Options"})}),Ur="li";function Br(e){let{disabled:t=!1,value:r,...o}=e,[n,i]=pe("Combobox.Option"),a=Ue(),l=`headlessui-combobox-option-${A()}`,s=n.activeOptionIndex!==null?n.options[n.activeOptionIndex].id===l:!1,u=n.comboboxPropsRef.current.value===r,c=React$2.useRef({disabled:t,value:r});x(()=>{c.current.disabled=t;},[c,t]),x(()=>{c.current.value=r;},[c,r]),x(()=>{var P,C;c.current.textValue=(C=(P=document.getElementById(l))==null?void 0:P.textContent)==null?void 0:C.toLowerCase();},[c,l]);let m=React$2.useCallback(()=>a.selectOption(l),[a,l]);x(()=>(i({type:4,id:l,dataRef:c}),()=>i({type:5,id:l})),[c,l]),x(()=>{n.comboboxState===0&&(!u||i({type:3,focus:4,id:l}));},[n.comboboxState,u,l]),x(()=>{if(n.comboboxState!==0||!s)return;let P=k();return P.requestAnimationFrame(()=>{var C,R;(R=(C=document.getElementById(l))==null?void 0:C.scrollIntoView)==null||R.call(C,{block:"nearest"});}),P.dispose},[l,s,n.comboboxState,n.activeOptionIndex]);let b=React$2.useCallback(P=>{if(t)return P.preventDefault();m(),i({type:1}),k().nextFrame(()=>{var C;return (C=n.inputRef.current)==null?void 0:C.focus({preventScroll:!0})});},[i,n.inputRef,t,m]),T=React$2.useCallback(()=>{if(t)return i({type:3,focus:5});i({type:3,focus:4,id:l});},[t,l,i]),y=React$2.useCallback(()=>{t||s||i({type:3,focus:4,id:l});},[t,s,l,i]),p=React$2.useCallback(()=>{t||!s||n.optionsPropsRef.current.hold||i({type:3,focus:5});},[t,s,i,n.comboboxState,n.comboboxPropsRef]),f=React$2.useMemo(()=>({active:s,selected:u,disabled:t}),[s,u,t]);return E({props:{...o,...{id:l,role:"option",tabIndex:t===!0?void 0:-1,"aria-disabled":t===!0?!0:void 0,"aria-selected":u===!0?!0:void 0,disabled:void 0,onClick:b,onFocus:T,onPointerMove:y,onMouseMove:y,onPointerLeave:p,onMouseLeave:p}},slot:f,defaultTag:Ur,name:"Combobox.Option"})}Object.assign(Ir,{Input:Dr,Button:Fr,Label:kr,Options:Hr,Option:Br});var Et=["[contentEditable=true]","[tabindex]","a[href]","area[href]","button:not([disabled])","iframe","input:not([disabled])","select:not([disabled])","textarea:not([disabled])"].map(e=>`${e}:not([tabindex='-1'])`).join(",");function xe(e=document.body){return e==null?[]:Array.from(e.querySelectorAll(Et))}function de(e,t=0){return e===document.body?!1:S(t,{[0](){return e.matches(Et)},[1](){let r=e;for(;r!==null;){if(r.matches(Et))return !0;r=r.parentElement;}return !1}})}function ce(e){e==null||e.focus({preventScroll:!0});}function M(e,t){let r=Array.isArray(e)?e.slice().sort((c,m)=>{let b=c.compareDocumentPosition(m);return b&Node.DOCUMENT_POSITION_FOLLOWING?-1:b&Node.DOCUMENT_POSITION_PRECEDING?1:0}):xe(e),o=document.activeElement,n=(()=>{if(t&(1|4))return 1;if(t&(2|8))return -1;throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last")})(),i=(()=>{if(t&1)return 0;if(t&2)return Math.max(0,r.indexOf(o))-1;if(t&4)return Math.max(0,r.indexOf(o))+1;if(t&8)return r.length-1;throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last")})(),a=t&32?{preventScroll:!0}:{},l=0,s=r.length,u;do{if(l>=s||l+s<=0)return 0;let c=i+l;if(t&16)c=(c+s)%s;else {if(c<0)return 3;if(c>=s)return 1}u=r[c],u==null||u.focus(a),l+=n;}while(u!==document.activeElement);return u.hasAttribute("tabindex")||u.setAttribute("tabindex","0"),2}function Be(){let e=React$2.useRef(!1);return React$2.useEffect(()=>(e.current=!0,()=>{e.current=!1;}),[]),e}function Ne(e,t=30,{initialFocus:r,containers:o}={}){let n=React$2.useRef(typeof window!="undefined"?document.activeElement:null),i=React$2.useRef(null),a=Be(),l=Boolean(t&16),s=Boolean(t&2);React$2.useEffect(()=>{!l||(n.current=document.activeElement);},[l]),React$2.useEffect(()=>{if(!!l)return ()=>{ce(n.current),n.current=null;}},[l]),React$2.useEffect(()=>{if(!s||!e.current)return;let u=document.activeElement;if(r==null?void 0:r.current){if((r==null?void 0:r.current)===u){i.current=u;return}}else if(e.current.contains(u)){i.current=u;return}(r==null?void 0:r.current)?ce(r.current):M(e.current,1)===0&&console.warn("There are no focusable elements inside the <FocusTrap />"),i.current=document.activeElement;},[e,r,s]),w("keydown",u=>{!(t&4)||!e.current||u.key==="Tab"&&(u.preventDefault(),M(e.current,(u.shiftKey?2:4)|16)===2&&(i.current=document.activeElement));}),w("focus",u=>{if(!(t&8))return;let c=new Set(o==null?void 0:o.current);if(c.add(e),!c.size)return;let m=i.current;if(!m||!a.current)return;let b=u.target;b&&b instanceof HTMLElement?Kr(c,b)?(i.current=b,ce(b)):(u.preventDefault(),u.stopPropagation(),ce(m)):ce(i.current);},!0);}function Kr(e,t){var r;for(let o of e)if((r=o.current)==null?void 0:r.contains(t))return !0;return !1}var fe=new Set,J=new Map;function po(e){e.setAttribute("aria-hidden","true"),e.inert=!0;}function co(e){let t=J.get(e);!t||(t["aria-hidden"]===null?e.removeAttribute("aria-hidden"):e.setAttribute("aria-hidden",t["aria-hidden"]),e.inert=t.inert);}function fo(e,t=!0){x(()=>{if(!t||!e.current)return;let r=e.current;fe.add(r);for(let o of J.keys())o.contains(r)&&(co(o),J.delete(o));return document.querySelectorAll("body > *").forEach(o=>{if(o instanceof HTMLElement){for(let n of fe)if(o.contains(n))return;fe.size===1&&(J.set(o,{"aria-hidden":o.getAttribute("aria-hidden"),inert:o.inert}),po(o));}}),()=>{if(fe.delete(r),fe.size>0)document.querySelectorAll("body > *").forEach(o=>{if(o instanceof HTMLElement&&!J.has(o)){for(let n of fe)if(o.contains(n))return;J.set(o,{"aria-hidden":o.getAttribute("aria-hidden"),inert:o.inert}),po(o);}});else for(let o of J.keys())co(o),J.delete(o);}},[t]);}var mo=React$2.createContext(!1);function bo(){return React$2.useContext(mo)}function At(e){return React__default["default"].createElement(mo.Provider,{value:e.force},e.children)}function Xr(){let e=bo(),t=React$2.useContext(Po),[r,o]=React$2.useState(()=>{if(!e&&t!==null||typeof window=="undefined")return null;let n=document.getElementById("headlessui-portal-root");if(n)return n;let i=document.createElement("div");return i.setAttribute("id","headlessui-portal-root"),document.body.appendChild(i)});return React$2.useEffect(()=>{r!==null&&(document.body.contains(r)||document.body.appendChild(r));},[r]),React$2.useEffect(()=>{e||t!==null&&o(t.current);},[t,o,e]),r}var Jr=React$2.Fragment;function We(e){let t=e,r=Xr(),[o]=React$2.useState(()=>typeof window=="undefined"?null:document.createElement("div")),n=q();return x(()=>{if(!!r&&!!o)return r.appendChild(o),()=>{var i;!r||!o||(r.removeChild(o),r.childNodes.length<=0&&((i=r.parentElement)==null||i.removeChild(r)));}},[r,o]),n?!r||!o?null:reactDom.createPortal(E({props:t,defaultTag:Jr,name:"Portal"}),o):null}var Zr=React$2.Fragment,Po=React$2.createContext(null);function en(e){let{target:t,...r}=e;return React__default["default"].createElement(Po.Provider,{value:t},E({props:r,defaultTag:Zr,name:"Popover.Group"}))}We.Group=en;var vo=React$2.createContext(null);function Ro(){let e=React$2.useContext(vo);if(e===null){let t=new Error("You used a <Description /> component, but it is not inside a relevant parent.");throw Error.captureStackTrace&&Error.captureStackTrace(t,Ro),t}return e}function re(){let[e,t]=React$2.useState([]);return [e.length>0?e.join(" "):void 0,React$2.useMemo(()=>function(o){let n=React$2.useCallback(a=>(t(l=>[...l,a]),()=>t(l=>{let s=l.slice(),u=s.indexOf(a);return u!==-1&&s.splice(u,1),s})),[]),i=React$2.useMemo(()=>({register:n,slot:o.slot,name:o.name,props:o.props}),[n,o.slot,o.name,o.props]);return React__default["default"].createElement(vo.Provider,{value:i},o.children)},[t])]}var an="p";function me(e){let t=Ro(),r=`headlessui-description-${A()}`;x(()=>t.register(r),[r,t.register]);let o=e,n={...t.props,id:r};return E({props:{...o,...n},slot:t.slot||{},defaultTag:an,name:t.name||"Description"})}var ht=React$2.createContext(()=>{});ht.displayName="StackContext";function cn(){return React$2.useContext(ht)}function Eo({children:e,onUpdate:t,type:r,element:o}){let n=cn(),i=React$2.useCallback((...a)=>{t==null||t(...a),n(...a);},[n,t]);return x(()=>(i(0,r,o),()=>i(1,r,o)),[i,r,o]),React__default["default"].createElement(ht.Provider,{value:i},e)}var yn={[0](e,t){return e.titleId===t.id?e:{...e,titleId:t.id}}},Ve=React$2.createContext(null);Ve.displayName="DialogContext";function It(e){let t=React$2.useContext(Ve);if(t===null){let r=new Error(`<${e} /> is missing a parent <${An.displayName} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,It),r}return t}function gn(e,t){return S(t.type,yn,e,t)}var Pn="div",xn=1|2,vn=D(function(t,r){let{open:o,onClose:n,initialFocus:i,...a}=t,[l,s]=React$2.useState(0),u=_();o===void 0&&u!==null&&(o=S(u,{[0]:!0,[1]:!1}));let c=React$2.useRef(new Set),m=React$2.useRef(null),b=I(m,r),T=t.hasOwnProperty("open")||u!==null,y=t.hasOwnProperty("onClose");if(!T&&!y)throw new Error("You have to provide an `open` and an `onClose` prop to the `Dialog` component.");if(!T)throw new Error("You provided an `onClose` prop to the `Dialog`, but forgot an `open` prop.");if(!y)throw new Error("You provided an `open` prop to the `Dialog`, but forgot an `onClose` prop.");if(typeof o!="boolean")throw new Error(`You provided an \`open\` prop to the \`Dialog\`, but the value is not a boolean. Received: ${o}`);if(typeof n!="function")throw new Error(`You provided an \`onClose\` prop to the \`Dialog\`, but the value is not a function. Received: ${n}`);let p=o?0:1,f=(()=>u!==null?u===0:p===0)(),[d,P]=React$2.useReducer(gn,{titleId:null,descriptionId:null}),C=React$2.useCallback(()=>n(!1),[n]),R=React$2.useCallback(F=>P({type:0,id:F}),[P]),v=q()&&p===0,h=l>1,O=React$2.useContext(Ve)!==null;Ne(m,v?S(h?"parent":"leaf",{parent:16,leaf:30}):1,{initialFocus:i,containers:c}),fo(m,h?v:!1),w("mousedown",F=>{var H;let $=F.target;p===0&&(h||((H=m.current)==null?void 0:H.contains($))||C());}),w("keydown",F=>{F.key==="Escape"&&p===0&&(h||(F.preventDefault(),F.stopPropagation(),C()));}),React$2.useEffect(()=>{if(p!==0||O)return;let F=document.documentElement.style.overflow,$=document.documentElement.style.paddingRight,H=window.innerWidth-document.documentElement.clientWidth;return document.documentElement.style.overflow="hidden",document.documentElement.style.paddingRight=`${H}px`,()=>{document.documentElement.style.overflow=F,document.documentElement.style.paddingRight=$;}},[p,O]),React$2.useEffect(()=>{if(p!==0||!m.current)return;let F=new IntersectionObserver($=>{for(let H of $)H.boundingClientRect.x===0&&H.boundingClientRect.y===0&&H.boundingClientRect.width===0&&H.boundingClientRect.height===0&&C();});return F.observe(m.current),()=>F.disconnect()},[p,m,C]);let[N,K]=re(),V=`headlessui-dialog-${A()}`,Fe=React$2.useMemo(()=>[{dialogState:p,close:C,setTitleId:R},d],[p,d,C,R]),ge=React$2.useMemo(()=>({open:p===0}),[p]),we={ref:b,id:V,role:"dialog","aria-modal":p===0?!0:void 0,"aria-labelledby":d.titleId,"aria-describedby":N,onClick(F){F.stopPropagation();}},X=a;return React__default["default"].createElement(Eo,{type:"Dialog",element:m,onUpdate:React$2.useCallback((F,$,H)=>{$==="Dialog"&&S(F,{[0](){c.current.add(H),s(Pe=>Pe+1);},[1](){c.current.add(H),s(Pe=>Pe-1);}});},[])},React__default["default"].createElement(At,{force:!0},React__default["default"].createElement(We,null,React__default["default"].createElement(Ve.Provider,{value:Fe},React__default["default"].createElement(We.Group,{target:m},React__default["default"].createElement(At,{force:!1},React__default["default"].createElement(K,{slot:ge,name:"Dialog.Description"},E({props:{...X,...we},slot:ge,defaultTag:Pn,features:xn,visible:f,name:"Dialog"}))))))))}),Rn="div",En=D(function(t,r){let[{dialogState:o,close:n}]=It("Dialog.Overlay"),i=I(r),a=`headlessui-dialog-overlay-${A()}`,l=React$2.useCallback(m=>{if(m.target===m.currentTarget){if(G(m.currentTarget))return m.preventDefault();m.preventDefault(),m.stopPropagation(),n();}},[n]),s=React$2.useMemo(()=>({open:o===0}),[o]);return E({props:{...t,...{ref:i,id:a,"aria-hidden":!0,onClick:l}},slot:s,defaultTag:Rn,name:"Dialog.Overlay"})}),Cn="h2";function Sn(e){let[{dialogState:t,setTitleId:r}]=It("Dialog.Title"),o=`headlessui-dialog-title-${A()}`;React$2.useEffect(()=>(r(o),()=>r(null)),[o,r]);let n=React$2.useMemo(()=>({open:t===0}),[t]);return E({props:{...e,...{id:o}},slot:n,defaultTag:Cn,name:"Dialog.Title"})}var An=Object.assign(vn,{Overlay:En,Title:Sn,Description:me});var Ln={[0]:e=>({...e,disclosureState:S(e.disclosureState,{[0]:1,[1]:0})}),[1]:e=>e.disclosureState===1?e:{...e,disclosureState:1},[4](e){return e.linkedPanel===!0?e:{...e,linkedPanel:!0}},[5](e){return e.linkedPanel===!1?e:{...e,linkedPanel:!1}},[2](e,t){return e.buttonId===t.buttonId?e:{...e,buttonId:t.buttonId}},[3](e,t){return e.panelId===t.panelId?e:{...e,panelId:t.panelId}}},Mt=React$2.createContext(null);Mt.displayName="DisclosureContext";function Ft(e){let t=React$2.useContext(Mt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Ye.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Ft),r}return t}var wt=React$2.createContext(null);wt.displayName="DisclosureAPIContext";function Ao(e){let t=React$2.useContext(wt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Ye.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Ao),r}return t}var kt=React$2.createContext(null);kt.displayName="DisclosurePanelContext";function Dn(){return React$2.useContext(kt)}function Mn(e,t){return S(t.type,Ln,e,t)}var Fn=React$2.Fragment;function Ye(e){let{defaultOpen:t=!1,...r}=e,o=`headlessui-disclosure-button-${A()}`,n=`headlessui-disclosure-panel-${A()}`,i=React$2.useReducer(Mn,{disclosureState:t?0:1,linkedPanel:!1,buttonId:o,panelId:n}),[{disclosureState:a},l]=i;React$2.useEffect(()=>l({type:2,buttonId:o}),[o,l]),React$2.useEffect(()=>l({type:3,panelId:n}),[n,l]);let s=React$2.useCallback(m=>{l({type:1});let b=(()=>m?m instanceof HTMLElement?m:m.current instanceof HTMLElement?m.current:document.getElementById(o):document.getElementById(o))();b==null||b.focus();},[l,o]),u=React$2.useMemo(()=>({close:s}),[s]),c=React$2.useMemo(()=>({open:a===0,close:s}),[a,s]);return React__default["default"].createElement(Mt.Provider,{value:i},React__default["default"].createElement(wt.Provider,{value:u},React__default["default"].createElement(W,{value:S(a,{[0]:0,[1]:1})},E({props:r,slot:c,defaultTag:Fn,name:"Disclosure"}))))}var wn="button",kn=D(function(t,r){let[o,n]=Ft("Disclosure.Button"),i=React$2.useRef(null),a=I(i,r),l=Dn(),s=l===null?!1:l===o.panelId,u=React$2.useCallback(f=>{var d;if(s){if(o.disclosureState===1)return;switch(f.key){case" ":case"Enter":f.preventDefault(),f.stopPropagation(),n({type:0}),(d=document.getElementById(o.buttonId))==null||d.focus();break}}else switch(f.key){case" ":case"Enter":f.preventDefault(),f.stopPropagation(),n({type:0});break}},[n,s,o.disclosureState,o.buttonId]),c=React$2.useCallback(f=>{switch(f.key){case" ":f.preventDefault();break}},[]),m=React$2.useCallback(f=>{var d;G(f.currentTarget)||t.disabled||(s?(n({type:0}),(d=document.getElementById(o.buttonId))==null||d.focus()):n({type:0}));},[n,t.disabled,o.buttonId,s]),b=React$2.useMemo(()=>({open:o.disclosureState===0}),[o]),T=U(t,i),y=t,p=s?{ref:a,type:T,onKeyDown:u,onClick:m}:{ref:a,id:o.buttonId,type:T,"aria-expanded":t.disabled?void 0:o.disclosureState===0,"aria-controls":o.linkedPanel?o.panelId:void 0,onKeyDown:u,onKeyUp:c,onClick:m};return E({props:{...y,...p},slot:b,defaultTag:wn,name:"Disclosure.Button"})}),_n="div",Gn=1|2,Hn=D(function(t,r){let[o,n]=Ft("Disclosure.Panel"),{close:i}=Ao("Disclosure.Panel"),a=I(r,()=>{o.linkedPanel||n({type:4});}),l=_(),s=(()=>l!==null?l===0:o.disclosureState===0)();React$2.useEffect(()=>()=>n({type:5}),[n]),React$2.useEffect(()=>{var b;o.disclosureState===1&&((b=t.unmount)!=null?b:!0)&&n({type:5});},[o.disclosureState,t.unmount,n]);let u=React$2.useMemo(()=>({open:o.disclosureState===0,close:i}),[o,i]),c={ref:a,id:o.panelId},m=t;return React__default["default"].createElement(kt.Provider,{value:o.panelId},E({props:{...m,...c},slot:u,defaultTag:_n,features:Gn,visible:s,name:"Disclosure.Panel"}))});Ye.Button=kn;Ye.Panel=Hn;var $n={[1](e){return e.disabled||e.listboxState===1?e:{...e,activeOptionIndex:null,listboxState:1}},[0](e){return e.disabled||e.listboxState===0?e:{...e,listboxState:0}},[2](e,t){return e.disabled===t.disabled?e:{...e,disabled:t.disabled}},[3](e,t){return e.orientation===t.orientation?e:{...e,orientation:t.orientation}},[4](e,t){if(e.disabled||e.listboxState===1)return e;let r=ae(t,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:o=>o.id,resolveDisabled:o=>o.dataRef.current.disabled});return e.searchQuery===""&&e.activeOptionIndex===r?e:{...e,searchQuery:"",activeOptionIndex:r}},[5]:(e,t)=>{if(e.disabled||e.listboxState===1)return e;let o=e.searchQuery!==""?0:1,n=e.searchQuery+t.value.toLowerCase(),a=(e.activeOptionIndex!==null?e.options.slice(e.activeOptionIndex+o).concat(e.options.slice(0,e.activeOptionIndex+o)):e.options).find(s=>{var u;return !s.dataRef.current.disabled&&((u=s.dataRef.current.textValue)==null?void 0:u.startsWith(n))}),l=a?e.options.indexOf(a):-1;return l===-1||l===e.activeOptionIndex?{...e,searchQuery:n}:{...e,searchQuery:n,activeOptionIndex:l}},[6](e){return e.disabled||e.listboxState===1||e.searchQuery===""?e:{...e,searchQuery:""}},[7]:(e,t)=>{var n;let r=Array.from((n=e.optionsRef.current)==null?void 0:n.querySelectorAll('[id^="headlessui-listbox-option-"]')).reduce((i,a,l)=>Object.assign(i,{[a.id]:l}),{}),o=[...e.options,{id:t.id,dataRef:t.dataRef}].sort((i,a)=>r[i.id]-r[a.id]);return {...e,options:o}},[8]:(e,t)=>{let r=e.options.slice(),o=e.activeOptionIndex!==null?r[e.activeOptionIndex]:null,n=r.findIndex(i=>i.id===t.id);return n!==-1&&r.splice(n,1),{...e,options:r,activeOptionIndex:(()=>n===e.activeOptionIndex||o===null?null:r.indexOf(o))()}}},Gt=React$2.createContext(null);Gt.displayName="ListboxContext";function Re(e){let t=React$2.useContext(Gt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Ee.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Re),r}return t}function Qn(e,t){return S(t.type,$n,e,t)}var qn=React$2.Fragment;function Ee(e){let{value:t,onChange:r,disabled:o=!1,horizontal:n=!1,...i}=e,a=n?"horizontal":"vertical",l=React$2.useReducer(Qn,{listboxState:1,propsRef:{current:{value:t,onChange:r}},labelRef:React$2.createRef(),buttonRef:React$2.createRef(),optionsRef:React$2.createRef(),disabled:o,orientation:a,options:[],searchQuery:"",activeOptionIndex:null}),[{listboxState:s,propsRef:u,optionsRef:c,buttonRef:m},b]=l;x(()=>{u.current.value=t;},[t,u]),x(()=>{u.current.onChange=r;},[r,u]),x(()=>b({type:2,disabled:o}),[o]),x(()=>b({type:3,orientation:a}),[a]),w("mousedown",y=>{var f,d,P;let p=y.target;s===0&&(((f=m.current)==null?void 0:f.contains(p))||((d=c.current)==null?void 0:d.contains(p))||(b({type:1}),de(p,1)||(y.preventDefault(),(P=m.current)==null||P.focus())));});let T=React$2.useMemo(()=>({open:s===0,disabled:o}),[s,o]);return React__default["default"].createElement(Gt.Provider,{value:l},React__default["default"].createElement(W,{value:S(s,{[0]:0,[1]:1})},E({props:i,slot:T,defaultTag:qn,name:"Listbox"})))}var zn="button",Yn=D(function(t,r){var p;let[o,n]=Re("Listbox.Button"),i=I(o.buttonRef,r),a=`headlessui-listbox-button-${A()}`,l=Q(),s=React$2.useCallback(f=>{switch(f.key){case" ":case"Enter":case"ArrowDown":f.preventDefault(),n({type:0}),l.nextFrame(()=>{o.propsRef.current.value||n({type:4,focus:0});});break;case"ArrowUp":f.preventDefault(),n({type:0}),l.nextFrame(()=>{o.propsRef.current.value||n({type:4,focus:3});});break}},[n,o,l]),u=React$2.useCallback(f=>{switch(f.key){case" ":f.preventDefault();break}},[]),c=React$2.useCallback(f=>{if(G(f.currentTarget))return f.preventDefault();o.listboxState===0?(n({type:1}),l.nextFrame(()=>{var d;return (d=o.buttonRef.current)==null?void 0:d.focus({preventScroll:!0})})):(f.preventDefault(),n({type:0}));},[n,l,o]),m=ee(()=>{if(!!o.labelRef.current)return [o.labelRef.current.id,a].join(" ")},[o.labelRef.current,a]),b=React$2.useMemo(()=>({open:o.listboxState===0,disabled:o.disabled}),[o]),T=t,y={ref:i,id:a,type:U(t,o.buttonRef),"aria-haspopup":!0,"aria-controls":(p=o.optionsRef.current)==null?void 0:p.id,"aria-expanded":o.disabled?void 0:o.listboxState===0,"aria-labelledby":m,disabled:o.disabled,onKeyDown:s,onKeyUp:u,onClick:c};return E({props:{...T,...y},slot:b,defaultTag:zn,name:"Listbox.Button"})}),Xn="label";function Jn(e){let[t]=Re("Listbox.Label"),r=`headlessui-listbox-label-${A()}`,o=React$2.useCallback(()=>{var a;return (a=t.buttonRef.current)==null?void 0:a.focus({preventScroll:!0})},[t.buttonRef]),n=React$2.useMemo(()=>({open:t.listboxState===0,disabled:t.disabled}),[t]),i={ref:t.labelRef,id:r,onClick:o};return E({props:{...e,...i},slot:n,defaultTag:Xn,name:"Listbox.Label"})}var Zn="ul",ei=1|2,ti=D(function(t,r){var f;let[o,n]=Re("Listbox.Options"),i=I(o.optionsRef,r),a=`headlessui-listbox-options-${A()}`,l=Q(),s=Q(),u=_(),c=(()=>u!==null?u===0:o.listboxState===0)();x(()=>{let d=o.optionsRef.current;!d||o.listboxState===0&&d!==document.activeElement&&d.focus({preventScroll:!0});},[o.listboxState,o.optionsRef]);let m=React$2.useCallback(d=>{switch(s.dispose(),d.key){case" ":if(o.searchQuery!=="")return d.preventDefault(),d.stopPropagation(),n({type:5,value:d.key});case"Enter":if(d.preventDefault(),d.stopPropagation(),n({type:1}),o.activeOptionIndex!==null){let{dataRef:P}=o.options[o.activeOptionIndex];o.propsRef.current.onChange(P.current.value);}k().nextFrame(()=>{var P;return (P=o.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})});break;case S(o.orientation,{vertical:"ArrowDown",horizontal:"ArrowRight"}):return d.preventDefault(),d.stopPropagation(),n({type:4,focus:2});case S(o.orientation,{vertical:"ArrowUp",horizontal:"ArrowLeft"}):return d.preventDefault(),d.stopPropagation(),n({type:4,focus:1});case"Home":case"PageUp":return d.preventDefault(),d.stopPropagation(),n({type:4,focus:0});case"End":case"PageDown":return d.preventDefault(),d.stopPropagation(),n({type:4,focus:3});case"Escape":return d.preventDefault(),d.stopPropagation(),n({type:1}),l.nextFrame(()=>{var P;return (P=o.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})});case"Tab":d.preventDefault(),d.stopPropagation();break;default:d.key.length===1&&(n({type:5,value:d.key}),s.setTimeout(()=>n({type:6}),350));break}},[l,n,s,o]),b=ee(()=>{var d,P,C;return (C=(d=o.labelRef.current)==null?void 0:d.id)!=null?C:(P=o.buttonRef.current)==null?void 0:P.id},[o.labelRef.current,o.buttonRef.current]),T=React$2.useMemo(()=>({open:o.listboxState===0}),[o]),y={"aria-activedescendant":o.activeOptionIndex===null||(f=o.options[o.activeOptionIndex])==null?void 0:f.id,"aria-labelledby":b,"aria-orientation":o.orientation,id:a,onKeyDown:m,role:"listbox",tabIndex:0,ref:i};return E({props:{...t,...y},slot:T,defaultTag:Zn,features:ei,visible:c,name:"Listbox.Options"})}),oi="li";function ri(e){let{disabled:t=!1,value:r,...o}=e,[n,i]=Re("Listbox.Option"),a=`headlessui-listbox-option-${A()}`,l=n.activeOptionIndex!==null?n.options[n.activeOptionIndex].id===a:!1,s=n.propsRef.current.value===r,u=React$2.useRef({disabled:t,value:r});x(()=>{u.current.disabled=t;},[u,t]),x(()=>{u.current.value=r;},[u,r]),x(()=>{var d,P;u.current.textValue=(P=(d=document.getElementById(a))==null?void 0:d.textContent)==null?void 0:P.toLowerCase();},[u,a]);let c=React$2.useCallback(()=>n.propsRef.current.onChange(r),[n.propsRef,r]);x(()=>(i({type:7,id:a,dataRef:u}),()=>i({type:8,id:a})),[u,a]),x(()=>{var d,P;n.listboxState===0&&(!s||(i({type:4,focus:4,id:a}),(P=(d=document.getElementById(a))==null?void 0:d.focus)==null||P.call(d)));},[n.listboxState]),x(()=>{if(n.listboxState!==0||!l)return;let d=k();return d.requestAnimationFrame(()=>{var P,C;(C=(P=document.getElementById(a))==null?void 0:P.scrollIntoView)==null||C.call(P,{block:"nearest"});}),d.dispose},[a,l,n.listboxState,n.activeOptionIndex]);let m=React$2.useCallback(d=>{if(t)return d.preventDefault();c(),i({type:1}),k().nextFrame(()=>{var P;return (P=n.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})});},[i,n.buttonRef,t,c]),b=React$2.useCallback(()=>{if(t)return i({type:4,focus:5});i({type:4,focus:4,id:a});},[t,a,i]),T=React$2.useCallback(()=>{t||l||i({type:4,focus:4,id:a});},[t,l,a,i]),y=React$2.useCallback(()=>{t||!l||i({type:4,focus:5});},[t,l,i]),p=React$2.useMemo(()=>({active:l,selected:s,disabled:t}),[l,s,t]);return E({props:{...o,...{id:a,role:"option",tabIndex:t===!0?void 0:-1,"aria-disabled":t===!0?!0:void 0,"aria-selected":s===!0?!0:void 0,disabled:void 0,onClick:m,onFocus:b,onPointerMove:T,onMouseMove:T,onPointerLeave:y,onMouseLeave:y}},slot:p,defaultTag:oi,name:"Listbox.Option"})}Ee.Button=Yn;Ee.Label=Jn;Ee.Options=ti;Ee.Option=ri;var ui={[1](e){return e.menuState===1?e:{...e,activeItemIndex:null,menuState:1}},[0](e){return e.menuState===0?e:{...e,menuState:0}},[2]:(e,t)=>{let r=ae(t,{resolveItems:()=>e.items,resolveActiveIndex:()=>e.activeItemIndex,resolveId:o=>o.id,resolveDisabled:o=>o.dataRef.current.disabled});return e.searchQuery===""&&e.activeItemIndex===r?e:{...e,searchQuery:"",activeItemIndex:r}},[3]:(e,t)=>{let o=e.searchQuery!==""?0:1,n=e.searchQuery+t.value.toLowerCase(),a=(e.activeItemIndex!==null?e.items.slice(e.activeItemIndex+o).concat(e.items.slice(0,e.activeItemIndex+o)):e.items).find(s=>{var u;return ((u=s.dataRef.current.textValue)==null?void 0:u.startsWith(n))&&!s.dataRef.current.disabled}),l=a?e.items.indexOf(a):-1;return l===-1||l===e.activeItemIndex?{...e,searchQuery:n}:{...e,searchQuery:n,activeItemIndex:l}},[4](e){return e.searchQuery===""?e:{...e,searchQuery:"",searchActiveItemIndex:null}},[5]:(e,t)=>{var n;let r=Array.from((n=e.itemsRef.current)==null?void 0:n.querySelectorAll('[id^="headlessui-menu-item-"]')).reduce((i,a,l)=>Object.assign(i,{[a.id]:l}),{}),o=[...e.items,{id:t.id,dataRef:t.dataRef}].sort((i,a)=>r[i.id]-r[a.id]);return {...e,items:o}},[6]:(e,t)=>{let r=e.items.slice(),o=e.activeItemIndex!==null?r[e.activeItemIndex]:null,n=r.findIndex(i=>i.id===t.id);return n!==-1&&r.splice(n,1),{...e,items:r,activeItemIndex:(()=>n===e.activeItemIndex||o===null?null:r.indexOf(o))()}}},Ht=React$2.createContext(null);Ht.displayName="MenuContext";function Je(e){let t=React$2.useContext(Ht);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Ze.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Je),r}return t}function pi(e,t){return S(t.type,ui,e,t)}var di=React$2.Fragment;function Ze(e){let t=React$2.useReducer(pi,{menuState:1,buttonRef:React$2.createRef(),itemsRef:React$2.createRef(),items:[],searchQuery:"",activeItemIndex:null}),[{menuState:r,itemsRef:o,buttonRef:n},i]=t;w("mousedown",l=>{var u,c,m;let s=l.target;r===0&&(((u=n.current)==null?void 0:u.contains(s))||((c=o.current)==null?void 0:c.contains(s))||(i({type:1}),de(s,1)||(l.preventDefault(),(m=n.current)==null||m.focus())));});let a=React$2.useMemo(()=>({open:r===0}),[r]);return React__default["default"].createElement(Ht.Provider,{value:t},React__default["default"].createElement(W,{value:S(r,{[0]:0,[1]:1})},E({props:e,slot:a,defaultTag:di,name:"Menu"})))}var ci="button",fi=D(function(t,r){var y;let[o,n]=Je("Menu.Button"),i=I(o.buttonRef,r),a=`headlessui-menu-button-${A()}`,l=Q(),s=React$2.useCallback(p=>{switch(p.key){case" ":case"Enter":case"ArrowDown":p.preventDefault(),p.stopPropagation(),n({type:0}),l.nextFrame(()=>n({type:2,focus:0}));break;case"ArrowUp":p.preventDefault(),p.stopPropagation(),n({type:0}),l.nextFrame(()=>n({type:2,focus:3}));break}},[n,l]),u=React$2.useCallback(p=>{switch(p.key){case" ":p.preventDefault();break}},[]),c=React$2.useCallback(p=>{if(G(p.currentTarget))return p.preventDefault();t.disabled||(o.menuState===0?(n({type:1}),l.nextFrame(()=>{var f;return (f=o.buttonRef.current)==null?void 0:f.focus({preventScroll:!0})})):(p.preventDefault(),p.stopPropagation(),n({type:0})));},[n,l,o,t.disabled]),m=React$2.useMemo(()=>({open:o.menuState===0}),[o]),b=t,T={ref:i,id:a,type:U(t,o.buttonRef),"aria-haspopup":!0,"aria-controls":(y=o.itemsRef.current)==null?void 0:y.id,"aria-expanded":t.disabled?void 0:o.menuState===0,onKeyDown:s,onKeyUp:u,onClick:c};return E({props:{...b,...T},slot:m,defaultTag:ci,name:"Menu.Button"})}),mi="div",bi=1|2,Ti=D(function(t,r){var p,f;let[o,n]=Je("Menu.Items"),i=I(o.itemsRef,r),a=`headlessui-menu-items-${A()}`,l=Q(),s=_(),u=(()=>s!==null?s===0:o.menuState===0)();React$2.useEffect(()=>{let d=o.itemsRef.current;!d||o.menuState===0&&d!==document.activeElement&&d.focus({preventScroll:!0});},[o.menuState,o.itemsRef]),se({container:o.itemsRef.current,enabled:o.menuState===0,accept(d){return d.getAttribute("role")==="menuitem"?NodeFilter.FILTER_REJECT:d.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(d){d.setAttribute("role","none");}});let c=React$2.useCallback(d=>{var P;switch(l.dispose(),d.key){case" ":if(o.searchQuery!=="")return d.preventDefault(),d.stopPropagation(),n({type:3,value:d.key});case"Enter":if(d.preventDefault(),d.stopPropagation(),n({type:1}),o.activeItemIndex!==null){let{id:C}=o.items[o.activeItemIndex];(P=document.getElementById(C))==null||P.click();}k().nextFrame(()=>{var C;return (C=o.buttonRef.current)==null?void 0:C.focus({preventScroll:!0})});break;case"ArrowDown":return d.preventDefault(),d.stopPropagation(),n({type:2,focus:2});case"ArrowUp":return d.preventDefault(),d.stopPropagation(),n({type:2,focus:1});case"Home":case"PageUp":return d.preventDefault(),d.stopPropagation(),n({type:2,focus:0});case"End":case"PageDown":return d.preventDefault(),d.stopPropagation(),n({type:2,focus:3});case"Escape":d.preventDefault(),d.stopPropagation(),n({type:1}),k().nextFrame(()=>{var C;return (C=o.buttonRef.current)==null?void 0:C.focus({preventScroll:!0})});break;case"Tab":d.preventDefault(),d.stopPropagation();break;default:d.key.length===1&&(n({type:3,value:d.key}),l.setTimeout(()=>n({type:4}),350));break}},[n,l,o]),m=React$2.useCallback(d=>{switch(d.key){case" ":d.preventDefault();break}},[]),b=React$2.useMemo(()=>({open:o.menuState===0}),[o]),T={"aria-activedescendant":o.activeItemIndex===null||(p=o.items[o.activeItemIndex])==null?void 0:p.id,"aria-labelledby":(f=o.buttonRef.current)==null?void 0:f.id,id:a,onKeyDown:c,onKeyUp:m,role:"menu",tabIndex:0,ref:i};return E({props:{...t,...T},slot:b,defaultTag:mi,features:bi,visible:u,name:"Menu.Items"})}),yi=React$2.Fragment;function gi(e){let{disabled:t=!1,onClick:r,...o}=e,[n,i]=Je("Menu.Item"),a=`headlessui-menu-item-${A()}`,l=n.activeItemIndex!==null?n.items[n.activeItemIndex].id===a:!1;x(()=>{if(n.menuState!==0||!l)return;let p=k();return p.requestAnimationFrame(()=>{var f,d;(d=(f=document.getElementById(a))==null?void 0:f.scrollIntoView)==null||d.call(f,{block:"nearest"});}),p.dispose},[a,l,n.menuState,n.activeItemIndex]);let s=React$2.useRef({disabled:t});x(()=>{s.current.disabled=t;},[s,t]),x(()=>{var p,f;s.current.textValue=(f=(p=document.getElementById(a))==null?void 0:p.textContent)==null?void 0:f.toLowerCase();},[s,a]),x(()=>(i({type:5,id:a,dataRef:s}),()=>i({type:6,id:a})),[s,a]);let u=React$2.useCallback(p=>{if(t)return p.preventDefault();if(i({type:1}),k().nextFrame(()=>{var f;return (f=n.buttonRef.current)==null?void 0:f.focus({preventScroll:!0})}),r)return r(p)},[i,n.buttonRef,t,r]),c=React$2.useCallback(()=>{if(t)return i({type:2,focus:5});i({type:2,focus:4,id:a});},[t,a,i]),m=React$2.useCallback(()=>{t||l||i({type:2,focus:4,id:a});},[t,l,a,i]),b=React$2.useCallback(()=>{t||!l||i({type:2,focus:5});},[t,l,i]),T=React$2.useMemo(()=>({active:l,disabled:t}),[l,t]);return E({props:{...o,...{id:a,role:"menuitem",tabIndex:t===!0?void 0:-1,"aria-disabled":t===!0?!0:void 0,disabled:void 0,onClick:u,onFocus:c,onPointerMove:m,onMouseMove:m,onPointerLeave:b,onMouseLeave:b}},slot:T,defaultTag:yi,name:"Menu.Item"})}Ze.Button=fi;Ze.Items=Ti;Ze.Item=gi;var vi={[0]:e=>({...e,popoverState:S(e.popoverState,{[0]:1,[1]:0})}),[1](e){return e.popoverState===1?e:{...e,popoverState:1}},[2](e,t){return e.button===t.button?e:{...e,button:t.button}},[3](e,t){return e.buttonId===t.buttonId?e:{...e,buttonId:t.buttonId}},[4](e,t){return e.panel===t.panel?e:{...e,panel:t.panel}},[5](e,t){return e.panelId===t.panelId?e:{...e,panelId:t.panelId}}},Ut=React$2.createContext(null);Ut.displayName="PopoverContext";function ot(e){let t=React$2.useContext(Ut);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Te.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,ot),r}return t}var Bt=React$2.createContext(null);Bt.displayName="PopoverAPIContext";function Mo(e){let t=React$2.useContext(Bt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Te.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Mo),r}return t}var Nt=React$2.createContext(null);Nt.displayName="PopoverGroupContext";function Fo(){return React$2.useContext(Nt)}var Wt=React$2.createContext(null);Wt.displayName="PopoverPanelContext";function Ri(){return React$2.useContext(Wt)}function Ei(e,t){return S(t.type,vi,e,t)}var Ci="div";function Te(e){let t=`headlessui-popover-button-${A()}`,r=`headlessui-popover-panel-${A()}`,o=React$2.useReducer(Ei,{popoverState:1,button:null,buttonId:t,panel:null,panelId:r}),[{popoverState:n,button:i,panel:a},l]=o;React$2.useEffect(()=>l({type:3,buttonId:t}),[t,l]),React$2.useEffect(()=>l({type:5,panelId:r}),[r,l]);let s=React$2.useMemo(()=>({buttonId:t,panelId:r,close:()=>l({type:1})}),[t,r,l]),u=Fo(),c=u==null?void 0:u.registerPopover,m=React$2.useCallback(()=>{var p;return (p=u==null?void 0:u.isFocusWithinPopoverGroup())!=null?p:(i==null?void 0:i.contains(document.activeElement))||(a==null?void 0:a.contains(document.activeElement))},[u,i,a]);React$2.useEffect(()=>c==null?void 0:c(s),[c,s]),w("focus",()=>{n===0&&(m()||!i||!a||l({type:1}));},!0),w("mousedown",p=>{let f=p.target;n===0&&((i==null?void 0:i.contains(f))||(a==null?void 0:a.contains(f))||(l({type:1}),de(f,1)||(p.preventDefault(),i==null||i.focus())));});let b=React$2.useCallback(p=>{l({type:1});let f=(()=>p?p instanceof HTMLElement?p:p.current instanceof HTMLElement?p.current:i:i)();f==null||f.focus();},[l,i]),T=React$2.useMemo(()=>({close:b}),[b]),y=React$2.useMemo(()=>({open:n===0,close:b}),[n,b]);return React__default["default"].createElement(Ut.Provider,{value:o},React__default["default"].createElement(Bt.Provider,{value:T},React__default["default"].createElement(W,{value:S(n,{[0]:0,[1]:1})},E({props:e,slot:y,defaultTag:Ci,name:"Popover"}))))}var Si="button",Ai=D(function(t,r){let[o,n]=ot("Popover.Button"),i=React$2.useRef(null),a=Fo(),l=a==null?void 0:a.closeOthers,s=Ri(),u=s===null?!1:s===o.panelId,c=I(i,r,u?null:g=>n({type:2,button:g})),m=I(i,r),b=React$2.useRef(null),T=React$2.useRef(typeof window=="undefined"?null:document.activeElement);w("focus",()=>{T.current=b.current,b.current=document.activeElement;},!0);let y=React$2.useCallback(g=>{var v,h;if(u){if(o.popoverState===1)return;switch(g.key){case" ":case"Enter":g.preventDefault(),g.stopPropagation(),n({type:1}),(v=o.button)==null||v.focus();break}}else switch(g.key){case" ":case"Enter":g.preventDefault(),g.stopPropagation(),o.popoverState===1&&(l==null||l(o.buttonId)),n({type:0});break;case"Escape":if(o.popoverState!==0)return l==null?void 0:l(o.buttonId);if(!i.current||!i.current.contains(document.activeElement))return;g.preventDefault(),g.stopPropagation(),n({type:1});break;case"Tab":if(o.popoverState!==0||!o.panel||!o.button)return;if(g.shiftKey){if(!T.current||((h=o.button)==null?void 0:h.contains(T.current))||o.panel.contains(T.current))return;let O=xe(),L=O.indexOf(T.current);if(O.indexOf(o.button)>L)return;g.preventDefault(),g.stopPropagation(),M(o.panel,8);}else g.preventDefault(),g.stopPropagation(),M(o.panel,1);break}},[n,o.popoverState,o.buttonId,o.button,o.panel,i,l,u]),p=React$2.useCallback(g=>{var v;if(!u&&(g.key===" "&&g.preventDefault(),o.popoverState===0&&!!o.panel&&!!o.button))switch(g.key){case"Tab":if(!T.current||((v=o.button)==null?void 0:v.contains(T.current))||o.panel.contains(T.current))return;let h=xe(),O=h.indexOf(T.current);if(h.indexOf(o.button)>O)return;g.preventDefault(),g.stopPropagation(),M(o.panel,8);break}},[o.popoverState,o.panel,o.button,u]),f=React$2.useCallback(g=>{var v,h;G(g.currentTarget)||t.disabled||(u?(n({type:1}),(v=o.button)==null||v.focus()):(o.popoverState===1&&(l==null||l(o.buttonId)),(h=o.button)==null||h.focus(),n({type:0})));},[n,o.button,o.popoverState,o.buttonId,t.disabled,l,u]),d=React$2.useMemo(()=>({open:o.popoverState===0}),[o]),P=U(t,i),C=t,R=u?{ref:m,type:P,onKeyDown:y,onClick:f}:{ref:c,id:o.buttonId,type:P,"aria-expanded":t.disabled?void 0:o.popoverState===0,"aria-controls":o.panel?o.panelId:void 0,onKeyDown:y,onKeyUp:p,onClick:f};return E({props:{...C,...R},slot:d,defaultTag:Si,name:"Popover.Button"})}),hi="div",Oi=1|2,Ii=D(function(t,r){let[{popoverState:o},n]=ot("Popover.Overlay"),i=I(r),a=`headlessui-popover-overlay-${A()}`,l=_(),s=(()=>l!==null?l===0:o===0)(),u=React$2.useCallback(T=>{if(G(T.currentTarget))return T.preventDefault();n({type:1});},[n]),c=React$2.useMemo(()=>({open:o===0}),[o]);return E({props:{...t,...{ref:i,id:a,"aria-hidden":!0,onClick:u}},slot:c,defaultTag:hi,features:Oi,visible:s,name:"Popover.Overlay"})}),Li$1="div",Di=1|2,Mi=D(function(t,r){let{focus:o=!1,...n}=t,[i,a]=ot("Popover.Panel"),{close:l}=Mo("Popover.Panel"),s=React$2.useRef(null),u=I(s,r,p=>{a({type:4,panel:p});}),c=_(),m=(()=>c!==null?c===0:i.popoverState===0)(),b=React$2.useCallback(p=>{var f;switch(p.key){case"Escape":if(i.popoverState!==0||!s.current||!s.current.contains(document.activeElement))return;p.preventDefault(),p.stopPropagation(),a({type:1}),(f=i.button)==null||f.focus();break}},[i,s,a]);React$2.useEffect(()=>()=>a({type:4,panel:null}),[a]),React$2.useEffect(()=>{var p;t.static||i.popoverState===1&&((p=t.unmount)!=null?p:!0)&&a({type:4,panel:null});},[i.popoverState,t.unmount,t.static,a]),React$2.useEffect(()=>{if(!o||i.popoverState!==0||!s.current)return;let p=document.activeElement;s.current.contains(p)||M(s.current,1);},[o,s,i.popoverState]),w("keydown",p=>{var d;if(i.popoverState!==0||!s.current||p.key!=="Tab"||!document.activeElement||!s.current||!s.current.contains(document.activeElement))return;p.preventDefault();let f=M(s.current,p.shiftKey?2:4);if(f===3)return (d=i.button)==null?void 0:d.focus();if(f===1){if(!i.button)return;let P=xe(),C=P.indexOf(i.button),R=P.splice(C+1).filter(g=>{var v;return !((v=s.current)==null?void 0:v.contains(g))});M(R,1)===0&&M(document.body,1);}}),w("focus",()=>{var p;!o||i.popoverState===0&&(!s.current||((p=s.current)==null?void 0:p.contains(document.activeElement))||a({type:1}));},!0);let T=React$2.useMemo(()=>({open:i.popoverState===0,close:l}),[i,l]),y={ref:u,id:i.panelId,onKeyDown:b};return React__default["default"].createElement(Wt.Provider,{value:i.panelId},E({props:{...n,...y},slot:T,defaultTag:Li$1,features:Di,visible:m,name:"Popover.Panel"}))}),Fi="div";function wi(e){let t=React$2.useRef(null),[r,o]=React$2.useState([]),n=React$2.useCallback(b=>{o(T=>{let y=T.indexOf(b);if(y!==-1){let p=T.slice();return p.splice(y,1),p}return T});},[o]),i=React$2.useCallback(b=>(o(T=>[...T,b]),()=>n(b)),[o,n]),a=React$2.useCallback(()=>{var T;let b=document.activeElement;return ((T=t.current)==null?void 0:T.contains(b))?!0:r.some(y=>{var p,f;return ((p=document.getElementById(y.buttonId))==null?void 0:p.contains(b))||((f=document.getElementById(y.panelId))==null?void 0:f.contains(b))})},[t,r]),l=React$2.useCallback(b=>{for(let T of r)T.buttonId!==b&&T.close();},[r]),s=React$2.useMemo(()=>({registerPopover:i,unregisterPopover:n,isFocusWithinPopoverGroup:a,closeOthers:l}),[i,n,a,l]),u=React$2.useMemo(()=>({}),[]),c={ref:t},m=e;return React__default["default"].createElement(Nt.Provider,{value:s},E({props:{...m,...c},slot:u,defaultTag:Fi,name:"Popover.Group"}))}Te.Button=Ai;Te.Overlay=Ii;Te.Panel=Mi;Te.Group=wi;function wo(e=0){let[t,r]=React$2.useState(e),o=React$2.useCallback(l=>r(s=>s|l),[r]),n=React$2.useCallback(l=>Boolean(t&l),[t]),i=React$2.useCallback(l=>r(s=>s&~l),[r]),a=React$2.useCallback(l=>r(s=>s^l),[r]);return {addFlag:o,hasFlag:n,removeFlag:i,toggleFlag:a}}var _o=React$2.createContext(null);function Go(){let e=React$2.useContext(_o);if(e===null){let t=new Error("You used a <Label /> component, but it is not inside a relevant parent.");throw Error.captureStackTrace&&Error.captureStackTrace(t,Go),t}return e}function Ae(){let[e,t]=React$2.useState([]);return [e.length>0?e.join(" "):void 0,React$2.useMemo(()=>function(o){let n=React$2.useCallback(a=>(t(l=>[...l,a]),()=>t(l=>{let s=l.slice(),u=s.indexOf(a);return u!==-1&&s.splice(u,1),s})),[]),i=React$2.useMemo(()=>({register:n,slot:o.slot,name:o.name,props:o.props}),[n,o.slot,o.name,o.props]);return React__default["default"].createElement(_o.Provider,{value:i},o.children)},[t])]}var Ni="label";function nt(e){let{passive:t=!1,...r}=e,o=Go(),n=`headlessui-label-${A()}`;x(()=>o.register(n),[n,o.register]);let i={...o.props,id:n},a={...r,...i};return t&&delete a.onClick,E({props:a,slot:o.slot||{},defaultTag:Ni,name:o.name||"Label"})}var Vi={[0](e,t){return {...e,options:[...e.options,{id:t.id,element:t.element,propsRef:t.propsRef}]}},[1](e,t){let r=e.options.slice(),o=e.options.findIndex(n=>n.id===t.id);return o===-1?e:(r.splice(o,1),{...e,options:r})}},jt=React$2.createContext(null);jt.displayName="RadioGroupContext";function Ho(e){let t=React$2.useContext(jt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${lt.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Ho),r}return t}function $i(e,t){return S(t.type,Vi,e,t)}var Qi="div";function lt(e){let{value:t,onChange:r,disabled:o=!1,...n}=e,[{options:i},a]=React$2.useReducer($i,{options:[]}),[l,s]=Ae(),[u,c]=re(),m=`headlessui-radiogroup-${A()}`,b=React$2.useRef(null),T=React$2.useMemo(()=>i.find(R=>!R.propsRef.current.disabled),[i]),y=React$2.useMemo(()=>i.some(R=>R.propsRef.current.value===t),[i,t]),p=React$2.useCallback(R=>{var v;if(o||R===t)return !1;let g=(v=i.find(h=>h.propsRef.current.value===R))==null?void 0:v.propsRef.current;return (g==null?void 0:g.disabled)?!1:(r(R),!0)},[r,t,o,i]);se({container:b.current,accept(R){return R.getAttribute("role")==="radio"?NodeFilter.FILTER_REJECT:R.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(R){R.setAttribute("role","none");}});let f=React$2.useCallback(R=>{if(!b.current)return;let v=i.filter(h=>h.propsRef.current.disabled===!1).map(h=>h.element.current);switch(R.key){case"ArrowLeft":case"ArrowUp":if(R.preventDefault(),R.stopPropagation(),M(v,2|16)===2){let O=i.find(L=>L.element.current===document.activeElement);O&&p(O.propsRef.current.value);}break;case"ArrowRight":case"ArrowDown":if(R.preventDefault(),R.stopPropagation(),M(v,4|16)===2){let O=i.find(L=>L.element.current===document.activeElement);O&&p(O.propsRef.current.value);}break;case" ":{R.preventDefault(),R.stopPropagation();let h=i.find(O=>O.element.current===document.activeElement);h&&p(h.propsRef.current.value);}break}},[b,i,p]),d=React$2.useCallback(R=>(a({type:0,...R}),()=>a({type:1,id:R.id})),[a]),P=React$2.useMemo(()=>({registerOption:d,firstOption:T,containsCheckedOption:y,change:p,disabled:o,value:t}),[d,T,y,p,o,t]),C={ref:b,id:m,role:"radiogroup","aria-labelledby":l,"aria-describedby":u,onKeyDown:f};return React__default["default"].createElement(c,{name:"RadioGroup.Description"},React__default["default"].createElement(s,{name:"RadioGroup.Label"},React__default["default"].createElement(jt.Provider,{value:P},E({props:{...n,...C},defaultTag:Qi,name:"RadioGroup"}))))}var qi="div";function zi(e){let t=React$2.useRef(null),r=`headlessui-radiogroup-option-${A()}`,[o,n]=Ae(),[i,a]=re(),{addFlag:l,removeFlag:s,hasFlag:u}=wo(1),{value:c,disabled:m=!1,...b}=e,T=React$2.useRef({value:c,disabled:m});x(()=>{T.current.value=c;},[c,T]),x(()=>{T.current.disabled=m;},[m,T]);let{registerOption:y,disabled:p,change:f,firstOption:d,containsCheckedOption:P,value:C}=Ho("RadioGroup.Option");x(()=>y({id:r,element:t,propsRef:T}),[r,y,t,e]);let R=React$2.useCallback(()=>{var V;!f(c)||(l(2),(V=t.current)==null||V.focus());},[l,f,c]),g=React$2.useCallback(()=>l(2),[l]),v=React$2.useCallback(()=>s(2),[s]),h=(d==null?void 0:d.id)===r,O=p||m,L=C===c,N={ref:t,id:r,role:"radio","aria-checked":L?"true":"false","aria-labelledby":o,"aria-describedby":i,"aria-disabled":O?!0:void 0,tabIndex:(()=>O?-1:L||!P&&h?0:-1)(),onClick:O?void 0:R,onFocus:O?void 0:g,onBlur:O?void 0:v},K=React$2.useMemo(()=>({checked:L,disabled:O,active:u(2)}),[L,O,u]);return React__default["default"].createElement(a,{name:"RadioGroup.Description"},React__default["default"].createElement(n,{name:"RadioGroup.Label"},E({props:{...b,...N},slot:K,defaultTag:qi,name:"RadioGroup.Option"})))}lt.Option=zi;lt.Label=nt;lt.Description=me;var $t=React$2.createContext(null);$t.displayName="GroupContext";var zt=React$2.createContext(null);zt.displayName="TabsContext";var dt=React$2.createContext(null);dt.displayName="TransitionContext";var ct=React$2.createContext(null);ct.displayName="NestingContext";
+`));return React$2.cloneElement(u,Object.assign({},fr(mr(gt(l,["ref"])),u.props,["onClick"]),s))}return React$2.createElement(n,Object.assign({},gt(l,["ref"]),n!==React$2.Fragment&&s),u)}function fr(e,t,r){let o=Object.assign({},e);for(let n of r)e[n]!==void 0&&t[n]!==void 0&&Object.assign(o,{[n](i){i.defaultPrevented||e[n](i),i.defaultPrevented||t[n](i);}});return o}function D(e){var t;return Object.assign(React$2.forwardRef(e),{displayName:(t=e.displayName)!=null?t:e.name})}function mr(e){let t=Object.assign({},e);for(let r in t)t[r]===void 0&&delete t[r];return t}function gt(e,t=[]){let r=Object.assign({},e);for(let o of t)o in r&&delete r[o];return r}function br(e){throw new Error("Unexpected object: "+e)}function ae(e,t){let r=t.resolveItems();if(r.length<=0)return null;let o=t.resolveActiveIndex(),n=o!=null?o:-1,i=(()=>{switch(e.focus){case 0:return r.findIndex(a=>!t.resolveDisabled(a));case 1:{let a=r.slice().reverse().findIndex((l,s,u)=>n!==-1&&u.length-s-1>=n?!1:!t.resolveDisabled(l));return a===-1?a:r.length-1-a}case 2:return r.findIndex((a,l)=>l<=n?!1:!t.resolveDisabled(a));case 3:{let a=r.slice().reverse().findIndex(l=>!t.resolveDisabled(l));return a===-1?a:r.length-1-a}case 4:return r.findIndex(a=>t.resolveId(a)===e.id);case 5:return null;default:br(e);}})();return i===-1?o:i}function G(e){let t=e.parentElement,r=null;for(;t&&!(t instanceof HTMLFieldSetElement);)t instanceof HTMLLegendElement&&(r=t),t=t.parentElement;let o=(t==null?void 0:t.getAttribute("disabled"))==="";return o&&Tr(r)?!1:o}function Tr(e){if(!e)return !1;let t=e.previousElementSibling;for(;t!==null;){if(t instanceof HTMLLegendElement)return !1;t=t.previousElementSibling;}return !0}function w$1(e,t,r){let o=React$2.useRef(t);o.current=t,React$2.useEffect(()=>{function n(i){o.current.call(window,i);}return window.addEventListener(e,n,r),()=>window.removeEventListener(e,n,r)},[e,r]);}var Pt=React$2.createContext(null);Pt.displayName="OpenClosedContext";function _(){return React$2.useContext(Pt)}function W({value:e,children:t}){return React__default["default"].createElement(Pt.Provider,{value:e},t)}function ro(e){var r;if(e.type)return e.type;let t=(r=e.as)!=null?r:"button";if(typeof t=="string"&&t.toLowerCase()==="button")return "button"}function U(e,t){let[r,o]=React$2.useState(()=>ro(e));return x$1(()=>{o(ro(e));},[e.type,e.as]),x$1(()=>{r||!t.current||t.current instanceof HTMLButtonElement&&!t.current.hasAttribute("type")&&o("button");},[r,t]),r}function se({container:e,accept:t,walk:r,enabled:o=!0}){let n=React$2.useRef(t),i=React$2.useRef(r);React$2.useEffect(()=>{n.current=t,i.current=r;},[t,r]),x$1(()=>{if(!e||!o)return;let a=n.current,l=i.current,s=Object.assign(c=>a(c),{acceptNode:a}),u=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,s,!1);for(;u.nextNode();)l(u.currentNode);},[e,o,n,i]);}var Ar={[1](e){return e.disabled||e.comboboxState===1?e:{...e,activeOptionIndex:null,comboboxState:1}},[0](e){return e.disabled||e.comboboxState===0?e:{...e,comboboxState:0}},[2](e,t){return e.disabled===t.disabled?e:{...e,disabled:t.disabled}},[3](e,t){if(e.disabled||e.optionsRef.current&&!e.optionsPropsRef.current.static&&e.comboboxState===1)return e;let r=ae(t,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:o=>o.id,resolveDisabled:o=>o.dataRef.current.disabled});return e.activeOptionIndex===r?e:{...e,activeOptionIndex:r}},[4]:(e,t)=>{var i;let r=e.activeOptionIndex!==null?e.options[e.activeOptionIndex]:null,o=Array.from((i=e.optionsRef.current)==null?void 0:i.querySelectorAll('[id^="headlessui-combobox-option-"]')).reduce((a,l,s)=>Object.assign(a,{[l.id]:s}),{}),n=[...e.options,{id:t.id,dataRef:t.dataRef}].sort((a,l)=>o[a.id]-o[l.id]);return {...e,options:n,activeOptionIndex:(()=>r===null?null:n.indexOf(r))()}},[5]:(e,t)=>{let r=e.options.slice(),o=e.activeOptionIndex!==null?r[e.activeOptionIndex]:null,n=r.findIndex(i=>i.id===t.id);return n!==-1&&r.splice(n,1),{...e,options:r,activeOptionIndex:(()=>n===e.activeOptionIndex||o===null?null:r.indexOf(o))()}}},vt=React$2.createContext(null);vt.displayName="ComboboxContext";function pe(e){let t=React$2.useContext(vt);if(t===null){let r=new Error(`<${e} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,pe),r}return t}var Rt=React$2.createContext(null);Rt.displayName="ComboboxActions";function Ue(){let e=React$2.useContext(Rt);if(e===null){let t=new Error("ComboboxActions is missing a parent <Combobox /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(t,Ue),t}return e}function hr(e,t){return S(t.type,Ar,e,t)}var Or=React$2.Fragment,Ir=D(function(t,r){let{value:o,onChange:n,disabled:i=!1,...a}=t,l=React$2.useRef({value:o,onChange:n}),s=React$2.useRef({static:!1,hold:!1}),u=React$2.useRef({displayValue:void 0}),c=React$2.useReducer(hr,{comboboxState:1,comboboxPropsRef:l,optionsPropsRef:s,inputPropsRef:u,labelRef:React$2.createRef(),inputRef:React$2.createRef(),buttonRef:React$2.createRef(),optionsRef:React$2.createRef(),disabled:i,options:[],activeOptionIndex:null}),[{comboboxState:m,options:b,activeOptionIndex:T,optionsRef:y,inputRef:p,buttonRef:f},d]=c;x$1(()=>{l.current.value=o;},[o,l]),x$1(()=>{l.current.onChange=n;},[n,l]),x$1(()=>d({type:2,disabled:i}),[i]),w$1("mousedown",O=>{var N,K,V;let L=O.target;m===0&&(((N=f.current)==null?void 0:N.contains(L))||((K=p.current)==null?void 0:K.contains(L))||((V=y.current)==null?void 0:V.contains(L))||d({type:1}));});let P=T===null?null:b[T].dataRef.current.value,C=React$2.useMemo(()=>({open:m===0,disabled:i,activeIndex:T,activeOption:P}),[m,i,b,T]),R=React$2.useCallback(()=>{if(!p.current||o===void 0)return;let O=u.current.displayValue;typeof O=="function"?p.current.value=O(o):typeof o=="string"&&(p.current.value=o);},[o,p,u]),g=React$2.useCallback(O=>{let L=b.find(K=>K.id===O);if(!L)return;let{dataRef:N}=L;l.current.onChange(N.current.value),R();},[b,l,p]),v=React$2.useCallback(()=>{if(T!==null){let{dataRef:O}=b[T];l.current.onChange(O.current.value),R();}},[T,b,l,p]),h=React$2.useMemo(()=>({selectOption:g,selectActiveOption:v}),[g,v]);return x$1(()=>{m===1&&R();},[R,m]),x$1(R,[R]),React__default["default"].createElement(Rt.Provider,{value:h},React__default["default"].createElement(vt.Provider,{value:c},React__default["default"].createElement(W,{value:S(m,{[0]:0,[1]:1})},E({props:r===null?a:{...a,ref:r},slot:C,defaultTag:Or,name:"Combobox"}))))}),Lr="input",Dr=D(function(t,r){var R,g;let{value:o,onChange:n,displayValue:i,...a}=t,[l,s]=pe("Combobox.Input"),u=Ue(),c=I(l.inputRef,r),m=l.inputPropsRef,b=`headlessui-combobox-input-${A$1()}`,T=Q(),y=ke(n);x$1(()=>{m.current.displayValue=i;},[i,m]);let p=React$2.useCallback(v=>{switch(v.key){case"Enter":v.preventDefault(),v.stopPropagation(),u.selectActiveOption(),s({type:1});break;case"ArrowDown":return v.preventDefault(),v.stopPropagation(),S(l.comboboxState,{[0]:()=>s({type:3,focus:2}),[1]:()=>{s({type:0}),T.nextFrame(()=>{l.comboboxPropsRef.current.value||s({type:3,focus:0});});}});case"ArrowUp":return v.preventDefault(),v.stopPropagation(),S(l.comboboxState,{[0]:()=>s({type:3,focus:1}),[1]:()=>{s({type:0}),T.nextFrame(()=>{l.comboboxPropsRef.current.value||s({type:3,focus:3});});}});case"Home":case"PageUp":return v.preventDefault(),v.stopPropagation(),s({type:3,focus:0});case"End":case"PageDown":return v.preventDefault(),v.stopPropagation(),s({type:3,focus:3});case"Escape":return v.preventDefault(),l.optionsRef.current&&!l.optionsPropsRef.current.static&&v.stopPropagation(),s({type:1});case"Tab":u.selectActiveOption(),s({type:1});break}},[T,s,l,u]),f=React$2.useCallback(v=>{var h;s({type:0}),(h=y.current)==null||h.call(y,v);},[s,y]),d=ee(()=>{if(!!l.labelRef.current)return [l.labelRef.current.id].join(" ")},[l.labelRef.current]),P=React$2.useMemo(()=>({open:l.comboboxState===0,disabled:l.disabled}),[l]),C={ref:c,id:b,role:"combobox",type:"text","aria-controls":(R=l.optionsRef.current)==null?void 0:R.id,"aria-expanded":l.disabled?void 0:l.comboboxState===0,"aria-activedescendant":l.activeOptionIndex===null||(g=l.options[l.activeOptionIndex])==null?void 0:g.id,"aria-labelledby":d,disabled:l.disabled,onKeyDown:p,onChange:f};return E({props:{...a,...C},slot:P,defaultTag:Lr,name:"Combobox.Input"})}),Mr="button",Fr=D(function(t,r){var p;let[o,n]=pe("Combobox.Button"),i=Ue(),a=I(o.buttonRef,r),l=`headlessui-combobox-button-${A$1()}`,s=Q(),u=React$2.useCallback(f=>{switch(f.key){case"ArrowDown":return f.preventDefault(),f.stopPropagation(),o.comboboxState===1&&(n({type:0}),s.nextFrame(()=>{o.comboboxPropsRef.current.value||n({type:3,focus:0});})),s.nextFrame(()=>{var d;return (d=o.inputRef.current)==null?void 0:d.focus({preventScroll:!0})});case"ArrowUp":return f.preventDefault(),f.stopPropagation(),o.comboboxState===1&&(n({type:0}),s.nextFrame(()=>{o.comboboxPropsRef.current.value||n({type:3,focus:3});})),s.nextFrame(()=>{var d;return (d=o.inputRef.current)==null?void 0:d.focus({preventScroll:!0})});case"Escape":return f.preventDefault(),o.optionsRef.current&&!o.optionsPropsRef.current.static&&f.stopPropagation(),n({type:1}),s.nextFrame(()=>{var d;return (d=o.inputRef.current)==null?void 0:d.focus({preventScroll:!0})})}},[s,n,o,i]),c=React$2.useCallback(f=>{if(G(f.currentTarget))return f.preventDefault();o.comboboxState===0?n({type:1}):(f.preventDefault(),n({type:0})),s.nextFrame(()=>{var d;return (d=o.inputRef.current)==null?void 0:d.focus({preventScroll:!0})});},[n,s,o]),m=ee(()=>{if(!!o.labelRef.current)return [o.labelRef.current.id,l].join(" ")},[o.labelRef.current,l]),b=React$2.useMemo(()=>({open:o.comboboxState===0,disabled:o.disabled}),[o]),T=t,y={ref:a,id:l,type:U(t,o.buttonRef),tabIndex:-1,"aria-haspopup":!0,"aria-controls":(p=o.optionsRef.current)==null?void 0:p.id,"aria-expanded":o.disabled?void 0:o.comboboxState===0,"aria-labelledby":m,disabled:o.disabled,onClick:c,onKeyDown:u};return E({props:{...T,...y},slot:b,defaultTag:Mr,name:"Combobox.Button"})}),wr="label";function kr(e){let[t]=pe("Combobox.Label"),r=`headlessui-combobox-label-${A$1()}`,o=React$2.useCallback(()=>{var a;return (a=t.inputRef.current)==null?void 0:a.focus({preventScroll:!0})},[t.inputRef]),n=React$2.useMemo(()=>({open:t.comboboxState===0,disabled:t.disabled}),[t]),i={ref:t.labelRef,id:r,onClick:o};return E({props:{...e,...i},slot:n,defaultTag:wr,name:"Combobox.Label"})}var _r="ul",Gr=1|2,Hr=D(function(t,r){var y;let{hold:o=!1,...n}=t,[i]=pe("Combobox.Options"),{optionsPropsRef:a}=i,l=I(i.optionsRef,r),s=`headlessui-combobox-options-${A$1()}`,u=_(),c=(()=>u!==null?u===0:i.comboboxState===0)();x$1(()=>{var p;a.current.static=(p=t.static)!=null?p:!1;},[a,t.static]),x$1(()=>{a.current.hold=o;},[o,a]),se({container:i.optionsRef.current,enabled:i.comboboxState===0,accept(p){return p.getAttribute("role")==="option"?NodeFilter.FILTER_REJECT:p.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(p){p.setAttribute("role","none");}});let m=ee(()=>{var p,f,d;return (d=(p=i.labelRef.current)==null?void 0:p.id)!=null?d:(f=i.buttonRef.current)==null?void 0:f.id},[i.labelRef.current,i.buttonRef.current]),b=React$2.useMemo(()=>({open:i.comboboxState===0}),[i]),T={"aria-activedescendant":i.activeOptionIndex===null||(y=i.options[i.activeOptionIndex])==null?void 0:y.id,"aria-labelledby":m,role:"listbox",id:s,ref:l};return E({props:{...n,...T},slot:b,defaultTag:_r,features:Gr,visible:c,name:"Combobox.Options"})}),Ur="li";function Br(e){let{disabled:t=!1,value:r,...o}=e,[n,i]=pe("Combobox.Option"),a=Ue(),l=`headlessui-combobox-option-${A$1()}`,s=n.activeOptionIndex!==null?n.options[n.activeOptionIndex].id===l:!1,u=n.comboboxPropsRef.current.value===r,c=React$2.useRef({disabled:t,value:r});x$1(()=>{c.current.disabled=t;},[c,t]),x$1(()=>{c.current.value=r;},[c,r]),x$1(()=>{var P,C;c.current.textValue=(C=(P=document.getElementById(l))==null?void 0:P.textContent)==null?void 0:C.toLowerCase();},[c,l]);let m=React$2.useCallback(()=>a.selectOption(l),[a,l]);x$1(()=>(i({type:4,id:l,dataRef:c}),()=>i({type:5,id:l})),[c,l]),x$1(()=>{n.comboboxState===0&&(!u||i({type:3,focus:4,id:l}));},[n.comboboxState,u,l]),x$1(()=>{if(n.comboboxState!==0||!s)return;let P=k$1();return P.requestAnimationFrame(()=>{var C,R;(R=(C=document.getElementById(l))==null?void 0:C.scrollIntoView)==null||R.call(C,{block:"nearest"});}),P.dispose},[l,s,n.comboboxState,n.activeOptionIndex]);let b=React$2.useCallback(P=>{if(t)return P.preventDefault();m(),i({type:1}),k$1().nextFrame(()=>{var C;return (C=n.inputRef.current)==null?void 0:C.focus({preventScroll:!0})});},[i,n.inputRef,t,m]),T=React$2.useCallback(()=>{if(t)return i({type:3,focus:5});i({type:3,focus:4,id:l});},[t,l,i]),y=React$2.useCallback(()=>{t||s||i({type:3,focus:4,id:l});},[t,s,l,i]),p=React$2.useCallback(()=>{t||!s||n.optionsPropsRef.current.hold||i({type:3,focus:5});},[t,s,i,n.comboboxState,n.comboboxPropsRef]),f=React$2.useMemo(()=>({active:s,selected:u,disabled:t}),[s,u,t]);return E({props:{...o,...{id:l,role:"option",tabIndex:t===!0?void 0:-1,"aria-disabled":t===!0?!0:void 0,"aria-selected":u===!0?!0:void 0,disabled:void 0,onClick:b,onFocus:T,onPointerMove:y,onMouseMove:y,onPointerLeave:p,onMouseLeave:p}},slot:f,defaultTag:Ur,name:"Combobox.Option"})}Object.assign(Ir,{Input:Dr,Button:Fr,Label:kr,Options:Hr,Option:Br});var Et=["[contentEditable=true]","[tabindex]","a[href]","area[href]","button:not([disabled])","iframe","input:not([disabled])","select:not([disabled])","textarea:not([disabled])"].map(e=>`${e}:not([tabindex='-1'])`).join(",");function xe(e=document.body){return e==null?[]:Array.from(e.querySelectorAll(Et))}function de(e,t=0){return e===document.body?!1:S(t,{[0](){return e.matches(Et)},[1](){let r=e;for(;r!==null;){if(r.matches(Et))return !0;r=r.parentElement;}return !1}})}function ce(e){e==null||e.focus({preventScroll:!0});}function M(e,t){let r=Array.isArray(e)?e.slice().sort((c,m)=>{let b=c.compareDocumentPosition(m);return b&Node.DOCUMENT_POSITION_FOLLOWING?-1:b&Node.DOCUMENT_POSITION_PRECEDING?1:0}):xe(e),o=document.activeElement,n=(()=>{if(t&(1|4))return 1;if(t&(2|8))return -1;throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last")})(),i=(()=>{if(t&1)return 0;if(t&2)return Math.max(0,r.indexOf(o))-1;if(t&4)return Math.max(0,r.indexOf(o))+1;if(t&8)return r.length-1;throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last")})(),a=t&32?{preventScroll:!0}:{},l=0,s=r.length,u;do{if(l>=s||l+s<=0)return 0;let c=i+l;if(t&16)c=(c+s)%s;else {if(c<0)return 3;if(c>=s)return 1}u=r[c],u==null||u.focus(a),l+=n;}while(u!==document.activeElement);return u.hasAttribute("tabindex")||u.setAttribute("tabindex","0"),2}function Be(){let e=React$2.useRef(!1);return React$2.useEffect(()=>(e.current=!0,()=>{e.current=!1;}),[]),e}function Ne(e,t=30,{initialFocus:r,containers:o}={}){let n=React$2.useRef(typeof window!="undefined"?document.activeElement:null),i=React$2.useRef(null),a=Be(),l=Boolean(t&16),s=Boolean(t&2);React$2.useEffect(()=>{!l||(n.current=document.activeElement);},[l]),React$2.useEffect(()=>{if(!!l)return ()=>{ce(n.current),n.current=null;}},[l]),React$2.useEffect(()=>{if(!s||!e.current)return;let u=document.activeElement;if(r==null?void 0:r.current){if((r==null?void 0:r.current)===u){i.current=u;return}}else if(e.current.contains(u)){i.current=u;return}(r==null?void 0:r.current)?ce(r.current):M(e.current,1)===0&&console.warn("There are no focusable elements inside the <FocusTrap />"),i.current=document.activeElement;},[e,r,s]),w$1("keydown",u=>{!(t&4)||!e.current||u.key==="Tab"&&(u.preventDefault(),M(e.current,(u.shiftKey?2:4)|16)===2&&(i.current=document.activeElement));}),w$1("focus",u=>{if(!(t&8))return;let c=new Set(o==null?void 0:o.current);if(c.add(e),!c.size)return;let m=i.current;if(!m||!a.current)return;let b=u.target;b&&b instanceof HTMLElement?Kr(c,b)?(i.current=b,ce(b)):(u.preventDefault(),u.stopPropagation(),ce(m)):ce(i.current);},!0);}function Kr(e,t){var r;for(let o of e)if((r=o.current)==null?void 0:r.contains(t))return !0;return !1}var fe=new Set,J=new Map;function po(e){e.setAttribute("aria-hidden","true"),e.inert=!0;}function co(e){let t=J.get(e);!t||(t["aria-hidden"]===null?e.removeAttribute("aria-hidden"):e.setAttribute("aria-hidden",t["aria-hidden"]),e.inert=t.inert);}function fo(e,t=!0){x$1(()=>{if(!t||!e.current)return;let r=e.current;fe.add(r);for(let o of J.keys())o.contains(r)&&(co(o),J.delete(o));return document.querySelectorAll("body > *").forEach(o=>{if(o instanceof HTMLElement){for(let n of fe)if(o.contains(n))return;fe.size===1&&(J.set(o,{"aria-hidden":o.getAttribute("aria-hidden"),inert:o.inert}),po(o));}}),()=>{if(fe.delete(r),fe.size>0)document.querySelectorAll("body > *").forEach(o=>{if(o instanceof HTMLElement&&!J.has(o)){for(let n of fe)if(o.contains(n))return;J.set(o,{"aria-hidden":o.getAttribute("aria-hidden"),inert:o.inert}),po(o);}});else for(let o of J.keys())co(o),J.delete(o);}},[t]);}var mo=React$2.createContext(!1);function bo(){return React$2.useContext(mo)}function At(e){return React__default["default"].createElement(mo.Provider,{value:e.force},e.children)}function Xr(){let e=bo(),t=React$2.useContext(Po),[r,o]=React$2.useState(()=>{if(!e&&t!==null||typeof window=="undefined")return null;let n=document.getElementById("headlessui-portal-root");if(n)return n;let i=document.createElement("div");return i.setAttribute("id","headlessui-portal-root"),document.body.appendChild(i)});return React$2.useEffect(()=>{r!==null&&(document.body.contains(r)||document.body.appendChild(r));},[r]),React$2.useEffect(()=>{e||t!==null&&o(t.current);},[t,o,e]),r}var Jr=React$2.Fragment;function We(e){let t=e,r=Xr(),[o]=React$2.useState(()=>typeof window=="undefined"?null:document.createElement("div")),n=q$1();return x$1(()=>{if(!!r&&!!o)return r.appendChild(o),()=>{var i;!r||!o||(r.removeChild(o),r.childNodes.length<=0&&((i=r.parentElement)==null||i.removeChild(r)));}},[r,o]),n?!r||!o?null:reactDom.createPortal(E({props:t,defaultTag:Jr,name:"Portal"}),o):null}var Zr=React$2.Fragment,Po=React$2.createContext(null);function en(e){let{target:t,...r}=e;return React__default["default"].createElement(Po.Provider,{value:t},E({props:r,defaultTag:Zr,name:"Popover.Group"}))}We.Group=en;var vo=React$2.createContext(null);function Ro(){let e=React$2.useContext(vo);if(e===null){let t=new Error("You used a <Description /> component, but it is not inside a relevant parent.");throw Error.captureStackTrace&&Error.captureStackTrace(t,Ro),t}return e}function re(){let[e,t]=React$2.useState([]);return [e.length>0?e.join(" "):void 0,React$2.useMemo(()=>function(o){let n=React$2.useCallback(a=>(t(l=>[...l,a]),()=>t(l=>{let s=l.slice(),u=s.indexOf(a);return u!==-1&&s.splice(u,1),s})),[]),i=React$2.useMemo(()=>({register:n,slot:o.slot,name:o.name,props:o.props}),[n,o.slot,o.name,o.props]);return React__default["default"].createElement(vo.Provider,{value:i},o.children)},[t])]}var an="p";function me(e){let t=Ro(),r=`headlessui-description-${A$1()}`;x$1(()=>t.register(r),[r,t.register]);let o=e,n={...t.props,id:r};return E({props:{...o,...n},slot:t.slot||{},defaultTag:an,name:t.name||"Description"})}var ht=React$2.createContext(()=>{});ht.displayName="StackContext";function cn(){return React$2.useContext(ht)}function Eo({children:e,onUpdate:t,type:r,element:o}){let n=cn(),i=React$2.useCallback((...a)=>{t==null||t(...a),n(...a);},[n,t]);return x$1(()=>(i(0,r,o),()=>i(1,r,o)),[i,r,o]),React__default["default"].createElement(ht.Provider,{value:i},e)}var yn={[0](e,t){return e.titleId===t.id?e:{...e,titleId:t.id}}},Ve=React$2.createContext(null);Ve.displayName="DialogContext";function It(e){let t=React$2.useContext(Ve);if(t===null){let r=new Error(`<${e} /> is missing a parent <${An.displayName} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,It),r}return t}function gn(e,t){return S(t.type,yn,e,t)}var Pn="div",xn=1|2,vn=D(function(t,r){let{open:o,onClose:n,initialFocus:i,...a}=t,[l,s]=React$2.useState(0),u=_();o===void 0&&u!==null&&(o=S(u,{[0]:!0,[1]:!1}));let c=React$2.useRef(new Set),m=React$2.useRef(null),b=I(m,r),T=t.hasOwnProperty("open")||u!==null,y=t.hasOwnProperty("onClose");if(!T&&!y)throw new Error("You have to provide an `open` and an `onClose` prop to the `Dialog` component.");if(!T)throw new Error("You provided an `onClose` prop to the `Dialog`, but forgot an `open` prop.");if(!y)throw new Error("You provided an `open` prop to the `Dialog`, but forgot an `onClose` prop.");if(typeof o!="boolean")throw new Error(`You provided an \`open\` prop to the \`Dialog\`, but the value is not a boolean. Received: ${o}`);if(typeof n!="function")throw new Error(`You provided an \`onClose\` prop to the \`Dialog\`, but the value is not a function. Received: ${n}`);let p=o?0:1,f=(()=>u!==null?u===0:p===0)(),[d,P]=React$2.useReducer(gn,{titleId:null,descriptionId:null}),C=React$2.useCallback(()=>n(!1),[n]),R=React$2.useCallback(F=>P({type:0,id:F}),[P]),v=q$1()&&p===0,h=l>1,O=React$2.useContext(Ve)!==null;Ne(m,v?S(h?"parent":"leaf",{parent:16,leaf:30}):1,{initialFocus:i,containers:c}),fo(m,h?v:!1),w$1("mousedown",F=>{var H;let $=F.target;p===0&&(h||((H=m.current)==null?void 0:H.contains($))||C());}),w$1("keydown",F=>{F.key==="Escape"&&p===0&&(h||(F.preventDefault(),F.stopPropagation(),C()));}),React$2.useEffect(()=>{if(p!==0||O)return;let F=document.documentElement.style.overflow,$=document.documentElement.style.paddingRight,H=window.innerWidth-document.documentElement.clientWidth;return document.documentElement.style.overflow="hidden",document.documentElement.style.paddingRight=`${H}px`,()=>{document.documentElement.style.overflow=F,document.documentElement.style.paddingRight=$;}},[p,O]),React$2.useEffect(()=>{if(p!==0||!m.current)return;let F=new IntersectionObserver($=>{for(let H of $)H.boundingClientRect.x===0&&H.boundingClientRect.y===0&&H.boundingClientRect.width===0&&H.boundingClientRect.height===0&&C();});return F.observe(m.current),()=>F.disconnect()},[p,m,C]);let[N,K]=re(),V=`headlessui-dialog-${A$1()}`,Fe=React$2.useMemo(()=>[{dialogState:p,close:C,setTitleId:R},d],[p,d,C,R]),ge=React$2.useMemo(()=>({open:p===0}),[p]),we={ref:b,id:V,role:"dialog","aria-modal":p===0?!0:void 0,"aria-labelledby":d.titleId,"aria-describedby":N,onClick(F){F.stopPropagation();}},X=a;return React__default["default"].createElement(Eo,{type:"Dialog",element:m,onUpdate:React$2.useCallback((F,$,H)=>{$==="Dialog"&&S(F,{[0](){c.current.add(H),s(Pe=>Pe+1);},[1](){c.current.add(H),s(Pe=>Pe-1);}});},[])},React__default["default"].createElement(At,{force:!0},React__default["default"].createElement(We,null,React__default["default"].createElement(Ve.Provider,{value:Fe},React__default["default"].createElement(We.Group,{target:m},React__default["default"].createElement(At,{force:!1},React__default["default"].createElement(K,{slot:ge,name:"Dialog.Description"},E({props:{...X,...we},slot:ge,defaultTag:Pn,features:xn,visible:f,name:"Dialog"}))))))))}),Rn="div",En=D(function(t,r){let[{dialogState:o,close:n}]=It("Dialog.Overlay"),i=I(r),a=`headlessui-dialog-overlay-${A$1()}`,l=React$2.useCallback(m=>{if(m.target===m.currentTarget){if(G(m.currentTarget))return m.preventDefault();m.preventDefault(),m.stopPropagation(),n();}},[n]),s=React$2.useMemo(()=>({open:o===0}),[o]);return E({props:{...t,...{ref:i,id:a,"aria-hidden":!0,onClick:l}},slot:s,defaultTag:Rn,name:"Dialog.Overlay"})}),Cn="h2";function Sn(e){let[{dialogState:t,setTitleId:r}]=It("Dialog.Title"),o=`headlessui-dialog-title-${A$1()}`;React$2.useEffect(()=>(r(o),()=>r(null)),[o,r]);let n=React$2.useMemo(()=>({open:t===0}),[t]);return E({props:{...e,...{id:o}},slot:n,defaultTag:Cn,name:"Dialog.Title"})}var An=Object.assign(vn,{Overlay:En,Title:Sn,Description:me});var Ln={[0]:e=>({...e,disclosureState:S(e.disclosureState,{[0]:1,[1]:0})}),[1]:e=>e.disclosureState===1?e:{...e,disclosureState:1},[4](e){return e.linkedPanel===!0?e:{...e,linkedPanel:!0}},[5](e){return e.linkedPanel===!1?e:{...e,linkedPanel:!1}},[2](e,t){return e.buttonId===t.buttonId?e:{...e,buttonId:t.buttonId}},[3](e,t){return e.panelId===t.panelId?e:{...e,panelId:t.panelId}}},Mt=React$2.createContext(null);Mt.displayName="DisclosureContext";function Ft(e){let t=React$2.useContext(Mt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Ye.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Ft),r}return t}var wt=React$2.createContext(null);wt.displayName="DisclosureAPIContext";function Ao(e){let t=React$2.useContext(wt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Ye.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Ao),r}return t}var kt=React$2.createContext(null);kt.displayName="DisclosurePanelContext";function Dn(){return React$2.useContext(kt)}function Mn(e,t){return S(t.type,Ln,e,t)}var Fn=React$2.Fragment;function Ye(e){let{defaultOpen:t=!1,...r}=e,o=`headlessui-disclosure-button-${A$1()}`,n=`headlessui-disclosure-panel-${A$1()}`,i=React$2.useReducer(Mn,{disclosureState:t?0:1,linkedPanel:!1,buttonId:o,panelId:n}),[{disclosureState:a},l]=i;React$2.useEffect(()=>l({type:2,buttonId:o}),[o,l]),React$2.useEffect(()=>l({type:3,panelId:n}),[n,l]);let s=React$2.useCallback(m=>{l({type:1});let b=(()=>m?m instanceof HTMLElement?m:m.current instanceof HTMLElement?m.current:document.getElementById(o):document.getElementById(o))();b==null||b.focus();},[l,o]),u=React$2.useMemo(()=>({close:s}),[s]),c=React$2.useMemo(()=>({open:a===0,close:s}),[a,s]);return React__default["default"].createElement(Mt.Provider,{value:i},React__default["default"].createElement(wt.Provider,{value:u},React__default["default"].createElement(W,{value:S(a,{[0]:0,[1]:1})},E({props:r,slot:c,defaultTag:Fn,name:"Disclosure"}))))}var wn="button",kn=D(function(t,r){let[o,n]=Ft("Disclosure.Button"),i=React$2.useRef(null),a=I(i,r),l=Dn(),s=l===null?!1:l===o.panelId,u=React$2.useCallback(f=>{var d;if(s){if(o.disclosureState===1)return;switch(f.key){case" ":case"Enter":f.preventDefault(),f.stopPropagation(),n({type:0}),(d=document.getElementById(o.buttonId))==null||d.focus();break}}else switch(f.key){case" ":case"Enter":f.preventDefault(),f.stopPropagation(),n({type:0});break}},[n,s,o.disclosureState,o.buttonId]),c=React$2.useCallback(f=>{switch(f.key){case" ":f.preventDefault();break}},[]),m=React$2.useCallback(f=>{var d;G(f.currentTarget)||t.disabled||(s?(n({type:0}),(d=document.getElementById(o.buttonId))==null||d.focus()):n({type:0}));},[n,t.disabled,o.buttonId,s]),b=React$2.useMemo(()=>({open:o.disclosureState===0}),[o]),T=U(t,i),y=t,p=s?{ref:a,type:T,onKeyDown:u,onClick:m}:{ref:a,id:o.buttonId,type:T,"aria-expanded":t.disabled?void 0:o.disclosureState===0,"aria-controls":o.linkedPanel?o.panelId:void 0,onKeyDown:u,onKeyUp:c,onClick:m};return E({props:{...y,...p},slot:b,defaultTag:wn,name:"Disclosure.Button"})}),_n="div",Gn=1|2,Hn=D(function(t,r){let[o,n]=Ft("Disclosure.Panel"),{close:i}=Ao("Disclosure.Panel"),a=I(r,()=>{o.linkedPanel||n({type:4});}),l=_(),s=(()=>l!==null?l===0:o.disclosureState===0)();React$2.useEffect(()=>()=>n({type:5}),[n]),React$2.useEffect(()=>{var b;o.disclosureState===1&&((b=t.unmount)!=null?b:!0)&&n({type:5});},[o.disclosureState,t.unmount,n]);let u=React$2.useMemo(()=>({open:o.disclosureState===0,close:i}),[o,i]),c={ref:a,id:o.panelId},m=t;return React__default["default"].createElement(kt.Provider,{value:o.panelId},E({props:{...m,...c},slot:u,defaultTag:_n,features:Gn,visible:s,name:"Disclosure.Panel"}))});Ye.Button=kn;Ye.Panel=Hn;var $n={[1](e){return e.disabled||e.listboxState===1?e:{...e,activeOptionIndex:null,listboxState:1}},[0](e){return e.disabled||e.listboxState===0?e:{...e,listboxState:0}},[2](e,t){return e.disabled===t.disabled?e:{...e,disabled:t.disabled}},[3](e,t){return e.orientation===t.orientation?e:{...e,orientation:t.orientation}},[4](e,t){if(e.disabled||e.listboxState===1)return e;let r=ae(t,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:o=>o.id,resolveDisabled:o=>o.dataRef.current.disabled});return e.searchQuery===""&&e.activeOptionIndex===r?e:{...e,searchQuery:"",activeOptionIndex:r}},[5]:(e,t)=>{if(e.disabled||e.listboxState===1)return e;let o=e.searchQuery!==""?0:1,n=e.searchQuery+t.value.toLowerCase(),a=(e.activeOptionIndex!==null?e.options.slice(e.activeOptionIndex+o).concat(e.options.slice(0,e.activeOptionIndex+o)):e.options).find(s=>{var u;return !s.dataRef.current.disabled&&((u=s.dataRef.current.textValue)==null?void 0:u.startsWith(n))}),l=a?e.options.indexOf(a):-1;return l===-1||l===e.activeOptionIndex?{...e,searchQuery:n}:{...e,searchQuery:n,activeOptionIndex:l}},[6](e){return e.disabled||e.listboxState===1||e.searchQuery===""?e:{...e,searchQuery:""}},[7]:(e,t)=>{var n;let r=Array.from((n=e.optionsRef.current)==null?void 0:n.querySelectorAll('[id^="headlessui-listbox-option-"]')).reduce((i,a,l)=>Object.assign(i,{[a.id]:l}),{}),o=[...e.options,{id:t.id,dataRef:t.dataRef}].sort((i,a)=>r[i.id]-r[a.id]);return {...e,options:o}},[8]:(e,t)=>{let r=e.options.slice(),o=e.activeOptionIndex!==null?r[e.activeOptionIndex]:null,n=r.findIndex(i=>i.id===t.id);return n!==-1&&r.splice(n,1),{...e,options:r,activeOptionIndex:(()=>n===e.activeOptionIndex||o===null?null:r.indexOf(o))()}}},Gt=React$2.createContext(null);Gt.displayName="ListboxContext";function Re(e){let t=React$2.useContext(Gt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Ee.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Re),r}return t}function Qn(e,t){return S(t.type,$n,e,t)}var qn=React$2.Fragment;function Ee(e){let{value:t,onChange:r,disabled:o=!1,horizontal:n=!1,...i}=e,a=n?"horizontal":"vertical",l=React$2.useReducer(Qn,{listboxState:1,propsRef:{current:{value:t,onChange:r}},labelRef:React$2.createRef(),buttonRef:React$2.createRef(),optionsRef:React$2.createRef(),disabled:o,orientation:a,options:[],searchQuery:"",activeOptionIndex:null}),[{listboxState:s,propsRef:u,optionsRef:c,buttonRef:m},b]=l;x$1(()=>{u.current.value=t;},[t,u]),x$1(()=>{u.current.onChange=r;},[r,u]),x$1(()=>b({type:2,disabled:o}),[o]),x$1(()=>b({type:3,orientation:a}),[a]),w$1("mousedown",y=>{var f,d,P;let p=y.target;s===0&&(((f=m.current)==null?void 0:f.contains(p))||((d=c.current)==null?void 0:d.contains(p))||(b({type:1}),de(p,1)||(y.preventDefault(),(P=m.current)==null||P.focus())));});let T=React$2.useMemo(()=>({open:s===0,disabled:o}),[s,o]);return React__default["default"].createElement(Gt.Provider,{value:l},React__default["default"].createElement(W,{value:S(s,{[0]:0,[1]:1})},E({props:i,slot:T,defaultTag:qn,name:"Listbox"})))}var zn="button",Yn=D(function(t,r){var p;let[o,n]=Re("Listbox.Button"),i=I(o.buttonRef,r),a=`headlessui-listbox-button-${A$1()}`,l=Q(),s=React$2.useCallback(f=>{switch(f.key){case" ":case"Enter":case"ArrowDown":f.preventDefault(),n({type:0}),l.nextFrame(()=>{o.propsRef.current.value||n({type:4,focus:0});});break;case"ArrowUp":f.preventDefault(),n({type:0}),l.nextFrame(()=>{o.propsRef.current.value||n({type:4,focus:3});});break}},[n,o,l]),u=React$2.useCallback(f=>{switch(f.key){case" ":f.preventDefault();break}},[]),c=React$2.useCallback(f=>{if(G(f.currentTarget))return f.preventDefault();o.listboxState===0?(n({type:1}),l.nextFrame(()=>{var d;return (d=o.buttonRef.current)==null?void 0:d.focus({preventScroll:!0})})):(f.preventDefault(),n({type:0}));},[n,l,o]),m=ee(()=>{if(!!o.labelRef.current)return [o.labelRef.current.id,a].join(" ")},[o.labelRef.current,a]),b=React$2.useMemo(()=>({open:o.listboxState===0,disabled:o.disabled}),[o]),T=t,y={ref:i,id:a,type:U(t,o.buttonRef),"aria-haspopup":!0,"aria-controls":(p=o.optionsRef.current)==null?void 0:p.id,"aria-expanded":o.disabled?void 0:o.listboxState===0,"aria-labelledby":m,disabled:o.disabled,onKeyDown:s,onKeyUp:u,onClick:c};return E({props:{...T,...y},slot:b,defaultTag:zn,name:"Listbox.Button"})}),Xn="label";function Jn(e){let[t]=Re("Listbox.Label"),r=`headlessui-listbox-label-${A$1()}`,o=React$2.useCallback(()=>{var a;return (a=t.buttonRef.current)==null?void 0:a.focus({preventScroll:!0})},[t.buttonRef]),n=React$2.useMemo(()=>({open:t.listboxState===0,disabled:t.disabled}),[t]),i={ref:t.labelRef,id:r,onClick:o};return E({props:{...e,...i},slot:n,defaultTag:Xn,name:"Listbox.Label"})}var Zn="ul",ei=1|2,ti=D(function(t,r){var f;let[o,n]=Re("Listbox.Options"),i=I(o.optionsRef,r),a=`headlessui-listbox-options-${A$1()}`,l=Q(),s=Q(),u=_(),c=(()=>u!==null?u===0:o.listboxState===0)();x$1(()=>{let d=o.optionsRef.current;!d||o.listboxState===0&&d!==document.activeElement&&d.focus({preventScroll:!0});},[o.listboxState,o.optionsRef]);let m=React$2.useCallback(d=>{switch(s.dispose(),d.key){case" ":if(o.searchQuery!=="")return d.preventDefault(),d.stopPropagation(),n({type:5,value:d.key});case"Enter":if(d.preventDefault(),d.stopPropagation(),n({type:1}),o.activeOptionIndex!==null){let{dataRef:P}=o.options[o.activeOptionIndex];o.propsRef.current.onChange(P.current.value);}k$1().nextFrame(()=>{var P;return (P=o.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})});break;case S(o.orientation,{vertical:"ArrowDown",horizontal:"ArrowRight"}):return d.preventDefault(),d.stopPropagation(),n({type:4,focus:2});case S(o.orientation,{vertical:"ArrowUp",horizontal:"ArrowLeft"}):return d.preventDefault(),d.stopPropagation(),n({type:4,focus:1});case"Home":case"PageUp":return d.preventDefault(),d.stopPropagation(),n({type:4,focus:0});case"End":case"PageDown":return d.preventDefault(),d.stopPropagation(),n({type:4,focus:3});case"Escape":return d.preventDefault(),d.stopPropagation(),n({type:1}),l.nextFrame(()=>{var P;return (P=o.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})});case"Tab":d.preventDefault(),d.stopPropagation();break;default:d.key.length===1&&(n({type:5,value:d.key}),s.setTimeout(()=>n({type:6}),350));break}},[l,n,s,o]),b=ee(()=>{var d,P,C;return (C=(d=o.labelRef.current)==null?void 0:d.id)!=null?C:(P=o.buttonRef.current)==null?void 0:P.id},[o.labelRef.current,o.buttonRef.current]),T=React$2.useMemo(()=>({open:o.listboxState===0}),[o]),y={"aria-activedescendant":o.activeOptionIndex===null||(f=o.options[o.activeOptionIndex])==null?void 0:f.id,"aria-labelledby":b,"aria-orientation":o.orientation,id:a,onKeyDown:m,role:"listbox",tabIndex:0,ref:i};return E({props:{...t,...y},slot:T,defaultTag:Zn,features:ei,visible:c,name:"Listbox.Options"})}),oi="li";function ri(e){let{disabled:t=!1,value:r,...o}=e,[n,i]=Re("Listbox.Option"),a=`headlessui-listbox-option-${A$1()}`,l=n.activeOptionIndex!==null?n.options[n.activeOptionIndex].id===a:!1,s=n.propsRef.current.value===r,u=React$2.useRef({disabled:t,value:r});x$1(()=>{u.current.disabled=t;},[u,t]),x$1(()=>{u.current.value=r;},[u,r]),x$1(()=>{var d,P;u.current.textValue=(P=(d=document.getElementById(a))==null?void 0:d.textContent)==null?void 0:P.toLowerCase();},[u,a]);let c=React$2.useCallback(()=>n.propsRef.current.onChange(r),[n.propsRef,r]);x$1(()=>(i({type:7,id:a,dataRef:u}),()=>i({type:8,id:a})),[u,a]),x$1(()=>{var d,P;n.listboxState===0&&(!s||(i({type:4,focus:4,id:a}),(P=(d=document.getElementById(a))==null?void 0:d.focus)==null||P.call(d)));},[n.listboxState]),x$1(()=>{if(n.listboxState!==0||!l)return;let d=k$1();return d.requestAnimationFrame(()=>{var P,C;(C=(P=document.getElementById(a))==null?void 0:P.scrollIntoView)==null||C.call(P,{block:"nearest"});}),d.dispose},[a,l,n.listboxState,n.activeOptionIndex]);let m=React$2.useCallback(d=>{if(t)return d.preventDefault();c(),i({type:1}),k$1().nextFrame(()=>{var P;return (P=n.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})});},[i,n.buttonRef,t,c]),b=React$2.useCallback(()=>{if(t)return i({type:4,focus:5});i({type:4,focus:4,id:a});},[t,a,i]),T=React$2.useCallback(()=>{t||l||i({type:4,focus:4,id:a});},[t,l,a,i]),y=React$2.useCallback(()=>{t||!l||i({type:4,focus:5});},[t,l,i]),p=React$2.useMemo(()=>({active:l,selected:s,disabled:t}),[l,s,t]);return E({props:{...o,...{id:a,role:"option",tabIndex:t===!0?void 0:-1,"aria-disabled":t===!0?!0:void 0,"aria-selected":s===!0?!0:void 0,disabled:void 0,onClick:m,onFocus:b,onPointerMove:T,onMouseMove:T,onPointerLeave:y,onMouseLeave:y}},slot:p,defaultTag:oi,name:"Listbox.Option"})}Ee.Button=Yn;Ee.Label=Jn;Ee.Options=ti;Ee.Option=ri;var ui={[1](e){return e.menuState===1?e:{...e,activeItemIndex:null,menuState:1}},[0](e){return e.menuState===0?e:{...e,menuState:0}},[2]:(e,t)=>{let r=ae(t,{resolveItems:()=>e.items,resolveActiveIndex:()=>e.activeItemIndex,resolveId:o=>o.id,resolveDisabled:o=>o.dataRef.current.disabled});return e.searchQuery===""&&e.activeItemIndex===r?e:{...e,searchQuery:"",activeItemIndex:r}},[3]:(e,t)=>{let o=e.searchQuery!==""?0:1,n=e.searchQuery+t.value.toLowerCase(),a=(e.activeItemIndex!==null?e.items.slice(e.activeItemIndex+o).concat(e.items.slice(0,e.activeItemIndex+o)):e.items).find(s=>{var u;return ((u=s.dataRef.current.textValue)==null?void 0:u.startsWith(n))&&!s.dataRef.current.disabled}),l=a?e.items.indexOf(a):-1;return l===-1||l===e.activeItemIndex?{...e,searchQuery:n}:{...e,searchQuery:n,activeItemIndex:l}},[4](e){return e.searchQuery===""?e:{...e,searchQuery:"",searchActiveItemIndex:null}},[5]:(e,t)=>{var n;let r=Array.from((n=e.itemsRef.current)==null?void 0:n.querySelectorAll('[id^="headlessui-menu-item-"]')).reduce((i,a,l)=>Object.assign(i,{[a.id]:l}),{}),o=[...e.items,{id:t.id,dataRef:t.dataRef}].sort((i,a)=>r[i.id]-r[a.id]);return {...e,items:o}},[6]:(e,t)=>{let r=e.items.slice(),o=e.activeItemIndex!==null?r[e.activeItemIndex]:null,n=r.findIndex(i=>i.id===t.id);return n!==-1&&r.splice(n,1),{...e,items:r,activeItemIndex:(()=>n===e.activeItemIndex||o===null?null:r.indexOf(o))()}}},Ht=React$2.createContext(null);Ht.displayName="MenuContext";function Je(e){let t=React$2.useContext(Ht);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Ze.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Je),r}return t}function pi(e,t){return S(t.type,ui,e,t)}var di=React$2.Fragment;function Ze(e){let t=React$2.useReducer(pi,{menuState:1,buttonRef:React$2.createRef(),itemsRef:React$2.createRef(),items:[],searchQuery:"",activeItemIndex:null}),[{menuState:r,itemsRef:o,buttonRef:n},i]=t;w$1("mousedown",l=>{var u,c,m;let s=l.target;r===0&&(((u=n.current)==null?void 0:u.contains(s))||((c=o.current)==null?void 0:c.contains(s))||(i({type:1}),de(s,1)||(l.preventDefault(),(m=n.current)==null||m.focus())));});let a=React$2.useMemo(()=>({open:r===0}),[r]);return React__default["default"].createElement(Ht.Provider,{value:t},React__default["default"].createElement(W,{value:S(r,{[0]:0,[1]:1})},E({props:e,slot:a,defaultTag:di,name:"Menu"})))}var ci="button",fi=D(function(t,r){var y;let[o,n]=Je("Menu.Button"),i=I(o.buttonRef,r),a=`headlessui-menu-button-${A$1()}`,l=Q(),s=React$2.useCallback(p=>{switch(p.key){case" ":case"Enter":case"ArrowDown":p.preventDefault(),p.stopPropagation(),n({type:0}),l.nextFrame(()=>n({type:2,focus:0}));break;case"ArrowUp":p.preventDefault(),p.stopPropagation(),n({type:0}),l.nextFrame(()=>n({type:2,focus:3}));break}},[n,l]),u=React$2.useCallback(p=>{switch(p.key){case" ":p.preventDefault();break}},[]),c=React$2.useCallback(p=>{if(G(p.currentTarget))return p.preventDefault();t.disabled||(o.menuState===0?(n({type:1}),l.nextFrame(()=>{var f;return (f=o.buttonRef.current)==null?void 0:f.focus({preventScroll:!0})})):(p.preventDefault(),p.stopPropagation(),n({type:0})));},[n,l,o,t.disabled]),m=React$2.useMemo(()=>({open:o.menuState===0}),[o]),b=t,T={ref:i,id:a,type:U(t,o.buttonRef),"aria-haspopup":!0,"aria-controls":(y=o.itemsRef.current)==null?void 0:y.id,"aria-expanded":t.disabled?void 0:o.menuState===0,onKeyDown:s,onKeyUp:u,onClick:c};return E({props:{...b,...T},slot:m,defaultTag:ci,name:"Menu.Button"})}),mi="div",bi=1|2,Ti=D(function(t,r){var p,f;let[o,n]=Je("Menu.Items"),i=I(o.itemsRef,r),a=`headlessui-menu-items-${A$1()}`,l=Q(),s=_(),u=(()=>s!==null?s===0:o.menuState===0)();React$2.useEffect(()=>{let d=o.itemsRef.current;!d||o.menuState===0&&d!==document.activeElement&&d.focus({preventScroll:!0});},[o.menuState,o.itemsRef]),se({container:o.itemsRef.current,enabled:o.menuState===0,accept(d){return d.getAttribute("role")==="menuitem"?NodeFilter.FILTER_REJECT:d.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(d){d.setAttribute("role","none");}});let c=React$2.useCallback(d=>{var P;switch(l.dispose(),d.key){case" ":if(o.searchQuery!=="")return d.preventDefault(),d.stopPropagation(),n({type:3,value:d.key});case"Enter":if(d.preventDefault(),d.stopPropagation(),n({type:1}),o.activeItemIndex!==null){let{id:C}=o.items[o.activeItemIndex];(P=document.getElementById(C))==null||P.click();}k$1().nextFrame(()=>{var C;return (C=o.buttonRef.current)==null?void 0:C.focus({preventScroll:!0})});break;case"ArrowDown":return d.preventDefault(),d.stopPropagation(),n({type:2,focus:2});case"ArrowUp":return d.preventDefault(),d.stopPropagation(),n({type:2,focus:1});case"Home":case"PageUp":return d.preventDefault(),d.stopPropagation(),n({type:2,focus:0});case"End":case"PageDown":return d.preventDefault(),d.stopPropagation(),n({type:2,focus:3});case"Escape":d.preventDefault(),d.stopPropagation(),n({type:1}),k$1().nextFrame(()=>{var C;return (C=o.buttonRef.current)==null?void 0:C.focus({preventScroll:!0})});break;case"Tab":d.preventDefault(),d.stopPropagation();break;default:d.key.length===1&&(n({type:3,value:d.key}),l.setTimeout(()=>n({type:4}),350));break}},[n,l,o]),m=React$2.useCallback(d=>{switch(d.key){case" ":d.preventDefault();break}},[]),b=React$2.useMemo(()=>({open:o.menuState===0}),[o]),T={"aria-activedescendant":o.activeItemIndex===null||(p=o.items[o.activeItemIndex])==null?void 0:p.id,"aria-labelledby":(f=o.buttonRef.current)==null?void 0:f.id,id:a,onKeyDown:c,onKeyUp:m,role:"menu",tabIndex:0,ref:i};return E({props:{...t,...T},slot:b,defaultTag:mi,features:bi,visible:u,name:"Menu.Items"})}),yi=React$2.Fragment;function gi(e){let{disabled:t=!1,onClick:r,...o}=e,[n,i]=Je("Menu.Item"),a=`headlessui-menu-item-${A$1()}`,l=n.activeItemIndex!==null?n.items[n.activeItemIndex].id===a:!1;x$1(()=>{if(n.menuState!==0||!l)return;let p=k$1();return p.requestAnimationFrame(()=>{var f,d;(d=(f=document.getElementById(a))==null?void 0:f.scrollIntoView)==null||d.call(f,{block:"nearest"});}),p.dispose},[a,l,n.menuState,n.activeItemIndex]);let s=React$2.useRef({disabled:t});x$1(()=>{s.current.disabled=t;},[s,t]),x$1(()=>{var p,f;s.current.textValue=(f=(p=document.getElementById(a))==null?void 0:p.textContent)==null?void 0:f.toLowerCase();},[s,a]),x$1(()=>(i({type:5,id:a,dataRef:s}),()=>i({type:6,id:a})),[s,a]);let u=React$2.useCallback(p=>{if(t)return p.preventDefault();if(i({type:1}),k$1().nextFrame(()=>{var f;return (f=n.buttonRef.current)==null?void 0:f.focus({preventScroll:!0})}),r)return r(p)},[i,n.buttonRef,t,r]),c=React$2.useCallback(()=>{if(t)return i({type:2,focus:5});i({type:2,focus:4,id:a});},[t,a,i]),m=React$2.useCallback(()=>{t||l||i({type:2,focus:4,id:a});},[t,l,a,i]),b=React$2.useCallback(()=>{t||!l||i({type:2,focus:5});},[t,l,i]),T=React$2.useMemo(()=>({active:l,disabled:t}),[l,t]);return E({props:{...o,...{id:a,role:"menuitem",tabIndex:t===!0?void 0:-1,"aria-disabled":t===!0?!0:void 0,disabled:void 0,onClick:u,onFocus:c,onPointerMove:m,onMouseMove:m,onPointerLeave:b,onMouseLeave:b}},slot:T,defaultTag:yi,name:"Menu.Item"})}Ze.Button=fi;Ze.Items=Ti;Ze.Item=gi;var vi={[0]:e=>({...e,popoverState:S(e.popoverState,{[0]:1,[1]:0})}),[1](e){return e.popoverState===1?e:{...e,popoverState:1}},[2](e,t){return e.button===t.button?e:{...e,button:t.button}},[3](e,t){return e.buttonId===t.buttonId?e:{...e,buttonId:t.buttonId}},[4](e,t){return e.panel===t.panel?e:{...e,panel:t.panel}},[5](e,t){return e.panelId===t.panelId?e:{...e,panelId:t.panelId}}},Ut=React$2.createContext(null);Ut.displayName="PopoverContext";function ot(e){let t=React$2.useContext(Ut);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Te.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,ot),r}return t}var Bt=React$2.createContext(null);Bt.displayName="PopoverAPIContext";function Mo(e){let t=React$2.useContext(Bt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${Te.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Mo),r}return t}var Nt=React$2.createContext(null);Nt.displayName="PopoverGroupContext";function Fo(){return React$2.useContext(Nt)}var Wt=React$2.createContext(null);Wt.displayName="PopoverPanelContext";function Ri(){return React$2.useContext(Wt)}function Ei(e,t){return S(t.type,vi,e,t)}var Ci="div";function Te(e){let t=`headlessui-popover-button-${A$1()}`,r=`headlessui-popover-panel-${A$1()}`,o=React$2.useReducer(Ei,{popoverState:1,button:null,buttonId:t,panel:null,panelId:r}),[{popoverState:n,button:i,panel:a},l]=o;React$2.useEffect(()=>l({type:3,buttonId:t}),[t,l]),React$2.useEffect(()=>l({type:5,panelId:r}),[r,l]);let s=React$2.useMemo(()=>({buttonId:t,panelId:r,close:()=>l({type:1})}),[t,r,l]),u=Fo(),c=u==null?void 0:u.registerPopover,m=React$2.useCallback(()=>{var p;return (p=u==null?void 0:u.isFocusWithinPopoverGroup())!=null?p:(i==null?void 0:i.contains(document.activeElement))||(a==null?void 0:a.contains(document.activeElement))},[u,i,a]);React$2.useEffect(()=>c==null?void 0:c(s),[c,s]),w$1("focus",()=>{n===0&&(m()||!i||!a||l({type:1}));},!0),w$1("mousedown",p=>{let f=p.target;n===0&&((i==null?void 0:i.contains(f))||(a==null?void 0:a.contains(f))||(l({type:1}),de(f,1)||(p.preventDefault(),i==null||i.focus())));});let b=React$2.useCallback(p=>{l({type:1});let f=(()=>p?p instanceof HTMLElement?p:p.current instanceof HTMLElement?p.current:i:i)();f==null||f.focus();},[l,i]),T=React$2.useMemo(()=>({close:b}),[b]),y=React$2.useMemo(()=>({open:n===0,close:b}),[n,b]);return React__default["default"].createElement(Ut.Provider,{value:o},React__default["default"].createElement(Bt.Provider,{value:T},React__default["default"].createElement(W,{value:S(n,{[0]:0,[1]:1})},E({props:e,slot:y,defaultTag:Ci,name:"Popover"}))))}var Si="button",Ai=D(function(t,r){let[o,n]=ot("Popover.Button"),i=React$2.useRef(null),a=Fo(),l=a==null?void 0:a.closeOthers,s=Ri(),u=s===null?!1:s===o.panelId,c=I(i,r,u?null:g=>n({type:2,button:g})),m=I(i,r),b=React$2.useRef(null),T=React$2.useRef(typeof window=="undefined"?null:document.activeElement);w$1("focus",()=>{T.current=b.current,b.current=document.activeElement;},!0);let y=React$2.useCallback(g=>{var v,h;if(u){if(o.popoverState===1)return;switch(g.key){case" ":case"Enter":g.preventDefault(),g.stopPropagation(),n({type:1}),(v=o.button)==null||v.focus();break}}else switch(g.key){case" ":case"Enter":g.preventDefault(),g.stopPropagation(),o.popoverState===1&&(l==null||l(o.buttonId)),n({type:0});break;case"Escape":if(o.popoverState!==0)return l==null?void 0:l(o.buttonId);if(!i.current||!i.current.contains(document.activeElement))return;g.preventDefault(),g.stopPropagation(),n({type:1});break;case"Tab":if(o.popoverState!==0||!o.panel||!o.button)return;if(g.shiftKey){if(!T.current||((h=o.button)==null?void 0:h.contains(T.current))||o.panel.contains(T.current))return;let O=xe(),L=O.indexOf(T.current);if(O.indexOf(o.button)>L)return;g.preventDefault(),g.stopPropagation(),M(o.panel,8);}else g.preventDefault(),g.stopPropagation(),M(o.panel,1);break}},[n,o.popoverState,o.buttonId,o.button,o.panel,i,l,u]),p=React$2.useCallback(g=>{var v;if(!u&&(g.key===" "&&g.preventDefault(),o.popoverState===0&&!!o.panel&&!!o.button))switch(g.key){case"Tab":if(!T.current||((v=o.button)==null?void 0:v.contains(T.current))||o.panel.contains(T.current))return;let h=xe(),O=h.indexOf(T.current);if(h.indexOf(o.button)>O)return;g.preventDefault(),g.stopPropagation(),M(o.panel,8);break}},[o.popoverState,o.panel,o.button,u]),f=React$2.useCallback(g=>{var v,h;G(g.currentTarget)||t.disabled||(u?(n({type:1}),(v=o.button)==null||v.focus()):(o.popoverState===1&&(l==null||l(o.buttonId)),(h=o.button)==null||h.focus(),n({type:0})));},[n,o.button,o.popoverState,o.buttonId,t.disabled,l,u]),d=React$2.useMemo(()=>({open:o.popoverState===0}),[o]),P=U(t,i),C=t,R=u?{ref:m,type:P,onKeyDown:y,onClick:f}:{ref:c,id:o.buttonId,type:P,"aria-expanded":t.disabled?void 0:o.popoverState===0,"aria-controls":o.panel?o.panelId:void 0,onKeyDown:y,onKeyUp:p,onClick:f};return E({props:{...C,...R},slot:d,defaultTag:Si,name:"Popover.Button"})}),hi="div",Oi=1|2,Ii=D(function(t,r){let[{popoverState:o},n]=ot("Popover.Overlay"),i=I(r),a=`headlessui-popover-overlay-${A$1()}`,l=_(),s=(()=>l!==null?l===0:o===0)(),u=React$2.useCallback(T=>{if(G(T.currentTarget))return T.preventDefault();n({type:1});},[n]),c=React$2.useMemo(()=>({open:o===0}),[o]);return E({props:{...t,...{ref:i,id:a,"aria-hidden":!0,onClick:u}},slot:c,defaultTag:hi,features:Oi,visible:s,name:"Popover.Overlay"})}),Li$1="div",Di=1|2,Mi=D(function(t,r){let{focus:o=!1,...n}=t,[i,a]=ot("Popover.Panel"),{close:l}=Mo("Popover.Panel"),s=React$2.useRef(null),u=I(s,r,p=>{a({type:4,panel:p});}),c=_(),m=(()=>c!==null?c===0:i.popoverState===0)(),b=React$2.useCallback(p=>{var f;switch(p.key){case"Escape":if(i.popoverState!==0||!s.current||!s.current.contains(document.activeElement))return;p.preventDefault(),p.stopPropagation(),a({type:1}),(f=i.button)==null||f.focus();break}},[i,s,a]);React$2.useEffect(()=>()=>a({type:4,panel:null}),[a]),React$2.useEffect(()=>{var p;t.static||i.popoverState===1&&((p=t.unmount)!=null?p:!0)&&a({type:4,panel:null});},[i.popoverState,t.unmount,t.static,a]),React$2.useEffect(()=>{if(!o||i.popoverState!==0||!s.current)return;let p=document.activeElement;s.current.contains(p)||M(s.current,1);},[o,s,i.popoverState]),w$1("keydown",p=>{var d;if(i.popoverState!==0||!s.current||p.key!=="Tab"||!document.activeElement||!s.current||!s.current.contains(document.activeElement))return;p.preventDefault();let f=M(s.current,p.shiftKey?2:4);if(f===3)return (d=i.button)==null?void 0:d.focus();if(f===1){if(!i.button)return;let P=xe(),C=P.indexOf(i.button),R=P.splice(C+1).filter(g=>{var v;return !((v=s.current)==null?void 0:v.contains(g))});M(R,1)===0&&M(document.body,1);}}),w$1("focus",()=>{var p;!o||i.popoverState===0&&(!s.current||((p=s.current)==null?void 0:p.contains(document.activeElement))||a({type:1}));},!0);let T=React$2.useMemo(()=>({open:i.popoverState===0,close:l}),[i,l]),y={ref:u,id:i.panelId,onKeyDown:b};return React__default["default"].createElement(Wt.Provider,{value:i.panelId},E({props:{...n,...y},slot:T,defaultTag:Li$1,features:Di,visible:m,name:"Popover.Panel"}))}),Fi="div";function wi(e){let t=React$2.useRef(null),[r,o]=React$2.useState([]),n=React$2.useCallback(b=>{o(T=>{let y=T.indexOf(b);if(y!==-1){let p=T.slice();return p.splice(y,1),p}return T});},[o]),i=React$2.useCallback(b=>(o(T=>[...T,b]),()=>n(b)),[o,n]),a=React$2.useCallback(()=>{var T;let b=document.activeElement;return ((T=t.current)==null?void 0:T.contains(b))?!0:r.some(y=>{var p,f;return ((p=document.getElementById(y.buttonId))==null?void 0:p.contains(b))||((f=document.getElementById(y.panelId))==null?void 0:f.contains(b))})},[t,r]),l=React$2.useCallback(b=>{for(let T of r)T.buttonId!==b&&T.close();},[r]),s=React$2.useMemo(()=>({registerPopover:i,unregisterPopover:n,isFocusWithinPopoverGroup:a,closeOthers:l}),[i,n,a,l]),u=React$2.useMemo(()=>({}),[]),c={ref:t},m=e;return React__default["default"].createElement(Nt.Provider,{value:s},E({props:{...m,...c},slot:u,defaultTag:Fi,name:"Popover.Group"}))}Te.Button=Ai;Te.Overlay=Ii;Te.Panel=Mi;Te.Group=wi;function wo(e=0){let[t,r]=React$2.useState(e),o=React$2.useCallback(l=>r(s=>s|l),[r]),n=React$2.useCallback(l=>Boolean(t&l),[t]),i=React$2.useCallback(l=>r(s=>s&~l),[r]),a=React$2.useCallback(l=>r(s=>s^l),[r]);return {addFlag:o,hasFlag:n,removeFlag:i,toggleFlag:a}}var _o=React$2.createContext(null);function Go(){let e=React$2.useContext(_o);if(e===null){let t=new Error("You used a <Label /> component, but it is not inside a relevant parent.");throw Error.captureStackTrace&&Error.captureStackTrace(t,Go),t}return e}function Ae(){let[e,t]=React$2.useState([]);return [e.length>0?e.join(" "):void 0,React$2.useMemo(()=>function(o){let n=React$2.useCallback(a=>(t(l=>[...l,a]),()=>t(l=>{let s=l.slice(),u=s.indexOf(a);return u!==-1&&s.splice(u,1),s})),[]),i=React$2.useMemo(()=>({register:n,slot:o.slot,name:o.name,props:o.props}),[n,o.slot,o.name,o.props]);return React__default["default"].createElement(_o.Provider,{value:i},o.children)},[t])]}var Ni="label";function nt(e){let{passive:t=!1,...r}=e,o=Go(),n=`headlessui-label-${A$1()}`;x$1(()=>o.register(n),[n,o.register]);let i={...o.props,id:n},a={...r,...i};return t&&delete a.onClick,E({props:a,slot:o.slot||{},defaultTag:Ni,name:o.name||"Label"})}var Vi={[0](e,t){return {...e,options:[...e.options,{id:t.id,element:t.element,propsRef:t.propsRef}]}},[1](e,t){let r=e.options.slice(),o=e.options.findIndex(n=>n.id===t.id);return o===-1?e:(r.splice(o,1),{...e,options:r})}},jt=React$2.createContext(null);jt.displayName="RadioGroupContext";function Ho(e){let t=React$2.useContext(jt);if(t===null){let r=new Error(`<${e} /> is missing a parent <${lt.name} /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,Ho),r}return t}function $i(e,t){return S(t.type,Vi,e,t)}var Qi="div";function lt(e){let{value:t,onChange:r,disabled:o=!1,...n}=e,[{options:i},a]=React$2.useReducer($i,{options:[]}),[l,s]=Ae(),[u,c]=re(),m=`headlessui-radiogroup-${A$1()}`,b=React$2.useRef(null),T=React$2.useMemo(()=>i.find(R=>!R.propsRef.current.disabled),[i]),y=React$2.useMemo(()=>i.some(R=>R.propsRef.current.value===t),[i,t]),p=React$2.useCallback(R=>{var v;if(o||R===t)return !1;let g=(v=i.find(h=>h.propsRef.current.value===R))==null?void 0:v.propsRef.current;return (g==null?void 0:g.disabled)?!1:(r(R),!0)},[r,t,o,i]);se({container:b.current,accept(R){return R.getAttribute("role")==="radio"?NodeFilter.FILTER_REJECT:R.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(R){R.setAttribute("role","none");}});let f=React$2.useCallback(R=>{if(!b.current)return;let v=i.filter(h=>h.propsRef.current.disabled===!1).map(h=>h.element.current);switch(R.key){case"ArrowLeft":case"ArrowUp":if(R.preventDefault(),R.stopPropagation(),M(v,2|16)===2){let O=i.find(L=>L.element.current===document.activeElement);O&&p(O.propsRef.current.value);}break;case"ArrowRight":case"ArrowDown":if(R.preventDefault(),R.stopPropagation(),M(v,4|16)===2){let O=i.find(L=>L.element.current===document.activeElement);O&&p(O.propsRef.current.value);}break;case" ":{R.preventDefault(),R.stopPropagation();let h=i.find(O=>O.element.current===document.activeElement);h&&p(h.propsRef.current.value);}break}},[b,i,p]),d=React$2.useCallback(R=>(a({type:0,...R}),()=>a({type:1,id:R.id})),[a]),P=React$2.useMemo(()=>({registerOption:d,firstOption:T,containsCheckedOption:y,change:p,disabled:o,value:t}),[d,T,y,p,o,t]),C={ref:b,id:m,role:"radiogroup","aria-labelledby":l,"aria-describedby":u,onKeyDown:f};return React__default["default"].createElement(c,{name:"RadioGroup.Description"},React__default["default"].createElement(s,{name:"RadioGroup.Label"},React__default["default"].createElement(jt.Provider,{value:P},E({props:{...n,...C},defaultTag:Qi,name:"RadioGroup"}))))}var qi="div";function zi(e){let t=React$2.useRef(null),r=`headlessui-radiogroup-option-${A$1()}`,[o,n]=Ae(),[i,a]=re(),{addFlag:l,removeFlag:s,hasFlag:u}=wo(1),{value:c,disabled:m=!1,...b}=e,T=React$2.useRef({value:c,disabled:m});x$1(()=>{T.current.value=c;},[c,T]),x$1(()=>{T.current.disabled=m;},[m,T]);let{registerOption:y,disabled:p,change:f,firstOption:d,containsCheckedOption:P,value:C}=Ho("RadioGroup.Option");x$1(()=>y({id:r,element:t,propsRef:T}),[r,y,t,e]);let R=React$2.useCallback(()=>{var V;!f(c)||(l(2),(V=t.current)==null||V.focus());},[l,f,c]),g=React$2.useCallback(()=>l(2),[l]),v=React$2.useCallback(()=>s(2),[s]),h=(d==null?void 0:d.id)===r,O=p||m,L=C===c,N={ref:t,id:r,role:"radio","aria-checked":L?"true":"false","aria-labelledby":o,"aria-describedby":i,"aria-disabled":O?!0:void 0,tabIndex:(()=>O?-1:L||!P&&h?0:-1)(),onClick:O?void 0:R,onFocus:O?void 0:g,onBlur:O?void 0:v},K=React$2.useMemo(()=>({checked:L,disabled:O,active:u(2)}),[L,O,u]);return React__default["default"].createElement(a,{name:"RadioGroup.Description"},React__default["default"].createElement(n,{name:"RadioGroup.Label"},E({props:{...b,...N},slot:K,defaultTag:qi,name:"RadioGroup.Option"})))}lt.Option=zi;lt.Label=nt;lt.Description=me;var $t=React$2.createContext(null);$t.displayName="GroupContext";var zt=React$2.createContext(null);zt.displayName="TabsContext";var dt=React$2.createContext(null);dt.displayName="TransitionContext";var ct=React$2.createContext(null);ct.displayName="NestingContext";
 
 var BaseSelectButton = function (_a) {
     var children = _a.children, as = _a.as;
@@ -4486,12 +4486,12 @@ var Container$C = newStyled.div(templateObject_1$Z || (templateObject_1$Z = __ma
     var borderColor = _a.borderColor;
     return borderColor;
 });
-var Image$2 = newStyled.img(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n"], ["\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n"])));
+var Image$3 = newStyled.img(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n"], ["\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n"])));
 var PatternSelector = function (_a) {
     var url = _a.url, selected = _a.selected, testId = _a.testId;
     var theme = useTheme();
     var outerBorder = selected ? theme.colors.shades['550'].color : 'transparent';
-    return (jsxRuntime.jsx(Container$C, __assign$1({ "data-testid": testId, borderColor: outerBorder }, { children: jsxRuntime.jsx(Image$2, { src: url, alt: "pattern" }, void 0) }), void 0));
+    return (jsxRuntime.jsx(Container$C, __assign$1({ "data-testid": testId, borderColor: outerBorder }, { children: jsxRuntime.jsx(Image$3, { src: url, alt: "pattern" }, void 0) }), void 0));
 };
 var templateObject_1$Z, templateObject_2$C;
 
@@ -4551,14 +4551,14 @@ var MultiColorPicker = function (_a) {
     return (jsxRuntime.jsxs(ColorRadioGroup$1, __assign$1({ value: selectedColor, onChange: onChangeHandler }, { children: [jsxRuntime.jsx(ColorRadioGroup$1.Label, { label: label, values: valueLabels }, void 0), jsxRuntime.jsx(ColorRadioGroup$1.OptionsContainer, { children: renderOptions(selectedColor, options) }, void 0)] }), void 0));
 };
 
-var Image$1 = newStyled.img(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n  width: 4.063rem;\n  height: 5.375rem;\n  box-sizing: border-box;\n  cursor: pointer;\n  border: ", ";\n"], ["\n  width: 4.063rem;\n  height: 5.375rem;\n  box-sizing: border-box;\n  cursor: pointer;\n  border: ", ";\n"])), function (_a) {
+var Image$2 = newStyled.img(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n  width: 4.063rem;\n  height: 5.375rem;\n  box-sizing: border-box;\n  cursor: pointer;\n  border: ", ";\n"], ["\n  width: 4.063rem;\n  height: 5.375rem;\n  box-sizing: border-box;\n  cursor: pointer;\n  border: ", ";\n"])), function (_a) {
     var selected = _a.selected, theme = _a.theme;
     return selected ? "0.063rem solid ".concat(theme.colors.shades['700'].color) : 'inherit';
 });
 var ImageSmallPreview = function (_a) {
     var imageUrl = _a.imageUrl, alt = _a.alt, _b = _a.selected, selected = _b === void 0 ? false : _b, className = _a.className;
     var theme = useTheme();
-    return jsxRuntime.jsx(Image$1, { className: className, src: imageUrl, alt: alt, selected: selected, theme: theme }, void 0);
+    return jsxRuntime.jsx(Image$2, { className: className, src: imageUrl, alt: alt, selected: selected, theme: theme }, void 0);
 };
 var templateObject_1$Y;
 
@@ -4928,7 +4928,7 @@ var Symbol$2 = _Symbol;
 var objectProto$1 = Object.prototype;
 
 /** Used to check objects for own properties. */
-var hasOwnProperty = objectProto$1.hasOwnProperty;
+var hasOwnProperty$1 = objectProto$1.hasOwnProperty;
 
 /**
  * Used to resolve the
@@ -4948,7 +4948,7 @@ var symToStringTag$1 = Symbol$2 ? Symbol$2.toStringTag : undefined;
  * @returns {string} Returns the raw `toStringTag`.
  */
 function getRawTag$1(value) {
-  var isOwn = hasOwnProperty.call(value, symToStringTag$1),
+  var isOwn = hasOwnProperty$1.call(value, symToStringTag$1),
       tag = value[symToStringTag$1];
 
   try {
@@ -6453,7 +6453,7 @@ var Track = /*#__PURE__*/function (_React$PureComponent) {
         onMouseOver: onMouseOver,
         onMouseLeave: onMouseLeave
       };
-      return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
+      return /*#__PURE__*/React__default["default"].createElement("div", _extends$2({
         ref: this.handleRef,
         className: "slick-track",
         style: this.props.trackStyle
@@ -6609,7 +6609,7 @@ var PrevArrow = /*#__PURE__*/function (_React$PureComponent) {
       if (this.props.prevArrow) {
         prevArrow = /*#__PURE__*/React__default["default"].cloneElement(this.props.prevArrow, _objectSpread2(_objectSpread2({}, prevArrowProps), customProps));
       } else {
-        prevArrow = /*#__PURE__*/React__default["default"].createElement("button", _extends$1({
+        prevArrow = /*#__PURE__*/React__default["default"].createElement("button", _extends$2({
           key: "0",
           type: "button"
         }, prevArrowProps), " ", "Previous");
@@ -6675,7 +6675,7 @@ var NextArrow = /*#__PURE__*/function (_React$PureComponent2) {
       if (this.props.nextArrow) {
         nextArrow = /*#__PURE__*/React__default["default"].cloneElement(this.props.nextArrow, _objectSpread2(_objectSpread2({}, nextArrowProps), customProps));
       } else {
-        nextArrow = /*#__PURE__*/React__default["default"].createElement("button", _extends$1({
+        nextArrow = /*#__PURE__*/React__default["default"].createElement("button", _extends$2({
           key: "1",
           type: "button"
         }, nextArrowProps), " ", "Next");
@@ -8378,9 +8378,9 @@ var InnerSlider = /*#__PURE__*/function (_React$Component) {
         };
       }
 
-      return /*#__PURE__*/React__default["default"].createElement("div", innerSliderProps, !_this.props.unslick ? prevArrow : "", /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
+      return /*#__PURE__*/React__default["default"].createElement("div", innerSliderProps, !_this.props.unslick ? prevArrow : "", /*#__PURE__*/React__default["default"].createElement("div", _extends$2({
         ref: _this.listRefHandler
-      }, listProps), /*#__PURE__*/React__default["default"].createElement(Track, _extends$1({
+      }, listProps), /*#__PURE__*/React__default["default"].createElement(Track, _extends$2({
         ref: _this.trackRefHandler
       }, trackProps), _this.props.children)), !_this.props.unslick ? nextArrow : "", !_this.props.unslick ? dots : "");
     });
@@ -8793,7 +8793,7 @@ var Slider = /*#__PURE__*/function (_React$Component) {
         settings.unslick = true;
       }
 
-      return /*#__PURE__*/React__default["default"].createElement(InnerSlider, _extends$1({
+      return /*#__PURE__*/React__default["default"].createElement(InnerSlider, _extends$2({
         style: this.props.style,
         ref: this.innerSliderRefHandler
       }, settings), newChildren);
@@ -8875,7 +8875,7 @@ var Container$B = newStyled.div(templateObject_3$q || (templateObject_3$q = __ma
     var position = _a.position;
     return (position == 'horizontal' ? horizontalStyles : verticalStyles);
 });
-var Button$3 = newStyled.button(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n  padding: 0;\n  border: none;\n  text-decoration: none;\n  background: transparent;\n"], ["\n  padding: 0;\n  border: none;\n  text-decoration: none;\n  background: transparent;\n"])));
+var Button$3 = newStyled.button(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n  padding: 0;\n  border: none;\n  text-decoration: none;\n  background: transparent;\n  outline: none;\n"], ["\n  padding: 0;\n  border: none;\n  text-decoration: none;\n  background: transparent;\n  outline: none;\n"])));
 var ImagePreviewList = function (_a) {
     var images = _a.images, selectedImage = _a.selectedImage, onClick = _a.onClick, dataTestId = _a.dataTestId, position = _a.position;
     return (jsxRuntime.jsx(Container$B, __assign$1({ "data-testid": dataTestId, position: position, className: position }, { children: position == 'horizontal' ? (jsxRuntime.jsx("div", __assign$1({ style: { maxWidth: '360px' } }, { children: jsxRuntime.jsx(SliderNavigation, __assign$1({ speed: 200, infinite: false, arrows: {
@@ -8886,238 +8886,1818 @@ var ImagePreviewList = function (_a) {
 };
 var templateObject_1$W, templateObject_2$B, templateObject_3$q, templateObject_4$i;
 
-var Img = newStyled.img(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n  height: ", ";\n  width: ", ";\n  border-radius: ", ";\n  object-fit: ", ";\n  object-position: ", ";\n"], ["\n  height: ", ";\n  width: ", ";\n  border-radius: ", ";\n  object-fit: ", ";\n  object-position: ", ";\n"])), function (props) { return props.height; }, function (props) { return props.width; }, function (props) { return props.borderRadius; }, function (props) { return props.objectFit; }, function (props) { return props.objectPosition; });
-var Image = function (_a) {
-    var src = _a.src, alt = _a.alt, height = _a.height, width = _a.width, borderRadius = _a.borderRadius, objectFit = _a.objectFit, objectPosition = _a.objectPosition, className = _a.className;
-    return (jsxRuntime.jsx(Img, { src: src, alt: alt, height: height, width: width, borderRadius: borderRadius, objectFit: objectFit, objectPosition: objectPosition, className: className }, void 0));
-};
-var templateObject_1$V;
+var propTypes = {exports: {}};
 
-var Container$A = newStyled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n  position: relative;\n  height: '45rem' &.styleforhorizontal {\n    height: '30rem';\n  }\n"], ["\n  position: relative;\n  height: '45rem' &.styleforhorizontal {\n    height: '30rem';\n  }\n"])));
-var TopTagContainer$2 = newStyled.div(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n  position: absolute;\n  left: 0;\n  top: 0;\n"], ["\n  position: absolute;\n  left: 0;\n  top: 0;\n"])));
-var BottomTagContainer$2 = newStyled.div(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n  position: absolute;\n  bottom: 3.75rem;\n  left: 0;\n"], ["\n  position: absolute;\n  bottom: 3.75rem;\n  left: 0;\n"])));
-var ImageProductWithTags$1 = function (_a) {
-    var image = _a.image, DiscountTagElement = _a.DiscountTagElement, BestSellerTagElement = _a.BestSellerTagElement, testId = _a.testId, position = _a.position;
-    return (jsxRuntime.jsxs(Container$A, __assign$1({ "data-testid": testId, className: "stylefor".concat(position) }, { children: [jsxRuntime.jsx(Image, { src: image.imageUrl, alt: image.alt, objectFit: "cover", objectPosition: "center", width: position == 'horizontal' ? '360px' : '530px', height: position == 'horizontal' ? 'auto' : '720px' }, void 0), jsxRuntime.jsx(TopTagContainer$2, { children: DiscountTagElement }, void 0), jsxRuntime.jsx(BottomTagContainer$2, { children: BestSellerTagElement }, void 0)] }), void 0));
-};
-var templateObject_1$U, templateObject_2$A, templateObject_3$p;
+var reactIs = {exports: {}};
 
-var Container$z = newStyled.div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: auto auto;\n  grid-column-gap: 20px;\n  max-height: 45rem;\n  width: fit-content;\n"], ["\n  display: grid;\n  grid-template-columns: auto auto;\n  grid-column-gap: 20px;\n  max-height: 45rem;\n  width: fit-content;\n"])));
-var ProductGallery = function (_a) {
-    var images = _a.images, selectedValue = _a.selectedValue, DiscountTagElement = _a.DiscountTagElement, BestSellerTagElement = _a.BestSellerTagElement, productImageDataTestId = _a.productImageDataTestId, previewListDataTestId = _a.previewListDataTestId, thumbnailPosition = _a.thumbnailPosition;
-    var initialValue = selectedValue && images.includes(selectedValue) ? selectedValue : images[0];
-    var _b = React$2.useState(initialValue), selectedImage = _b[0], setSelectedImage = _b[1];
-    React$2.useEffect(function () {
-        setSelectedImage(initialValue);
-    }, [initialValue]);
-    return (jsxRuntime.jsxs(Container$z, { children: [jsxRuntime.jsx(ImagePreviewList, { images: images, selectedImage: selectedImage, dataTestId: previewListDataTestId, onClick: function (value) {
-                    setSelectedImage(value);
-                }, position: thumbnailPosition }, void 0), jsxRuntime.jsx(ImageProductWithTags$1, { image: selectedImage, DiscountTagElement: DiscountTagElement, BestSellerTagElement: BestSellerTagElement, testId: productImageDataTestId, position: thumbnailPosition }, void 0)] }, void 0));
-};
-var templateObject_1$T;
+var reactIs_production_min = {};
 
-/* base styles & size variants */
-var StarStyles = {
-    baseStyles: function () {
-        return css({
-            display: 'flex',
-        });
-    },
-    xsmall: function (theme) {
-        return css({
-            svg: {
-                width: theme.component.stars.element.xsmall.width,
-                height: theme.component.stars.element.xsmall.height,
-                marginRight: theme.component.stars.element.xsmall.marginRight,
-            },
-        });
-    },
-    small: function (theme) {
-        return css({
-            svg: {
-                width: theme.component.stars.element.small.width,
-                height: theme.component.stars.element.small.height,
-                marginRight: theme.component.stars.element.small.marginRight,
-            },
-        });
-    },
-    medium: function (theme) {
-        return css({
-            svg: {
-                width: theme.component.stars.element.medium.width,
-                height: theme.component.stars.element.medium.height,
-                marginRight: theme.component.stars.element.medium.marginRight,
-            },
-        });
-    },
-    large: function (theme) {
-        return css({
-            svg: {
-                width: theme.component.stars.element.large.width,
-                height: theme.component.stars.element.large.height,
-                marginRight: theme.component.stars.element.large.marginRight,
-            },
-        });
-    },
-};
-var Container$y = newStyled.div(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
-var templateObject_1$S;
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
+Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
+function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}reactIs_production_min.AsyncMode=l;reactIs_production_min.ConcurrentMode=m;reactIs_production_min.ContextConsumer=k;reactIs_production_min.ContextProvider=h;reactIs_production_min.Element=c;reactIs_production_min.ForwardRef=n;reactIs_production_min.Fragment=e;reactIs_production_min.Lazy=t;reactIs_production_min.Memo=r;reactIs_production_min.Portal=d;
+reactIs_production_min.Profiler=g;reactIs_production_min.StrictMode=f;reactIs_production_min.Suspense=p;reactIs_production_min.isAsyncMode=function(a){return A(a)||z(a)===l};reactIs_production_min.isConcurrentMode=A;reactIs_production_min.isContextConsumer=function(a){return z(a)===k};reactIs_production_min.isContextProvider=function(a){return z(a)===h};reactIs_production_min.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};reactIs_production_min.isForwardRef=function(a){return z(a)===n};reactIs_production_min.isFragment=function(a){return z(a)===e};reactIs_production_min.isLazy=function(a){return z(a)===t};
+reactIs_production_min.isMemo=function(a){return z(a)===r};reactIs_production_min.isPortal=function(a){return z(a)===d};reactIs_production_min.isProfiler=function(a){return z(a)===g};reactIs_production_min.isStrictMode=function(a){return z(a)===f};reactIs_production_min.isSuspense=function(a){return z(a)===p};
+reactIs_production_min.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};reactIs_production_min.typeOf=z;
 
-var StarContainer = newStyled.div(function (_a) {
-    var size = _a.size, theme = _a.theme;
-    return [
-        StarStyles.baseStyles(),
-        StarStyles[size](theme),
-    ];
-});
-var sizes = {
-    xsmall: { width: 0.75, height: 0.75 },
-    small: { width: 1, height: 1 },
-    medium: { width: 1.5, height: 1.5 },
-    large: { width: 2.5, height: 2.5 },
-};
-var StarList = function (_a) {
-    var rating = _a.rating, starsNumber = _a.starsNumber, fill = _a.fill, _b = _a.size, size = _b === void 0 ? exports.ComponentSize.Medium : _b;
-    var theme = useTheme();
-    return (jsxRuntime.jsx(Container$y, { children: __spreadArray([], new Array(starsNumber), true).map(function (_, index) {
-            return (jsxRuntime.jsx(StarContainer, __assign$1({ "data-testid": "star-container", size: size, theme: theme }, { children: index < Math.floor(rating) ? (jsxRuntime.jsx(Icon.PDP.Star, __assign$1({}, sizes[size], { fill: fill }), void 0)) : index === Math.floor(rating) && rating % 1 != 0 ? (jsxRuntime.jsx(Icon.PDP.StarHalf, __assign$1({}, sizes[size], { fill: fill }), void 0)) : (jsxRuntime.jsx(Icon.PDP.StarEmpty, __assign$1({}, sizes[size], { fill: fill }), void 0)) }), index));
-        }) }, void 0));
-};
+var reactIs_development = {};
 
-/* base styles & size variants */
-var LabelStyles = {
-    baseStyles: function (theme) {
-        return css({
-            margin: '0',
-            display: 'flex',
-            color: theme.colors.pallete.secondary.color,
-            fontWeight: theme.component.rating.fontWeight,
-        });
-    },
-    xsmall: function (theme) {
-        return css({
-            fontSize: theme.component.rating.size.xsmall.fontSize,
-            lineHeight: theme.component.rating.size.xsmall.lineHeight,
-            marginLeft: '0.172rem',
-        });
-    },
-    small: function (theme) {
-        return css({
-            fontSize: theme.component.rating.size.small.fontSize,
-            lineHeight: theme.component.rating.size.small.lineHeight,
-            marginLeft: '0.313rem',
-        });
-    },
-    medium: function (theme) {
-        return css({
-            fontSize: theme.component.rating.size.medium.fontSize,
-            lineHeight: theme.component.rating.size.medium.lineHeight,
-            marginLeft: '0.438rem',
-        });
-    },
-    large: function (theme) {
-        return css({
-            fontSize: theme.component.rating.size.large.fontSize,
-            lineHeight: theme.component.rating.size.large.lineHeight,
-            marginLeft: '0.563rem',
-        });
-    },
-};
-var Container$x = newStyled.div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
-var templateObject_1$R;
+/** @license React v16.13.1
+ * react-is.development.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
 
-var CustomLabel = newStyled.div(function (_a) {
-    var theme = _a.theme, size = _a.size, wrapWithParenthesis = _a.wrapWithParenthesis;
-    return [
-        LabelStyles.baseStyles(theme),
-        LabelStyles[size](theme),
-        {
-            ':before': {
-                content: wrapWithParenthesis ? '"("' : '""',
-            },
-            ':after': {
-                content: wrapWithParenthesis ? '")"' : '""',
-            },
-        },
-    ];
-});
-var starsNumber = 5;
-var Rating = function (_a) {
-    var _b = _a.size, size = _b === void 0 ? exports.ComponentSize.Medium : _b, reviews = _a.reviews, reviewsText = _a.reviewsText, rating = _a.rating, _c = _a.wrapWithParenthesis, wrapWithParenthesis = _c === void 0 ? false : _c;
-    var theme = useTheme();
-    return (jsxRuntime.jsxs(Container$x, { children: [jsxRuntime.jsx(StarList, { rating: rating, size: size, starsNumber: starsNumber, fill: theme.component.stars.element.color }, void 0), jsxRuntime.jsxs(CustomLabel, __assign$1({ theme: theme, size: size, wrapWithParenthesis: wrapWithParenthesis, "data-testid": "CustomLabel" }, { children: [reviews, " ", reviewsText] }), void 0)] }, void 0));
-};
 
-var Container$w = newStyled.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  font-size: 0.88rem;\n"], ["\n  display: flex;\n  align-items: center;\n  font-size: 0.88rem;\n"])));
-var P$2 = newStyled.p(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n  margin: 0 0.25rem;\n  font-weight: 700;\n  color: ", ";\n"], ["\n  margin: 0 0.25rem;\n  font-weight: 700;\n  color: ", ";\n"])), function (props) { return props.theme.colors.shades['550'].color; });
-var textButtonStyles = function (theme) { return ({
-    border: 'none',
-    background: 'transparent',
-    padding: 0,
-    textDecoration: 'underline',
-    color: theme.colors.shades['400'].color,
-    lineHeight: '1.13rem',
-    cursor: 'pointer',
-}); };
-var FitPredictor = function (_a) {
-    var onClick = _a.onClick;
-    var theme = useTheme();
-    return (jsxs(Container$w, __assign$1({ theme: theme }, { children: [jsx(Container$w, { children: jsx(Icon.Other.FitPredictor, { width: 1.125, height: 1.125, fill: theme.colors.shades['550'].color }, void 0) }, void 0), jsx(P$2, __assign$1({ theme: theme }, { children: "FIT PREDICTOR" }), void 0), jsx(BaseButton, __assign$1({ css: textButtonStyles(theme), onClick: onClick }, { children: "Calculate your size" }), void 0)] }), void 0));
-};
-var templateObject_1$Q, templateObject_2$z;
 
-var H2$2 = newStyled.h2(function (_a) {
-    var color = _a.color;
-    return ({
-        textAlign: 'center',
-        fontWeight: 400,
-        fontStyle: 'normal',
-        fontSize: '0.875rem',
-        lineHeight: '1.375rem',
-        color: color,
-        margin: '0.938rem 4.188rem',
-    });
-});
-var Bar = newStyled.div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n  @keyframes loading {\n    0% {\n      transform: translateX(0);\n    }\n    to {\n      transform: translateX(400%);\n    }\n  }\n\n  height: 0.5rem;\n  background-color: ", ";\n  width: ", ";\n  border-radius: 0.25rem;\n  position: absolute;\n  left: ", ";\n  animation: ", ";\n"], ["\n  @keyframes loading {\n    0% {\n      transform: translateX(0);\n    }\n    to {\n      transform: translateX(400%);\n    }\n  }\n\n  height: 0.5rem;\n  background-color: ", ";\n  width: ", ";\n  border-radius: 0.25rem;\n  position: absolute;\n  left: ", ";\n  animation: ", ";\n"])), function (_a) {
-    var backgroundColor = _a.backgroundColor;
-    return backgroundColor;
-}, function (_a) {
-    var percent = _a.percent;
-    return (percent ? getBarWithBasedOnPercent(percent) : '50%');
-}, function (_a) {
-    var percent = _a.percent;
-    return (percent ? '0' : '-50%');
-}, function (_a) {
-    var percent = _a.percent;
-    return (percent ? 'none' : 'loading 1s ease-in 0.5s infinite');
-});
-var Background = newStyled.div(function (_a) {
-    var backgroundColor = _a.backgroundColor;
-    return ({
-        height: '0.5rem',
-        width: '100%',
-        backgroundColor: backgroundColor,
-        borderRadius: '0.25rem',
-        position: 'absolute',
-    });
-});
-var Container$v = newStyled.div(function (_a) {
-    var widthAuto = _a.widthAuto;
-    return ({
-        width: widthAuto ? 'auto' : 'fit-content',
-        position: 'relative',
-        overflow: 'hidden',
-    });
-});
-var getBarWithBasedOnPercent = function (percent) {
-    return percent <= 100 && percent >= 0 ? "".concat(percent, "%") : '0%';
-};
-var ProgressBar = function (_a) {
-    var description = _a.description, fillColor = _a.fillColor, _b = _a.widthAuto, widthAuto = _b === void 0 ? true : _b, percent = _a.percent;
-    var theme = useTheme();
+if (process.env.NODE_ENV !== "production") {
+  (function() {
+
+// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
+// nor polyfill, then a plain number is used for performance.
+var hasSymbol = typeof Symbol === 'function' && Symbol.for;
+var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
+var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
+var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
+var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
+var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
+var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
+var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
+// (unstable) APIs that have been removed. Can we remove the symbols?
+
+var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
+var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
+var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
+var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
+var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
+var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
+var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
+var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
+var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
+var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
+var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
+
+function isValidElementType(type) {
+  return typeof type === 'string' || typeof type === 'function' || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
+  type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
+}
+
+function typeOf(object) {
+  if (typeof object === 'object' && object !== null) {
+    var $$typeof = object.$$typeof;
+
+    switch ($$typeof) {
+      case REACT_ELEMENT_TYPE:
+        var type = object.type;
+
+        switch (type) {
+          case REACT_ASYNC_MODE_TYPE:
+          case REACT_CONCURRENT_MODE_TYPE:
+          case REACT_FRAGMENT_TYPE:
+          case REACT_PROFILER_TYPE:
+          case REACT_STRICT_MODE_TYPE:
+          case REACT_SUSPENSE_TYPE:
+            return type;
+
+          default:
+            var $$typeofType = type && type.$$typeof;
+
+            switch ($$typeofType) {
+              case REACT_CONTEXT_TYPE:
+              case REACT_FORWARD_REF_TYPE:
+              case REACT_LAZY_TYPE:
+              case REACT_MEMO_TYPE:
+              case REACT_PROVIDER_TYPE:
+                return $$typeofType;
+
+              default:
+                return $$typeof;
+            }
+
+        }
+
+      case REACT_PORTAL_TYPE:
+        return $$typeof;
+    }
+  }
+
+  return undefined;
+} // AsyncMode is deprecated along with isAsyncMode
+
+var AsyncMode = REACT_ASYNC_MODE_TYPE;
+var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
+var ContextConsumer = REACT_CONTEXT_TYPE;
+var ContextProvider = REACT_PROVIDER_TYPE;
+var Element = REACT_ELEMENT_TYPE;
+var ForwardRef = REACT_FORWARD_REF_TYPE;
+var Fragment = REACT_FRAGMENT_TYPE;
+var Lazy = REACT_LAZY_TYPE;
+var Memo = REACT_MEMO_TYPE;
+var Portal = REACT_PORTAL_TYPE;
+var Profiler = REACT_PROFILER_TYPE;
+var StrictMode = REACT_STRICT_MODE_TYPE;
+var Suspense = REACT_SUSPENSE_TYPE;
+var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
+
+function isAsyncMode(object) {
+  {
+    if (!hasWarnedAboutDeprecatedIsAsyncMode) {
+      hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
+
+      console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
+    }
+  }
+
+  return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
+}
+function isConcurrentMode(object) {
+  return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
+}
+function isContextConsumer(object) {
+  return typeOf(object) === REACT_CONTEXT_TYPE;
+}
+function isContextProvider(object) {
+  return typeOf(object) === REACT_PROVIDER_TYPE;
+}
+function isElement(object) {
+  return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
+}
+function isForwardRef(object) {
+  return typeOf(object) === REACT_FORWARD_REF_TYPE;
+}
+function isFragment(object) {
+  return typeOf(object) === REACT_FRAGMENT_TYPE;
+}
+function isLazy(object) {
+  return typeOf(object) === REACT_LAZY_TYPE;
+}
+function isMemo(object) {
+  return typeOf(object) === REACT_MEMO_TYPE;
+}
+function isPortal(object) {
+  return typeOf(object) === REACT_PORTAL_TYPE;
+}
+function isProfiler(object) {
+  return typeOf(object) === REACT_PROFILER_TYPE;
+}
+function isStrictMode(object) {
+  return typeOf(object) === REACT_STRICT_MODE_TYPE;
+}
+function isSuspense(object) {
+  return typeOf(object) === REACT_SUSPENSE_TYPE;
+}
+
+reactIs_development.AsyncMode = AsyncMode;
+reactIs_development.ConcurrentMode = ConcurrentMode;
+reactIs_development.ContextConsumer = ContextConsumer;
+reactIs_development.ContextProvider = ContextProvider;
+reactIs_development.Element = Element;
+reactIs_development.ForwardRef = ForwardRef;
+reactIs_development.Fragment = Fragment;
+reactIs_development.Lazy = Lazy;
+reactIs_development.Memo = Memo;
+reactIs_development.Portal = Portal;
+reactIs_development.Profiler = Profiler;
+reactIs_development.StrictMode = StrictMode;
+reactIs_development.Suspense = Suspense;
+reactIs_development.isAsyncMode = isAsyncMode;
+reactIs_development.isConcurrentMode = isConcurrentMode;
+reactIs_development.isContextConsumer = isContextConsumer;
+reactIs_development.isContextProvider = isContextProvider;
+reactIs_development.isElement = isElement;
+reactIs_development.isForwardRef = isForwardRef;
+reactIs_development.isFragment = isFragment;
+reactIs_development.isLazy = isLazy;
+reactIs_development.isMemo = isMemo;
+reactIs_development.isPortal = isPortal;
+reactIs_development.isProfiler = isProfiler;
+reactIs_development.isStrictMode = isStrictMode;
+reactIs_development.isSuspense = isSuspense;
+reactIs_development.isValidElementType = isValidElementType;
+reactIs_development.typeOf = typeOf;
+  })();
+}
+
+if (process.env.NODE_ENV === 'production') {
+  reactIs.exports = reactIs_production_min;
+} else {
+  reactIs.exports = reactIs_development;
+}
+
+/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/
+/* eslint-disable no-unused-vars */
+var getOwnPropertySymbols = Object.getOwnPropertySymbols;
+var hasOwnProperty = Object.prototype.hasOwnProperty;
+var propIsEnumerable = Object.prototype.propertyIsEnumerable;
+
+function toObject(val) {
+	if (val === null || val === undefined) {
+		throw new TypeError('Object.assign cannot be called with null or undefined');
+	}
+
+	return Object(val);
+}
+
+function shouldUseNative() {
+	try {
+		if (!Object.assign) {
+			return false;
+		}
+
+		// Detect buggy property enumeration order in older V8 versions.
+
+		// https://bugs.chromium.org/p/v8/issues/detail?id=4118
+		var test1 = new String('abc');  // eslint-disable-line no-new-wrappers
+		test1[5] = 'de';
+		if (Object.getOwnPropertyNames(test1)[0] === '5') {
+			return false;
+		}
+
+		// https://bugs.chromium.org/p/v8/issues/detail?id=3056
+		var test2 = {};
+		for (var i = 0; i < 10; i++) {
+			test2['_' + String.fromCharCode(i)] = i;
+		}
+		var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
+			return test2[n];
+		});
+		if (order2.join('') !== '0123456789') {
+			return false;
+		}
+
+		// https://bugs.chromium.org/p/v8/issues/detail?id=3056
+		var test3 = {};
+		'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
+			test3[letter] = letter;
+		});
+		if (Object.keys(Object.assign({}, test3)).join('') !==
+				'abcdefghijklmnopqrst') {
+			return false;
+		}
+
+		return true;
+	} catch (err) {
+		// We don't expect any of the above to throw, but better to be safe.
+		return false;
+	}
+}
+
+var objectAssign = shouldUseNative() ? Object.assign : function (target, source) {
+	var from;
+	var to = toObject(target);
+	var symbols;
+
+	for (var s = 1; s < arguments.length; s++) {
+		from = Object(arguments[s]);
+
+		for (var key in from) {
+			if (hasOwnProperty.call(from, key)) {
+				to[key] = from[key];
+			}
+		}
+
+		if (getOwnPropertySymbols) {
+			symbols = getOwnPropertySymbols(from);
+			for (var i = 0; i < symbols.length; i++) {
+				if (propIsEnumerable.call(from, symbols[i])) {
+					to[symbols[i]] = from[symbols[i]];
+				}
+			}
+		}
+	}
+
+	return to;
+};
+
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+var ReactPropTypesSecret$3 = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
+
+var ReactPropTypesSecret_1 = ReactPropTypesSecret$3;
+
+var has$2 = Function.call.bind(Object.prototype.hasOwnProperty);
+
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+var printWarning$1 = function() {};
+
+if (process.env.NODE_ENV !== 'production') {
+  var ReactPropTypesSecret$2 = ReactPropTypesSecret_1;
+  var loggedTypeFailures = {};
+  var has$1 = has$2;
+
+  printWarning$1 = function(text) {
+    var message = 'Warning: ' + text;
+    if (typeof console !== 'undefined') {
+      console.error(message);
+    }
+    try {
+      // --- Welcome to debugging React ---
+      // This error was thrown as a convenience so that you can use this stack
+      // to find the callsite that caused this warning to fire.
+      throw new Error(message);
+    } catch (x) { /**/ }
+  };
+}
+
+/**
+ * Assert that the values match with the type specs.
+ * Error messages are memorized and will only be shown once.
+ *
+ * @param {object} typeSpecs Map of name to a ReactPropType
+ * @param {object} values Runtime values that need to be type-checked
+ * @param {string} location e.g. "prop", "context", "child context"
+ * @param {string} componentName Name of the component for error messages.
+ * @param {?Function} getStack Returns the component stack.
+ * @private
+ */
+function checkPropTypes$1(typeSpecs, values, location, componentName, getStack) {
+  if (process.env.NODE_ENV !== 'production') {
+    for (var typeSpecName in typeSpecs) {
+      if (has$1(typeSpecs, typeSpecName)) {
+        var error;
+        // Prop type validation may throw. In case they do, we don't want to
+        // fail the render phase where it didn't fail before. So we log it.
+        // After these have been cleaned up, we'll let them throw.
+        try {
+          // This is intentionally an invariant that gets caught. It's the same
+          // behavior as without this statement except with a better message.
+          if (typeof typeSpecs[typeSpecName] !== 'function') {
+            var err = Error(
+              (componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' +
+              'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' +
+              'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.'
+            );
+            err.name = 'Invariant Violation';
+            throw err;
+          }
+          error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret$2);
+        } catch (ex) {
+          error = ex;
+        }
+        if (error && !(error instanceof Error)) {
+          printWarning$1(
+            (componentName || 'React class') + ': type specification of ' +
+            location + ' `' + typeSpecName + '` is invalid; the type checker ' +
+            'function must return `null` or an `Error` but returned a ' + typeof error + '. ' +
+            'You may have forgotten to pass an argument to the type checker ' +
+            'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' +
+            'shape all require an argument).'
+          );
+        }
+        if (error instanceof Error && !(error.message in loggedTypeFailures)) {
+          // Only monitor this failure once because there tends to be a lot of the
+          // same error.
+          loggedTypeFailures[error.message] = true;
+
+          var stack = getStack ? getStack() : '';
+
+          printWarning$1(
+            'Failed ' + location + ' type: ' + error.message + (stack != null ? stack : '')
+          );
+        }
+      }
+    }
+  }
+}
+
+/**
+ * Resets warning cache when testing.
+ *
+ * @private
+ */
+checkPropTypes$1.resetWarningCache = function() {
+  if (process.env.NODE_ENV !== 'production') {
+    loggedTypeFailures = {};
+  }
+};
+
+var checkPropTypes_1 = checkPropTypes$1;
+
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+var ReactIs$1 = reactIs.exports;
+var assign = objectAssign;
+
+var ReactPropTypesSecret$1 = ReactPropTypesSecret_1;
+var has = has$2;
+var checkPropTypes = checkPropTypes_1;
+
+var printWarning = function() {};
+
+if (process.env.NODE_ENV !== 'production') {
+  printWarning = function(text) {
+    var message = 'Warning: ' + text;
+    if (typeof console !== 'undefined') {
+      console.error(message);
+    }
+    try {
+      // --- Welcome to debugging React ---
+      // This error was thrown as a convenience so that you can use this stack
+      // to find the callsite that caused this warning to fire.
+      throw new Error(message);
+    } catch (x) {}
+  };
+}
+
+function emptyFunctionThatReturnsNull() {
+  return null;
+}
+
+var factoryWithTypeCheckers = function(isValidElement, throwOnDirectAccess) {
+  /* global Symbol */
+  var ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
+  var FAUX_ITERATOR_SYMBOL = '@@iterator'; // Before Symbol spec.
+
+  /**
+   * Returns the iterator method function contained on the iterable object.
+   *
+   * Be sure to invoke the function with the iterable as context:
+   *
+   *     var iteratorFn = getIteratorFn(myIterable);
+   *     if (iteratorFn) {
+   *       var iterator = iteratorFn.call(myIterable);
+   *       ...
+   *     }
+   *
+   * @param {?object} maybeIterable
+   * @return {?function}
+   */
+  function getIteratorFn(maybeIterable) {
+    var iteratorFn = maybeIterable && (ITERATOR_SYMBOL && maybeIterable[ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]);
+    if (typeof iteratorFn === 'function') {
+      return iteratorFn;
+    }
+  }
+
+  /**
+   * Collection of methods that allow declaration and validation of props that are
+   * supplied to React components. Example usage:
+   *
+   *   var Props = require('ReactPropTypes');
+   *   var MyArticle = React.createClass({
+   *     propTypes: {
+   *       // An optional string prop named "description".
+   *       description: Props.string,
+   *
+   *       // A required enum prop named "category".
+   *       category: Props.oneOf(['News','Photos']).isRequired,
+   *
+   *       // A prop named "dialog" that requires an instance of Dialog.
+   *       dialog: Props.instanceOf(Dialog).isRequired
+   *     },
+   *     render: function() { ... }
+   *   });
+   *
+   * A more formal specification of how these methods are used:
+   *
+   *   type := array|bool|func|object|number|string|oneOf([...])|instanceOf(...)
+   *   decl := ReactPropTypes.{type}(.isRequired)?
+   *
+   * Each and every declaration produces a function with the same signature. This
+   * allows the creation of custom validation functions. For example:
+   *
+   *  var MyLink = React.createClass({
+   *    propTypes: {
+   *      // An optional string or URI prop named "href".
+   *      href: function(props, propName, componentName) {
+   *        var propValue = props[propName];
+   *        if (propValue != null && typeof propValue !== 'string' &&
+   *            !(propValue instanceof URI)) {
+   *          return new Error(
+   *            'Expected a string or an URI for ' + propName + ' in ' +
+   *            componentName
+   *          );
+   *        }
+   *      }
+   *    },
+   *    render: function() {...}
+   *  });
+   *
+   * @internal
+   */
+
+  var ANONYMOUS = '<<anonymous>>';
+
+  // Important!
+  // Keep this list in sync with production version in `./factoryWithThrowingShims.js`.
+  var ReactPropTypes = {
+    array: createPrimitiveTypeChecker('array'),
+    bigint: createPrimitiveTypeChecker('bigint'),
+    bool: createPrimitiveTypeChecker('boolean'),
+    func: createPrimitiveTypeChecker('function'),
+    number: createPrimitiveTypeChecker('number'),
+    object: createPrimitiveTypeChecker('object'),
+    string: createPrimitiveTypeChecker('string'),
+    symbol: createPrimitiveTypeChecker('symbol'),
+
+    any: createAnyTypeChecker(),
+    arrayOf: createArrayOfTypeChecker,
+    element: createElementTypeChecker(),
+    elementType: createElementTypeTypeChecker(),
+    instanceOf: createInstanceTypeChecker,
+    node: createNodeChecker(),
+    objectOf: createObjectOfTypeChecker,
+    oneOf: createEnumTypeChecker,
+    oneOfType: createUnionTypeChecker,
+    shape: createShapeTypeChecker,
+    exact: createStrictShapeTypeChecker,
+  };
+
+  /**
+   * inlined Object.is polyfill to avoid requiring consumers ship their own
+   * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
+   */
+  /*eslint-disable no-self-compare*/
+  function is(x, y) {
+    // SameValue algorithm
+    if (x === y) {
+      // Steps 1-5, 7-10
+      // Steps 6.b-6.e: +0 != -0
+      return x !== 0 || 1 / x === 1 / y;
+    } else {
+      // Step 6.a: NaN == NaN
+      return x !== x && y !== y;
+    }
+  }
+  /*eslint-enable no-self-compare*/
+
+  /**
+   * We use an Error-like object for backward compatibility as people may call
+   * PropTypes directly and inspect their output. However, we don't use real
+   * Errors anymore. We don't inspect their stack anyway, and creating them
+   * is prohibitively expensive if they are created too often, such as what
+   * happens in oneOfType() for any type before the one that matched.
+   */
+  function PropTypeError(message, data) {
+    this.message = message;
+    this.data = data && typeof data === 'object' ? data: {};
+    this.stack = '';
+  }
+  // Make `instanceof Error` still work for returned errors.
+  PropTypeError.prototype = Error.prototype;
+
+  function createChainableTypeChecker(validate) {
+    if (process.env.NODE_ENV !== 'production') {
+      var manualPropTypeCallCache = {};
+      var manualPropTypeWarningCount = 0;
+    }
+    function checkType(isRequired, props, propName, componentName, location, propFullName, secret) {
+      componentName = componentName || ANONYMOUS;
+      propFullName = propFullName || propName;
+
+      if (secret !== ReactPropTypesSecret$1) {
+        if (throwOnDirectAccess) {
+          // New behavior only for users of `prop-types` package
+          var err = new Error(
+            'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
+            'Use `PropTypes.checkPropTypes()` to call them. ' +
+            'Read more at http://fb.me/use-check-prop-types'
+          );
+          err.name = 'Invariant Violation';
+          throw err;
+        } else if (process.env.NODE_ENV !== 'production' && typeof console !== 'undefined') {
+          // Old behavior for people using React.PropTypes
+          var cacheKey = componentName + ':' + propName;
+          if (
+            !manualPropTypeCallCache[cacheKey] &&
+            // Avoid spamming the console because they are often not actionable except for lib authors
+            manualPropTypeWarningCount < 3
+          ) {
+            printWarning(
+              'You are manually calling a React.PropTypes validation ' +
+              'function for the `' + propFullName + '` prop on `' + componentName + '`. This is deprecated ' +
+              'and will throw in the standalone `prop-types` package. ' +
+              'You may be seeing this warning due to a third-party PropTypes ' +
+              'library. See https://fb.me/react-warning-dont-call-proptypes ' + 'for details.'
+            );
+            manualPropTypeCallCache[cacheKey] = true;
+            manualPropTypeWarningCount++;
+          }
+        }
+      }
+      if (props[propName] == null) {
+        if (isRequired) {
+          if (props[propName] === null) {
+            return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required ' + ('in `' + componentName + '`, but its value is `null`.'));
+          }
+          return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required in ' + ('`' + componentName + '`, but its value is `undefined`.'));
+        }
+        return null;
+      } else {
+        return validate(props, propName, componentName, location, propFullName);
+      }
+    }
+
+    var chainedCheckType = checkType.bind(null, false);
+    chainedCheckType.isRequired = checkType.bind(null, true);
+
+    return chainedCheckType;
+  }
+
+  function createPrimitiveTypeChecker(expectedType) {
+    function validate(props, propName, componentName, location, propFullName, secret) {
+      var propValue = props[propName];
+      var propType = getPropType(propValue);
+      if (propType !== expectedType) {
+        // `propValue` being instance of, say, date/regexp, pass the 'object'
+        // check, but we can offer a more precise error message here rather than
+        // 'of type `object`'.
+        var preciseType = getPreciseType(propValue);
+
+        return new PropTypeError(
+          'Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + preciseType + '` supplied to `' + componentName + '`, expected ') + ('`' + expectedType + '`.'),
+          {expectedType: expectedType}
+        );
+      }
+      return null;
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function createAnyTypeChecker() {
+    return createChainableTypeChecker(emptyFunctionThatReturnsNull);
+  }
+
+  function createArrayOfTypeChecker(typeChecker) {
+    function validate(props, propName, componentName, location, propFullName) {
+      if (typeof typeChecker !== 'function') {
+        return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside arrayOf.');
+      }
+      var propValue = props[propName];
+      if (!Array.isArray(propValue)) {
+        var propType = getPropType(propValue);
+        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an array.'));
+      }
+      for (var i = 0; i < propValue.length; i++) {
+        var error = typeChecker(propValue, i, componentName, location, propFullName + '[' + i + ']', ReactPropTypesSecret$1);
+        if (error instanceof Error) {
+          return error;
+        }
+      }
+      return null;
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function createElementTypeChecker() {
+    function validate(props, propName, componentName, location, propFullName) {
+      var propValue = props[propName];
+      if (!isValidElement(propValue)) {
+        var propType = getPropType(propValue);
+        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement.'));
+      }
+      return null;
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function createElementTypeTypeChecker() {
+    function validate(props, propName, componentName, location, propFullName) {
+      var propValue = props[propName];
+      if (!ReactIs$1.isValidElementType(propValue)) {
+        var propType = getPropType(propValue);
+        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement type.'));
+      }
+      return null;
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function createInstanceTypeChecker(expectedClass) {
+    function validate(props, propName, componentName, location, propFullName) {
+      if (!(props[propName] instanceof expectedClass)) {
+        var expectedClassName = expectedClass.name || ANONYMOUS;
+        var actualClassName = getClassName(props[propName]);
+        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + actualClassName + '` supplied to `' + componentName + '`, expected ') + ('instance of `' + expectedClassName + '`.'));
+      }
+      return null;
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function createEnumTypeChecker(expectedValues) {
+    if (!Array.isArray(expectedValues)) {
+      if (process.env.NODE_ENV !== 'production') {
+        if (arguments.length > 1) {
+          printWarning(
+            'Invalid arguments supplied to oneOf, expected an array, got ' + arguments.length + ' arguments. ' +
+            'A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).'
+          );
+        } else {
+          printWarning('Invalid argument supplied to oneOf, expected an array.');
+        }
+      }
+      return emptyFunctionThatReturnsNull;
+    }
+
+    function validate(props, propName, componentName, location, propFullName) {
+      var propValue = props[propName];
+      for (var i = 0; i < expectedValues.length; i++) {
+        if (is(propValue, expectedValues[i])) {
+          return null;
+        }
+      }
+
+      var valuesString = JSON.stringify(expectedValues, function replacer(key, value) {
+        var type = getPreciseType(value);
+        if (type === 'symbol') {
+          return String(value);
+        }
+        return value;
+      });
+      return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of value `' + String(propValue) + '` ' + ('supplied to `' + componentName + '`, expected one of ' + valuesString + '.'));
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function createObjectOfTypeChecker(typeChecker) {
+    function validate(props, propName, componentName, location, propFullName) {
+      if (typeof typeChecker !== 'function') {
+        return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside objectOf.');
+      }
+      var propValue = props[propName];
+      var propType = getPropType(propValue);
+      if (propType !== 'object') {
+        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an object.'));
+      }
+      for (var key in propValue) {
+        if (has(propValue, key)) {
+          var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret$1);
+          if (error instanceof Error) {
+            return error;
+          }
+        }
+      }
+      return null;
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function createUnionTypeChecker(arrayOfTypeCheckers) {
+    if (!Array.isArray(arrayOfTypeCheckers)) {
+      process.env.NODE_ENV !== 'production' ? printWarning('Invalid argument supplied to oneOfType, expected an instance of array.') : void 0;
+      return emptyFunctionThatReturnsNull;
+    }
+
+    for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
+      var checker = arrayOfTypeCheckers[i];
+      if (typeof checker !== 'function') {
+        printWarning(
+          'Invalid argument supplied to oneOfType. Expected an array of check functions, but ' +
+          'received ' + getPostfixForTypeWarning(checker) + ' at index ' + i + '.'
+        );
+        return emptyFunctionThatReturnsNull;
+      }
+    }
+
+    function validate(props, propName, componentName, location, propFullName) {
+      var expectedTypes = [];
+      for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
+        var checker = arrayOfTypeCheckers[i];
+        var checkerResult = checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret$1);
+        if (checkerResult == null) {
+          return null;
+        }
+        if (checkerResult.data && has(checkerResult.data, 'expectedType')) {
+          expectedTypes.push(checkerResult.data.expectedType);
+        }
+      }
+      var expectedTypesMessage = (expectedTypes.length > 0) ? ', expected one of type [' + expectedTypes.join(', ') + ']': '';
+      return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`' + expectedTypesMessage + '.'));
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function createNodeChecker() {
+    function validate(props, propName, componentName, location, propFullName) {
+      if (!isNode(props[propName])) {
+        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`, expected a ReactNode.'));
+      }
+      return null;
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function invalidValidatorError(componentName, location, propFullName, key, type) {
+    return new PropTypeError(
+      (componentName || 'React class') + ': ' + location + ' type `' + propFullName + '.' + key + '` is invalid; ' +
+      'it must be a function, usually from the `prop-types` package, but received `' + type + '`.'
+    );
+  }
+
+  function createShapeTypeChecker(shapeTypes) {
+    function validate(props, propName, componentName, location, propFullName) {
+      var propValue = props[propName];
+      var propType = getPropType(propValue);
+      if (propType !== 'object') {
+        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
+      }
+      for (var key in shapeTypes) {
+        var checker = shapeTypes[key];
+        if (typeof checker !== 'function') {
+          return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));
+        }
+        var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret$1);
+        if (error) {
+          return error;
+        }
+      }
+      return null;
+    }
+    return createChainableTypeChecker(validate);
+  }
+
+  function createStrictShapeTypeChecker(shapeTypes) {
+    function validate(props, propName, componentName, location, propFullName) {
+      var propValue = props[propName];
+      var propType = getPropType(propValue);
+      if (propType !== 'object') {
+        return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
+      }
+      // We need to check all keys in case some are required but missing from props.
+      var allKeys = assign({}, props[propName], shapeTypes);
+      for (var key in allKeys) {
+        var checker = shapeTypes[key];
+        if (has(shapeTypes, key) && typeof checker !== 'function') {
+          return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));
+        }
+        if (!checker) {
+          return new PropTypeError(
+            'Invalid ' + location + ' `' + propFullName + '` key `' + key + '` supplied to `' + componentName + '`.' +
+            '\nBad object: ' + JSON.stringify(props[propName], null, '  ') +
+            '\nValid keys: ' + JSON.stringify(Object.keys(shapeTypes), null, '  ')
+          );
+        }
+        var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret$1);
+        if (error) {
+          return error;
+        }
+      }
+      return null;
+    }
+
+    return createChainableTypeChecker(validate);
+  }
+
+  function isNode(propValue) {
+    switch (typeof propValue) {
+      case 'number':
+      case 'string':
+      case 'undefined':
+        return true;
+      case 'boolean':
+        return !propValue;
+      case 'object':
+        if (Array.isArray(propValue)) {
+          return propValue.every(isNode);
+        }
+        if (propValue === null || isValidElement(propValue)) {
+          return true;
+        }
+
+        var iteratorFn = getIteratorFn(propValue);
+        if (iteratorFn) {
+          var iterator = iteratorFn.call(propValue);
+          var step;
+          if (iteratorFn !== propValue.entries) {
+            while (!(step = iterator.next()).done) {
+              if (!isNode(step.value)) {
+                return false;
+              }
+            }
+          } else {
+            // Iterator will provide entry [k,v] tuples rather than values.
+            while (!(step = iterator.next()).done) {
+              var entry = step.value;
+              if (entry) {
+                if (!isNode(entry[1])) {
+                  return false;
+                }
+              }
+            }
+          }
+        } else {
+          return false;
+        }
+
+        return true;
+      default:
+        return false;
+    }
+  }
+
+  function isSymbol(propType, propValue) {
+    // Native Symbol.
+    if (propType === 'symbol') {
+      return true;
+    }
+
+    // falsy value can't be a Symbol
+    if (!propValue) {
+      return false;
+    }
+
+    // 19.4.3.5 Symbol.prototype[@@toStringTag] === 'Symbol'
+    if (propValue['@@toStringTag'] === 'Symbol') {
+      return true;
+    }
+
+    // Fallback for non-spec compliant Symbols which are polyfilled.
+    if (typeof Symbol === 'function' && propValue instanceof Symbol) {
+      return true;
+    }
+
+    return false;
+  }
+
+  // Equivalent of `typeof` but with special handling for array and regexp.
+  function getPropType(propValue) {
+    var propType = typeof propValue;
+    if (Array.isArray(propValue)) {
+      return 'array';
+    }
+    if (propValue instanceof RegExp) {
+      // Old webkits (at least until Android 4.0) return 'function' rather than
+      // 'object' for typeof a RegExp. We'll normalize this here so that /bla/
+      // passes PropTypes.object.
+      return 'object';
+    }
+    if (isSymbol(propType, propValue)) {
+      return 'symbol';
+    }
+    return propType;
+  }
+
+  // This handles more types than `getPropType`. Only used for error messages.
+  // See `createPrimitiveTypeChecker`.
+  function getPreciseType(propValue) {
+    if (typeof propValue === 'undefined' || propValue === null) {
+      return '' + propValue;
+    }
+    var propType = getPropType(propValue);
+    if (propType === 'object') {
+      if (propValue instanceof Date) {
+        return 'date';
+      } else if (propValue instanceof RegExp) {
+        return 'regexp';
+      }
+    }
+    return propType;
+  }
+
+  // Returns a string that is postfixed to a warning about an invalid type.
+  // For example, "undefined" or "of type array"
+  function getPostfixForTypeWarning(value) {
+    var type = getPreciseType(value);
+    switch (type) {
+      case 'array':
+      case 'object':
+        return 'an ' + type;
+      case 'boolean':
+      case 'date':
+      case 'regexp':
+        return 'a ' + type;
+      default:
+        return type;
+    }
+  }
+
+  // Returns class name of the object, if any.
+  function getClassName(propValue) {
+    if (!propValue.constructor || !propValue.constructor.name) {
+      return ANONYMOUS;
+    }
+    return propValue.constructor.name;
+  }
+
+  ReactPropTypes.checkPropTypes = checkPropTypes;
+  ReactPropTypes.resetWarningCache = checkPropTypes.resetWarningCache;
+  ReactPropTypes.PropTypes = ReactPropTypes;
+
+  return ReactPropTypes;
+};
+
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+var ReactPropTypesSecret = ReactPropTypesSecret_1;
+
+function emptyFunction() {}
+function emptyFunctionWithReset() {}
+emptyFunctionWithReset.resetWarningCache = emptyFunction;
+
+var factoryWithThrowingShims = function() {
+  function shim(props, propName, componentName, location, propFullName, secret) {
+    if (secret === ReactPropTypesSecret) {
+      // It is still safe when called from React.
+      return;
+    }
+    var err = new Error(
+      'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
+      'Use PropTypes.checkPropTypes() to call them. ' +
+      'Read more at http://fb.me/use-check-prop-types'
+    );
+    err.name = 'Invariant Violation';
+    throw err;
+  }  shim.isRequired = shim;
+  function getShim() {
+    return shim;
+  }  // Important!
+  // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`.
+  var ReactPropTypes = {
+    array: shim,
+    bigint: shim,
+    bool: shim,
+    func: shim,
+    number: shim,
+    object: shim,
+    string: shim,
+    symbol: shim,
+
+    any: shim,
+    arrayOf: getShim,
+    element: shim,
+    elementType: shim,
+    instanceOf: getShim,
+    node: shim,
+    objectOf: getShim,
+    oneOf: getShim,
+    oneOfType: getShim,
+    shape: getShim,
+    exact: getShim,
+
+    checkPropTypes: emptyFunctionWithReset,
+    resetWarningCache: emptyFunction
+  };
+
+  ReactPropTypes.PropTypes = ReactPropTypes;
+
+  return ReactPropTypes;
+};
+
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+if (process.env.NODE_ENV !== 'production') {
+  var ReactIs = reactIs.exports;
+
+  // By explicitly using `prop-types` you are opting into new development behavior.
+  // http://fb.me/prop-types-in-prod
+  var throwOnDirectAccess = true;
+  propTypes.exports = factoryWithTypeCheckers(ReactIs.isElement, throwOnDirectAccess);
+} else {
+  // By explicitly using `prop-types` you are opting into new production behavior.
+  // http://fb.me/prop-types-in-prod
+  propTypes.exports = factoryWithThrowingShims();
+}
+
+var PropTypes = propTypes.exports;
+
+function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
+
+var Image$1 = function Image(_ref) {
+  var src = _ref.src,
+      sources = _ref.sources,
+      width = _ref.width,
+      height = _ref.height,
+      hasSpacer = _ref.hasSpacer,
+      imgAttributes = _ref.imgAttributes,
+      isZoomed = _ref.isZoomed,
+      fadeDuration = _ref.fadeDuration;
+  var createSpacer = width && height && hasSpacer;
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    style: {
+      paddingTop: createSpacer ? height / width * 100 + "%" : null
+    }
+  }, sources && sources.length > 0 ? /*#__PURE__*/React__default["default"].createElement("picture", null, sources.map(function (source, i) {
+    return /*#__PURE__*/React__default["default"].createElement(React$2.Fragment, {
+      key: i
+    }, source.srcSet && /*#__PURE__*/React__default["default"].createElement("source", source));
+  }), /*#__PURE__*/React__default["default"].createElement("img", _extends$1({}, imgAttributes, {
+    className: "iiz__img " + (imgAttributes.className || '') + " " + (isZoomed ? 'iiz__img--hidden' : '') + " " + (createSpacer ? 'iiz__img--abs' : ''),
+    style: {
+      transition: "linear 0ms opacity " + (isZoomed ? fadeDuration : 0) + "ms, linear " + fadeDuration + "ms visibility " + (isZoomed ? fadeDuration : 0) + "ms"
+    },
+    src: src,
+    width: width,
+    height: height
+  }))) : /*#__PURE__*/React__default["default"].createElement("img", _extends$1({}, imgAttributes, {
+    className: "iiz__img " + (imgAttributes.className || '') + " " + (isZoomed ? 'iiz__img--hidden' : '') + " " + (createSpacer ? 'iiz__img--abs' : ''),
+    style: {
+      transition: "linear 0ms opacity " + (isZoomed ? fadeDuration : 0) + "ms, linear " + fadeDuration + "ms visibility " + (isZoomed ? fadeDuration : 0) + "ms"
+    },
+    src: src,
+    width: width,
+    height: height
+  })));
+};
+
+Image$1.propTypes = process.env.NODE_ENV !== "production" ? {
+  src: PropTypes.string.isRequired,
+  sources: PropTypes.array,
+  width: PropTypes.number,
+  height: PropTypes.number,
+  hasSpacer: PropTypes.bool,
+  imgAttributes: PropTypes.object,
+  fadeDuration: PropTypes.number,
+  isZoomed: PropTypes.bool
+} : {};
+
+var ZoomImage = function ZoomImage(_ref) {
+  var src = _ref.src,
+      fadeDuration = _ref.fadeDuration,
+      top = _ref.top,
+      left = _ref.left,
+      isZoomed = _ref.isZoomed,
+      onLoad = _ref.onLoad,
+      onDragStart = _ref.onDragStart,
+      onDragEnd = _ref.onDragEnd,
+      onClose = _ref.onClose,
+      onFadeOut = _ref.onFadeOut;
+  return /*#__PURE__*/React__default["default"].createElement(React$2.Fragment, null, /*#__PURE__*/React__default["default"].createElement("img", {
+    className: "iiz__zoom-img " + (isZoomed ? 'iiz__zoom-img--visible' : ''),
+    style: {
+      top: top,
+      left: left,
+      transition: "linear " + fadeDuration + "ms opacity, linear " + fadeDuration + "ms visibility"
+    },
+    src: src,
+    onLoad: onLoad,
+    onTouchStart: onDragStart,
+    onTouchEnd: onDragEnd,
+    onMouseDown: onDragStart,
+    onMouseUp: onDragEnd,
+    onTransitionEnd: onFadeOut,
+    draggable: "false",
+    alt: ""
+  }), onClose && /*#__PURE__*/React__default["default"].createElement("button", {
+    className: "iiz__btn iiz__close " + (isZoomed ? 'iiz__close--visible' : ''),
+    style: {
+      transition: "linear " + fadeDuration + "ms opacity, linear " + fadeDuration + "ms visibility"
+    },
+    onClick: onClose,
+    "aria-label": "Zoom Out"
+  }));
+};
+
+ZoomImage.propTypes = process.env.NODE_ENV !== "production" ? {
+  src: PropTypes.string,
+  fadeDuration: PropTypes.number,
+  top: PropTypes.number,
+  left: PropTypes.number,
+  isZoomed: PropTypes.bool,
+  onLoad: PropTypes.func,
+  onDragStart: PropTypes.func,
+  onDragEnd: PropTypes.func,
+  onClose: PropTypes.func,
+  onFadeOut: PropTypes.func
+} : {};
+
+var FullscreenPortal = function FullscreenPortal(_ref) {
+  var children = _ref.children;
+
+  var _useState = React$2.useState(function () {
+    var el = document.createElement('div');
+    el.classList.add('iiz__zoom-portal');
+    return el;
+  }),
+      portal = _useState[0];
+
+  React$2.useEffect(function () {
+    document.body.appendChild(portal);
+    return function () {
+      return document.body.removeChild(portal);
+    };
+  }, [portal]);
+  return reactDom.createPortal(children, portal);
+};
+
+FullscreenPortal.propTypes = {
+  children: PropTypes.element
+};
+
+var _this = undefined;
+
+var InnerImageZoom = function InnerImageZoom(_ref) {
+  var _ref$moveType = _ref.moveType,
+      moveType = _ref$moveType === void 0 ? 'pan' : _ref$moveType,
+      _ref$zoomType = _ref.zoomType,
+      zoomType = _ref$zoomType === void 0 ? 'click' : _ref$zoomType,
+      src = _ref.src,
+      sources = _ref.sources,
+      width = _ref.width,
+      height = _ref.height,
+      hasSpacer = _ref.hasSpacer,
+      _ref$imgAttributes = _ref.imgAttributes,
+      imgAttributes = _ref$imgAttributes === void 0 ? {} : _ref$imgAttributes,
+      zoomSrc = _ref.zoomSrc,
+      _ref$zoomScale = _ref.zoomScale,
+      zoomScale = _ref$zoomScale === void 0 ? 1 : _ref$zoomScale,
+      zoomPreload = _ref.zoomPreload,
+      _ref$fadeDuration = _ref.fadeDuration,
+      fadeDuration = _ref$fadeDuration === void 0 ? 150 : _ref$fadeDuration,
+      fullscreenOnMobile = _ref.fullscreenOnMobile,
+      _ref$mobileBreakpoint = _ref.mobileBreakpoint,
+      mobileBreakpoint = _ref$mobileBreakpoint === void 0 ? 640 : _ref$mobileBreakpoint,
+      hideCloseButton = _ref.hideCloseButton,
+      hideHint = _ref.hideHint,
+      className = _ref.className,
+      afterZoomIn = _ref.afterZoomIn,
+      afterZoomOut = _ref.afterZoomOut;
+  var img = React$2.useRef(null);
+  var zoomImg = React$2.useRef(null);
+  var imgProps = React$2.useRef({});
+
+  var _useState = React$2.useState(zoomPreload),
+      isActive = _useState[0],
+      setIsActive = _useState[1];
+
+  var _useState2 = React$2.useState(false),
+      isTouch = _useState2[0],
+      setIsTouch = _useState2[1];
+
+  var _useState3 = React$2.useState(false),
+      isZoomed = _useState3[0],
+      setIsZoomed = _useState3[1];
+
+  var _useState4 = React$2.useState(false),
+      isFullscreen = _useState4[0],
+      setIsFullscreen = _useState4[1];
+
+  var _useState5 = React$2.useState(false),
+      isDragging = _useState5[0],
+      setIsDragging = _useState5[1];
+
+  var _useState6 = React$2.useState(false),
+      isValidDrag = _useState6[0],
+      setIsValidDrag = _useState6[1];
+
+  var _useState7 = React$2.useState(false),
+      isFading = _useState7[0],
+      setIsFading = _useState7[1];
+
+  var _useState8 = React$2.useState(moveType),
+      currentMoveType = _useState8[0],
+      setCurrentMoveType = _useState8[1];
+
+  var _useState9 = React$2.useState(0),
+      left = _useState9[0],
+      setLeft = _useState9[1];
+
+  var _useState10 = React$2.useState(0),
+      top = _useState10[0],
+      setTop = _useState10[1];
+
+  var handleMouseEnter = function handleMouseEnter(e) {
+    setIsActive(true);
+    zoomType === 'hover' && !isZoomed && handleClick(e);
+  };
+
+  var handleTouchStart = function handleTouchStart() {
+    setIsTouch(true);
+    setIsFullscreen(getFullscreenStatus(fullscreenOnMobile, mobileBreakpoint));
+    setCurrentMoveType('drag');
+  };
+
+  var handleClick = function handleClick(e) {
+    if (isZoomed) {
+      if (isTouch) {
+        hideCloseButton && handleClose();
+      } else {
+        !isValidDrag && zoomOut();
+      }
+
+      return;
+    }
+
+    isTouch && setIsActive(true);
+
+    if (zoomImg.current) {
+      handleLoad({
+        target: zoomImg.current
+      });
+      zoomIn(e.pageX, e.pageY);
+    } else {
+      imgProps.current.onLoadCallback = zoomIn.bind(_this, e.pageX, e.pageY);
+    }
+  };
+
+  var handleLoad = function handleLoad(e) {
+    var scaledDimensions = getScaledDimensions(e.target, zoomScale);
+    zoomImg.current = e.target;
+    zoomImg.current.setAttribute('width', scaledDimensions.width);
+    zoomImg.current.setAttribute('height', scaledDimensions.height);
+    imgProps.current.scaledDimensions = scaledDimensions;
+    imgProps.current.bounds = getBounds(img.current, false);
+    imgProps.current.ratios = getRatios(imgProps.current.bounds, scaledDimensions);
+
+    if (imgProps.current.onLoadCallback) {
+      imgProps.current.onLoadCallback();
+      imgProps.current.onLoadCallback = null;
+    }
+  };
+
+  var handleMouseMove = function handleMouseMove(e) {
+    var left = e.pageX - imgProps.current.offsets.x;
+    var top = e.pageY - imgProps.current.offsets.y;
+    left = Math.max(Math.min(left, imgProps.current.bounds.width), 0);
+    top = Math.max(Math.min(top, imgProps.current.bounds.height), 0);
+    setLeft(left * -imgProps.current.ratios.x);
+    setTop(top * -imgProps.current.ratios.y);
+  };
+
+  var handleDragStart = function handleDragStart(e) {
+    imgProps.current.offsets = getOffsets(e.pageX || e.changedTouches[0].pageX, e.pageY || e.changedTouches[0].pageY, zoomImg.current.offsetLeft, zoomImg.current.offsetTop);
+    setIsDragging(true);
+
+    if (!isTouch) {
+      imgProps.current.eventPosition = {
+        x: e.pageX,
+        y: e.pageY
+      };
+    }
+  };
+
+  var handleDragMove = React$2.useCallback(function (e) {
+    e.stopPropagation();
+    var left = (e.pageX || e.changedTouches[0].pageX) - imgProps.current.offsets.x;
+    var top = (e.pageY || e.changedTouches[0].pageY) - imgProps.current.offsets.y;
+    left = Math.max(Math.min(left, 0), (imgProps.current.scaledDimensions.width - imgProps.current.bounds.width) * -1);
+    top = Math.max(Math.min(top, 0), (imgProps.current.scaledDimensions.height - imgProps.current.bounds.height) * -1);
+    setLeft(left);
+    setTop(top);
+  }, []);
+
+  var handleDragEnd = function handleDragEnd(e) {
+    setIsDragging(false);
+
+    if (!isTouch) {
+      var moveX = Math.abs(e.pageX - imgProps.current.eventPosition.x);
+      var moveY = Math.abs(e.pageY - imgProps.current.eventPosition.y);
+      setIsValidDrag(moveX > 5 || moveY > 5);
+    }
+  };
+
+  var handleMouseLeave = function handleMouseLeave(e) {
+    currentMoveType === 'drag' && isZoomed ? handleDragEnd(e) : handleClose();
+  };
+
+  var handleClose = function handleClose() {
+    if (!isZoomed || isFullscreen || !fadeDuration) {
+      handleFadeOut({}, true);
+    } else {
+      setIsFading(true);
+    }
+
+    zoomOut();
+  };
+
+  var handleFadeOut = function handleFadeOut(e, noTransition) {
+    if (noTransition || e.propertyName === 'opacity' && img.current.contains(e.target)) {
+      if (zoomPreload && isTouch || !zoomPreload) {
+        zoomImg.current = null;
+        imgProps.current = getDefaults();
+        setIsActive(false);
+      }
+
+      setIsTouch(false);
+      setIsFullscreen(false);
+      setCurrentMoveType(moveType);
+      setIsFading(false);
+    }
+  };
+
+  var initialMove = function initialMove(pageX, pageY) {
+    imgProps.current.offsets = getOffsets(window.pageXOffset, window.pageYOffset, -imgProps.current.bounds.left, -imgProps.current.bounds.top);
+    handleMouseMove({
+      pageX: pageX,
+      pageY: pageY
+    });
+  };
+
+  var initialDrag = function initialDrag(pageX, pageY) {
+    var initialPageX = (pageX - (window.pageXOffset + imgProps.current.bounds.left)) * -imgProps.current.ratios.x;
+    var initialPageY = (pageY - (window.pageYOffset + imgProps.current.bounds.top)) * -imgProps.current.ratios.y;
+    initialPageX = initialPageX + (isFullscreen ? (window.innerWidth - imgProps.current.bounds.width) / 2 : 0);
+    initialPageY = initialPageY + (isFullscreen ? (window.innerHeight - imgProps.current.bounds.height) / 2 : 0);
+    imgProps.current.bounds = getBounds(img.current, isFullscreen);
+    imgProps.current.offsets = getOffsets(0, 0, 0, 0);
+    handleDragMove({
+      changedTouches: [{
+        pageX: initialPageX,
+        pageY: initialPageY
+      }],
+      preventDefault: function preventDefault() {},
+      stopPropagation: function stopPropagation() {}
+    });
+  };
+
+  var zoomIn = function zoomIn(pageX, pageY) {
+    setIsZoomed(true);
+    currentMoveType === 'drag' ? initialDrag(pageX, pageY) : initialMove(pageX, pageY);
+    afterZoomIn && afterZoomIn();
+  };
+
+  var zoomOut = function zoomOut() {
+    setIsZoomed(false);
+    afterZoomOut && afterZoomOut();
+  };
+
+  var getDefaults = function getDefaults() {
+    return {
+      onLoadCallback: null,
+      bounds: {},
+      offsets: {},
+      ratios: {},
+      eventPosition: {},
+      scaledDimensions: {}
+    };
+  };
+
+  var getBounds = function getBounds(img, isFullscreen) {
+    if (isFullscreen) {
+      return {
+        width: window.innerWidth,
+        height: window.innerHeight,
+        left: 0,
+        top: 0
+      };
+    }
+
+    return img.getBoundingClientRect();
+  };
+
+  var getOffsets = function getOffsets(pageX, pageY, left, top) {
+    return {
+      x: pageX - left,
+      y: pageY - top
+    };
+  };
+
+  var getRatios = function getRatios(bounds, dimensions) {
+    return {
+      x: (dimensions.width - bounds.width) / bounds.width,
+      y: (dimensions.height - bounds.height) / bounds.height
+    };
+  };
+
+  var getFullscreenStatus = function getFullscreenStatus(fullscreenOnMobile, mobileBreakpoint) {
+    return fullscreenOnMobile && window.matchMedia && window.matchMedia("(max-width: " + mobileBreakpoint + "px)").matches;
+  };
+
+  var getScaledDimensions = function getScaledDimensions(zoomImg, zoomScale) {
+    return {
+      width: zoomImg.naturalWidth * zoomScale,
+      height: zoomImg.naturalHeight * zoomScale
+    };
+  };
+
+  var zoomImageProps = {
+    src: zoomSrc || src,
+    fadeDuration: isFullscreen ? 0 : fadeDuration,
+    top: top,
+    left: left,
+    isZoomed: isZoomed,
+    onLoad: handleLoad,
+    onDragStart: currentMoveType === 'drag' ? handleDragStart : null,
+    onDragEnd: currentMoveType === 'drag' ? handleDragEnd : null,
+    onClose: !hideCloseButton && currentMoveType === 'drag' ? handleClose : null,
+    onFadeOut: isFading ? handleFadeOut : null
+  };
+  React$2.useEffect(function () {
+    imgProps.current = getDefaults();
+  }, []);
+  React$2.useEffect(function () {
+    getFullscreenStatus(fullscreenOnMobile, mobileBreakpoint) && setIsActive(false);
+  }, [fullscreenOnMobile, mobileBreakpoint]);
+  React$2.useEffect(function () {
+    if (!zoomImg.current) {
+      return;
+    }
+
+    var eventType = isTouch ? 'touchmove' : 'mousemove';
+
+    if (isDragging) {
+      zoomImg.current.addEventListener(eventType, handleDragMove, {
+        passive: true
+      });
+    } else {
+      zoomImg.current.removeEventListener(eventType, handleDragMove);
+    }
+  }, [isDragging, isTouch, handleDragMove]);
+  return /*#__PURE__*/React__default["default"].createElement("figure", {
+    className: "iiz " + (currentMoveType === 'drag' ? 'iiz--drag' : '') + " " + (className ? className : ''),
+    style: {
+      width: width
+    },
+    ref: img,
+    onTouchStart: isZoomed ? null : handleTouchStart,
+    onClick: handleClick,
+    onMouseEnter: isTouch ? null : handleMouseEnter,
+    onMouseMove: currentMoveType === 'drag' || !isZoomed ? null : handleMouseMove,
+    onMouseLeave: isTouch ? null : handleMouseLeave
+  }, /*#__PURE__*/React__default["default"].createElement(Image$1, {
+    src: src,
+    sources: sources,
+    width: width,
+    height: height,
+    hasSpacer: hasSpacer,
+    imgAttributes: imgAttributes,
+    fadeDuration: fadeDuration,
+    isZoomed: isZoomed
+  }), isActive && /*#__PURE__*/React__default["default"].createElement(React$2.Fragment, null, isFullscreen ? /*#__PURE__*/React__default["default"].createElement(FullscreenPortal, null, /*#__PURE__*/React__default["default"].createElement(ZoomImage, zoomImageProps)) : /*#__PURE__*/React__default["default"].createElement(ZoomImage, zoomImageProps)), !hideHint && !isZoomed && /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "iiz__btn iiz__hint"
+  }));
+};
+
+InnerImageZoom.propTypes = process.env.NODE_ENV !== "production" ? {
+  moveType: PropTypes.string,
+  zoomType: PropTypes.string,
+  src: PropTypes.string.isRequired,
+  sources: PropTypes.array,
+  width: PropTypes.number,
+  height: PropTypes.number,
+  hasSpacer: PropTypes.bool,
+  imgAttributes: PropTypes.object,
+  zoomSrc: PropTypes.string,
+  zoomScale: PropTypes.number,
+  zoomPreload: PropTypes.bool,
+  fadeDuration: PropTypes.number,
+  fullscreenOnMobile: PropTypes.bool,
+  mobileBreakpoint: PropTypes.number,
+  hideCloseButton: PropTypes.bool,
+  hideHint: PropTypes.bool,
+  className: PropTypes.string,
+  afterZoomIn: PropTypes.func,
+  afterZoomOut: PropTypes.func
+} : {};
+
+var Container$A = newStyled.div(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n  position: relative;\n  height: '45rem' &.styleforhorizontal {\n    height: '30rem';\n  }\n"], ["\n  position: relative;\n  height: '45rem' &.styleforhorizontal {\n    height: '30rem';\n  }\n"])));
+var TopTagContainer$2 = newStyled.div(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n  position: absolute;\n  left: 0;\n  top: 0;\n"], ["\n  position: absolute;\n  left: 0;\n  top: 0;\n"])));
+var BottomTagContainer$2 = newStyled.div(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n  position: absolute;\n  bottom: 3.75rem;\n  left: 0;\n"], ["\n  position: absolute;\n  bottom: 3.75rem;\n  left: 0;\n"])));
+var ImageProductWithTags$1 = function (_a) {
+    var image = _a.image, topTag = _a.topTag, bottomTag = _a.bottomTag, testId = _a.testId, position = _a.position;
+    return (jsxRuntime.jsxs(Container$A, __assign$1({ "data-testid": testId, className: "stylefor".concat(position) }, { children: [jsxRuntime.jsx(InnerImageZoom, { src: image.imageUrl, zoomSrc: image.imageUrl, zoomType: "hover", imgAttributes: {
+                    alt: image.alt,
+                    style: { objectFit: 'cover', objectPosition: 'center' },
+                }, width: position == 'horizontal' ? 360 : 530, height: position == 'horizontal' ? 480 : 720, hideHint: true }, void 0), jsxRuntime.jsx(TopTagContainer$2, { children: topTag }, void 0), jsxRuntime.jsx(BottomTagContainer$2, { children: bottomTag }, void 0)] }), void 0));
+};
+var templateObject_1$V, templateObject_2$A, templateObject_3$p;
+
+var Container$z = newStyled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: auto auto;\n  grid-column-gap: 20px;\n  max-height: 45rem;\n  width: fit-content;\n"], ["\n  display: grid;\n  grid-template-columns: auto auto;\n  grid-column-gap: 20px;\n  max-height: 45rem;\n  width: fit-content;\n"])));
+var ProductGallery = function (_a) {
+    var images = _a.images, selectedValue = _a.selectedValue, topTag = _a.topTag, bottomTag = _a.bottomTag, productImageDataTestId = _a.productImageDataTestId, previewListDataTestId = _a.previewListDataTestId, thumbnailPosition = _a.thumbnailPosition;
+    var initialValue = selectedValue && images.includes(selectedValue) ? selectedValue : images[0];
+    var _b = React$2.useState(initialValue), selectedImage = _b[0], setSelectedImage = _b[1];
+    React$2.useEffect(function () {
+        setSelectedImage(initialValue);
+    }, [initialValue]);
+    return (jsxRuntime.jsxs(Container$z, { children: [jsxRuntime.jsx(ImagePreviewList, { images: images, selectedImage: selectedImage, dataTestId: previewListDataTestId, onClick: function (value) {
+                    setSelectedImage(value);
+                }, position: thumbnailPosition }, void 0), jsxRuntime.jsx(ImageProductWithTags$1, { image: selectedImage, topTag: topTag, bottomTag: bottomTag, testId: productImageDataTestId, position: thumbnailPosition }, void 0)] }, void 0));
+};
+var templateObject_1$U;
+
+/* base styles & size variants */
+var StarStyles = {
+    baseStyles: function () {
+        return css({
+            display: 'flex',
+        });
+    },
+    xsmall: function (theme) {
+        return css({
+            svg: {
+                width: theme.component.stars.element.xsmall.width,
+                height: theme.component.stars.element.xsmall.height,
+                marginRight: theme.component.stars.element.xsmall.marginRight,
+            },
+        });
+    },
+    small: function (theme) {
+        return css({
+            svg: {
+                width: theme.component.stars.element.small.width,
+                height: theme.component.stars.element.small.height,
+                marginRight: theme.component.stars.element.small.marginRight,
+            },
+        });
+    },
+    medium: function (theme) {
+        return css({
+            svg: {
+                width: theme.component.stars.element.medium.width,
+                height: theme.component.stars.element.medium.height,
+                marginRight: theme.component.stars.element.medium.marginRight,
+            },
+        });
+    },
+    large: function (theme) {
+        return css({
+            svg: {
+                width: theme.component.stars.element.large.width,
+                height: theme.component.stars.element.large.height,
+                marginRight: theme.component.stars.element.large.marginRight,
+            },
+        });
+    },
+};
+var Container$y = newStyled.div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
+var templateObject_1$T;
+
+var StarContainer = newStyled.div(function (_a) {
+    var size = _a.size, theme = _a.theme;
+    return [
+        StarStyles.baseStyles(),
+        StarStyles[size](theme),
+    ];
+});
+var sizes = {
+    xsmall: { width: 0.75, height: 0.75 },
+    small: { width: 1, height: 1 },
+    medium: { width: 1.5, height: 1.5 },
+    large: { width: 2.5, height: 2.5 },
+};
+var StarList = function (_a) {
+    var rating = _a.rating, starsNumber = _a.starsNumber, fill = _a.fill, _b = _a.size, size = _b === void 0 ? exports.ComponentSize.Medium : _b;
+    var theme = useTheme();
+    return (jsxRuntime.jsx(Container$y, { children: __spreadArray([], new Array(starsNumber), true).map(function (_, index) {
+            return (jsxRuntime.jsx(StarContainer, __assign$1({ "data-testid": "star-container", size: size, theme: theme }, { children: index < Math.floor(rating) ? (jsxRuntime.jsx(Icon.PDP.Star, __assign$1({}, sizes[size], { fill: fill }), void 0)) : index === Math.floor(rating) && rating % 1 != 0 ? (jsxRuntime.jsx(Icon.PDP.StarHalf, __assign$1({}, sizes[size], { fill: fill }), void 0)) : (jsxRuntime.jsx(Icon.PDP.StarEmpty, __assign$1({}, sizes[size], { fill: fill }), void 0)) }), index));
+        }) }, void 0));
+};
+
+/* base styles & size variants */
+var LabelStyles = {
+    baseStyles: function (theme) {
+        return css({
+            margin: '0',
+            display: 'flex',
+            color: theme.colors.pallete.secondary.color,
+            fontWeight: theme.component.rating.fontWeight,
+        });
+    },
+    xsmall: function (theme) {
+        return css({
+            fontSize: theme.component.rating.size.xsmall.fontSize,
+            lineHeight: theme.component.rating.size.xsmall.lineHeight,
+            marginLeft: '0.172rem',
+        });
+    },
+    small: function (theme) {
+        return css({
+            fontSize: theme.component.rating.size.small.fontSize,
+            lineHeight: theme.component.rating.size.small.lineHeight,
+            marginLeft: '0.313rem',
+        });
+    },
+    medium: function (theme) {
+        return css({
+            fontSize: theme.component.rating.size.medium.fontSize,
+            lineHeight: theme.component.rating.size.medium.lineHeight,
+            marginLeft: '0.438rem',
+        });
+    },
+    large: function (theme) {
+        return css({
+            fontSize: theme.component.rating.size.large.fontSize,
+            lineHeight: theme.component.rating.size.large.lineHeight,
+            marginLeft: '0.563rem',
+        });
+    },
+};
+var Container$x = newStyled.div(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
+var templateObject_1$S;
+
+var CustomLabel = newStyled.div(function (_a) {
+    var theme = _a.theme, size = _a.size, wrapWithParenthesis = _a.wrapWithParenthesis;
+    return [
+        LabelStyles.baseStyles(theme),
+        LabelStyles[size](theme),
+        {
+            ':before': {
+                content: wrapWithParenthesis ? '"("' : '""',
+            },
+            ':after': {
+                content: wrapWithParenthesis ? '")"' : '""',
+            },
+        },
+    ];
+});
+var starsNumber = 5;
+var Rating = function (_a) {
+    var _b = _a.size, size = _b === void 0 ? exports.ComponentSize.Medium : _b, reviews = _a.reviews, reviewsText = _a.reviewsText, rating = _a.rating, _c = _a.wrapWithParenthesis, wrapWithParenthesis = _c === void 0 ? false : _c;
+    var theme = useTheme();
+    return (jsxRuntime.jsxs(Container$x, { children: [jsxRuntime.jsx(StarList, { rating: rating, size: size, starsNumber: starsNumber, fill: theme.component.stars.element.color }, void 0), jsxRuntime.jsxs(CustomLabel, __assign$1({ theme: theme, size: size, wrapWithParenthesis: wrapWithParenthesis, "data-testid": "CustomLabel" }, { children: [reviews, " ", reviewsText] }), void 0)] }, void 0));
+};
+
+var Container$w = newStyled.div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  font-size: 0.88rem;\n"], ["\n  display: flex;\n  align-items: center;\n  font-size: 0.88rem;\n"])));
+var P$2 = newStyled.p(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n  margin: 0 0.25rem;\n  font-weight: 700;\n  color: ", ";\n"], ["\n  margin: 0 0.25rem;\n  font-weight: 700;\n  color: ", ";\n"])), function (props) { return props.theme.colors.shades['550'].color; });
+var textButtonStyles = function (theme) { return ({
+    border: 'none',
+    background: 'transparent',
+    padding: 0,
+    textDecoration: 'underline',
+    color: theme.colors.shades['400'].color,
+    lineHeight: '1.13rem',
+    cursor: 'pointer',
+}); };
+var FitPredictor = function (_a) {
+    var onClick = _a.onClick;
+    var theme = useTheme();
+    return (jsxs(Container$w, __assign$1({ theme: theme }, { children: [jsx(Container$w, { children: jsx(Icon.Other.FitPredictor, { width: 1.125, height: 1.125, fill: theme.colors.shades['550'].color }, void 0) }, void 0), jsx(P$2, __assign$1({ theme: theme }, { children: "FIT PREDICTOR" }), void 0), jsx(BaseButton, __assign$1({ css: textButtonStyles(theme), onClick: onClick }, { children: "Calculate your size" }), void 0)] }), void 0));
+};
+var templateObject_1$R, templateObject_2$z;
+
+var H2$2 = newStyled.h2(function (_a) {
+    var color = _a.color;
+    return ({
+        textAlign: 'center',
+        fontWeight: 400,
+        fontStyle: 'normal',
+        fontSize: '0.875rem',
+        lineHeight: '1.375rem',
+        color: color,
+        margin: '0.938rem 4.188rem',
+    });
+});
+var Bar = newStyled.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n  @keyframes loading {\n    0% {\n      transform: translateX(0);\n    }\n    to {\n      transform: translateX(400%);\n    }\n  }\n\n  height: 0.5rem;\n  background-color: ", ";\n  width: ", ";\n  border-radius: 0.25rem;\n  position: absolute;\n  left: ", ";\n  animation: ", ";\n"], ["\n  @keyframes loading {\n    0% {\n      transform: translateX(0);\n    }\n    to {\n      transform: translateX(400%);\n    }\n  }\n\n  height: 0.5rem;\n  background-color: ", ";\n  width: ", ";\n  border-radius: 0.25rem;\n  position: absolute;\n  left: ", ";\n  animation: ", ";\n"])), function (_a) {
+    var backgroundColor = _a.backgroundColor;
+    return backgroundColor;
+}, function (_a) {
+    var percent = _a.percent;
+    return (percent ? getBarWithBasedOnPercent(percent) : '50%');
+}, function (_a) {
+    var percent = _a.percent;
+    return (percent ? '0' : '-50%');
+}, function (_a) {
+    var percent = _a.percent;
+    return (percent ? 'none' : 'loading 1s ease-in 0.5s infinite');
+});
+var Background = newStyled.div(function (_a) {
+    var backgroundColor = _a.backgroundColor;
+    return ({
+        height: '0.5rem',
+        width: '100%',
+        backgroundColor: backgroundColor,
+        borderRadius: '0.25rem',
+        position: 'absolute',
+    });
+});
+var Container$v = newStyled.div(function (_a) {
+    var widthAuto = _a.widthAuto;
+    return ({
+        width: widthAuto ? 'auto' : 'fit-content',
+        position: 'relative',
+        overflow: 'hidden',
+    });
+});
+var getBarWithBasedOnPercent = function (percent) {
+    return percent <= 100 && percent >= 0 ? "".concat(percent, "%") : '0%';
+};
+var ProgressBar = function (_a) {
+    var description = _a.description, fillColor = _a.fillColor, _b = _a.widthAuto, widthAuto = _b === void 0 ? true : _b, percent = _a.percent;
+    var theme = useTheme();
     return (jsxRuntime.jsxs(Container$v, __assign$1({ "data-testid": "PBContainer", widthAuto: widthAuto }, { children: [jsxRuntime.jsx(Background, __assign$1({ backgroundColor: theme.colors.shades['100'].color }, { children: jsxRuntime.jsx(Bar, { "data-testid": "PBBar", backgroundColor: fillColor, percent: percent }, void 0) }), void 0), description && jsxRuntime.jsx(H2$2, __assign$1({ color: theme.colors.pallete.secondary.color }, { children: description }), void 0)] }), void 0));
 };
-var templateObject_1$P;
+var templateObject_1$Q;
 
 var getStylesBySize$3 = function (size) {
     switch (size) {
@@ -9138,7 +10718,7 @@ var getStylesBySize$3 = function (size) {
             };
     }
 };
-var Container$u = newStyled.div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n  background-color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 50%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  transition: background-color 0.1s ease;\n\n  svg {\n    margin: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n    cursor: pointer;\n  }\n\n  &.disabled {\n    background-color: ", ";\n    cursor: not-allowed;\n\n    svg path {\n      fill: ", ";\n    }\n  }\n"], ["\n  background-color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 50%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  transition: background-color 0.1s ease;\n\n  svg {\n    margin: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n    cursor: pointer;\n  }\n\n  &.disabled {\n    background-color: ", ";\n    cursor: not-allowed;\n\n    svg path {\n      fill: ", ";\n    }\n  }\n"])), function (_a) {
+var Container$u = newStyled.div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n  background-color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 50%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  transition: background-color 0.1s ease;\n\n  svg {\n    margin: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n    cursor: pointer;\n  }\n\n  &.disabled {\n    background-color: ", ";\n    cursor: not-allowed;\n\n    svg path {\n      fill: ", ";\n    }\n  }\n"], ["\n  background-color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 50%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  transition: background-color 0.1s ease;\n\n  svg {\n    margin: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n    cursor: pointer;\n  }\n\n  &.disabled {\n    background-color: ", ";\n    cursor: not-allowed;\n\n    svg path {\n      fill: ", ";\n    }\n  }\n"])), function (_a) {
     var backgroundColor = _a.backgroundColor;
     return backgroundColor;
 }, function (_a) {
@@ -9168,7 +10748,7 @@ var IconButton = function (_a) {
     var theme = useTheme();
     return (jsxRuntime.jsx(Container$u, __assign$1({ className: disabled ? 'disabled' : '', backgroundColor: theme.component.button.primary.active.backgroundColor, hoverBackgroundColor: theme.component.button.secondary.active.backgroundColor, disabledColor: theme.colors.shades['50'].color, disabledIconColor: theme.colors.shades['200'].color, size: size, "data-testid": "Container", onClick: disabled ? function () { } : onClick }, { children: children }), void 0));
 };
-var templateObject_1$O;
+var templateObject_1$P;
 
 var TooltipArrow = function (_a) {
     var height = _a.height, width = _a.width, fill = _a.fill, stroke = _a.stroke;
@@ -9248,7 +10828,7 @@ var getTooltipAlignItems = function (position, align) {
     }
 };
 
-var Wrapper$5 = newStyled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n  display: flex;\n  flex-direction: ", ";\n  align-items: center;\n  cursor: pointer;\n\n  &:hover {\n    .tooltip-container {\n      visibility: visible;\n      opacity: 1;\n    }\n  }\n"], ["\n  display: flex;\n  flex-direction: ", ";\n  align-items: center;\n  cursor: pointer;\n\n  &:hover {\n    .tooltip-container {\n      visibility: visible;\n      opacity: 1;\n    }\n  }\n"])), function (_a) {
+var Wrapper$5 = newStyled.div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n  display: flex;\n  flex-direction: ", ";\n  align-items: center;\n  cursor: pointer;\n\n  &:hover {\n    .tooltip-container {\n      visibility: visible;\n      opacity: 1;\n    }\n  }\n"], ["\n  display: flex;\n  flex-direction: ", ";\n  align-items: center;\n  cursor: pointer;\n\n  &:hover {\n    .tooltip-container {\n      visibility: visible;\n      opacity: 1;\n    }\n  }\n"])), function (_a) {
     var position = _a.position;
     return getWrapperFlexDirection(position);
 });
@@ -9296,7 +10876,7 @@ var Title$5 = newStyled.h1(templateObject_6$7 || (templateObject_6$7 = __makeTem
     return color;
 });
 var IconContainer$5 = newStyled.div(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n  width: 1.375rem;\n  height: 1.125rem;\n  margin-right: 0.563rem;\n"], ["\n  width: 1.375rem;\n  height: 1.125rem;\n  margin-right: 0.563rem;\n"])));
-var templateObject_1$N, templateObject_2$y, templateObject_3$o, templateObject_4$h, templateObject_5$a, templateObject_6$7, templateObject_7$4;
+var templateObject_1$O, templateObject_2$y, templateObject_3$o, templateObject_4$h, templateObject_5$a, templateObject_6$7, templateObject_7$4;
 
 var Tooltip = function (_a) {
     var children = _a.children, position = _a.position, text = _a.text, _b = _a.align, align = _b === void 0 ? 'center' : _b, onClick = _a.onClick, header = _a.header;
@@ -9448,7 +11028,7 @@ var ContainerStyles = {
     },
 };
 
-var Wrapper$4 = newStyled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
+var Wrapper$4 = newStyled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
 var Container$t = newStyled.div(__assign$1({}, ContainerStyles.baseStyles), function (props) { return [ContainerStyles[props.size](props.theme)]; });
 var Input$2 = newStyled.input(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n  position: absolute;\n  opacity: 0;\n  cursor: ", ";\n  height: 100%;\n  width: 100%;\n  margin: 0;\n"], ["\n  position: absolute;\n  opacity: 0;\n  cursor: ", ";\n  height: 100%;\n  width: 100%;\n  margin: 0;\n"])), function (_a) {
     var disabled = _a.disabled;
@@ -9467,7 +11047,7 @@ var RadioInput = function (_a) {
     };
     return (jsxRuntime.jsxs(Wrapper$4, { children: [jsxRuntime.jsxs(Container$t, __assign$1({ theme: theme, size: size, "data-testid": "container" }, { children: [jsxRuntime.jsx(Input$2, { id: "".concat(name, "-").concat(id), type: "radio", name: name, value: value, checked: checked, onChange: function (e) { return (disabled ? null : handleChange(e, label)); }, disabled: disabled }, void 0), jsxRuntime.jsx(CustomRadio, { size: size, isChecked: checked, disabled: disabled, theme: theme, "data-testid": "custom-radio" }, void 0)] }), void 0), jsxRuntime.jsx(Label$3, __assign$1({ htmlFor: "".concat(name, "-").concat(id), "data-testid": "label", variant: "regular", size: size, disabled: disabled }, { children: label }), void 0)] }, void 0));
 };
-var templateObject_1$M, templateObject_2$x;
+var templateObject_1$N, templateObject_2$x;
 
 var RadioGroupInput = function (_a) {
     var name = _a.name, _b = _a.options, options = _b === void 0 ? [] : _b, value = _a.value, onChange = _a.onChange, _c = _a.size, size = _c === void 0 ? exports.ComponentSize.Medium : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d;
@@ -9481,16 +11061,16 @@ var RadioGroupInput = function (_a) {
         }) }), void 0));
 };
 
-var Wrapper$3 = newStyled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n  padding: 0.625rem 1.5rem;\n"], ["\n  padding: 0.625rem 1.5rem;\n"])));
+var Wrapper$3 = newStyled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n  padding: 0.625rem 1.5rem;\n"], ["\n  padding: 0.625rem 1.5rem;\n"])));
 var Container$s = newStyled.div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"], ["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
 var Minimalistic = function (_a) {
     var _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#FFF6EF' : _b, _c = _a.borderColor, borderColor = _c === void 0 ? '#E7C9B2' : _c, originalPrice = _a.originalPrice, price = _a.price, savingPrice = _a.savingPrice, getMorePayLessText = _a.getMorePayLessText, youAreSavingText = _a.youAreSavingText, getQtyForText = _a.getQtyForText, discount = _a.discount, offText = _a.offText, _d = _a.widthAuto, widthAuto = _d === void 0 ? false : _d, _e = _a.testId, testId = _e === void 0 ? 'minimalistic' : _e;
     var theme = useTheme();
     return (jsxRuntime.jsx(Card$2, __assign$1({ backgroundColor: backgroundColor, widthAuto: widthAuto, border: { borderColor: borderColor, borderWidth: '0.063rem' }, flex: false }, { children: jsxRuntime.jsxs(Wrapper$3, { children: [jsxRuntime.jsxs(Container$s, __assign$1({ "data-testid": "".concat(testId, "-section") }, { children: [jsxRuntime.jsx(Text$5, __assign$1({ variant: "body", weight: "demi", size: "small", style: { margin: '0.1rem 1.25rem 0.1rem 0' } }, { children: getMorePayLessText }), void 0), jsxRuntime.jsx(PriceLabel, { finalPrice: price, originalPrice: originalPrice, color: theme.colors.pallete.secondary.color, size: exports.ComponentSize.Small, testId: testId }, void 0)] }), void 0), jsxRuntime.jsxs(Container$s, __assign$1({ "data-testid": "".concat(testId, "-section-bottom") }, { children: [jsxRuntime.jsxs(Text$5, __assign$1({ variant: "body", weight: "demi", style: { color: '#d3373c', margin: '0.1rem 1.25rem 0.1rem 0' }, size: "small" }, { children: [getQtyForText, " ", discount, "% ", offText.toLocaleUpperCase()] }), void 0), jsxRuntime.jsxs(Text$5, __assign$1({ variant: "body", weight: "regular", size: "small" }, { children: [youAreSavingText, ": ", savingPrice] }), void 0)] }), void 0)] }, void 0) }), void 0));
 };
-var templateObject_1$L, templateObject_2$w;
+var templateObject_1$M, templateObject_2$w;
 
-var Container$r = newStyled.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n  padding: 0.625rem 1.5rem;\n"], ["\n  padding: 0.625rem 1.5rem;\n"])));
+var Container$r = newStyled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n  padding: 0.625rem 1.5rem;\n"], ["\n  padding: 0.625rem 1.5rem;\n"])));
 var Title$4 = newStyled.h1(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n  font-weight: 700;\n  font-size: 1rem;\n  line-height: 1.25rem;\n  color: ", ";\n  margin: 0;\n  margin-bottom: 0.125rem;\n  text-align: center;\n"], ["\n  font-weight: 700;\n  font-size: 1rem;\n  line-height: 1.25rem;\n  color: ", ";\n  margin: 0;\n  margin-bottom: 0.125rem;\n  text-align: center;\n"])), function (props) { return props.color; });
 var Details$1 = newStyled.span(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  font-weight: 400;\n  font-size: 1rem;\n  margin: 0;\n  line-height: 1.5rem;\n  justify-content: center;\n  color: ", ";\n"], ["\n  display: flex;\n  align-items: center;\n  font-weight: 400;\n  font-size: 1rem;\n  margin: 0;\n  line-height: 1.5rem;\n  justify-content: center;\n  color: ", ";\n"])), function (props) { return props.color; });
 var PriceContainer$1 = newStyled.span(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n  margin: 0 0.313rem;\n  display: flex;\n  align-items: center;\n"], ["\n  margin: 0 0.313rem;\n  display: flex;\n  align-items: center;\n"])));
@@ -9499,19 +11079,19 @@ var Simple = function (_a) {
     var theme = useTheme();
     return (jsxRuntime.jsx(Card$2, __assign$1({ backgroundColor: backgroundColor, widthAuto: widthAuto }, { children: jsxRuntime.jsxs(Container$r, { children: [jsxRuntime.jsx(Title$4, __assign$1({ color: theme.colors.pallete.secondary.color, "data-testid": "Title" }, { children: title }), void 0), jsxRuntime.jsxs(Details$1, __assign$1({ color: theme.colors.pallete.secondary.color, "data-testid": "Details" }, { children: [anyQtyForText, jsxRuntime.jsx(PriceContainer$1, __assign$1({ "data-testid": "Price" }, { children: jsxRuntime.jsx(PriceLabel, { finalPrice: price, color: "#d3373c", size: exports.ComponentSize.Small }, void 0) }), void 0), "+ ", freeShippingText] }), void 0)] }, void 0) }), void 0));
 };
-var templateObject_1$K, templateObject_2$v, templateObject_3$n, templateObject_4$g;
+var templateObject_1$L, templateObject_2$v, templateObject_3$n, templateObject_4$g;
 
 var Bundle = {
     Minimalistic: Minimalistic,
     Simple: Simple,
 };
 
-var Container$q = newStyled.div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: fit-content;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: fit-content;\n"])));
+var Container$q = newStyled.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: fit-content;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: fit-content;\n"])));
 var Tag$1 = function (_a) {
     var text = _a.text, className = _a.className;
     return jsxRuntime.jsx(Container$q, __assign$1({ className: className }, { children: text }), void 0);
 };
-var templateObject_1$J;
+var templateObject_1$K;
 
 var getStylesBySize$2 = function (size) {
     switch (size) {
@@ -9614,7 +11194,7 @@ var Timer = function (_a) {
     return (jsxRuntime.jsxs("div", __assign$1({ "data-testid": "Time" }, { children: [(hours || displayZeroValues) && "".concat(hours, "h "), (minutes || displayZeroValues) && "".concat(minutes, "m "), seconds, "s"] }), void 0));
 };
 
-var Label$1 = newStyled.span(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n  font-weight: 600;\n  color: ", ";\n  font-size: 1.125rem;\n  line-height: 1.75rem;\n"], ["\n  font-weight: 600;\n  color: ", ";\n  font-size: 1.125rem;\n  line-height: 1.75rem;\n"])), function (_a) {
+var Label$1 = newStyled.span(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n  font-weight: 600;\n  color: ", ";\n  font-size: 1.125rem;\n  line-height: 1.75rem;\n"], ["\n  font-weight: 600;\n  color: ", ";\n  font-size: 1.125rem;\n  line-height: 1.75rem;\n"])), function (_a) {
     var color = _a.color;
     return color;
 });
@@ -9627,7 +11207,7 @@ var InputLabel = function (_a) {
     var theme = useTheme();
     return (jsxRuntime.jsxs(Label$1, __assign$1({ color: isDisabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color }, { children: [label, isRequired && jsxRuntime.jsx(MandatoryIcon, __assign$1({ color: theme.colors.semantic.urgent.color }, { children: "*" }), void 0)] }), void 0));
 };
-var templateObject_1$I, templateObject_2$u;
+var templateObject_1$J, templateObject_2$u;
 
 /**
  * @returns number formatted with "," and 2 decimals as string
@@ -9681,16 +11261,16 @@ var formatPrice = function (value, _a) {
     }).format(valueToFormat);
 };
 
-var ErrorText = newStyled.h3(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n  color: ", " !important;\n  font-size: 0.75rem;\n  font-weight: 600;\n  margin: 0;\n  font-height: 1rem;\n  margin-left: 0.313rem;\n"], ["\n  color: ", " !important;\n  font-size: 0.75rem;\n  font-weight: 600;\n  margin: 0;\n  font-height: 1rem;\n  margin-left: 0.313rem;\n"])), function (props) { return props.color; });
+var ErrorText = newStyled.h3(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n  color: ", " !important;\n  font-size: 0.75rem;\n  font-weight: 600;\n  margin: 0;\n  font-height: 1rem;\n  margin-left: 0.313rem;\n"], ["\n  color: ", " !important;\n  font-size: 0.75rem;\n  font-weight: 600;\n  margin: 0;\n  font-height: 1rem;\n  margin-left: 0.313rem;\n"])), function (props) { return props.color; });
 var ErrorContainer = newStyled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  margin-top: 0.25rem;\n"], ["\n  display: flex;\n  align-items: center;\n  margin-top: 0.25rem;\n"])));
 var Error$1 = function (_a) {
     var error = _a.error;
     var theme = useTheme();
     return (jsxRuntime.jsxs(ErrorContainer, { children: [jsxRuntime.jsx(Icon.Actions.LightExclamation, { fill: theme.colors.semantic.urgent.color, width: 0.875, height: 0.875 }, void 0), jsxRuntime.jsx(ErrorText, __assign$1({ color: theme.colors.semantic.urgent.color }, { children: error }), void 0)] }, void 0));
 };
-var templateObject_1$H, templateObject_2$t;
+var templateObject_1$I, templateObject_2$t;
 
-var Container$p = newStyled.div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n  input {\n    border-color: ", ";\n  }\n"], ["\n  input {\n    border-color: ", ";\n  }\n"])), function (_a) {
+var Container$p = newStyled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n  input {\n    border-color: ", ";\n  }\n"], ["\n  input {\n    border-color: ", ";\n  }\n"])), function (_a) {
     var color = _a.color;
     return color;
 });
@@ -9741,7 +11321,7 @@ var InputWrapper = newStyled.div(templateObject_3$m || (templateObject_3$m = __m
     var size = _a.size;
     return (size === 'small' ? '36px' : '44px');
 });
-var templateObject_1$G, templateObject_2$s, templateObject_3$m;
+var templateObject_1$H, templateObject_2$s, templateObject_3$m;
 
 var BaseInput = function (_a) {
     var _b;
@@ -9815,7 +11395,7 @@ var Button$2 = function (_a) {
     throw new Error("Invalid button variant ".concat(variant));
 };
 
-var Container$o = newStyled.div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n  overflow: hidden;\n\n  input {\n    border-radius: ", ";\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n    border-right: none;\n    width: 100%;\n  }\n"], ["\n  overflow: hidden;\n\n  input {\n    border-radius: ", ";\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n    border-right: none;\n    width: 100%;\n  }\n"])), function (_a) {
+var Container$o = newStyled.div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n  overflow: hidden;\n\n  input {\n    border-radius: ", ";\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n    border-right: none;\n    width: 100%;\n  }\n"], ["\n  overflow: hidden;\n\n  input {\n    border-radius: ", ";\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n    border-right: none;\n    width: 100%;\n  }\n"])), function (_a) {
     var theme = _a.theme;
     return theme.component.inputCustom.input.borderRadius;
 });
@@ -9834,9 +11414,9 @@ var Custom = function (_a) {
     }); }, [variant, onClick, text, rest.disabled]);
     return (jsxRuntime.jsx(Container$o, __assign$1({ theme: theme }, { children: jsxRuntime.jsx(BaseInput, __assign$1({}, rest, { children: jsxRuntime.jsx(ButtonContainer$1, __assign$1({ theme: theme }, { children: jsxRuntime.jsx(Button$2, __assign$1({}, props), void 0) }), void 0) }), void 0) }), void 0));
 };
-var templateObject_1$F, templateObject_2$r;
+var templateObject_1$G, templateObject_2$r;
 
-var SuccessContainer = newStyled.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n  height: ", ";\n  display: flex;\n"], ["\n  height: ", ";\n  display: flex;\n"])), function (_a) {
+var SuccessContainer = newStyled.div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n  height: ", ";\n  display: flex;\n"], ["\n  height: ", ";\n  display: flex;\n"])), function (_a) {
     var size = _a.size;
     return (size === 'small' ? '36px' : '');
 });
@@ -9846,9 +11426,9 @@ var Success = function (_a) {
     var children = _a.children, successText = _a.successText, size = _a.size;
     return (jsxRuntime.jsxs(SuccessContainer, __assign$1({ size: size }, { children: [jsxRuntime.jsxs(SuccessMessage, { children: [jsxRuntime.jsx(Icon.Actions.Check, { fill: "#5EAD63", width: 1.375, height: 1.063 }, void 0), jsxRuntime.jsx(SuccessText, { children: successText }, void 0)] }, void 0), children] }), void 0));
 };
-var templateObject_1$E, templateObject_2$q, templateObject_3$l;
+var templateObject_1$F, templateObject_2$q, templateObject_3$l;
 
-var ButtonContainer = newStyled.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n  margin-left: 0.625rem;\n\n  button {\n    width: 100%;\n    height: 100%;\n    background-color: ", ";\n  }\n"], ["\n  margin-left: 0.625rem;\n\n  button {\n    width: 100%;\n    height: 100%;\n    background-color: ", ";\n  }\n"])), function (_a) {
+var ButtonContainer = newStyled.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n  margin-left: 0.625rem;\n\n  button {\n    width: 100%;\n    height: 100%;\n    background-color: ", ";\n  }\n"], ["\n  margin-left: 0.625rem;\n\n  button {\n    width: 100%;\n    height: 100%;\n    background-color: ", ";\n  }\n"])), function (_a) {
     var status = _a.status, type = _a.type, theme = _a.theme;
     return status === exports.InputValidationType.Empty &&
         type === 'primary' &&
@@ -9865,9 +11445,9 @@ var BasePlusButton = function (_a) {
     }
     return (jsxRuntime.jsx(BaseInput, __assign$1({}, rest, { onValidation: setStatus, onChange: onChangeInput }, { children: jsxRuntime.jsx(ButtonContainer, __assign$1({ status: status, type: "primary", theme: theme }, { children: jsxRuntime.jsx(ButtonSecondary, { text: text, onClick: function () { return onClick(inputValue); }, disabled: rest.disabled || status === exports.InputValidationType.Error }, void 0) }), void 0) }), void 0));
 };
-var templateObject_1$D;
+var templateObject_1$E;
 
-var Container$n = newStyled.div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n  input {\n    padding-right: 2.688rem;\n  }\n"], ["\n  input {\n    padding-right: 2.688rem;\n  }\n"])));
+var Container$n = newStyled.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n  input {\n    padding-right: 2.688rem;\n  }\n"], ["\n  input {\n    padding-right: 2.688rem;\n  }\n"])));
 var IconContainer$4 = newStyled.div(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n  position: absolute;\n  right: 0.875rem;\n  width: 1.125rem;\n  height: 100%;\n  display: flex;\n  align-items: center;\n\n  svg path {\n    fill: ", ";\n  }\n"], ["\n  position: absolute;\n  right: 0.875rem;\n  width: 1.125rem;\n  height: 100%;\n  display: flex;\n  align-items: center;\n\n  svg path {\n    fill: ", ";\n  }\n"])), function (props) { return props.color; });
 var BasePlusIcon = function (_a) {
     var Icon = _a.Icon, rest = __rest(_a, ["Icon"]);
@@ -9879,7 +11459,7 @@ var BasePlusIcon = function (_a) {
                         ? theme.colors.semantic.urgent.color
                         : '' }, { children: React$2.createElement(Icon, { fill: theme.colors.shades['250'].color }) }), void 0) }), void 0) }, void 0));
 };
-var templateObject_1$C, templateObject_2$p;
+var templateObject_1$D, templateObject_2$p;
 
 var Input$1 = {
     Simple: BaseInput,
@@ -9888,7 +11468,7 @@ var Input$1 = {
     SimplePlusIcon: BasePlusIcon,
 };
 
-var Container$m = newStyled.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n  width: ", ";\n  height: ", ";\n  border: 0.063rem solid ", ";\n  border-radius: 0.25rem;\n  padding: 0.375rem;\n  cursor: ", ";\n"], ["\n  width: ", ";\n  height: ", ";\n  border: 0.063rem solid ", ";\n  border-radius: 0.25rem;\n  padding: 0.375rem;\n  cursor: ", ";\n"])), function (_a) {
+var Container$m = newStyled.div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n  width: ", ";\n  height: ", ";\n  border: 0.063rem solid ", ";\n  border-radius: 0.25rem;\n  padding: 0.375rem;\n  cursor: ", ";\n"], ["\n  width: ", ";\n  height: ", ";\n  border: 0.063rem solid ", ";\n  border-radius: 0.25rem;\n  padding: 0.375rem;\n  cursor: ", ";\n"])), function (_a) {
     var width = _a.width;
     return width;
 }, function (_a) {
@@ -9906,9 +11486,9 @@ var PaymentMethod = function (_a) {
     var theme = useTheme();
     return (jsxRuntime.jsx(Container$m, __assign$1({ width: width, height: height, borderColor: theme.colors.shades['100'].color, isClickable: Boolean(onClick), onClick: onClick, "data-testid": "payment-method-container" }, { children: React$2.createElement(Icon) }), void 0));
 };
-var templateObject_1$B;
+var templateObject_1$C;
 
-var Text$4 = newStyled.h3(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n  background-color: ", ";\n  margin: 0;\n  padding: 0.25rem 0.5rem;\n  font-size: 0.625rem;\n  font-weight: 700;\n  line-height: 0.875rem;\n  border-radius: 0.125rem;\n  display: initial;\n  color: ", ";\n"], ["\n  background-color: ", ";\n  margin: 0;\n  padding: 0.25rem 0.5rem;\n  font-size: 0.625rem;\n  font-weight: 700;\n  line-height: 0.875rem;\n  border-radius: 0.125rem;\n  display: initial;\n  color: ", ";\n"])), function (_a) {
+var Text$4 = newStyled.h3(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n  background-color: ", ";\n  margin: 0;\n  padding: 0.25rem 0.5rem;\n  font-size: 0.625rem;\n  font-weight: 700;\n  line-height: 0.875rem;\n  border-radius: 0.125rem;\n  display: initial;\n  color: ", ";\n"], ["\n  background-color: ", ";\n  margin: 0;\n  padding: 0.25rem 0.5rem;\n  font-size: 0.625rem;\n  font-weight: 700;\n  line-height: 0.875rem;\n  border-radius: 0.125rem;\n  display: initial;\n  color: ", ";\n"])), function (_a) {
     var backgroundColor = _a.backgroundColor;
     return backgroundColor;
 }, function (_a) {
@@ -9920,9 +11500,9 @@ var OfferBanner = function (_a) {
     var theme = useTheme();
     return (jsxRuntime.jsx(Text$4, __assign$1({ backgroundColor: backgroundColor, color: theme.colors.shades['700'].color, "data-testid": "OfferBanner" }, { children: discountAppliedText }), void 0));
 };
-var templateObject_1$A;
+var templateObject_1$B;
 
-var Wrapper$2 = newStyled.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n"])));
+var Wrapper$2 = newStyled.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n"])));
 var GrandTotal = newStyled.h1(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n  margin: 0;\n  font-size: 1.5rem;\n  line-height: 2rem;\n  font-weight: 700;\n  color: ", ";\n  display: flex;\n  align-items: center;\n"], ["\n  margin: 0;\n  font-size: 1.5rem;\n  line-height: 2rem;\n  font-weight: 700;\n  color: ", ";\n  display: flex;\n  align-items: center;\n"])), function (props) { return props.color; });
 var Currency = newStyled.span(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n  margin: 0;\n  margin-right: 0.625rem;\n  font-size: 0.875rem;\n  line-height: 1.375rem;\n  font-weight: 600;\n"], ["\n  margin: 0;\n  margin-right: 0.625rem;\n  font-size: 0.875rem;\n  line-height: 1.375rem;\n  font-weight: 600;\n"])));
 var Container$l = newStyled.div(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  margin-top: 0.625rem;\n  color: ", ";\n"], ["\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  margin-top: 0.625rem;\n  color: ", ";\n"])), function (props) { return props.highlightColor; });
@@ -9932,9 +11512,9 @@ var Total = function (_a) {
     var theme = useTheme();
     return (jsxRuntime.jsxs(Wrapper$2, __assign$1({ "data-testid": "total-wrapper" }, { children: [jsxRuntime.jsxs(GrandTotal, __assign$1({ color: theme.colors.shades['550'].color }, { children: [jsxRuntime.jsx(Currency, { children: currency }, void 0), total] }), void 0), saving && (jsxRuntime.jsxs(Container$l, __assign$1({ "data-testid": "subtotal-container", highlightColor: highlightColor }, { children: [jsxRuntime.jsx(Discount, { children: saving.savingText }, void 0), jsxRuntime.jsx(Discount, { children: saving.amount }, void 0)] }), void 0))] }), void 0));
 };
-var templateObject_1$z, templateObject_2$o, templateObject_3$k, templateObject_4$f, templateObject_5$9;
+var templateObject_1$A, templateObject_2$o, templateObject_3$k, templateObject_4$f, templateObject_5$9;
 
-var Wrapper$1 = newStyled.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var Wrapper$1 = newStyled.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var color = _a.color;
     return color;
 });
@@ -9952,14 +11532,14 @@ var Subtotal = function (_a) {
                     return (jsxRuntime.jsxs(ItemContainer, { children: [jsxRuntime.jsxs(CouponItem, __assign$1({ color: highlightColor }, { children: [coupon.couponText, " ", c.code, " ", coupon.appliedText] }), void 0), jsxRuntime.jsx(CouponItem, __assign$1({ color: highlightColor }, { children: c.amount }), void 0)] }, i));
                 })] }), void 0));
 };
-var templateObject_1$y, templateObject_2$n, templateObject_3$j, templateObject_4$e;
+var templateObject_1$z, templateObject_2$n, templateObject_3$j, templateObject_4$e;
 
 var Totals = {
     Total: Total,
     Subtotal: Subtotal,
 };
 
-var Container$k = newStyled.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n  padding: 0.625rem 1.25rem;\n  background-color: ", ";\n  border-radius: 0.313rem;\n  display: flex;\n  margin-bottom: 0.938rem;\n"], ["\n  padding: 0.625rem 1.25rem;\n  background-color: ", ";\n  border-radius: 0.313rem;\n  display: flex;\n  margin-bottom: 0.938rem;\n"])), function (props) { return props.color; });
+var Container$k = newStyled.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n  padding: 0.625rem 1.25rem;\n  background-color: ", ";\n  border-radius: 0.313rem;\n  display: flex;\n  margin-bottom: 0.938rem;\n"], ["\n  padding: 0.625rem 1.25rem;\n  background-color: ", ";\n  border-radius: 0.313rem;\n  display: flex;\n  margin-bottom: 0.938rem;\n"])), function (props) { return props.color; });
 var IconContainer$3 = newStyled.div(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n  width: 1rem;\n  height: 0.875rem;\n  margin-right: 0.5rem;\n  margin-top: 0.125rem;\n"], ["\n  width: 1rem;\n  height: 0.875rem;\n  margin-right: 0.5rem;\n  margin-top: 0.125rem;\n"])));
 var Text$3 = newStyled.p(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n  font-size: 0.875rem;\n  line-height: 1.375rem;\n  font-weight: 400;\n  margin: 0;\n  color: ", ";\n"], ["\n  font-size: 0.875rem;\n  line-height: 1.375rem;\n  font-weight: 400;\n  margin: 0;\n  color: ", ";\n"])), function (props) { return props.color; });
 var Details = newStyled.span(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n  color: ", ";\n  font-weight: 700;\n"], ["\n  color: ", ";\n  font-weight: 700;\n"])), function (props) { return props.color; });
@@ -9967,7 +11547,7 @@ var Note = function (_a) {
     var accentColor = _a.accentColor, color = _a.color, backgroundColor = _a.backgroundColor, importantNoteText = _a.importantNoteText, text = _a.text;
     return (jsxRuntime.jsxs(Container$k, __assign$1({ color: backgroundColor, "data-testid": "Container" }, { children: [jsxRuntime.jsx(IconContainer$3, { children: jsxRuntime.jsx(Icon.Actions.LightExclamation, { fill: accentColor }, void 0) }, void 0), jsxRuntime.jsx("div", { children: jsxRuntime.jsxs(Text$3, __assign$1({ color: color }, { children: [jsxRuntime.jsxs(Details, __assign$1({ color: accentColor }, { children: [importantNoteText, ":"] }), void 0), " ", text] }), void 0) }, void 0)] }), void 0));
 };
-var templateObject_1$x, templateObject_2$m, templateObject_3$i, templateObject_4$d;
+var templateObject_1$y, templateObject_2$m, templateObject_3$i, templateObject_4$d;
 
 /* eslint-disable no-param-reassign */
 var index$1 = function (breakpoints) {
@@ -10053,7 +11633,7 @@ var mediaQueries = index$1(["@media(max-width: 900px)", "@media(min-width: 900px
     literal: true,
 });
 
-var Title$3 = newStyled.h1(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n  color: ", ";\n  font-size: 1.25rem;\n  line-height: 1.75rem;\n  font-weight: 600;\n  margin: 0;\n  text-align: center;\n"], ["\n  color: ", ";\n  font-size: 1.25rem;\n  line-height: 1.75rem;\n  font-weight: 600;\n  margin: 0;\n  text-align: center;\n"])), function (props) { return props.color; });
+var Title$3 = newStyled.h1(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n  color: ", ";\n  font-size: 1.25rem;\n  line-height: 1.75rem;\n  font-weight: 600;\n  margin: 0;\n  text-align: center;\n"], ["\n  color: ", ";\n  font-size: 1.25rem;\n  line-height: 1.75rem;\n  font-weight: 600;\n  margin: 0;\n  text-align: center;\n"])), function (props) { return props.color; });
 var Line = newStyled.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n  width: 100%;\n  height: 0.063rem;\n  background-color: ", ";\n  margin: 0.938rem 0;\n"], ["\n  width: 100%;\n  height: 0.063rem;\n  background-color: ", ";\n  margin: 0.938rem 0;\n"])), function (props) { return props.backgroundColor; });
 var Row$1 = newStyled.div(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n  display: flex;\n  ", "\n  justify-content: space-between;\n  align-items: flex-start;\n"], ["\n  display: flex;\n  ", "\n  justify-content: space-between;\n  align-items: flex-start;\n"])), mediaQueries({
     flexDirection: ['column', 'row'],
@@ -10082,27 +11662,27 @@ var DeliveryDetails = function (_a) {
     var theme = useTheme();
     return (jsxRuntime.jsxs("div", __assign$1({ "data-testid": "DeliveryDetails" }, { children: [jsxRuntime.jsx(Title$3, __assign$1({ color: theme.colors.pallete.secondary.color }, { children: deliveryDetailsText }), void 0), jsxRuntime.jsx(Line, { backgroundColor: theme.colors.shades['100'].color }, void 0), note && jsxRuntime.jsx(Note, __assign$1({}, note), void 0), jsxRuntime.jsxs(Row$1, __assign$1({ "data-testid": "DD-row", theme: theme }, { children: [jsxRuntime.jsxs(Col$1, __assign$1({ theme: theme }, { children: [jsxRuntime.jsxs(SectionTitle, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(IconContainer$2, __assign$1({ theme: theme }, { children: jsxRuntime.jsx(Icon.PDP.Clock, {}, void 0) }), void 0), arrivingBy.title] }), void 0), jsxRuntime.jsx(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: arrivingBy.details }), void 0)] }), void 0), jsxRuntime.jsxs(Col$1, __assign$1({ theme: theme }, { children: [jsxRuntime.jsxs(SectionTitle, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(IconContainer$2, __assign$1({ theme: theme }, { children: jsxRuntime.jsx(Icon.Navigation.MapMarker, {}, void 0) }), void 0), shippingTo.title] }), void 0), jsxRuntime.jsx(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: shippingTo.details }), void 0)] }), void 0), jsxRuntime.jsxs(Col$1, __assign$1({ theme: theme }, { children: [jsxRuntime.jsxs(SectionTitle, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(IconContainer$2, __assign$1({ theme: theme }, { children: jsxRuntime.jsx(Icon.Messaging.Messenger, {}, void 0) }), void 0), instantOrderUpdate.title] }), void 0), jsxRuntime.jsx(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: instantOrderUpdate.details }), void 0), jsxRuntime.jsxs(KeepMeUpdated, __assign$1({ onClick: instantOrderUpdate.keepMeUpdated.onClick, borderColor: theme.colors.shades['150'].color }, { children: [jsxRuntime.jsx(Icon.Messaging.Messenger, { width: 1, height: 1, fill: "#0078FF" }, void 0), instantOrderUpdate.keepMeUpdated.title] }), void 0)] }), void 0)] }), void 0)] }), void 0));
 };
-var templateObject_1$w, templateObject_2$l, templateObject_3$h, templateObject_4$c, templateObject_5$8, templateObject_6$6, templateObject_7$3, templateObject_8$1;
+var templateObject_1$x, templateObject_2$l, templateObject_3$h, templateObject_4$c, templateObject_5$8, templateObject_6$6, templateObject_7$3, templateObject_8$1;
 
-var Container$j = newStyled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n  display: inline-flex;\n  align-items: center;\n  cursor: pointer;\n  user-select: none;\n"], ["\n  display: inline-flex;\n  align-items: center;\n  cursor: pointer;\n  user-select: none;\n"])));
+var Container$j = newStyled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n  display: inline-flex;\n  align-items: center;\n  cursor: pointer;\n  user-select: none;\n"], ["\n  display: inline-flex;\n  align-items: center;\n  cursor: pointer;\n  user-select: none;\n"])));
 var H1$2 = newStyled.h1(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n  margin: 0;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  font-weight: 700;\n  color: ", ";\n  margin-right: 0.313rem;\n"], ["\n  margin: 0;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  font-weight: 700;\n  color: ", ";\n  margin-right: 0.313rem;\n"])), function (props) { return props.color; });
 var ScrollToTop = function (_a) {
     var scrollToTopText = _a.scrollToTopText, onClick = _a.onClick;
     var theme = useTheme();
     return (jsxRuntime.jsxs(Container$j, __assign$1({ onClick: onClick, "data-testid": "Container" }, { children: [jsxRuntime.jsx(H1$2, __assign$1({ color: theme.colors.shades['700'].color }, { children: scrollToTopText }), void 0), jsxRuntime.jsx(Icon.Arrows.ChevronUpSolid, { width: 1.375, height: 1.375, fill: theme.colors.pallete.primary.color }, void 0)] }), void 0));
 };
-var templateObject_1$v, templateObject_2$k;
+var templateObject_1$w, templateObject_2$k;
 
-var Container$i = newStyled.div(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: #dfefeb;\n  padding: 0.75rem 0;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: #dfefeb;\n  padding: 0.75rem 0;\n"])));
+var Container$i = newStyled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: #dfefeb;\n  padding: 0.75rem 0;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: #dfefeb;\n  padding: 0.75rem 0;\n"])));
 var H1$1 = newStyled.h1(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n  margin: 0;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  font-weight: 600;\n  color: ", ";\n  margin-left: 0.625rem;\n"], ["\n  margin: 0;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  font-weight: 600;\n  color: ", ";\n  margin-left: 0.625rem;\n"])), function (props) { return props.color; });
 var OrderBar = function (_a) {
     var message = _a.message;
     var theme = useTheme();
     return (jsxRuntime.jsxs(Container$i, { children: [jsxRuntime.jsx(Icon.Actions.Check, { width: 1.25, height: 0.875, fill: "#2F806A" }, void 0), jsxRuntime.jsx(H1$1, __assign$1({ color: theme.colors.shades['700'].color }, { children: message }), void 0)] }, void 0));
 };
-var templateObject_1$u, templateObject_2$j;
+var templateObject_1$v, templateObject_2$j;
 
-var TableElement = newStyled.table(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n  box-sizing: border-box;\n  border-radius: 0.5rem;\n  border: 0.063rem solid ", ";\n  border-spacing: 0;\n  font-size: 0.875rem;\n  line-height: 3.125rem;\n  width: 100%;\n  color: ", ";\n"], ["\n  box-sizing: border-box;\n  border-radius: 0.5rem;\n  border: 0.063rem solid ", ";\n  border-spacing: 0;\n  font-size: 0.875rem;\n  line-height: 3.125rem;\n  width: 100%;\n  color: ", ";\n"])), function (props) { return props.borderColor; }, function (props) { return props.color; });
+var TableElement = newStyled.table(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n  box-sizing: border-box;\n  border-radius: 0.5rem;\n  border: 0.063rem solid ", ";\n  border-spacing: 0;\n  font-size: 0.875rem;\n  line-height: 3.125rem;\n  width: 100%;\n  color: ", ";\n"], ["\n  box-sizing: border-box;\n  border-radius: 0.5rem;\n  border: 0.063rem solid ", ";\n  border-spacing: 0;\n  font-size: 0.875rem;\n  line-height: 3.125rem;\n  width: 100%;\n  color: ", ";\n"])), function (props) { return props.borderColor; }, function (props) { return props.color; });
 var TableCell = newStyled.td(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n  border-bottom: 0.063rem solid ", ";\n  border-right: 0.063rem solid ", ";\n  padding: 0 1.25rem;\n  text-align: center;\n\n  &:last-child {\n    border-right: none;\n  }\n\n  &:first-of-type {\n    font-weight: 700;\n  }\n"], ["\n  border-bottom: 0.063rem solid ", ";\n  border-right: 0.063rem solid ", ";\n  padding: 0 1.25rem;\n  text-align: center;\n\n  &:last-child {\n    border-right: none;\n  }\n\n  &:first-of-type {\n    font-weight: 700;\n  }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
 var TableHead = newStyled.th(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n  border-bottom: 0.063rem solid ", ";\n  border-right: 0.063rem solid ", ";\n  font-weight: 700;\n\n  &:last-child {\n    border-right: none;\n  }\n"], ["\n  border-bottom: 0.063rem solid ", ";\n  border-right: 0.063rem solid ", ";\n  font-weight: 700;\n\n  &:last-child {\n    border-right: none;\n  }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
 var TableRow = newStyled.tr(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n  &:last-child {\n    td {\n      border-bottom: none;\n    }\n  }\n\n  &.background {\n    background-color: ", ";\n  }\n"], ["\n  &:last-child {\n    td {\n      border-bottom: none;\n    }\n  }\n\n  &.background {\n    background-color: ", ";\n  }\n"])), function (props) { return props.backgroundColor; });
@@ -10111,7 +11691,14 @@ var SizeTable = function (_a) {
     var theme = useTheme();
     return (jsxRuntime.jsxs(TableElement, __assign$1({ color: theme.colors.shades['700'].color, borderColor: theme.colors.shades['100'].color }, { children: [jsxRuntime.jsx("thead", { children: jsxRuntime.jsx(TableRow, __assign$1({ backgroundColor: theme.colors.shades['10'].color }, { children: headers.map(function (header, index) { return (jsxRuntime.jsx(TableHead, __assign$1({ borderColor: theme.colors.shades['100'].color }, { children: header }), index)); }) }), void 0) }, void 0), jsxRuntime.jsx("tbody", { children: data.map(function (row, index) { return (jsxRuntime.jsx(TableRow, __assign$1({ className: index % 2 !== 0 ? '' : 'background', backgroundColor: theme.colors.shades['10'].color }, { children: row.map(function (cell, index) { return (jsxRuntime.jsx(TableCell, __assign$1({ borderColor: theme.colors.shades['100'].color }, { children: cell }), index)); }) }), index)); }) }, void 0)] }), void 0));
 };
-var templateObject_1$t, templateObject_2$i, templateObject_3$g, templateObject_4$b;
+var templateObject_1$u, templateObject_2$i, templateObject_3$g, templateObject_4$b;
+
+var Img = newStyled.img(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n  height: ", ";\n  width: ", ";\n  border-radius: ", ";\n  object-fit: ", ";\n  object-position: ", ";\n"], ["\n  height: ", ";\n  width: ", ";\n  border-radius: ", ";\n  object-fit: ", ";\n  object-position: ", ";\n"])), function (props) { return props.height; }, function (props) { return props.width; }, function (props) { return props.borderRadius; }, function (props) { return props.objectFit; }, function (props) { return props.objectPosition; });
+var Image = function (_a) {
+    var src = _a.src, alt = _a.alt, height = _a.height, width = _a.width, borderRadius = _a.borderRadius, objectFit = _a.objectFit, objectPosition = _a.objectPosition, className = _a.className;
+    return (jsxRuntime.jsx(Img, { src: src, alt: alt, height: height, width: width, borderRadius: borderRadius, objectFit: objectFit, objectPosition: objectPosition, className: className }, void 0));
+};
+var templateObject_1$t;
 
 var Container$h = newStyled.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  width: auto;\n"], ["\n  display: flex;\n  flex-direction: row;\n  width: auto;\n"])));
 var ImageContainer$1 = newStyled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
@@ -10954,16 +12541,16 @@ function useSwipeable(options) {
   return handlers;
 }
 
-var Container$7 = newStyled.div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n  position: relative;\n  max-height: 31.875rem;\n"], ["\n  position: relative;\n  max-height: 31.875rem;\n"])));
+var Container$7 = newStyled.div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n  position: relative;\n  max-height: 31.875rem;\n  overflow: hidden;\n"], ["\n  position: relative;\n  max-height: 31.875rem;\n  overflow: hidden;\n"])));
 var TopTagContainer = newStyled.div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n  position: absolute;\n  left: 0;\n  top: 0;\n"], ["\n  position: absolute;\n  left: 0;\n  top: 0;\n"])));
 var BottomTagContainer = newStyled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n  position: absolute;\n  bottom: 3.75rem;\n  left: 0;\n"], ["\n  position: absolute;\n  bottom: 3.75rem;\n  left: 0;\n"])));
 var ImageProductWithTags = React$2.forwardRef(function ImageProductWithTags(_a, ref) {
-    var image = _a.image, DiscountTagElement = _a.DiscountTagElement, BestSellerTagElement = _a.BestSellerTagElement, testId = _a.testId;
-    return (jsxRuntime.jsxs(Container$7, __assign$1({ "data-testid": testId, ref: ref }, { children: [jsxRuntime.jsx(Image, { src: image.imageUrl, alt: image.alt, objectFit: "cover", objectPosition: "center top", width: "100%", height: "510px" }, void 0), jsxRuntime.jsx(TopTagContainer, { children: DiscountTagElement }, void 0), jsxRuntime.jsx(BottomTagContainer, { children: BestSellerTagElement }, void 0)] }), void 0));
+    var image = _a.image, topTag = _a.topTag, bottomTag = _a.bottomTag, testId = _a.testId;
+    return (jsxRuntime.jsxs(Container$7, __assign$1({ "data-testid": testId, ref: ref }, { children: [jsxRuntime.jsx(InnerImageZoom, { src: image.imageUrl, zoomSrc: image.imageUrl, zoomType: "hover", imgAttributes: { alt: image.alt, width: '100%', height: '510px' }, height: 510, fullscreenOnMobile: true, className: "zoomWrapper" }, void 0), jsxRuntime.jsx(TopTagContainer, { children: topTag }, void 0), jsxRuntime.jsx(BottomTagContainer, { children: bottomTag }, void 0)] }), void 0));
 });
 var templateObject_1$e, templateObject_2$7, templateObject_3$7;
 
-var Button = newStyled.button(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n  background: transparent;\n  border: none;\n  padding: 0.188rem 0.625rem;\n"], ["\n  background: transparent;\n  border: none;\n  padding: 0.188rem 0.625rem;\n"])));
+var Button = newStyled.button(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n  background: transparent;\n  border: none;\n  padding: 0.188rem 0.625rem;\n  z-index: 99;\n  top: calc(50% - 40px);\n  height: 40px !important;\n"], ["\n  background: transparent;\n  border: none;\n  padding: 0.188rem 0.625rem;\n  z-index: 99;\n  top: calc(50% - 40px);\n  height: 40px !important;\n"])));
 var ArrowButton = function (_a) {
     var Icon = _a.Icon, onClick = _a.onClick, className = _a.className;
     return (jsxRuntime.jsx(Button, __assign$1({ className: className, type: "button", onClick: onClick }, { children: Icon }), void 0));
@@ -10999,7 +12586,7 @@ var templateObject_1$b, templateObject_2$6, templateObject_3$6;
 
 var Container$5 = newStyled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  height: fit-content;\n  position: relative;\n  max-width: 450px;\n"], ["\n  display: flex;\n  flex-direction: column;\n  height: fit-content;\n  position: relative;\n  max-width: 450px;\n"])));
 var ProductGalleryMobile = function (_a) {
-    var images = _a.images, selectedValue = _a.selectedValue, DiscountTagElement = _a.DiscountTagElement, BestSellerTagElement = _a.BestSellerTagElement, productImageDataTestId = _a.productImageDataTestId, slideDotsDataTestId = _a.slideDotsDataTestId;
+    var images = _a.images, selectedValue = _a.selectedValue, topTag = _a.topTag, bottomTag = _a.bottomTag, productImageDataTestId = _a.productImageDataTestId, slideDotsDataTestId = _a.slideDotsDataTestId;
     var _b = React$2.useState(0), index = _b[0], setIndex = _b[1];
     React$2.useEffect(function () {
         if (selectedValue == null) {
@@ -11009,23 +12596,18 @@ var ProductGalleryMobile = function (_a) {
     }, [selectedValue, images]);
     var _c = React$2.useState(function () { return images[index]; }), selectedImage = _c[0], setSelectedImage = _c[1];
     var handlers = useSwipeable({
-        onSwiped: React$2.useCallback(function (_a) {
-            var dir = _a.dir;
-            setIndex(function (index) {
-                if (dir === 'Left') {
-                    return Math.min(index + 1, images.length - 1);
-                }
-                if (dir === 'Right') {
-                    return Math.max(index - 1, 0);
-                }
-                return index;
-            });
+        onSwipedLeft: React$2.useCallback(function (e) {
+            console.log(e);
+            setIndex(function (index) { return Math.min(index + 1, images.length - 1); });
         }, [images.length]),
+        onSwipedRight: React$2.useCallback(function () {
+            setIndex(function (index) { return Math.max(index - 1, 0); });
+        }, []),
     });
     React$2.useEffect(function () {
         setSelectedImage(images[index]);
     }, [index, images]);
-    return (jsxRuntime.jsxs(Container$5, { children: [jsxRuntime.jsx(ImageProductWithTags, __assign$1({}, handlers, { image: selectedImage, DiscountTagElement: DiscountTagElement, BestSellerTagElement: BestSellerTagElement, testId: productImageDataTestId }), void 0), jsxRuntime.jsx(SlideNavigation, { quantity: images.length, selectedIndex: images.indexOf(selectedImage), onNavigate: setIndex, testId: slideDotsDataTestId }, void 0)] }, void 0));
+    return (jsxRuntime.jsxs(Container$5, { children: [jsxRuntime.jsx(ImageProductWithTags, __assign$1({}, handlers, { image: selectedImage, topTag: topTag, bottomTag: bottomTag, testId: productImageDataTestId }), void 0), jsxRuntime.jsx(SlideNavigation, { quantity: images.length, selectedIndex: images.indexOf(selectedImage), onNavigate: setIndex, testId: slideDotsDataTestId }, void 0)] }, void 0));
 };
 var templateObject_1$a;