@everlywell/consumer-ui 1.30.0 → 1.32.0

package/index.mjs

@@ -1,9 +1,9 @@
-import { useSteps as Wt, Box as E, Stepper as Bt, Icon as ie, Flex as L, Text as Z, Link as G, Button as gt, Image as Mt, IconButton as Vt, VStack as Nt, Skeleton as Ne, HStack as st, SkeletonCircle as Le, Drawer as Yt, DrawerOverlay as zt, DrawerContent as Ut, DrawerHeader as Gt, DrawerBody as Zt, Grid as Kt, GridItem as Xt } from "@everlywell/ui-kit";
-import Ke, { useEffect as ae, forwardRef as bt, useRef as Jt, useState as V, useCallback as Xe } from "react";
+import { useSteps as Wt, Box as E, Stepper as Mt, Icon as ae, Flex as T, Text as Z, Link as G, Button as vt, Image as Bt, IconButton as Vt, VStack as Nt, Skeleton as Ve, HStack as ot, SkeletonCircle as Le, DrawerContent as Yt, DrawerOverlay as zt, Drawer as Ut, DrawerHeader as Gt, DrawerBody as Zt, Grid as Kt, GridItem as Xt } from "@everlywell/ui-kit";
+import Ze, { useEffect as q, forwardRef as gt, useRef as Jt, useCallback as xt, useState as W } from "react";
 import { Text as qt, useBreakpointValue as mt, InputGroup as Qt, Input as en, InputRightElement as tn, Icon as nn } from "@chakra-ui/react";
-import { CaretRight as ut, MagnifyingGlass as Ct, List as rn, Basket as ln, CaretLeft as an, X as on, User as ct, QrCode as sn } from "@phosphor-icons/react";
-import { motion as dt } from "framer-motion";
-var Ge = { exports: {} }, xe = {};
+import { CaretRight as st, MagnifyingGlass as bt, List as rn, Basket as ln, CaretLeft as an, X as on, User as ut, QrCode as sn } from "@phosphor-icons/react";
+import { motion as Ke, AnimatePresence as un } from "framer-motion";
+var Ue = { exports: {} }, Ce = {};
 /**
  * @license React
  * react-jsx-runtime.production.min.js
@@ -13,25 +13,25 @@ var Ge = { exports: {} }, xe = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var ft;
-function un() {
-  if (ft)
-    return xe;
-  ft = 1;
-  var l = Ke, o = Symbol.for("react.element"), h = Symbol.for("react.fragment"), d = Object.prototype.hasOwnProperty, w = l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, x = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function m(R, u, b) {
-    var s, f = {}, j = null, c = null;
-    b !== void 0 && (j = "" + b), u.key !== void 0 && (j = "" + u.key), u.ref !== void 0 && (c = u.ref);
-    for (s in u)
-      d.call(u, s) && !x.hasOwnProperty(s) && (f[s] = u[s]);
+var ct;
+function cn() {
+  if (ct)
+    return Ce;
+  ct = 1;
+  var l = Ze, o = Symbol.for("react.element"), p = Symbol.for("react.fragment"), d = Object.prototype.hasOwnProperty, j = l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, v = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function m(R, c, x) {
+    var s, b = {}, w = null, u = null;
+    x !== void 0 && (w = "" + x), c.key !== void 0 && (w = "" + c.key), c.ref !== void 0 && (u = c.ref);
+    for (s in c)
+      d.call(c, s) && !v.hasOwnProperty(s) && (b[s] = c[s]);
     if (R && R.defaultProps)
-      for (s in u = R.defaultProps, u)
-        f[s] === void 0 && (f[s] = u[s]);
-    return { $$typeof: o, type: R, key: j, ref: c, props: f, _owner: w.current };
+      for (s in c = R.defaultProps, c)
+        b[s] === void 0 && (b[s] = c[s]);
+    return { $$typeof: o, type: R, key: w, ref: u, props: b, _owner: j.current };
   }
-  return xe.Fragment = h, xe.jsx = m, xe.jsxs = m, xe;
+  return Ce.Fragment = p, Ce.jsx = m, Ce.jsxs = m, Ce;
 }
-var ge = {};
+var je = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -41,70 +41,70 @@ var ge = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var pt;
-function cn() {
-  return pt || (pt = 1, process.env.NODE_ENV !== "production" && function() {
-    var l = Ke, o = Symbol.for("react.element"), h = Symbol.for("react.portal"), d = Symbol.for("react.fragment"), w = Symbol.for("react.strict_mode"), x = Symbol.for("react.profiler"), m = Symbol.for("react.provider"), R = Symbol.for("react.context"), u = Symbol.for("react.forward_ref"), b = Symbol.for("react.suspense"), s = Symbol.for("react.suspense_list"), f = Symbol.for("react.memo"), j = Symbol.for("react.lazy"), c = Symbol.for("react.offscreen"), S = Symbol.iterator, I = "@@iterator";
-    function $(e) {
+var dt;
+function dn() {
+  return dt || (dt = 1, process.env.NODE_ENV !== "production" && function() {
+    var l = Ze, o = Symbol.for("react.element"), p = Symbol.for("react.portal"), d = Symbol.for("react.fragment"), j = Symbol.for("react.strict_mode"), v = Symbol.for("react.profiler"), m = Symbol.for("react.provider"), R = Symbol.for("react.context"), c = Symbol.for("react.forward_ref"), x = Symbol.for("react.suspense"), s = Symbol.for("react.suspense_list"), b = Symbol.for("react.memo"), w = Symbol.for("react.lazy"), u = Symbol.for("react.offscreen"), L = Symbol.iterator, M = "@@iterator";
+    function Q(e) {
       if (e === null || typeof e != "object")
         return null;
-      var n = S && e[S] || e[I];
+      var n = L && e[L] || e[M];
       return typeof n == "function" ? n : null;
     }
     var F = l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
-    function T(e) {
+    function _(e) {
       {
-        for (var n = arguments.length, r = new Array(n > 1 ? n - 1 : 0), a = 1; a < n; a++)
-          r[a - 1] = arguments[a];
-        B("error", e, r);
+        for (var n = arguments.length, r = new Array(n > 1 ? n - 1 : 0), i = 1; i < n; i++)
+          r[i - 1] = arguments[i];
+        se("error", e, r);
       }
     }
-    function B(e, n, r) {
+    function se(e, n, r) {
       {
-        var a = F.ReactDebugCurrentFrame, g = a.getStackAddendum();
+        var i = F.ReactDebugCurrentFrame, g = i.getStackAddendum();
         g !== "" && (n += "%s", r = r.concat([g]));
-        var C = r.map(function(v) {
-          return String(v);
+        var C = r.map(function(h) {
+          return String(h);
         });
         C.unshift("Warning: " + n), Function.prototype.apply.call(console[e], console, C);
       }
     }
-    var be = !1, J = !1, me = !1, Ce = !1, q = !1, y;
+    var ue = !1, ce = !1, H = !1, ee = !1, B = !1, y;
     y = Symbol.for("react.module.reference");
-    function N(e) {
-      return !!(typeof e == "string" || typeof e == "function" || e === d || e === x || q || e === w || e === b || e === s || Ce || e === c || be || J || me || typeof e == "object" && e !== null && (e.$$typeof === j || e.$$typeof === f || e.$$typeof === m || e.$$typeof === R || e.$$typeof === u || // This needs to include all possible module reference object
+    function V(e) {
+      return !!(typeof e == "string" || typeof e == "function" || e === d || e === v || B || e === j || e === x || e === s || ee || e === u || ue || ce || H || typeof e == "object" && e !== null && (e.$$typeof === w || e.$$typeof === b || e.$$typeof === m || e.$$typeof === R || e.$$typeof === c || // This needs to include all possible module reference object
       // types supported by any Flight configuration anywhere since
       // we don't know which Flight build this will end up being used
       // with.
       e.$$typeof === y || e.getModuleId !== void 0));
     }
-    function se(e, n, r) {
-      var a = e.displayName;
-      if (a)
-        return a;
+    function we(e, n, r) {
+      var i = e.displayName;
+      if (i)
+        return i;
       var g = n.displayName || n.name || "";
       return g !== "" ? r + "(" + g + ")" : r;
     }
-    function we(e) {
+    function de(e) {
       return e.displayName || "Context";
     }
-    function A(e) {
+    function I(e) {
       if (e == null)
         return null;
-      if (typeof e.tag == "number" && T("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
+      if (typeof e.tag == "number" && _("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
         return e.displayName || e.name || null;
       if (typeof e == "string")
         return e;
       switch (e) {
         case d:
           return "Fragment";
-        case h:
+        case p:
           return "Portal";
-        case x:
+        case v:
           return "Profiler";
-        case w:
+        case j:
           return "StrictMode";
-        case b:
+        case x:
           return "Suspense";
         case s:
           return "SuspenseList";
@@ -113,19 +113,19 @@ function cn() {
         switch (e.$$typeof) {
           case R:
             var n = e;
-            return we(n) + ".Consumer";
+            return de(n) + ".Consumer";
           case m:
             var r = e;
-            return we(r._context) + ".Provider";
-          case u:
-            return se(e, e.render, "ForwardRef");
-          case f:
-            var a = e.displayName || null;
-            return a !== null ? a : A(e.type) || "Memo";
-          case j: {
-            var g = e, C = g._payload, v = g._init;
+            return de(r._context) + ".Provider";
+          case c:
+            return we(e, e.render, "ForwardRef");
+          case b:
+            var i = e.displayName || null;
+            return i !== null ? i : I(e.type) || "Memo";
+          case w: {
+            var g = e, C = g._payload, h = g._init;
             try {
-              return A(v(C));
+              return I(h(C));
             } catch {
               return null;
             }
@@ -133,18 +133,18 @@ function cn() {
         }
       return null;
     }
-    var M = Object.assign, Y = 0, je, ye, Q, Ee, ue, Re, _e;
-    function Se() {
+    var N = Object.assign, Y = 0, ye, Ee, te, Re, fe, _e, Se;
+    function ke() {
     }
-    Se.__reactDisabledLog = !0;
-    function De() {
+    ke.__reactDisabledLog = !0;
+    function pe() {
       {
         if (Y === 0) {
-          je = console.log, ye = console.info, Q = console.warn, Ee = console.error, ue = console.group, Re = console.groupCollapsed, _e = console.groupEnd;
+          ye = console.log, Ee = console.info, te = console.warn, Re = console.error, fe = console.group, _e = console.groupCollapsed, Se = console.groupEnd;
           var e = {
             configurable: !0,
             enumerable: !0,
-            value: Se,
+            value: ke,
             writable: !0
           };
           Object.defineProperties(console, {
@@ -160,7 +160,7 @@ function cn() {
         Y++;
       }
     }
-    function Te() {
+    function Pe() {
       {
         if (Y--, Y === 0) {
           var e = {
@@ -169,217 +169,217 @@ function cn() {
             writable: !0
           };
           Object.defineProperties(console, {
-            log: M({}, e, {
-              value: je
-            }),
-            info: M({}, e, {
+            log: N({}, e, {
               value: ye
             }),
-            warn: M({}, e, {
-              value: Q
-            }),
-            error: M({}, e, {
+            info: N({}, e, {
               value: Ee
             }),
-            group: M({}, e, {
-              value: ue
+            warn: N({}, e, {
+              value: te
             }),
-            groupCollapsed: M({}, e, {
+            error: N({}, e, {
               value: Re
             }),
-            groupEnd: M({}, e, {
+            group: N({}, e, {
+              value: fe
+            }),
+            groupCollapsed: N({}, e, {
               value: _e
+            }),
+            groupEnd: N({}, e, {
+              value: Se
             })
           });
         }
-        Y < 0 && T("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
+        Y < 0 && _("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
       }
     }
-    var ce = F.ReactCurrentDispatcher, de;
-    function ee(e, n, r) {
+    var he = F.ReactCurrentDispatcher, ve;
+    function ne(e, n, r) {
       {
-        if (de === void 0)
+        if (ve === void 0)
           try {
             throw Error();
           } catch (g) {
-            var a = g.stack.trim().match(/\n( *(at )?)/);
-            de = a && a[1] || "";
+            var i = g.stack.trim().match(/\n( *(at )?)/);
+            ve = i && i[1] || "";
           }
         return `
-` + de + e;
+` + ve + e;
       }
     }
-    var fe = !1, te;
+    var ge = !1, re;
     {
       var Ie = typeof WeakMap == "function" ? WeakMap : Map;
-      te = new Ie();
+      re = new Ie();
     }
-    function ke(e, n) {
-      if (!e || fe)
+    function Te(e, n) {
+      if (!e || ge)
         return "";
       {
-        var r = te.get(e);
+        var r = re.get(e);
         if (r !== void 0)
           return r;
       }
-      var a;
-      fe = !0;
+      var i;
+      ge = !0;
       var g = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
       var C;
-      C = ce.current, ce.current = null, De();
+      C = he.current, he.current = null, pe();
       try {
         if (n) {
-          var v = function() {
+          var h = function() {
             throw Error();
           };
-          if (Object.defineProperty(v.prototype, "props", {
+          if (Object.defineProperty(h.prototype, "props", {
             set: function() {
               throw Error();
             }
           }), typeof Reflect == "object" && Reflect.construct) {
             try {
-              Reflect.construct(v, []);
-            } catch (D) {
-              a = D;
+              Reflect.construct(h, []);
+            } catch (P) {
+              i = P;
             }
-            Reflect.construct(e, [], v);
+            Reflect.construct(e, [], h);
           } else {
             try {
-              v.call();
-            } catch (D) {
-              a = D;
+              h.call();
+            } catch (P) {
+              i = P;
             }
-            e.call(v.prototype);
+            e.call(h.prototype);
           }
         } else {
           try {
             throw Error();
-          } catch (D) {
-            a = D;
+          } catch (P) {
+            i = P;
           }
           e();
         }
-      } catch (D) {
-        if (D && a && typeof D.stack == "string") {
-          for (var p = D.stack.split(`
-`), P = a.stack.split(`
-`), _ = p.length - 1, k = P.length - 1; _ >= 1 && k >= 0 && p[_] !== P[k]; )
+      } catch (P) {
+        if (P && i && typeof P.stack == "string") {
+          for (var f = P.stack.split(`
+`), O = i.stack.split(`
+`), S = f.length - 1, k = O.length - 1; S >= 1 && k >= 0 && f[S] !== O[k]; )
             k--;
-          for (; _ >= 1 && k >= 0; _--, k--)
-            if (p[_] !== P[k]) {
-              if (_ !== 1 || k !== 1)
+          for (; S >= 1 && k >= 0; S--, k--)
+            if (f[S] !== O[k]) {
+              if (S !== 1 || k !== 1)
                 do
-                  if (_--, k--, k < 0 || p[_] !== P[k]) {
-                    var W = `
-` + p[_].replace(" at new ", " at ");
-                    return e.displayName && W.includes("<anonymous>") && (W = W.replace("<anonymous>", e.displayName)), typeof e == "function" && te.set(e, W), W;
+                  if (S--, k--, k < 0 || f[S] !== O[k]) {
+                    var $ = `
+` + f[S].replace(" at new ", " at ");
+                    return e.displayName && $.includes("<anonymous>") && ($ = $.replace("<anonymous>", e.displayName)), typeof e == "function" && re.set(e, $), $;
                   }
-                while (_ >= 1 && k >= 0);
+                while (S >= 1 && k >= 0);
               break;
             }
         }
       } finally {
-        fe = !1, ce.current = C, Te(), Error.prepareStackTrace = g;
+        ge = !1, he.current = C, Pe(), Error.prepareStackTrace = g;
       }
-      var le = e ? e.displayName || e.name : "", X = le ? ee(le) : "";
-      return typeof e == "function" && te.set(e, X), X;
+      var ie = e ? e.displayName || e.name : "", J = ie ? ne(ie) : "";
+      return typeof e == "function" && re.set(e, J), J;
     }
-    function Fe(e, n, r) {
-      return ke(e, !1);
+    function Ae(e, n, r) {
+      return Te(e, !1);
     }
-    function Ae(e) {
+    function Fe(e) {
       var n = e.prototype;
       return !!(n && n.isReactComponent);
     }
-    function ne(e, n, r) {
+    function K(e, n, r) {
       if (e == null)
         return "";
       if (typeof e == "function")
-        return ke(e, Ae(e));
+        return Te(e, Fe(e));
       if (typeof e == "string")
-        return ee(e);
+        return ne(e);
       switch (e) {
-        case b:
-          return ee("Suspense");
+        case x:
+          return ne("Suspense");
         case s:
-          return ee("SuspenseList");
+          return ne("SuspenseList");
       }
       if (typeof e == "object")
         switch (e.$$typeof) {
-          case u:
-            return Fe(e.render);
-          case f:
-            return ne(e.type, n, r);
-          case j: {
-            var a = e, g = a._payload, C = a._init;
+          case c:
+            return Ae(e.render);
+          case b:
+            return K(e.type, n, r);
+          case w: {
+            var i = e, g = i._payload, C = i._init;
             try {
-              return ne(C(g), n, r);
+              return K(C(g), n, r);
             } catch {
             }
           }
         }
       return "";
     }
-    var z = Object.prototype.hasOwnProperty, pe = {}, he = F.ReactDebugCurrentFrame;
-    function i(e) {
+    var z = Object.prototype.hasOwnProperty, xe = {}, a = F.ReactDebugCurrentFrame;
+    function D(e) {
       if (e) {
-        var n = e._owner, r = ne(e.type, e._source, n ? n.type : null);
-        he.setExtraStackFrame(r);
+        var n = e._owner, r = K(e.type, e._source, n ? n.type : null);
+        a.setExtraStackFrame(r);
       } else
-        he.setExtraStackFrame(null);
+        a.setExtraStackFrame(null);
     }
-    function H(e, n, r, a, g) {
+    function U(e, n, r, i, g) {
       {
         var C = Function.call.bind(z);
-        for (var v in e)
-          if (C(e, v)) {
-            var p = void 0;
+        for (var h in e)
+          if (C(e, h)) {
+            var f = void 0;
             try {
-              if (typeof e[v] != "function") {
-                var P = Error((a || "React class") + ": " + r + " type `" + v + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[v] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
-                throw P.name = "Invariant Violation", P;
+              if (typeof e[h] != "function") {
+                var O = Error((i || "React class") + ": " + r + " type `" + h + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[h] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
+                throw O.name = "Invariant Violation", O;
               }
-              p = e[v](n, v, a, r, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
-            } catch (_) {
-              p = _;
+              f = e[h](n, h, i, r, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+            } catch (S) {
+              f = S;
             }
-            p && !(p instanceof Error) && (i(g), T("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", a || "React class", r, v, typeof p), i(null)), p instanceof Error && !(p.message in pe) && (pe[p.message] = !0, i(g), T("Failed %s type: %s", r, p.message), i(null));
+            f && !(f instanceof Error) && (D(g), _("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", i || "React class", r, h, typeof f), D(null)), f instanceof Error && !(f.message in xe) && (xe[f.message] = !0, D(g), _("Failed %s type: %s", r, f.message), D(null));
           }
       }
     }
-    var U = Array.isArray;
-    function O(e) {
-      return U(e);
+    var A = Array.isArray;
+    function me(e) {
+      return A(e);
     }
-    function He(e) {
+    function X(e) {
       {
         var n = typeof Symbol == "function" && Symbol.toStringTag, r = n && e[Symbol.toStringTag] || e.constructor.name || "Object";
         return r;
       }
     }
-    function K(e) {
+    function Ct(e) {
       try {
-        return Je(e), !1;
+        return Xe(e), !1;
       } catch {
         return !0;
       }
     }
-    function Je(e) {
+    function Xe(e) {
       return "" + e;
     }
-    function qe(e) {
-      if (K(e))
-        return T("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", He(e)), Je(e);
+    function Je(e) {
+      if (Ct(e))
+        return _("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", X(e)), Xe(e);
     }
-    var ve = F.ReactCurrentOwner, wt = {
+    var be = F.ReactCurrentOwner, jt = {
       key: !0,
       ref: !0,
       __self: !0,
       __source: !0
-    }, Qe, et, $e;
-    $e = {};
-    function jt(e) {
+    }, qe, Qe, He;
+    He = {};
+    function wt(e) {
       if (z.call(e, "ref")) {
         var n = Object.getOwnPropertyDescriptor(e, "ref").get;
         if (n && n.isReactWarning)
@@ -396,15 +396,15 @@ function cn() {
       return e.key !== void 0;
     }
     function Et(e, n) {
-      if (typeof e.ref == "string" && ve.current && n && ve.current.stateNode !== n) {
-        var r = A(ve.current.type);
-        $e[r] || (T('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', A(ve.current.type), e.ref), $e[r] = !0);
+      if (typeof e.ref == "string" && be.current && n && be.current.stateNode !== n) {
+        var r = I(be.current.type);
+        He[r] || (_('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', I(be.current.type), e.ref), He[r] = !0);
       }
     }
     function Rt(e, n) {
       {
         var r = function() {
-          Qe || (Qe = !0, T("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", n));
+          qe || (qe = !0, _("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", n));
         };
         r.isReactWarning = !0, Object.defineProperty(e, "key", {
           get: r,
@@ -415,7 +415,7 @@ function cn() {
     function _t(e, n) {
       {
         var r = function() {
-          et || (et = !0, T("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", n));
+          Qe || (Qe = !0, _("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", n));
         };
         r.isReactWarning = !0, Object.defineProperty(e, "ref", {
           get: r,
@@ -423,70 +423,70 @@ function cn() {
         });
       }
     }
-    var St = function(e, n, r, a, g, C, v) {
-      var p = {
+    var St = function(e, n, r, i, g, C, h) {
+      var f = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: o,
         // Built-in properties that belong on the element
         type: e,
         key: n,
         ref: r,
-        props: v,
+        props: h,
         // Record the component responsible for creating this element.
         _owner: C
       };
-      return p._store = {}, Object.defineProperty(p._store, "validated", {
+      return f._store = {}, Object.defineProperty(f._store, "validated", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: !1
-      }), Object.defineProperty(p, "_self", {
+      }), Object.defineProperty(f, "_self", {
         configurable: !1,
         enumerable: !1,
         writable: !1,
-        value: a
-      }), Object.defineProperty(p, "_source", {
+        value: i
+      }), Object.defineProperty(f, "_source", {
         configurable: !1,
         enumerable: !1,
         writable: !1,
         value: g
-      }), Object.freeze && (Object.freeze(p.props), Object.freeze(p)), p;
+      }), Object.freeze && (Object.freeze(f.props), Object.freeze(f)), f;
     };
-    function Tt(e, n, r, a, g) {
+    function kt(e, n, r, i, g) {
       {
-        var C, v = {}, p = null, P = null;
-        r !== void 0 && (qe(r), p = "" + r), yt(n) && (qe(n.key), p = "" + n.key), jt(n) && (P = n.ref, Et(n, g));
+        var C, h = {}, f = null, O = null;
+        r !== void 0 && (Je(r), f = "" + r), yt(n) && (Je(n.key), f = "" + n.key), wt(n) && (O = n.ref, Et(n, g));
         for (C in n)
-          z.call(n, C) && !wt.hasOwnProperty(C) && (v[C] = n[C]);
+          z.call(n, C) && !jt.hasOwnProperty(C) && (h[C] = n[C]);
         if (e && e.defaultProps) {
-          var _ = e.defaultProps;
-          for (C in _)
-            v[C] === void 0 && (v[C] = _[C]);
+          var S = e.defaultProps;
+          for (C in S)
+            h[C] === void 0 && (h[C] = S[C]);
         }
-        if (p || P) {
+        if (f || O) {
           var k = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
-          p && Rt(v, k), P && _t(v, k);
+          f && Rt(h, k), O && _t(h, k);
         }
-        return St(e, p, P, g, a, ve.current, v);
+        return St(e, f, O, g, i, be.current, h);
       }
     }
-    var We = F.ReactCurrentOwner, tt = F.ReactDebugCurrentFrame;
-    function re(e) {
+    var $e = F.ReactCurrentOwner, et = F.ReactDebugCurrentFrame;
+    function le(e) {
       if (e) {
-        var n = e._owner, r = ne(e.type, e._source, n ? n.type : null);
-        tt.setExtraStackFrame(r);
+        var n = e._owner, r = K(e.type, e._source, n ? n.type : null);
+        et.setExtraStackFrame(r);
       } else
-        tt.setExtraStackFrame(null);
+        et.setExtraStackFrame(null);
     }
-    var Be;
-    Be = !1;
+    var We;
+    We = !1;
     function Me(e) {
       return typeof e == "object" && e !== null && e.$$typeof === o;
     }
-    function nt() {
+    function tt() {
       {
-        if (We.current) {
-          var e = A(We.current.type);
+        if ($e.current) {
+          var e = I($e.current.type);
           if (e)
             return `
 
@@ -495,7 +495,7 @@ Check the render method of \`` + e + "`.";
         return "";
       }
     }
-    function kt(e) {
+    function Tt(e) {
       {
         if (e !== void 0) {
           var n = e.fileName.replace(/^.*[\\\/]/, ""), r = e.lineNumber;
@@ -506,10 +506,10 @@ Check your code at ` + n + ":" + r + ".";
         return "";
       }
     }
-    var rt = {};
+    var nt = {};
     function Lt(e) {
       {
-        var n = nt();
+        var n = tt();
         if (!n) {
           var r = typeof e == "string" ? e : e.displayName || e.name;
           r && (n = `
@@ -519,39 +519,39 @@ Check the top-level render call using <` + r + ">.");
         return n;
       }
     }
-    function lt(e, n) {
+    function rt(e, n) {
       {
         if (!e._store || e._store.validated || e.key != null)
           return;
         e._store.validated = !0;
         var r = Lt(n);
-        if (rt[r])
+        if (nt[r])
           return;
-        rt[r] = !0;
-        var a = "";
-        e && e._owner && e._owner !== We.current && (a = " It was passed a child from " + A(e._owner.type) + "."), re(e), T('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', r, a), re(null);
+        nt[r] = !0;
+        var i = "";
+        e && e._owner && e._owner !== $e.current && (i = " It was passed a child from " + I(e._owner.type) + "."), le(e), _('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', r, i), le(null);
       }
     }
-    function it(e, n) {
+    function lt(e, n) {
       {
         if (typeof e != "object")
           return;
-        if (O(e))
+        if (me(e))
           for (var r = 0; r < e.length; r++) {
-            var a = e[r];
-            Me(a) && lt(a, n);
+            var i = e[r];
+            Me(i) && rt(i, n);
           }
         else if (Me(e))
           e._store && (e._store.validated = !0);
         else if (e) {
-          var g = $(e);
+          var g = Q(e);
           if (typeof g == "function" && g !== e.entries)
-            for (var C = g.call(e), v; !(v = C.next()).done; )
-              Me(v.value) && lt(v.value, n);
+            for (var C = g.call(e), h; !(h = C.next()).done; )
+              Me(h.value) && rt(h.value, n);
         }
       }
     }
-    function Ot(e) {
+    function Dt(e) {
       {
         var n = e.type;
         if (n == null || typeof n == "string")
@@ -559,133 +559,133 @@ Check the top-level render call using <` + r + ">.");
         var r;
         if (typeof n == "function")
           r = n.propTypes;
-        else if (typeof n == "object" && (n.$$typeof === u || // Note: Memo only checks outer props here.
+        else if (typeof n == "object" && (n.$$typeof === c || // Note: Memo only checks outer props here.
         // Inner props are checked in the reconciler.
-        n.$$typeof === f))
+        n.$$typeof === b))
           r = n.propTypes;
         else
           return;
         if (r) {
-          var a = A(n);
-          H(r, e.props, "prop", a, e);
-        } else if (n.PropTypes !== void 0 && !Be) {
-          Be = !0;
-          var g = A(n);
-          T("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", g || "Unknown");
+          var i = I(n);
+          U(r, e.props, "prop", i, e);
+        } else if (n.PropTypes !== void 0 && !We) {
+          We = !0;
+          var g = I(n);
+          _("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", g || "Unknown");
         }
-        typeof n.getDefaultProps == "function" && !n.getDefaultProps.isReactClassApproved && T("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
+        typeof n.getDefaultProps == "function" && !n.getDefaultProps.isReactClassApproved && _("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
       }
     }
-    function Pt(e) {
+    function Ot(e) {
       {
         for (var n = Object.keys(e.props), r = 0; r < n.length; r++) {
-          var a = n[r];
-          if (a !== "children" && a !== "key") {
-            re(e), T("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", a), re(null);
+          var i = n[r];
+          if (i !== "children" && i !== "key") {
+            le(e), _("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", i), le(null);
             break;
           }
         }
-        e.ref !== null && (re(e), T("Invalid attribute `ref` supplied to `React.Fragment`."), re(null));
+        e.ref !== null && (le(e), _("Invalid attribute `ref` supplied to `React.Fragment`."), le(null));
       }
     }
-    var at = {};
-    function ot(e, n, r, a, g, C) {
+    var it = {};
+    function at(e, n, r, i, g, C) {
       {
-        var v = N(e);
-        if (!v) {
-          var p = "";
-          (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (p += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
-          var P = kt(g);
-          P ? p += P : p += nt();
-          var _;
-          e === null ? _ = "null" : O(e) ? _ = "array" : e !== void 0 && e.$$typeof === o ? (_ = "<" + (A(e.type) || "Unknown") + " />", p = " Did you accidentally export a JSX literal instead of a component?") : _ = typeof e, T("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", _, p);
+        var h = V(e);
+        if (!h) {
+          var f = "";
+          (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (f += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
+          var O = Tt(g);
+          O ? f += O : f += tt();
+          var S;
+          e === null ? S = "null" : me(e) ? S = "array" : e !== void 0 && e.$$typeof === o ? (S = "<" + (I(e.type) || "Unknown") + " />", f = " Did you accidentally export a JSX literal instead of a component?") : S = typeof e, _("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", S, f);
         }
-        var k = Tt(e, n, r, g, C);
+        var k = kt(e, n, r, g, C);
         if (k == null)
           return k;
-        if (v) {
-          var W = n.children;
-          if (W !== void 0)
-            if (a)
-              if (O(W)) {
-                for (var le = 0; le < W.length; le++)
-                  it(W[le], e);
-                Object.freeze && Object.freeze(W);
+        if (h) {
+          var $ = n.children;
+          if ($ !== void 0)
+            if (i)
+              if (me($)) {
+                for (var ie = 0; ie < $.length; ie++)
+                  lt($[ie], e);
+                Object.freeze && Object.freeze($);
               } else
-                T("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
+                _("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
             else
-              it(W, e);
+              lt($, e);
         }
         if (z.call(n, "key")) {
-          var X = A(e), D = Object.keys(n).filter(function($t) {
+          var J = I(e), P = Object.keys(n).filter(function($t) {
             return $t !== "key";
-          }), Ve = D.length > 0 ? "{key: someKey, " + D.join(": ..., ") + ": ...}" : "{key: someKey}";
-          if (!at[X + Ve]) {
-            var Ht = D.length > 0 ? "{" + D.join(": ..., ") + ": ...}" : "{}";
-            T(`A props object containing a "key" prop is being spread into JSX:
+          }), Be = P.length > 0 ? "{key: someKey, " + P.join(": ..., ") + ": ...}" : "{key: someKey}";
+          if (!it[J + Be]) {
+            var Ht = P.length > 0 ? "{" + P.join(": ..., ") + ": ...}" : "{}";
+            _(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`, Ve, X, Ht, X), at[X + Ve] = !0;
+  <%s key={someKey} {...props} />`, Be, J, Ht, J), it[J + Be] = !0;
           }
         }
-        return e === d ? Pt(k) : Ot(k), k;
+        return e === d ? Ot(k) : Dt(k), k;
       }
     }
-    function Dt(e, n, r) {
-      return ot(e, n, r, !0);
+    function Pt(e, n, r) {
+      return at(e, n, r, !0);
     }
     function It(e, n, r) {
-      return ot(e, n, r, !1);
+      return at(e, n, r, !1);
     }
-    var Ft = It, At = Dt;
-    ge.Fragment = d, ge.jsx = Ft, ge.jsxs = At;
-  }()), ge;
+    var At = It, Ft = Pt;
+    je.Fragment = d, je.jsx = At, je.jsxs = Ft;
+  }()), je;
 }
-process.env.NODE_ENV === "production" ? Ge.exports = un() : Ge.exports = cn();
-var t = Ge.exports;
-const Ye = 60, ht = 6, dn = (l) => {
+process.env.NODE_ENV === "production" ? Ue.exports = cn() : Ue.exports = dn();
+var t = Ue.exports;
+const Ne = 60, ft = 6, fn = (l) => {
   const {
     activeStepIndex: o,
-    hideIndicators: h = !1,
+    hideIndicators: p = !1,
     steps: d,
-    stepperTheme: w = {
+    stepperTheme: j = {
       light: "eggplant.light",
       base: "eggplant.base"
     }
-  } = l, { activeStep: x, setActiveStep: m } = Wt({
+  } = l, { activeStep: v, setActiveStep: m } = Wt({
     index: o,
     count: d.length
   });
-  return ae(() => {
+  return q(() => {
     m(o);
   }, [o, m]), /* @__PURE__ */ t.jsx(
     E,
     { position: "relative", width: "100%", "data-testid": "stepper", children: /* @__PURE__ */ t.jsx(
-      Bt,
+      Mt,
       {
         role: "progressbar",
-        index: x,
+        index: v,
         width: "100%",
         display: "flex",
         flexWrap: "nowrap",
-        children: d.map((R, u) => {
-          const b = x === u, s = u === 0, f = u === d.length - 1, j = x > u;
-          let c = `${Ye}px`;
-          const S = `calc(100% - ((${Ye * (d.length - 1)}px) - (${d.length - 1} * ${ht * 2}px)))`;
-          return b ? c = S : (s || f) && (c = `${Ye - ht}px`), /* @__PURE__ */ t.jsx(
+        children: d.map((R, c) => {
+          const x = v === c, s = c === 0, b = c === d.length - 1, w = v > c;
+          let u = `${Ne}px`;
+          const L = `calc(100% - ((${Ne * (d.length - 1)}px) - (${d.length - 1} * ${ft * 2}px)))`;
+          return x ? u = L : (s || b) && (u = `${Ne - ft}px`), /* @__PURE__ */ t.jsx(
             E,
             {
-              width: c,
-              opacity: j || b ? 1 : 0.2,
-              paddingRight: f ? "0" : "6px",
+              width: u,
+              opacity: w || x ? 1 : 0.2,
+              paddingRight: b ? "0" : "6px",
               paddingLeft: s ? "0" : "6px",
               transition: "width 0.4s ease-in-out, opacity 0.4s ease-in-out",
               children: /* @__PURE__ */ t.jsx(
                 E,
                 {
-                  paddingTop: h ? 2 : 5,
+                  paddingTop: p ? 2 : 5,
                   position: "relative",
                   width: "100%",
                   children: /* @__PURE__ */ t.jsx(
@@ -694,8 +694,8 @@ const Ye = 60, ht = 6, dn = (l) => {
                       width: "100%",
                       position: "absolute",
                       top: "0",
-                      backgroundColor: j ? w.light : w.base,
-                      height: h ? "4px" : "8px",
+                      backgroundColor: w ? j.light : j.base,
+                      height: p ? "4px" : "8px",
                       borderRadius: "4",
                       left: "0"
                     }
@@ -703,40 +703,40 @@ const Ye = 60, ht = 6, dn = (l) => {
                 }
               )
             },
-            `step-${u}`
+            `step-${c}`
           );
         })
       }
     ) }
   );
-}, En = Ke.memo(dn), Rn = ({
+}, Sn = Ze.memo(fn), kn = ({
   children: l,
   ...o
 }) => /* @__PURE__ */ t.jsx(
   qt,
   { color: "tints.uiGrey", fontSize: ["md", null, null, "lg"], ...o, children: l }
-), Pe = (l, o) => {
-  const h = (l == null ? void 0 : l.startsWith("http")) || (l == null ? void 0 : l.startsWith("mailto"));
-  return o && !h ? {
+), Oe = (l, o) => {
+  const p = (l == null ? void 0 : l.startsWith("http")) || (l == null ? void 0 : l.startsWith("mailto"));
+  return o && !p ? {
     to: l
   } : {
     href: l
   };
-}, ze = bt(
+}, Ye = gt(
   (l, o) => {
     const {
-      label: h,
+      label: p,
       additionalContent: d,
-      mainTextFontSize: w,
-      linkComponent: x,
+      mainTextFontSize: j,
+      linkComponent: v,
       href: m,
       ...R
-    } = l, u = x || G, b = Pe(m, !!x);
+    } = l, c = v || G, x = Oe(m, !!v);
     return /* @__PURE__ */ t.jsxs(
       E,
       {
         ref: o,
-        as: u,
+        as: c,
         display: "flex",
         alignItems: "center",
         gap: [null, null, null, 1],
@@ -748,14 +748,14 @@ const Ye = 60, ht = 6, dn = (l) => {
         borderColor: ["tints.cream", null, null, "unset"],
         width: ["100%", null, null, "fit-content"],
         cursor: "pointer",
-        ...b,
+        ...x,
         ...R,
         children: [
           /* @__PURE__ */ t.jsx(
-            ie,
+            ae,
             {
               display: ["none", null, null, "block"],
-              as: ut,
+              as: st,
               fontSize: "lg",
               color: "viridian.light",
               role: "img",
@@ -764,14 +764,14 @@ const Ye = 60, ht = 6, dn = (l) => {
             }
           ),
           /* @__PURE__ */ t.jsxs(
-            L,
+            T,
             { alignItems: "center", gap: "1", width: ["100%", null, null, "auto"], children: [
               /* @__PURE__ */ t.jsx(
                 Z,
                 {
-                  fontSize: [w || "xl", null, null, "lg"],
+                  fontSize: [j || "xl", null, null, "lg"],
                   fontWeight: "medium",
-                  children: h
+                  children: p
                 }
               ),
               d && (typeof d == "string" ? /* @__PURE__ */ t.jsx(
@@ -789,10 +789,10 @@ const Ye = 60, ht = 6, dn = (l) => {
                 }
               ) : d),
               /* @__PURE__ */ t.jsx(
-                ie,
+                ae,
                 {
                   display: ["block", null, null, "none"],
-                  as: ut,
+                  as: st,
                   fontSize: "2xl",
                   color: "tints.uiGrey",
                   role: "img",
@@ -806,15 +806,15 @@ const Ye = 60, ht = 6, dn = (l) => {
       }
     );
   }
-), Oe = bt(
+), De = gt(
   (l, o) => {
-    const { children: h, isSelected: d, ...w } = l, x = l.backgroundColor || (d ? "tints.lightCream" : "transparent");
+    const { children: p, isSelected: d, ...j } = l, v = l.backgroundColor || (d ? "tints.lightCream" : "transparent");
     return /* @__PURE__ */ t.jsx(
-      gt,
+      vt,
       {
         ref: o,
         borderRadius: "full",
-        backgroundColor: x,
+        backgroundColor: v,
         fontSize: "lg !important",
         fontWeight: "normal",
         color: "tints.black",
@@ -827,41 +827,41 @@ const Ye = 60, ht = 6, dn = (l) => {
           left: [null, null, null, -2]
         },
         _hover: {
-          backgroundColor: x,
+          backgroundColor: v,
           textDecoration: "none",
           filter: "brightness(0.95)"
         },
-        ...w,
-        children: h
+        ...j,
+        children: p
       }
     );
   }
-), fn = ({
+), pn = ({
   title: l,
   description: o,
-  imageSrc: h,
+  imageSrc: p,
   imageElement: d,
-  button: w,
-  backgroundColor: x = "viridian.wash",
+  button: j,
+  backgroundColor: v = "viridian.wash",
   onClick: m,
   href: R,
-  linkComponent: u
+  linkComponent: c
 }) => {
-  const b = "80px", s = "200px", f = "272px", j = u || G, c = Pe(R, !!u), S = mt({
+  const x = "80px", s = "200px", b = "272px", w = c || G, u = Oe(R, !!c), L = mt({
     base: !1,
     tablet: !1,
     largeTablet: !1,
     desktop: !0
   });
   return /* @__PURE__ */ t.jsxs(
-    L,
+    T,
     {
       direction: ["row", null, null, "column"],
       alignItems: ["center"],
       borderRadius: "xl",
       overflow: "hidden",
-      height: [b, null, null, f],
-      backgroundColor: x,
+      height: [x, null, null, b],
+      backgroundColor: v,
       onClick: m,
       "data-testid": "spotlight-card",
       position: "relative",
@@ -875,8 +875,8 @@ const Ye = 60, ht = 6, dn = (l) => {
         border: "1px solid",
         borderColor: "tints.white"
       },
-      as: S ? L : j,
-      ...S ? {} : c,
+      as: L ? T : w,
+      ...L ? {} : u,
       children: [
         /* @__PURE__ */ t.jsx(
           E,
@@ -884,12 +884,12 @@ const Ye = 60, ht = 6, dn = (l) => {
             width: ["72px", null, null, "100%"],
             height: ["100%"],
             flex: [null, null, null, "1"],
-            children: h ? /* @__PURE__ */ t.jsx(
-              Mt,
+            children: p ? /* @__PURE__ */ t.jsx(
+              Bt,
               {
-                src: h,
+                src: p,
                 objectFit: "cover",
-                height: [b, null, null, s],
+                height: [x, null, null, s],
                 width: "100%",
                 alt: "",
                 "data-testid": "spotlight-card-image"
@@ -897,7 +897,7 @@ const Ye = 60, ht = 6, dn = (l) => {
             ) : /* @__PURE__ */ t.jsx(
               E,
               {
-                height: [b, null, null, s],
+                height: [x, null, null, s],
                 overflow: "hidden",
                 children: d
               }
@@ -905,7 +905,7 @@ const Ye = 60, ht = 6, dn = (l) => {
           }
         ),
         /* @__PURE__ */ t.jsxs(
-          L,
+          T,
           {
             direction: ["column", null, null, "row"],
             justifyContent: [null, null, null, "space-between"],
@@ -915,7 +915,7 @@ const Ye = 60, ht = 6, dn = (l) => {
             width: "100%",
             position: [null, null, null, "absolute"],
             bottom: [null, null, null, "0"],
-            backgroundColor: [null, null, null, `${x}CC`],
+            backgroundColor: [null, null, null, `${v}CC`],
             backdropFilter: [null, null, null, "blur(8px)"],
             children: [
               /* @__PURE__ */ t.jsxs(
@@ -931,7 +931,7 @@ const Ye = 60, ht = 6, dn = (l) => {
                   )
                 ] }
               ),
-              S ? /* @__PURE__ */ t.jsx(E, { children: w }) : null
+              L ? /* @__PURE__ */ t.jsx(E, { children: j }) : null
             ]
           }
         )
@@ -959,7 +959,7 @@ const Ye = 60, ht = 6, dn = (l) => {
     },
     ...l
   }
-), pn = () => /* @__PURE__ */ t.jsx(
+), hn = () => /* @__PURE__ */ t.jsx(
   "svg",
   {
     width: "116",
@@ -983,73 +983,65 @@ const Ye = 60, ht = 6, dn = (l) => {
       ) }
     )
   }
-), hn = ({
+), vn = ({
   desktopTopButtons: l,
   kitRegistrationElement: o,
-  profileElement: h,
+  profileElement: p,
   cartElement: d,
-  onSearchClick: w,
-  onMenuClick: x,
+  onSearchClick: j,
+  onMenuClick: v,
   hasSearch: m = !1,
   logoLink: R = "https://www.everlywell.com",
-  onHeightChange: u,
-  linkComponent: b,
+  setTopOffset: c,
+  linkComponent: x,
   onLogoClick: s
 }) => {
-  const f = Jt(null), [j, c] = V(0), S = 100, I = Xe(() => {
-    if (f.current && u) {
-      const $ = Date.now();
-      if ($ - j > S) {
-        const F = f.current.getBoundingClientRect().height;
-        u(F), c($);
-      }
+  const b = Jt(null), w = xt(() => {
+    if (b.current) {
+      const u = b.current.getBoundingClientRect();
+      c(u.bottom);
     }
-  }, [u, j]);
-  return ae(() => {
-    I();
-    const $ = new ResizeObserver(() => {
-      I();
-    });
-    return f.current && $.observe(f.current), () => {
-      $.disconnect();
-    };
-  }, [I]), /* @__PURE__ */ t.jsx(
+  }, []);
+  return q(() => {
+    w();
+  }, [w]), /* @__PURE__ */ t.jsx(
     E,
     {
-      ref: f,
+      ref: b,
       paddingY: "4",
       paddingX: [4, null, null, 12],
       borderBottom: "1px solid",
       borderColor: "tints.lightCream",
       backgroundColor: "tints.white",
-      position: "fixed",
+      position: "sticky",
+      top: "0",
       width: "100%",
       zIndex: ["sticky", null, null, "tooltip"],
-      id: "main-app-nav",
+      onMouseEnter: w,
       children: /* @__PURE__ */ t.jsxs(
-        L,
+        T,
         { justifyContent: "space-between", alignItems: "center", children: [
           /* @__PURE__ */ t.jsxs(
-            L,
+            T,
             { alignItems: "center", gap: "5", children: [
               /* @__PURE__ */ t.jsx(
                 E,
                 {
                   "aria-label": "Go to homepage",
                   onClick: s,
-                  as: b || G,
-                  ...Pe(R, !!b),
-                  children: /* @__PURE__ */ t.jsx(pn, {})
+                  as: x || G,
+                  ...Oe(R, !!x),
+                  children: /* @__PURE__ */ t.jsx(hn, {})
                 }
               ),
               /* @__PURE__ */ t.jsx(
-                L,
+                T,
                 { display: ["none", null, null, "flex"], children: l }
               )
             ] }
           ),
           /* @__PURE__ */ t.jsxs(
-            L,
+            T,
             { alignItems: "center", gap: "2", children: [
               /* @__PURE__ */ t.jsx(
                 E,
@@ -1059,8 +1051,8 @@ const Ye = 60, ht = 6, dn = (l) => {
                 oe,
                 {
                   "aria-label": "Search",
-                  icon: /* @__PURE__ */ t.jsx(ie, { as: Ct }),
-                  onClick: w
+                  icon: /* @__PURE__ */ t.jsx(ae, { as: bt }),
+                  onClick: j
                 }
               ) : null,
               d,
@@ -1072,18 +1064,18 @@ const Ye = 60, ht = 6, dn = (l) => {
                     icon: /* @__PURE__ */ t.jsx(rn, {}),
                     "aria-label": "menu",
                     "data-testid": "menu-button",
-                    onClick: x
+                    onClick: v
                   }
                 ) }
               ),
-              /* @__PURE__ */ t.jsx(E, { display: ["none", null, null, "block"], children: h })
+              /* @__PURE__ */ t.jsx(E, { display: ["none", null, null, "block"], children: p })
             ] }
           )
         ] }
       )
     }
   );
-}, vn = ({
+}, gn = ({
   count: l = 0,
   ...o
 }) => /* @__PURE__ */ t.jsxs(
@@ -1112,387 +1104,417 @@ const Ye = 60, ht = 6, dn = (l) => {
       }
     )
   ] }
-), _n = ({
-  numLinks: l = 5,
-  showPromoButton: o = !0
+), Tn = ({
+  numDesktopLinks: l = 5,
+  showPromoButton: o = !1
 }) => /* @__PURE__ */ t.jsx(
   Nt,
   { spacing: 0, align: "stretch", children: /* @__PURE__ */ t.jsx(
     E,
-    { paddingY: 4, paddingX: 6, borderBottomWidth: "1px", children: /* @__PURE__ */ t.jsxs(
-      L,
-      { justify: "space-between", align: "center", children: [
-        /* @__PURE__ */ t.jsx(Ne, { w: "120px", h: "48px" }),
-        /* @__PURE__ */ t.jsxs(
-          st,
-          { spacing: 8, marginLeft: 12, children: [
-            Array.from({ length: l }).map(
-              (h, d) => /* @__PURE__ */ t.jsx(Ne, { width: "90px", height: "48px" }, d)
-            ),
-            o && /* @__PURE__ */ t.jsx(Ne, { width: "110px", height: "48px", borderRadius: "full" })
-          ] }
-        ),
-        /* @__PURE__ */ t.jsxs(
-          st,
-          { spacing: 4, ml: "auto", children: [
-            /* @__PURE__ */ t.jsx(Le, { width: "120px", height: "48px" }),
-            " ",
-            /* @__PURE__ */ t.jsx(Le, { width: "48px", height: "48px" }),
-            " ",
-            /* @__PURE__ */ t.jsx(Le, { width: "48px", height: "48px" }),
-            " ",
-            /* @__PURE__ */ t.jsx(Le, { width: "48px", height: "48px" }),
-            " "
-          ] }
-        )
-      ] }
-    ) }
+    {
+      paddingY: 4,
+      paddingX: 6,
+      borderBottomWidth: "1px",
+      borderColor: "tints.lightCream",
+      children: /* @__PURE__ */ t.jsxs(
+        T,
+        { justify: "space-between", align: "center", children: [
+          /* @__PURE__ */ t.jsx(Ve, { w: "120px", h: "48px" }),
+          /* @__PURE__ */ t.jsxs(
+            ot,
+            {
+              spacing: 8,
+              marginLeft: 12,
+              display: ["none", null, null, "flex"],
+              "data-testid": "desktop-nav",
+              children: [
+                Array.from({ length: l }).map(
+                  (p, d) => /* @__PURE__ */ t.jsx(Ve, { width: "90px", height: "48px" }, d)
+                ),
+                o && /* @__PURE__ */ t.jsx(Ve, { width: "110px", height: "48px", borderRadius: "full" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ t.jsxs(
+            ot,
+            { spacing: 4, ml: "auto", children: [
+              /* @__PURE__ */ t.jsx(
+                Le,
+                {
+                  width: "120px",
+                  height: "48px",
+                  display: ["none", null, null, "block"],
+                  "data-testid": "register-kit"
+                }
+              ),
+              " ",
+              /* @__PURE__ */ t.jsx(Le, { width: "48px", height: "48px" }),
+              " ",
+              /* @__PURE__ */ t.jsx(Le, { width: "48px", height: "48px" }),
+              " ",
+              /* @__PURE__ */ t.jsx(Le, { width: "48px", height: "48px" }),
+              " "
+            ] }
+          )
+        ] }
+      )
+    }
   ) }
 ), xn = (l, o) => {
-  let h;
+  let p;
   return (...d) => {
-    h && clearTimeout(h), h = setTimeout(() => {
+    p && clearTimeout(p), p = setTimeout(() => {
       l(...d);
     }, o);
   };
-}, Ze = "nav-drawer-hover", vt = (l) => {
+}, Ge = "nav-drawer-hover", pt = (l) => {
   window.dispatchEvent(
-    new CustomEvent(Ze, {
+    new CustomEvent(Ge, {
       detail: { isHovering: l },
       bubbles: !0,
       cancelable: !0
     })
   );
-}, gn = (l = !1, o = !1, h = !1) => l || !o ? "column" : h ? "row" : "row-reverse", Ue = ({
+}, mn = (l = !1, o = !1, p = !1) => l || !o ? "column" : p ? "row" : "row-reverse", bn = Ke(Yt), Cn = Ke(zt), ze = ({
   isOpen: l = !1,
   onClose: o,
-  title: h,
+  title: p,
   navDrawerLinks: d,
-  bottomNavButtons: w,
-  spotlightCards: x,
+  bottomNavButtons: j,
+  spotlightCards: v,
   bottomButton: m,
   hasBackButton: R = !0,
-  onBackClick: u,
-  hasOnlySpotlightCards: b = !1,
-  navHeight: s,
-  hasSearch: f = !1,
-  onSearch: j = () => ({})
+  onBackClick: c,
+  hasOnlySpotlightCards: x = !1,
+  hasSearch: s = !1,
+  onSearch: b = () => ({}),
+  topOffset: w
 }) => {
-  const c = mt({
+  const u = mt({
     base: !1,
     tablet: !1,
     largeTablet: !1,
     desktop: !0
-  }), S = c ? "top" : "left", [I, $] = V(0), F = () => {
-    $((B) => B + 1);
-  }, T = Xe(
-    xn((B) => {
-      j(B), F();
+  }), L = u ? "top" : "left", [M, Q] = W(0), [F, _] = W(!1), se = () => {
+    Q((H) => H + 1);
+  }, ue = xt(
+    xn((H) => {
+      b(H), se();
     }, 100),
     []
   );
-  return /* @__PURE__ */ t.jsxs(
-    Yt,
+  q(() => {
+    l && _(!0);
+  }, [l]);
+  const ce = () => {
+    l || (_(!1), o());
+  };
+  return /* @__PURE__ */ t.jsx(
+    Ut,
     {
-      isOpen: l,
-      onClose: o,
-      placement: S,
+      isOpen: F || l,
+      onClose: () => {
+        F && u || o();
+      },
+      placement: L,
       blockScrollOnMount: !1,
       autoFocus: !1,
-      children: [
-        /* @__PURE__ */ t.jsx(
-          zt,
-          {
-            backgroundColor: "tints.black",
-            top: ["0", null, null, s ? `${s}px` : null],
-            opacity: c ? void 0 : "0.4 !important",
-            motionProps: c ? {
-              initial: { opacity: 0 },
-              animate: { opacity: 0.4 },
-              exit: { opacity: 0 },
-              transition: {
-                duration: 0.4,
-                delay: 0.2,
-                ease: "easeOut"
+      children: /* @__PURE__ */ t.jsx(
+        un,
+        { children: l ? /* @__PURE__ */ t.jsxs(
+          t.Fragment,
+          { children: [
+            /* @__PURE__ */ t.jsx(
+              Cn,
+              {
+                backgroundColor: "tints.black",
+                top: ["0", null, null, `${w}px`],
+                opacity: u ? void 0 : "0.4 !important",
+                ...u ? {
+                  initial: { opacity: 0 },
+                  animate: { opacity: 0.4 },
+                  exit: { opacity: 0 },
+                  transition: {
+                    duration: 0.2,
+                    delay: 0.3,
+                    ease: "easeOut"
+                  }
+                } : {}
               }
-            } : {}
-          }
-        ),
-        /* @__PURE__ */ t.jsxs(
-          Ut,
-          {
-            onClick: (B) => {
-              const J = B.target.closest("a");
-              J && J.href === window.location.href && o();
-            },
-            onMouseEnter: () => {
-              !f && c && vt(!0);
-            },
-            onMouseLeave: () => {
-              !f && c && vt(!1);
-            },
-            paddingTop: [4, null, null, s ? `${s + 24}px` : null],
-            paddingX: [4, null, null, 12],
-            paddingBottom: "24",
-            overflow: "auto",
-            maxHeight: "100vh",
-            position: "relative",
-            className: "navbar-drawer-content-container",
-            children: [
-              !f && c ? null : /* @__PURE__ */ t.jsxs(
-                Gt,
-                {
-                  padding: "0",
-                  flexDirection: f ? "column" : "row",
-                  gap: f ? "4" : "0",
-                  children: [
-                    c ? null : /* @__PURE__ */ t.jsxs(
-                      L,
-                      {
-                        width: "100%",
-                        justifyContent: "space-between",
-                        alignItems: "center",
-                        children: [
-                          R ? /* @__PURE__ */ t.jsx(
-                            oe,
-                            {
-                              icon: /* @__PURE__ */ t.jsx(an, {}),
-                              onClick: () => {
-                                u && u(), o();
-                              },
-                              "aria-label": "Back"
-                            }
-                          ) : null,
-                          /* @__PURE__ */ t.jsx(
-                            Z,
-                            { color: "tints.uiGrey", fontSize: ["xl", null, null, "lg"], children: h }
-                          ),
-                          /* @__PURE__ */ t.jsx(
-                            oe,
-                            {
-                              icon: /* @__PURE__ */ t.jsx(on, {}),
-                              onClick: o,
-                              "aria-label": "Close"
-                            }
-                          )
-                        ]
-                      }
-                    ),
-                    f && /* @__PURE__ */ t.jsxs(
-                      Qt,
-                      { width: "100%", children: [
-                        /* @__PURE__ */ t.jsx(
-                          en,
+            ),
+            /* @__PURE__ */ t.jsxs(
+              bn,
+              {
+                onClick: (H) => {
+                  const B = H.target.closest("a");
+                  B && B.href === window.location.href && o();
+                },
+                onMouseEnter: () => {
+                  u && pt(!0);
+                },
+                onMouseLeave: () => {
+                  u && pt(!1);
+                },
+                paddingTop: "4",
+                paddingX: [4, null, null, 12],
+                paddingBottom: "24",
+                overflow: ["auto", null, null, "hidden"],
+                maxHeight: "100vh",
+                position: "relative",
+                top: u ? `${w}px !important` : void 0,
+                onAnimationComplete: ce,
+                ...u ? {
+                  initial: { height: 0, opacity: 0 },
+                  animate: { height: "auto", opacity: 1 },
+                  exit: { height: 0, opacity: 0 },
+                  transition: { duration: 0.3 }
+                } : {},
+                children: [
+                  !s && u ? null : /* @__PURE__ */ t.jsxs(
+                    Gt,
+                    {
+                      padding: "0",
+                      flexDirection: s ? "column" : "row",
+                      gap: s ? "4" : "0",
+                      children: [
+                        u ? null : /* @__PURE__ */ t.jsxs(
+                          T,
                           {
-                            onChange: (B) => {
-                              T(B.target.value);
-                            },
-                            placeholder: "Search",
-                            autoFocus: !0,
-                            width: "full",
-                            type: "search"
+                            width: "100%",
+                            justifyContent: "space-between",
+                            alignItems: "center",
+                            children: [
+                              R ? /* @__PURE__ */ t.jsx(
+                                oe,
+                                {
+                                  icon: /* @__PURE__ */ t.jsx(an, {}),
+                                  onClick: () => {
+                                    c && c(), o();
+                                  },
+                                  "aria-label": "Back"
+                                }
+                              ) : null,
+                              /* @__PURE__ */ t.jsx(
+                                Z,
+                                {
+                                  color: "tints.uiGrey",
+                                  fontSize: ["xl", null, null, "lg"],
+                                  children: p
+                                }
+                              ),
+                              /* @__PURE__ */ t.jsx(
+                                oe,
+                                {
+                                  icon: /* @__PURE__ */ t.jsx(on, {}),
+                                  onClick: o,
+                                  "aria-label": "Close"
+                                }
+                              )
+                            ]
                           }
                         ),
-                        /* @__PURE__ */ t.jsx(
-                          tn,
-                          { pointerEvents: "none", children: /* @__PURE__ */ t.jsx(nn, { as: Ct, color: "gray.500" }) }
+                        s && /* @__PURE__ */ t.jsxs(
+                          Qt,
+                          { width: "100%", children: [
+                            /* @__PURE__ */ t.jsx(
+                              en,
+                              {
+                                onChange: (H) => {
+                                  ue(H.target.value);
+                                },
+                                placeholder: "Search",
+                                autoFocus: !0,
+                                width: "full",
+                                type: "search"
+                              }
+                            ),
+                            /* @__PURE__ */ t.jsx(
+                              tn,
+                              { pointerEvents: "none", children: /* @__PURE__ */ t.jsx(nn, { as: bt, color: "gray.500" }) }
+                            )
+                          ] }
                         )
-                      ] }
-                    )
-                  ]
-                }
-              ),
-              /* @__PURE__ */ t.jsx(
-                Zt,
-                {
-                  paddingX: "0",
-                  paddingBottom: [6, null, null, 4],
-                  "data-testid": `navbar-drawer-body-${h.toLowerCase()}`,
-                  children: /* @__PURE__ */ t.jsx(
-                    dt.div,
-                    { ...c ? {
-                      initial: { opacity: 0, y: 0 },
-                      animate: { opacity: 1, y: 0 },
-                      exit: { opacity: 0, y: 0 },
-                      transition: {
-                        duration: 0.3,
-                        ease: [0.4, 0, 0.2, 1],
-                        exit: {
-                          duration: 0.3,
-                          ease: [0.4, 0, 0.2, 1]
-                        }
-                      }
-                    } : {}, children: /* @__PURE__ */ t.jsxs(
-                      dt.div,
-                      {
-                        ...c ? {
-                          initial: { opacity: 0, y: -5 },
-                          animate: { opacity: 1, y: 0 },
-                          exit: { opacity: 0, y: -5 },
-                          transition: {
-                            duration: 0.5,
-                            delay: 0.2,
-                            ease: [0.4, 0, 0.2, 1],
-                            exit: {
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ t.jsx(
+                    Zt,
+                    {
+                      paddingX: "0",
+                      paddingBottom: [6, null, null, 4],
+                      "data-testid": `navbar-drawer-body-${p.toLowerCase()}`,
+                      children: /* @__PURE__ */ t.jsxs(
+                        Ke.div,
+                        {
+                          ...u ? {
+                            initial: { opacity: 0, y: -5 },
+                            animate: { opacity: 1, y: 0 },
+                            exit: { opacity: 0, y: -5 },
+                            transition: {
                               duration: 0.5,
                               delay: 0.2,
-                              ease: [0.4, 0, 0.2, 1]
+                              ease: [0.4, 0, 0.2, 1],
+                              exit: {
+                                duration: 0.5,
+                                delay: 0.2,
+                                ease: [0.4, 0, 0.2, 1]
+                              }
                             }
-                          }
-                        } : {},
-                        style: {
-                          display: "flex",
-                          flexDirection: gn(
-                            b,
-                            c,
-                            f
-                          ),
-                          gap: "24px",
-                          justifyContent: "space-between"
-                        },
-                        children: [
-                          x ? /* @__PURE__ */ t.jsx(
-                            E,
-                            {
-                              gap: "6",
-                              display: "flex",
-                              justifyContent: [null, null, null, "center"],
-                              sx: {
-                                "& > *": {
-                                  width: ["100%", null, null, "365px", "432px"]
+                          } : {},
+                          style: {
+                            display: "flex",
+                            flexDirection: mn(
+                              x,
+                              u,
+                              s
+                            ),
+                            gap: "24px",
+                            justifyContent: "space-between"
+                          },
+                          children: [
+                            v ? /* @__PURE__ */ t.jsx(
+                              E,
+                              {
+                                gap: "6",
+                                display: "flex",
+                                justifyContent: [null, null, null, "center"],
+                                sx: {
+                                  "& > *": {
+                                    width: ["100%", null, null, "365px", "432px"]
+                                  },
+                                  flexWrap: "wrap",
+                                  flexDirection: ["column", null, null, "row"]
                                 },
-                                flexWrap: "wrap",
-                                flexDirection: ["column", null, null, "row"]
-                              },
-                              children: x
-                            }
-                          ) : null,
-                          /* @__PURE__ */ t.jsxs(
-                            L,
-                            {
-                              position: [null, null, null, "relative"],
-                              flexDirection: "column",
-                              gap: "6",
-                              width: ["100%", null, null, f ? null : "auto"],
-                              children: [
-                                d ? /* @__PURE__ */ t.jsx(E, { children: d }) : null,
-                                w && !c ? /* @__PURE__ */ t.jsx(E, { children: w }) : null,
-                                m ? /* @__PURE__ */ t.jsx(
-                                  E,
-                                  {
-                                    width: ["100%"],
-                                    position: [null, null, null, "absolute"],
-                                    bottom: [null, null, null, 0],
-                                    children: m
-                                  }
-                                ) : null
-                              ]
-                            }
-                          )
-                        ]
-                      },
-                      I
-                    ) }
+                                children: v
+                              }
+                            ) : null,
+                            /* @__PURE__ */ t.jsxs(
+                              T,
+                              {
+                                position: [null, null, null, "relative"],
+                                flexDirection: "column",
+                                gap: "6",
+                                width: ["100%", null, null, s ? null : "auto"],
+                                children: [
+                                  d ? /* @__PURE__ */ t.jsx(E, { children: d }) : null,
+                                  j && !u ? /* @__PURE__ */ t.jsx(E, { children: j }) : null,
+                                  m ? /* @__PURE__ */ t.jsx(
+                                    E,
+                                    {
+                                      width: ["100%"],
+                                      position: [null, null, null, "absolute"],
+                                      bottom: [null, null, null, 0],
+                                      children: m
+                                    }
+                                  ) : null
+                                ]
+                              }
+                            )
+                          ]
+                        },
+                        M
+                      )
+                    }
                   )
-                }
-              )
-            ]
-          }
-        )
-      ]
+                ]
+              }
+            )
+          ] }
+        ) : null }
+      )
     }
   );
-}, bn = ({
+}, ht = (l) => {
+  const o = /* @__PURE__ */ new Set();
+  return l.reduce((p, d) => {
+    var v;
+    const j = ((v = d.sections) == null ? void 0 : v.reduce((m, R) => {
+      const c = R.links.filter((x) => o.has(x.label) || x.isSearchable !== !0 ? !1 : (o.add(x.label), !0));
+      return [...m, ...c];
+    }, [])) ?? [];
+    return [...p, ...j];
+  }, []);
+}, jn = ({
   source: l,
   onSearchCallback: o,
-  isActive: h
+  isActive: p
 }) => {
-  const [d, w] = V(""), [x, m] = V([]), R = (s, f) => {
+  const [d, j] = W(""), [v, m] = W([]), R = (s, b) => {
     if (!s)
       return [];
-    const j = s.toLowerCase();
-    return f.filter((c) => {
-      const S = c.label.toLowerCase().includes(j), I = typeof c.additionalContent == "string" && c.additionalContent.toLowerCase().includes(j);
-      return S || I;
-    }).sort((c, S) => c.label.localeCompare(S.label));
-  }, u = (s) => {
-    if (w(s), !s) {
+    const w = s.toLowerCase();
+    return b.filter((u) => {
+      const L = u.label.toLowerCase().includes(w), M = typeof u.additionalContent == "string" && u.additionalContent.toLowerCase().includes(w);
+      return L || M;
+    }).sort((u, L) => u.label.localeCompare(L.label));
+  }, c = (s) => {
+    if (j(s), !s) {
       m([]);
       return;
     }
-    const f = R(s, l);
-    m(f), o && o(s, f);
-  }, b = () => {
-    w(""), m([]);
+    const b = R(s, l);
+    m(b), o && o(s, b);
+  }, x = () => {
+    j(""), m([]);
   };
-  return ae(() => {
-    h || (w(""), m([]));
-  }, [h]), {
+  return q(() => {
+    p || (j(""), m([]));
+  }, [p]), {
     query: d,
-    results: x,
-    handleClose: b,
-    handleSearch: u
+    results: v,
+    handleClose: x,
+    handleSearch: c
   };
-}, xt = (l) => {
-  const o = /* @__PURE__ */ new Set();
-  return l.reduce((h, d) => {
-    var x;
-    const w = ((x = d.sections) == null ? void 0 : x.reduce((m, R) => {
-      const u = R.links.filter((b) => o.has(b.label) || b.isSearchable !== !0 ? !1 : (o.add(b.label), !0));
-      return [...m, ...u];
-    }, [])) ?? [];
-    return [...h, ...w];
-  }, []);
-}, Sn = ({
+}, Ln = ({
   categories: l = [],
   onCartClick: o,
-  mainCategoryLabel: h = "Menu",
+  mainCategoryLabel: p = "Menu",
   logoLink: d = "https://www.everlywell.com",
-  hasSearch: w = !0,
-  onSearchClick: x,
+  hasSearch: j = !0,
+  onSearchClick: v,
   registrationUrl: m,
   profileUrl: R = "https://secure.everlywell.com/login",
-  mobileBottomButtons: u = [],
-  numberOfCartItems: b = 0,
+  mobileBottomButtons: c = [],
+  numberOfCartItems: x = 0,
   linkComponent: s,
-  onSearchCallback: f,
-  onLinkClick: j,
-  onCategoryOpen: c,
-  onMobileMenuOpen: S,
-  onBackToMainMenu: I,
-  onRegisterKitClick: $,
+  onSearchCallback: b,
+  onLinkClick: w,
+  onCategoryOpen: u,
+  onMobileMenuOpen: L,
+  onBackToMainMenu: M,
+  onRegisterKitClick: Q,
   onProfileClick: F,
-  onLogoClick: T,
-  shopAllProductsUrl: B,
-  onShopAllProductsClick: be
+  onLogoClick: _,
+  shopAllProductsUrl: se,
+  onShopAllProductsClick: ue
 }) => {
-  var z, pe, he;
-  const [J, me] = V(!1), [Ce, q] = V(!1), [y, N] = V(null), [se, we] = V(0), [A, M] = V(!1), [Y, je] = V(!1), {
-    query: ye,
-    results: Q,
-    handleSearch: Ee
-  } = bn({
-    source: xt(l),
-    onSearchCallback: f,
-    isActive: Ce
-  }), ue = Q.length > 0, Re = s || G, _e = Pe(B, !!s), Se = ye && /* @__PURE__ */ t.jsxs(
-    L,
-    { gap: ue ? "6" : 0, direction: "column", children: [
-      ue ? /* @__PURE__ */ t.jsx(Z, { color: "tints.uiGrey", children: `${Q.length} Results` }) : /* @__PURE__ */ t.jsxs(
-        L,
+  var K, z, xe;
+  const [ce, H] = W(!1), [ee, B] = W(!1), [y, V] = W(null), [we, de] = W(!1), [I, N] = W(!1), [Y, ye] = W(0), {
+    query: Ee,
+    results: te,
+    handleSearch: Re
+  } = jn({
+    source: ht(l),
+    onSearchCallback: b,
+    isActive: ee
+  }), fe = te.length > 0, _e = s || G, Se = Oe(se, !!s), ke = Ee && /* @__PURE__ */ t.jsxs(
+    T,
+    { gap: fe ? "6" : 0, direction: "column", children: [
+      fe ? /* @__PURE__ */ t.jsx(Z, { color: "tints.uiGrey", children: `${te.length} Results` }) : /* @__PURE__ */ t.jsxs(
+        T,
         { direction: "column", gap: "6", alignItems: "flex-start", children: [
           /* @__PURE__ */ t.jsx(
             Z,
             { color: "tints.uiGrey", children: "We didn't find what you were looking for." }
           ),
           /* @__PURE__ */ t.jsx(
-            gt,
+            vt,
             {
-              as: Re,
-              onClick: be,
+              as: _e,
+              onClick: ue,
               _hover: { textDecoration: "none" },
               width: ["100%", null, null, "auto"],
-              ..._e,
+              ...Se,
               children: "Shop all products"
             }
           )
@@ -1500,105 +1522,103 @@ const Ye = 60, ht = 6, dn = (l) => {
       ),
       /* @__PURE__ */ t.jsx(
         Kt,
-        { columns: [1, 1, 1, 4], children: Q.map(
-          (i, H) => /* @__PURE__ */ t.jsx(
+        { columns: [1, 1, 1, 4], children: te.map(
+          (a, D) => /* @__PURE__ */ t.jsx(
             Xt,
             { children: /* @__PURE__ */ t.jsx(
-              ze,
+              Ye,
               {
-                href: i.href,
-                label: i.label,
-                additionalContent: i == null ? void 0 : i.additionalContent,
+                href: a.href,
+                label: a.label,
+                additionalContent: a == null ? void 0 : a.additionalContent,
                 linkComponent: s
               }
             ) },
-            `${i.label}-${H}`
+            `${a.label}-${D}`
           )
         ) }
       )
     ] }
-  ), De = Xe((i) => {
-    we(i);
-  }, []), Te = () => {
-    me(!1), N(null);
-  }, ce = (i) => {
-    N(i);
-  }, de = (i) => {
-    M(!0), q(!1), (i.sections || i.spotlightCards) && N(i);
-  }, ee = () => {
-    M(!1);
+  ), pe = () => {
+    H(!1), V(null);
+  }, Pe = (a) => {
+    V(a);
+  }, he = (a) => {
+    de(!0), B(!1), (a.sections || a.spotlightCards) && V(a);
+  }, ve = () => {
+    de(!1);
   };
-  ae(() => {
-    const i = (H) => {
-      je(H.detail.isHovering);
+  q(() => {
+    const a = (D) => {
+      N(D.detail.isHovering);
     };
     return window.addEventListener(
-      Ze,
-      i
+      Ge,
+      a
     ), () => {
       window.removeEventListener(
-        Ze,
-        i
+        Ge,
+        a
       );
     };
-  }, []), ae(() => {
-    !A && !Y && (N(null), q(!1));
-  }, [A, Y]), ae(() => {
-    let i = window.location.href;
-    const H = () => {
-      const O = window.location.href;
-      O !== i && (i = O, Te(), N(null));
-    }, U = setInterval(H, 100);
-    return window.addEventListener("popstate", H), () => {
-      window.removeEventListener("popstate", H), clearInterval(U);
+  }, []), q(() => {
+    !we && !I && (V(null), B(!1));
+  }, [we, I]), q(() => {
+    let a = window.location.href;
+    const D = () => {
+      const A = window.location.href;
+      A !== a && (a = A, pe(), V(null));
+    }, U = setInterval(D, 100);
+    return window.addEventListener("popstate", D), () => {
+      window.removeEventListener("popstate", D), clearInterval(U);
     };
   }, []);
-  const fe = () => {
-    N(null), I == null || I();
-  }, te = /* @__PURE__ */ t.jsx(
+  const ne = () => {
+    V(null), M == null || M();
+  }, ge = /* @__PURE__ */ t.jsx(
     t.Fragment,
     { children: l == null ? void 0 : l.map(
-      (i, H) => /* @__PURE__ */ t.jsx(
-        Oe,
+      (a, D) => /* @__PURE__ */ t.jsx(
+        De,
         {
           onMouseEnter: () => {
-            de(i), c == null || c(i.label);
+            he(a), u == null || u(a.label);
           },
-          onMouseLeave: ee,
-          isSelected: (y == null ? void 0 : y.label) === i.label,
-          ...i.buttonProps,
-          children: i.label
+          onMouseLeave: ve,
+          isSelected: (y == null ? void 0 : y.label) === a.label,
+          ...a.buttonProps,
+          children: a.label
         },
-        `${i.label}-${H}`
+        `${a.label}-${D}`
       )
     ) }
-  ), Ie = (z = l.filter((i) => i.isMobileTopLink !== !1)) == null ? void 0 : z.map(
-    (i) => /* @__PURE__ */ t.jsx(
+  ), re = (K = l.filter((a) => a.isMobileTopLink !== !1)) == null ? void 0 : K.map(
+    (a) => /* @__PURE__ */ t.jsx(
       E,
       {
         onClick: () => {
-          ce(i), c == null || c(i.label);
+          Pe(a), u == null || u(a.label);
         },
         children: /* @__PURE__ */ t.jsx(
-          ze,
+          Ye,
           {
-            label: i.label,
+            label: a.label,
             role: "link",
-            additionalContent: i.additionalContent,
+            additionalContent: a.additionalContent,
             mainTextFontSize: "3xl",
             linkComponent: s
           }
         )
       },
-      i.label
+      a.label
     )
   );
-  xt(l);
-  const ke = /* @__PURE__ */ t.jsxs(
+  ht(l);
+  const Ie = /* @__PURE__ */ t.jsxs(
     t.Fragment,
     { children: [
       /* @__PURE__ */ t.jsx(
-        Oe,
+        De,
         {
           as: G,
           href: R,
@@ -1606,46 +1626,46 @@ const Ye = 60, ht = 6, dn = (l) => {
           backgroundColor: "tints.cream",
           onClick: F,
           children: /* @__PURE__ */ t.jsxs(
-            L,
+            T,
             { gap: "2", children: [
               "My Everly",
-              /* @__PURE__ */ t.jsx(ie, { as: ct, size: 24 })
+              /* @__PURE__ */ t.jsx(ae, { as: ut, size: 24 })
             ] }
           )
         },
         "my-everly"
       ),
       /* @__PURE__ */ t.jsx(
-        Oe,
+        De,
         {
           as: G,
           width: "100%",
           href: m,
           backgroundColor: "tints.cream",
-          onClick: $,
+          onClick: Q,
           children: /* @__PURE__ */ t.jsxs(
-            L,
+            T,
             { gap: "2", children: [
               "Register kit",
-              /* @__PURE__ */ t.jsx(ie, { as: sn, size: 24 })
+              /* @__PURE__ */ t.jsx(ae, { as: sn, size: 24 })
             ] }
           )
         },
         "register-kit"
       )
     ] }
-  ), Fe = /* @__PURE__ */ t.jsxs(
-    L,
+  ), Te = /* @__PURE__ */ t.jsxs(
+    T,
     { gap: "2", flexDirection: "column", children: [
-      u,
-      ke
+      c,
+      Ie
     ] }
   ), Ae = y ? /* @__PURE__ */ t.jsx(
-    L,
-    { direction: ["column", null, null, "row"], gap: "8", children: (pe = y == null ? void 0 : y.sections) == null ? void 0 : pe.map((i, H) => {
+    T,
+    { direction: ["column", null, null, "row"], gap: "8", children: (z = y == null ? void 0 : y.sections) == null ? void 0 : z.map((a, D) => {
       const U = [];
-      for (let O = 0; O < i.links.length; O += 3)
-        U.push(i.links.slice(O, O + 3));
+      for (let A = 0; A < a.links.length; A += 3)
+        U.push(a.links.slice(A, A + 3));
       return /* @__PURE__ */ t.jsxs(
         E,
         { children: [
@@ -1655,141 +1675,143 @@ const Ye = 60, ht = 6, dn = (l) => {
               fontSize: "md",
               color: "tints.uiGrey",
               marginBottom: [0, null, null, 6],
-              children: i.title
+              children: a.title
             }
           ),
           /* @__PURE__ */ t.jsx(
-            L,
+            T,
             {
               flexDirection: ["column", null, null, "row"],
               gap: [null, null, null, 8],
               children: U == null ? void 0 : U.map(
-                (O, He) => /* @__PURE__ */ t.jsx(
-                  L,
+                (A, me) => /* @__PURE__ */ t.jsx(
+                  T,
                   {
                     flexDirection: ["column"],
                     gap: [null, null, null, 5],
                     marginLeft: [null, null, null, -2],
-                    children: O == null ? void 0 : O.map(
-                      (K) => /* @__PURE__ */ t.jsx(
-                        ze,
+                    children: A == null ? void 0 : A.map(
+                      (X) => /* @__PURE__ */ t.jsx(
+                        Ye,
                         {
-                          label: K.label,
-                          href: K.href,
-                          additionalContent: K.additionalContent,
+                          label: X.label,
+                          href: X.href,
+                          additionalContent: X.additionalContent,
                           linkComponent: s,
-                          onClick: () => j == null ? void 0 : j(K.label)
+                          onClick: () => w == null ? void 0 : w(X.label)
                         },
-                        K.label
+                        X.label
                       )
                     )
                   },
-                  He
+                  me
                 )
               )
             }
           )
         ] },
-        `${i.title}-${H}`
+        `${a.title}-${D}`
       );
     }) }
-  ) : null, ne = y != null && y.spotlightCards ? (he = y.spotlightCards) == null ? void 0 : he.map(
-    (i) => /* @__PURE__ */ t.jsx(fn, { ...i }, i.title)
+  ) : null, Fe = y != null && y.spotlightCards ? (xe = y.spotlightCards) == null ? void 0 : xe.map(
+    (a) => /* @__PURE__ */ t.jsx(pn, { ...a }, a.title)
   ) : /* @__PURE__ */ t.jsx(E, {});
   return /* @__PURE__ */ t.jsxs(
     t.Fragment,
     { children: [
       /* @__PURE__ */ t.jsx(
-        hn,
+        vn,
         {
-          desktopTopButtons: te,
+          desktopTopButtons: ge,
           kitRegistrationElement: /* @__PURE__ */ t.jsx(
-            Oe,
+            De,
             {
               as: G,
               href: m,
-              onClick: $,
+              onClick: Q,
               backgroundColor: "tints.cream",
               children: "Register Kit"
             }
           ),
           profileElement: /* @__PURE__ */ t.jsx(
             G,
-            { href: R, "aria-label": "login", onClick: F, children: /* @__PURE__ */ t.jsx(oe, { icon: /* @__PURE__ */ t.jsx(ie, { as: ct }), "aria-label": "Profile" }) }
+            { href: R, "aria-label": "login", onClick: F, children: /* @__PURE__ */ t.jsx(oe, { icon: /* @__PURE__ */ t.jsx(ae, { as: ut }), "aria-label": "Profile" }) }
           ),
           cartElement: /* @__PURE__ */ t.jsx(
-            vn,
+            gn,
             {
               "aria-label": "Cart",
-              count: b,
+              count: x,
               onClick: o
             }
           ),
           onSearchClick: () => {
-            q(!0), x == null || x();
+            B(!ee), v == null || v();
           },
           onMenuClick: () => {
-            me(!0), S == null || S();
+            H(!0), L == null || L();
           },
-          hasSearch: w,
+          hasSearch: j,
           logoLink: d,
-          onHeightChange: De,
           linkComponent: s,
-          onLogoClick: T
+          onLogoClick: _,
+          setTopOffset: ye
         }
       ),
       /* @__PURE__ */ t.jsx(
-        Ue,
+        ze,
         {
-          isOpen: J,
-          onClose: Te,
-          title: h,
-          navDrawerLinks: Ie,
-          bottomNavButtons: Fe,
+          isOpen: ce,
+          onClose: pe,
+          title: p,
+          navDrawerLinks: re,
+          bottomNavButtons: Te,
           hasBackButton: !1,
-          navHeight: se
+          topOffset: Y
         }
       ),
       /* @__PURE__ */ t.jsx(
-        Ue,
+        ze,
         {
           isOpen: !!y,
-          onClose: () => N(null),
+          onClose: () => {
+            pe(), V(null);
+          },
           title: (y == null ? void 0 : y.label) || "",
           navDrawerLinks: Ae,
-          onBackClick: fe,
-          spotlightCards: ne,
+          onBackClick: ne,
+          spotlightCards: Fe,
           hasOnlySpotlightCards: y == null ? void 0 : y.hasOnlySpotlightCards,
-          navHeight: se,
-          bottomButton: y == null ? void 0 : y.bottomButton
+          bottomButton: y == null ? void 0 : y.bottomButton,
+          topOffset: Y
         }
       ),
       /* @__PURE__ */ t.jsx(
-        Ue,
+        ze,
         {
-          isOpen: Ce,
-          onClose: () => q(!1),
+          isOpen: ee,
+          onClose: () => B(!1),
           title: "Search",
-          navHeight: se,
-          navDrawerLinks: Se,
-          onSearch: Ee,
+          navDrawerLinks: ke,
+          onSearch: Re,
           hasSearch: !0,
-          hasBackButton: !1
+          hasBackButton: !1,
+          topOffset: Y
         }
       )
     ] }
   );
 };
 export {
-  vn as BasketButton,
-  Rn as CategoryLabel,
-  Oe as NavButton,
-  _n as NavSkeleton,
-  Ue as NavbarDrawer,
-  ze as NavbarDrawerLink,
-  Sn as NavigationBar,
-  fn as SpotlightCard,
-  En as Stepper,
+  gn as BasketButton,
+  kn as CategoryLabel,
+  De as NavButton,
+  Tn as NavSkeleton,
+  ze as NavbarDrawer,
+  Ye as NavbarDrawerLink,
+  Ln as NavigationBar,
+  pn as SpotlightCard,
+  Sn as Stepper,
   oe as TopNavIconButton,
-  hn as TopNavigation
+  vn as TopNavigation
 };