@everlywell/ui-kit 1.3.2 → 1.4.0

package/index.mjs

@@ -1,9 +1,9 @@
-import { defineStyleConfig as se, createMultiStyleConfigHelpers as Ue, cssVar as qe, baseTheme as Mt, useTheme as To, Box as Ve, Flex as Ro, Show as Eo, Hide as Fo, Checkbox as Bo, Icon as Ot, Progress as Io, forwardRef as Po, useRadioGroupContext as zo, useRadio as $o, chakra as Mo, ChakraBaseProvider as Oo } from "@chakra-ui/react";
-import { Accordion as Qa, AccordionButton as ei, AccordionIcon as ri, AccordionItem as ti, AccordionPanel as oi, Box as ni, Breadcrumb as ai, BreadcrumbItem as ii, BreadcrumbLink as si, BreadcrumbSeparator as li, Button as di, CheckboxGroup as ci, Container as ui, Drawer as fi, DrawerBody as pi, DrawerCloseButton as gi, DrawerContent as hi, DrawerFooter as bi, DrawerHeader as mi, DrawerOverlay as yi, Flex as vi, FormControl as Si, FormErrorMessage as xi, FormHelperText as ki, FormLabel as wi, HStack as _i, Heading as Ci, Icon as Ti, IconButton as Ri, Image as Ei, Input as Fi, InputGroup as Bi, InputLeftElement as Ii, InputRightElement as Pi, Link as zi, List as $i, ListIcon as Mi, ListItem as Oi, Menu as Di, MenuButton as Ai, MenuCommand as ji, MenuDivider as Wi, MenuGroup as Li, MenuItem as Gi, MenuItemOption as Yi, MenuList as Hi, MenuOptionGroup as Ni, OrderedList as Vi, RadioGroup as Xi, Select as Ui, Skeleton as qi, SkeletonCircle as Ki, SkeletonText as Ji, Slider as Zi, SliderFilledTrack as Qi, SliderMark as es, SliderThumb as rs, SliderTrack as ts, Spacer as os, Spinner as ns, Stack as as, Tab as is, TabList as ss, TabPanel as ls, TabPanels as ds, Table as cs, TableCaption as us, TableContainer as fs, Tabs as ps, Tag as gs, TagCloseButton as hs, TagLabel as bs, TagLeftIcon as ms, TagRightIcon as ys, Tbody as vs, Td as Ss, Text as xs, Tfoot as ks, Th as ws, Thead as _s, Tooltip as Cs, Tr as Ts, UnorderedList as Rs, VStack as Es, VisuallyHidden as Fs, extendBaseTheme as Bs, useMediaQuery as Is, useRadioGroup as Ps, useTab as zs } from "@chakra-ui/react";
+import { defineStyleConfig as re, createMultiStyleConfigHelpers as Ue, cssVar as qe, baseTheme as Mt, useTheme as To, Box as Ve, Flex as Ro, Show as Eo, Hide as Fo, Checkbox as Bo, Icon as Ot, Progress as Io, forwardRef as Po, useRadioGroupContext as zo, useRadio as $o, chakra as Mo, ChakraBaseProvider as Oo } from "@chakra-ui/react";
+import { Accordion as ei, AccordionButton as ri, AccordionIcon as ti, AccordionItem as oi, AccordionPanel as ni, Box as ai, Breadcrumb as ii, BreadcrumbItem as si, BreadcrumbLink as li, BreadcrumbSeparator as di, Button as ci, CheckboxGroup as ui, Container as fi, Drawer as pi, DrawerBody as gi, DrawerCloseButton as hi, DrawerContent as bi, DrawerFooter as mi, DrawerHeader as yi, DrawerOverlay as vi, Flex as Si, FormControl as xi, FormErrorMessage as ki, FormHelperText as wi, FormLabel as _i, HStack as Ci, Heading as Ti, Icon as Ri, IconButton as Ei, Image as Fi, Input as Bi, InputGroup as Ii, InputLeftElement as Pi, InputRightElement as zi, Link as $i, List as Mi, ListIcon as Oi, ListItem as Di, Menu as Ai, MenuButton as ji, MenuCommand as Wi, MenuDivider as Li, MenuGroup as Gi, MenuItem as Yi, MenuItemOption as Hi, MenuList as Ni, MenuOptionGroup as Vi, OrderedList as Xi, RadioGroup as Ui, Select as qi, Skeleton as Ki, SkeletonCircle as Ji, SkeletonText as Zi, Slider as Qi, SliderFilledTrack as es, SliderMark as rs, SliderThumb as ts, SliderTrack as os, Spacer as ns, Spinner as as, Stack as is, Step as ss, StepDescription as ls, StepIcon as ds, StepIndicator as cs, StepNumber as us, StepSeparator as fs, StepStatus as ps, StepTitle as gs, Stepper as hs, Tab as bs, TabList as ms, TabPanel as ys, TabPanels as vs, Table as Ss, TableCaption as xs, TableContainer as ks, Tabs as ws, Tag as _s, TagCloseButton as Cs, TagLabel as Ts, TagLeftIcon as Rs, TagRightIcon as Es, Tbody as Fs, Td as Bs, Text as Is, Tfoot as Ps, Th as zs, Thead as $s, Tooltip as Ms, Tr as Os, UnorderedList as Ds, VStack as As, VisuallyHidden as js, extendBaseTheme as Ws, useMediaQuery as Ls, useRadioGroup as Gs, useSteps as Ys, useTab as Hs } from "@chakra-ui/react";
 import Er, { createContext as Do, useContext as Ao, forwardRef as jo } from "react";
 import { Check as Dt } from "@phosphor-icons/react";
 import { Global as Wo } from "@emotion/react";
-import { default as Ms } from "@emotion/styled";
+import { default as Vs } from "@emotion/styled";
 var kr = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
 function Lo(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
@@ -21,11 +21,11 @@ var at = { exports: {} }, Ye = {};
 var wt;
 function Go() {
   return wt || (wt = 1, process.env.NODE_ENV !== "production" && function() {
-    var e = Er, a = Symbol.for("react.element"), s = Symbol.for("react.portal"), u = Symbol.for("react.fragment"), f = Symbol.for("react.strict_mode"), m = Symbol.for("react.profiler"), T = Symbol.for("react.provider"), w = Symbol.for("react.context"), g = Symbol.for("react.forward_ref"), P = Symbol.for("react.suspense"), _ = Symbol.for("react.suspense_list"), v = Symbol.for("react.memo"), D = Symbol.for("react.lazy"), G = Symbol.for("react.offscreen"), V = Symbol.iterator, re = "@@iterator";
-    function te(t) {
+    var e = Er, a = Symbol.for("react.element"), s = Symbol.for("react.portal"), u = Symbol.for("react.fragment"), f = Symbol.for("react.strict_mode"), m = Symbol.for("react.profiler"), T = Symbol.for("react.provider"), w = Symbol.for("react.context"), g = Symbol.for("react.forward_ref"), P = Symbol.for("react.suspense"), _ = Symbol.for("react.suspense_list"), v = Symbol.for("react.memo"), D = Symbol.for("react.lazy"), G = Symbol.for("react.offscreen"), V = Symbol.iterator, te = "@@iterator";
+    function oe(t) {
       if (t === null || typeof t != "object")
         return null;
-      var l = V && t[V] || t[re];
+      var l = V && t[V] || t[te];
       return typeof l == "function" ? l : null;
     }
     var X = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
@@ -173,7 +173,7 @@ function Go() {
       }
     }
     var de = X.ReactCurrentDispatcher, Ce;
-    function oe(t, l, d) {
+    function ne(t, l, d) {
       {
         if (Ce === void 0)
           try {
@@ -259,7 +259,7 @@ function Go() {
       } finally {
         Te = !1, de.current = S, Or(), Error.prepareStackTrace = k;
       }
-      var ae = t ? t.displayName || t.name : "", yr = ae ? oe(ae) : "";
+      var ie = t ? t.displayName || t.name : "", yr = ie ? ne(ie) : "";
       return typeof t == "function" && ge.set(t, yr), yr;
     }
     function Dr(t, l, d) {
@@ -275,12 +275,12 @@ function Go() {
       if (typeof t == "function")
         return Me(t, Ar(t));
       if (typeof t == "string")
-        return oe(t);
+        return ne(t);
       switch (t) {
         case P:
-          return oe("Suspense");
+          return ne("Suspense");
         case _:
-          return oe("SuspenseList");
+          return ne("SuspenseList");
       }
       if (typeof t == "object")
         switch (t.$$typeof) {
@@ -460,7 +460,7 @@ function Go() {
     function We(t) {
       return typeof t == "object" && t !== null && t.$$typeof === a;
     }
-    function ne() {
+    function ae() {
       {
         if ($e.current) {
           var t = Z($e.current.type);
@@ -486,7 +486,7 @@ Check your code at ` + l + ":" + d + ".";
     var gr = {};
     function Yr(t) {
       {
-        var l = ne();
+        var l = ae();
         if (!l) {
           var d = typeof t == "string" ? t : t.displayName || t.name;
           d && (l = `
@@ -521,7 +521,7 @@ Check the top-level render call using <` + d + ">.");
         else if (We(t))
           t._store && (t._store.validated = !0);
         else if (t) {
-          var k = te(t);
+          var k = oe(t);
           if (typeof k == "function" && k !== t.entries)
             for (var S = k.call(t), b; !(b = S.next()).done; )
               We(b.value) && hr(b.value, l);
@@ -572,7 +572,7 @@ Check the top-level render call using <` + d + ">.");
           var h = "";
           (t === void 0 || typeof t == "object" && t !== null && Object.keys(t).length === 0) && (h += " 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 W = Gr(k);
-          W ? h += W : h += ne();
+          W ? h += W : h += ae();
           var A;
           t === null ? A = "null" : he(t) ? A = "array" : t !== void 0 && t.$$typeof === a ? (A = "<" + (Z(t.type) || "Unknown") + " />", h = " Did you accidentally export a JSX literal instead of a component?") : A = typeof t, $("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", A, h);
         }
@@ -584,8 +584,8 @@ Check the top-level render call using <` + d + ">.");
           if (H !== void 0)
             if (p)
               if (he(H)) {
-                for (var ae = 0; ae < H.length; ae++)
-                  br(H[ae], t);
+                for (var ie = 0; ie < H.length; ie++)
+                  br(H[ie], t);
                 Object.freeze && Object.freeze(H);
               } else
                 $("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
@@ -635,7 +635,7 @@ function Yo() {
 }
 process.env.NODE_ENV === "production" ? at.exports = Yo() : at.exports = Go();
 var Y = at.exports;
-const Ct = ["redCS", "greenCS"], Ho = se({
+const Ct = ["redCS", "greenCS"], Ho = re({
   // The styles all button have in common
   baseStyle: {
     fontFamily: "body",
@@ -1012,11 +1012,11 @@ function At(e) {
 var Tr = { exports: {} };
 Tr.exports;
 (function(e, a) {
-  var s = 200, u = "__lodash_hash_undefined__", f = 800, m = 16, T = 9007199254740991, w = "[object Arguments]", g = "[object Array]", P = "[object AsyncFunction]", _ = "[object Boolean]", v = "[object Date]", D = "[object Error]", G = "[object Function]", V = "[object GeneratorFunction]", re = "[object Map]", te = "[object Number]", X = "[object Null]", $ = "[object Object]", we = "[object Proxy]", _e = "[object RegExp]", Br = "[object Set]", Ir = "[object String]", Pr = "[object Undefined]", zr = "[object WeakMap]", Ke = "[object ArrayBuffer]", $r = "[object DataView]", Mr = "[object Float32Array]", Je = "[object Float64Array]", Z = "[object Int8Array]", le = "[object Int16Array]", ye = "[object Int32Array]", Ze = "[object Uint8Array]", Qe = "[object Uint8ClampedArray]", er = "[object Uint16Array]", rr = "[object Uint32Array]", tr = /[\\^$.*+?()[\]{}|]/g, or = /^\[object .+?Constructor\]$/, nr = /^(?:0|[1-9]\d*)$/, B = {};
-  B[Mr] = B[Je] = B[Z] = B[le] = B[ye] = B[Ze] = B[Qe] = B[er] = B[rr] = !0, B[w] = B[g] = B[Ke] = B[_] = B[$r] = B[v] = B[D] = B[G] = B[re] = B[te] = B[$] = B[_e] = B[Br] = B[Ir] = B[zr] = !1;
-  var ar = typeof kr == "object" && kr && kr.Object === Object && kr, Or = typeof self == "object" && self && self.Object === Object && self, de = ar || Or || Function("return this")(), Ce = a && !a.nodeType && a, oe = Ce && !0 && e && !e.nodeType && e, Te = oe && oe.exports === Ce, ge = Te && ar.process, ir = function() {
+  var s = 200, u = "__lodash_hash_undefined__", f = 800, m = 16, T = 9007199254740991, w = "[object Arguments]", g = "[object Array]", P = "[object AsyncFunction]", _ = "[object Boolean]", v = "[object Date]", D = "[object Error]", G = "[object Function]", V = "[object GeneratorFunction]", te = "[object Map]", oe = "[object Number]", X = "[object Null]", $ = "[object Object]", we = "[object Proxy]", _e = "[object RegExp]", Br = "[object Set]", Ir = "[object String]", Pr = "[object Undefined]", zr = "[object WeakMap]", Ke = "[object ArrayBuffer]", $r = "[object DataView]", Mr = "[object Float32Array]", Je = "[object Float64Array]", Z = "[object Int8Array]", le = "[object Int16Array]", ye = "[object Int32Array]", Ze = "[object Uint8Array]", Qe = "[object Uint8ClampedArray]", er = "[object Uint16Array]", rr = "[object Uint32Array]", tr = /[\\^$.*+?()[\]{}|]/g, or = /^\[object .+?Constructor\]$/, nr = /^(?:0|[1-9]\d*)$/, B = {};
+  B[Mr] = B[Je] = B[Z] = B[le] = B[ye] = B[Ze] = B[Qe] = B[er] = B[rr] = !0, B[w] = B[g] = B[Ke] = B[_] = B[$r] = B[v] = B[D] = B[G] = B[te] = B[oe] = B[$] = B[_e] = B[Br] = B[Ir] = B[zr] = !1;
+  var ar = typeof kr == "object" && kr && kr.Object === Object && kr, Or = typeof self == "object" && self && self.Object === Object && self, de = ar || Or || Function("return this")(), Ce = a && !a.nodeType && a, ne = Ce && !0 && e && !e.nodeType && e, Te = ne && ne.exports === Ce, ge = Te && ar.process, ir = function() {
     try {
-      var r = oe && oe.require && oe.require("util").types;
+      var r = ne && ne.require && ne.require("util").types;
       return r || ge && ge.binding && ge.binding("util");
     } catch {
     }
@@ -1076,7 +1076,7 @@ Tr.exports;
       return r.prototype = void 0, i;
     };
   }();
-  function ne(r) {
+  function ae(r) {
     var o = -1, i = r == null ? 0 : r.length;
     for (this.clear(); ++o < i; ) {
       var c = r[o];
@@ -1106,7 +1106,7 @@ Tr.exports;
     var i = this.__data__;
     return this.size += this.has(r) ? 0 : 1, i[r] = fe && o === void 0 ? u : o, this;
   }
-  ne.prototype.clear = Gr, ne.prototype.delete = gr, ne.prototype.get = Yr, ne.prototype.has = hr, ne.prototype.set = br;
+  ae.prototype.clear = Gr, ae.prototype.delete = gr, ae.prototype.get = Yr, ae.prototype.has = hr, ae.prototype.set = br;
   function ee(r) {
     var o = -1, i = r == null ? 0 : r.length;
     for (this.clear(); ++o < i; ) {
@@ -1145,9 +1145,9 @@ Tr.exports;
   }
   function t() {
     this.size = 0, this.__data__ = {
-      hash: new ne(),
+      hash: new ae(),
       map: new (ue || ee)(),
-      string: new ne()
+      string: new ae()
     };
   }
   function l(r) {
@@ -1203,7 +1203,7 @@ Tr.exports;
       ht(q, O))) && y.push(q);
     return y;
   }
-  function ae(r, o, i) {
+  function ie(r, o, i) {
     (i !== void 0 && !xr(r[o], i) || i === void 0 && !(o in r)) && Ur(r, o, i);
   }
   function yr(r, o, i) {
@@ -1254,14 +1254,14 @@ Tr.exports;
         Zt(r, o, M, i, gt, c, x);
       else {
         var y = c ? c(Kr(r, M), I, M + "", r, o, x) : void 0;
-        y === void 0 && (y = I), ae(r, M, y);
+        y === void 0 && (y = I), ie(r, M, y);
       }
     }, St);
   }
   function Zt(r, o, i, c, x, I, M) {
     var y = Kr(r, i), O = Kr(o, i), q = M.get(O);
     if (q) {
-      ae(r, i, q);
+      ie(r, i, q);
       return;
     }
     var U = I ? I(y, O, i + "", r, o, M) : void 0, Ge = U === void 0;
@@ -1269,7 +1269,7 @@ Tr.exports;
       var rt = Zr(O), tt = !rt && mt(O), kt = !rt && !tt && vt(O);
       U = O, rt || tt || kt ? Zr(y) ? U = y : So(y) ? U = no(y) : tt ? (Ge = !1, U = ro(O, !0)) : kt ? (Ge = !1, U = oo(O, !0)) : U = [] : xo(O) || Jr(O) ? (U = y, Jr(y) ? U = ko(y) : (!Se(y) || et(y)) && (U = co(O))) : Ge = !1;
     }
-    Ge && (M.set(O, U), x(U, O, c, I, M), M.delete(O)), ae(r, i, U);
+    Ge && (M.set(O, U), x(U, O, c, I, M), M.delete(O)), ie(r, i, U);
   }
   function Qt(r, o) {
     return mo(bo(r, o, xt), r + "");
@@ -1641,10 +1641,10 @@ function vn(e, a) {
   const v = P.map((D) => {
     if (mn.has(D))
       return D;
-    const G = D.indexOf(" "), [V, re] = G !== -1 ? [D.substr(0, G), D.substr(G + 1)] : [D], te = lt(re) ? re : re && re.split(" "), X = `colors.${V}`, $ = X in a.__cssMap ? a.__cssMap[X].varRef : V;
-    return te ? [
+    const G = D.indexOf(" "), [V, te] = G !== -1 ? [D.substr(0, G), D.substr(G + 1)] : [D], oe = lt(te) ? te : te && te.split(" "), X = `colors.${V}`, $ = X in a.__cssMap ? a.__cssMap[X].varRef : V;
+    return oe ? [
       $,
-      ...Array.isArray(te) ? te : [te]
+      ...Array.isArray(oe) ? oe : [oe]
     ].join(" ") : $;
   });
   return `${w}(${v.join(", ")})`;
@@ -1656,7 +1656,7 @@ function xn(e) {
 var kn = (e) => {
   const a = parseFloat(e.toString()), s = e.toString().replace(String(a), "");
   return { unitless: !s, value: a, unit: s };
-}, ie = (e) => (a) => `${e}(${a})`, C = {
+}, se = (e) => (a) => `${e}(${a})`, C = {
   filter(e) {
     return e !== "auto" ? e : pn;
   },
@@ -1695,16 +1695,16 @@ var kn = (e) => {
     return typeof e == "number" || a ? `${e}deg` : e;
   },
   gradient: Sn,
-  blur: ie("blur"),
-  opacity: ie("opacity"),
-  brightness: ie("brightness"),
-  contrast: ie("contrast"),
-  dropShadow: ie("drop-shadow"),
-  grayscale: ie("grayscale"),
-  hueRotate: ie("hue-rotate"),
-  invert: ie("invert"),
-  saturate: ie("saturate"),
-  sepia: ie("sepia"),
+  blur: se("blur"),
+  opacity: se("opacity"),
+  brightness: se("brightness"),
+  contrast: se("contrast"),
+  dropShadow: se("drop-shadow"),
+  grayscale: se("grayscale"),
+  hueRotate: se("hue-rotate"),
+  invert: se("invert"),
+  saturate: se("saturate"),
+  sepia: se("sepia"),
   bgImage(e) {
     return e == null || lt(e) || st.has(e) ? e : `url(${e})`;
   },
@@ -2669,7 +2669,7 @@ const Qn = Jn({
       color: "tints.medGrey"
     }
   }
-}), ea = Zn({ baseStyle: Qn }), ra = se({
+}), ea = Zn({ baseStyle: Qn }), ra = re({
   baseStyle: {
     thumb: {
       cursor: "grab",
@@ -2682,7 +2682,7 @@ const Qn = Jn({
   sizes: {},
   variants: {},
   defaultProps: {}
-}), ta = se({
+}), ta = re({
   baseStyle: {
     color: "viridian.base",
     fontWeight: "normal",
@@ -2710,7 +2710,27 @@ const Qn = Jn({
   defaultProps: {
     size: "md"
   }
-}), oa = se({
+}), oa = re({
+  baseStyle: {
+    stepper: {
+      width: "100%",
+      backgroundColor: ""
+    },
+    step: {},
+    title: {},
+    description: {},
+    indicator: {},
+    separator: {
+      backgroundColor: "eggplant.base",
+      height: "4px"
+    },
+    icon: {},
+    number: {}
+  },
+  sizes: {},
+  variants: {},
+  defaultProps: {}
+}), na = re({
   baseStyle: {
     fontFamily: "heading",
     fontWeight: "normal",
@@ -2763,7 +2783,7 @@ const Qn = Jn({
   defaultProps: {
     size: "md"
   }
-}), na = se({
+}), aa = re({
   baseStyle: {
     fontFamily: "body",
     fontWeight: "normal",
@@ -2793,7 +2813,7 @@ const Qn = Jn({
   defaultProps: {
     size: "lg"
   }
-}), aa = se({
+}), ia = re({
   baseStyle: {},
   sizes: {
     sm: {
@@ -2810,7 +2830,7 @@ const Qn = Jn({
   defaultProps: {
     size: "md"
   }
-}), { defineMultiStyleConfig: ia, definePartsStyle: ut } = ke(Xo.keys), sa = {
+}), { defineMultiStyleConfig: sa, definePartsStyle: ut } = ke(Xo.keys), la = {
   partial: ut({
     dialog: {
       maxW: 560
@@ -2823,7 +2843,7 @@ const Qn = Jn({
       borderRadius: 0
     }
   })
-}, la = ut({
+}, da = ut({
   overlay: {
     zIndex: "overlay",
     bg: (e) => `${e.colors.tints.black}66`
@@ -2867,11 +2887,11 @@ const Qn = Jn({
     py: 6,
     px: 8
   }
-}), da = ia({
-  baseStyle: la,
-  sizes: sa,
+}), ca = sa({
+  baseStyle: da,
+  sizes: la,
   defaultProps: { size: "partial" }
-}), ca = se({
+}), ua = re({
   baseStyle: {
     // adding a background color and/or font color to the tooltip causes the arrow to disappear
     // not including these properties for now
@@ -2880,8 +2900,8 @@ const Qn = Jn({
   },
   sizes: {},
   defaultProps: {}
-}), Nt = qe("progress-background"), Vt = qe("progress-filled-background"), { defineMultiStyleConfig: ua, definePartsStyle: fa } = ke(Ko.keys), pa = ua({
-  baseStyle: fa({
+}), Nt = qe("progress-background"), Vt = qe("progress-filled-background"), { defineMultiStyleConfig: fa, definePartsStyle: pa } = ke(Ko.keys), ga = fa({
+  baseStyle: pa({
     label: {
       lineHeight: "1",
       fontSize: "0.25em",
@@ -2926,7 +2946,7 @@ const Qn = Jn({
   defaultProps: {
     size: "xs"
   }
-}), ga = se({
+}), ha = re({
   baseStyle: {},
   sizes: {
     sm: {
@@ -2949,20 +2969,20 @@ const Qn = Jn({
   defaultProps: {
     size: "md"
   }
-}), ha = qe("skeleton-start-color"), ba = qe("skeleton-end-color"), ma = qe("skeleton-speed"), ya = se({
+}), ba = qe("skeleton-start-color"), ma = qe("skeleton-end-color"), ya = qe("skeleton-speed"), va = re({
   baseStyle: {
-    [ha.variable]: "colors.tints.lightGrey",
-    [ba.variable]: "colors.tints.medGrey",
-    [ma.variable]: "0.8",
+    [ba.variable]: "colors.tints.lightGrey",
+    [ma.variable]: "colors.tints.medGrey",
+    [ya.variable]: "0.8",
     borderRadius: "sm",
     p: "4"
   },
   sizes: {},
   variants: {},
   defaultProps: {}
-}), { defineMultiStyleConfig: va } = Ue(
+}), { defineMultiStyleConfig: Sa } = Ue(
   Qo.keys
-), Sa = va({
+), xa = Sa({
   baseStyle: {
     tab: {
       color: "tints.darkGrey",
@@ -3025,9 +3045,9 @@ const Qn = Jn({
   defaultProps: {
     size: "lg"
   }
-}), { defineMultiStyleConfig: xa } = Ue(
+}), { defineMultiStyleConfig: ka } = Ue(
   en.keys
-), ka = {
+), wa = {
   sm: {
     paddingX: ["2", "2"],
     paddingY: ["0.5", "2"]
@@ -3036,7 +3056,7 @@ const Qn = Jn({
     paddingX: ["2", "3"],
     paddingY: ["0.5", "3"]
   }
-}, wa = xa({
+}, _a = ka({
   baseStyle: {
     container: {
       fontWeight: "medium",
@@ -3158,7 +3178,7 @@ const Qn = Jn({
         backgroundColor: "tints.white",
         color: "tints.black",
         borderRadius: "8px",
-        ...ka[e]
+        ...wa[e]
       },
       label: {
         backgroundColor: "tints.white",
@@ -3176,9 +3196,9 @@ const Qn = Jn({
     size: "md",
     variant: "primary"
   }
-}), { defineMultiStyleConfig: _a } = ke(
+}), { defineMultiStyleConfig: Ca } = ke(
   No.keys
-), Ca = _a({
+), Ta = Ca({
   baseStyle: {
     container: {
       width: "100%"
@@ -3231,9 +3251,9 @@ const Qn = Jn({
     size: "lg",
     variant: "primary"
   }
-}), { defineMultiStyleConfig: Ta } = Ue(
+}), { defineMultiStyleConfig: Ra } = Ue(
   Zo.keys
-), Ra = Ta({
+), Ea = Ra({
   baseStyle: {
     table: {
       width: "full",
@@ -3280,7 +3300,7 @@ const Qn = Jn({
   defaultProps: {
     variant: "simple"
   }
-}), Ea = se({
+}), Fa = re({
   baseStyle: {
     w: "100%",
     paddingX: "48px"
@@ -3309,7 +3329,7 @@ const Qn = Jn({
   defaultProps: {
     size: "lg"
   }
-}), Fa = {
+}), Ba = {
   tints: {
     black: "#0F0F0F",
     darkGrey: "#545454",
@@ -3423,8 +3443,8 @@ const Qn = Jn({
     success: "#28724F",
     rating: "#F5A623"
   }
-}, { semanticTokens: Ya, sizes: Ha, space: Na, ...Ba } = Mt, E = (e) => `${e / 16}rem`, Ia = (e) => e, Va = Ia({
-  ...Ba,
+}, { semanticTokens: Ha, sizes: Na, space: Va, ...Ia } = Mt, E = (e) => `${e / 16}rem`, Pa = (e) => e, Xa = Pa({
+  ...Ia,
   breakpoints: {
     // Chakra relies on the initial breakpoint being `base`
     base: "0em",
@@ -3551,37 +3571,38 @@ const Qn = Jn({
     toast: 1700,
     tooltip: 1800
   },
-  colors: Fa,
+  colors: Ba,
   components: {
-    Accordion: Ca,
+    Accordion: Ta,
     Button: Ho,
     Checkbox: on,
-    Container: Ea,
-    Drawer: da,
+    Container: Fa,
+    Drawer: ca,
     Form: Gn,
     // Not sure why chakra does not follow their naming convention for this theme, but this is the way that it works
     FormError: Nn,
     FormLabel: Xn,
     Select: ea,
-    Heading: oa,
-    Icon: aa,
+    Heading: na,
+    Icon: ia,
     Input: xe,
     Link: ta,
+    Stepper: oa,
     Menu: Kn,
-    Progress: pa,
+    Progress: ga,
     Slider: ra,
-    Spinner: ga,
-    Skeleton: ya,
-    Tabs: Sa,
-    Table: Ra,
-    Tag: wa,
-    Text: na,
-    Tooltip: ca
-  }
-}), Pa = () => To(), Xt = Do({
+    Spinner: ha,
+    Skeleton: va,
+    Tabs: xa,
+    Table: Ea,
+    Tag: _a,
+    Text: aa,
+    Tooltip: ua
+  }
+}), za = () => To(), Xt = Do({
   spacing: 0,
   columns: 1
-}), za = Er.forwardRef(
+}), $a = Er.forwardRef(
   ({
     children: e,
     alignEdges: a = !0,
@@ -3590,7 +3611,7 @@ const Qn = Jn({
     spacing: f,
     ...m
   }, T) => {
-    const w = Pa(), g = f ?? w.space[4], P = (v) => typeof v == "number" ? -1 * v : `-${v}`, _ = Array.isArray(g) ? g.map((v) => v && P(v)) : g && P(g);
+    const w = za(), g = f ?? w.space[4], P = (v) => typeof v == "number" ? -1 * v : `-${v}`, _ = Array.isArray(g) ? g.map((v) => v && P(v)) : g && P(g);
     return /* @__PURE__ */ Y.jsx(Xt.Provider, { value: { spacing: g, columns: u }, children: /* @__PURE__ */ Y.jsx(Ve, { m: a ? _ : void 0, children: /* @__PURE__ */ Y.jsx(
       Ro,
       {
@@ -3605,8 +3626,8 @@ const Qn = Jn({
     ) }) });
   }
 );
-za.displayName = "Grid";
-const $a = Er.forwardRef(
+$a.displayName = "Grid";
+const Ma = Er.forwardRef(
   ({ children: e, width: a, ...s }, u) => {
     const { columns: f, spacing: m } = Ao(Xt), T = Array.isArray(a) ? a.map((g) => g === "auto" ? 1 : 0) : a === "auto" ? 1 : 0, w = () => (Array.isArray(f) ? f : [f]).map((P) => `${100 / P}%`);
     return /* @__PURE__ */ Y.jsx(
@@ -3626,10 +3647,10 @@ const $a = Er.forwardRef(
     );
   }
 );
-$a.displayName = "GridItem";
-const Xa = Eo, Ua = Fo, Ma = (e) => /* @__PURE__ */ Y.jsx(Bo, { icon: /* @__PURE__ */ Y.jsx(Ot, { as: Dt }), ...e });
-Ma.displayName = "Checkbox";
-function Oa(e, a) {
+Ma.displayName = "GridItem";
+const Ua = Eo, qa = Fo, Oa = (e) => /* @__PURE__ */ Y.jsx(Bo, { icon: /* @__PURE__ */ Y.jsx(Ot, { as: Dt }), ...e });
+Oa.displayName = "Checkbox";
+function Da(e, a) {
   const { background: s, filledBackground: u, ...f } = e;
   return /* @__PURE__ */ Y.jsx(
     Io,
@@ -3643,7 +3664,7 @@ function Oa(e, a) {
     }
   );
 }
-const qa = jo(Oa), nt = "32px", _r = (e) => e == null, Da = Po((e, a) => {
+const Ka = jo(Da), nt = "32px", _r = (e) => e == null, Aa = Po((e, a) => {
   const s = zo(), u = {
     isDisabled: s == null ? void 0 : s.isDisabled,
     isFocusable: s == null ? void 0 : s.isFocusable,
@@ -3663,7 +3684,7 @@ const qa = jo(Oa), nt = "32px", _r = (e) => e == null, Da = Po((e, a) => {
   } = $o({
     ...e,
     ...u
-  }), _ = f({}, a), v = m(), D = w(), G = P(), V = g.isChecked, re = () => e.isDisabled ? "tints.lightGrey" : V ? "viridian.base" : "tints.white", te = () => e.isDisabled ? "tints.lightGrey" : V ? "viridian.base" : "tints.uiGrey", X = () => e.isDisabled ? "not-allowed" : "pointer";
+  }), _ = f({}, a), v = m(), D = w(), G = P(), V = g.isChecked, te = () => e.isDisabled ? "tints.lightGrey" : V ? "viridian.base" : "tints.white", oe = () => e.isDisabled ? "tints.lightGrey" : V ? "viridian.base" : "tints.uiGrey", X = () => e.isDisabled ? "not-allowed" : "pointer";
   return /* @__PURE__ */ Y.jsxs(
     Mo.label,
     {
@@ -3687,9 +3708,9 @@ const qa = jo(Oa), nt = "32px", _r = (e) => e == null, Da = Po((e, a) => {
             display: "flex",
             alignItems: "center",
             justifyContent: "center",
-            backgroundColor: re(),
+            backgroundColor: te(),
             color: V ? "tints.white" : "transparent",
-            borderColor: te(),
+            borderColor: oe(),
             borderStyle: "solid",
             flexShrink: 0,
             borderWidth: "1.5px",
@@ -3715,8 +3736,8 @@ const qa = jo(Oa), nt = "32px", _r = (e) => e == null, Da = Po((e, a) => {
     }
   );
 });
-Da.displayName = "Radio";
-const Aa = () => /* @__PURE__ */ Y.jsx(
+Aa.displayName = "Radio";
+const ja = () => /* @__PURE__ */ Y.jsx(
   Wo,
   {
     styles: `
@@ -3800,111 +3821,121 @@ const Aa = () => /* @__PURE__ */ Y.jsx(
       }
       `
   }
-), Ka = ({
+), Ja = ({
   children: e,
   ...a
 }) => /* @__PURE__ */ Y.jsxs(Oo, { ...a, children: [
-  /* @__PURE__ */ Y.jsx(Aa, {}),
+  /* @__PURE__ */ Y.jsx(ja, {}),
   e
 ] });
 export {
-  Qa as Accordion,
-  ei as AccordionButton,
-  ri as AccordionIcon,
-  ti as AccordionItem,
-  oi as AccordionPanel,
-  ni as Box,
-  ai as Breadcrumb,
-  ii as BreadcrumbItem,
-  si as BreadcrumbLink,
-  li as BreadcrumbSeparator,
-  di as Button,
-  Ma as Checkbox,
-  ci as CheckboxGroup,
-  ui as Container,
-  fi as Drawer,
-  pi as DrawerBody,
-  gi as DrawerCloseButton,
-  hi as DrawerContent,
-  bi as DrawerFooter,
-  mi as DrawerHeader,
-  yi as DrawerOverlay,
-  vi as Flex,
-  Si as FormControl,
-  xi as FormErrorMessage,
-  ki as FormHelperText,
-  wi as FormLabel,
-  za as Grid,
-  $a as GridItem,
-  _i as HStack,
-  Ci as Heading,
-  Ua as Hide,
-  Ti as Icon,
-  Ri as IconButton,
-  Ei as Image,
-  Fi as Input,
-  Bi as InputGroup,
-  Ii as InputLeftElement,
-  Pi as InputRightElement,
-  zi as Link,
-  $i as List,
-  Mi as ListIcon,
-  Oi as ListItem,
-  Di as Menu,
-  Ai as MenuButton,
-  ji as MenuCommand,
-  Wi as MenuDivider,
-  Li as MenuGroup,
-  Gi as MenuItem,
-  Yi as MenuItemOption,
-  Hi as MenuList,
-  Ni as MenuOptionGroup,
-  Vi as OrderedList,
-  qa as Progress,
-  Da as Radio,
-  Xi as RadioGroup,
-  Ui as Select,
-  Xa as Show,
-  qi as Skeleton,
-  Ki as SkeletonCircle,
-  Ji as SkeletonText,
-  Zi as Slider,
-  Qi as SliderFilledTrack,
-  es as SliderMark,
-  rs as SliderThumb,
-  ts as SliderTrack,
-  os as Spacer,
-  ns as Spinner,
-  as as Stack,
-  is as Tab,
-  ss as TabList,
-  ls as TabPanel,
-  ds as TabPanels,
-  cs as Table,
-  us as TableCaption,
-  fs as TableContainer,
-  ps as Tabs,
-  gs as Tag,
-  hs as TagCloseButton,
-  bs as TagLabel,
-  ms as TagLeftIcon,
-  ys as TagRightIcon,
-  vs as Tbody,
-  Ss as Td,
-  xs as Text,
-  ks as Tfoot,
-  ws as Th,
-  _s as Thead,
-  Ka as ThemeProvider,
-  Cs as Tooltip,
-  Ts as Tr,
-  Rs as UnorderedList,
-  Es as VStack,
-  Fs as VisuallyHidden,
-  Bs as extendTheme,
-  Ms as styled,
-  Va as theme,
-  Is as useMediaQuery,
-  Ps as useRadioGroup,
-  zs as useTab
+  ei as Accordion,
+  ri as AccordionButton,
+  ti as AccordionIcon,
+  oi as AccordionItem,
+  ni as AccordionPanel,
+  ai as Box,
+  ii as Breadcrumb,
+  si as BreadcrumbItem,
+  li as BreadcrumbLink,
+  di as BreadcrumbSeparator,
+  ci as Button,
+  Oa as Checkbox,
+  ui as CheckboxGroup,
+  fi as Container,
+  pi as Drawer,
+  gi as DrawerBody,
+  hi as DrawerCloseButton,
+  bi as DrawerContent,
+  mi as DrawerFooter,
+  yi as DrawerHeader,
+  vi as DrawerOverlay,
+  Si as Flex,
+  xi as FormControl,
+  ki as FormErrorMessage,
+  wi as FormHelperText,
+  _i as FormLabel,
+  $a as Grid,
+  Ma as GridItem,
+  Ci as HStack,
+  Ti as Heading,
+  qa as Hide,
+  Ri as Icon,
+  Ei as IconButton,
+  Fi as Image,
+  Bi as Input,
+  Ii as InputGroup,
+  Pi as InputLeftElement,
+  zi as InputRightElement,
+  $i as Link,
+  Mi as List,
+  Oi as ListIcon,
+  Di as ListItem,
+  Ai as Menu,
+  ji as MenuButton,
+  Wi as MenuCommand,
+  Li as MenuDivider,
+  Gi as MenuGroup,
+  Yi as MenuItem,
+  Hi as MenuItemOption,
+  Ni as MenuList,
+  Vi as MenuOptionGroup,
+  Xi as OrderedList,
+  Ka as Progress,
+  Aa as Radio,
+  Ui as RadioGroup,
+  qi as Select,
+  Ua as Show,
+  Ki as Skeleton,
+  Ji as SkeletonCircle,
+  Zi as SkeletonText,
+  Qi as Slider,
+  es as SliderFilledTrack,
+  rs as SliderMark,
+  ts as SliderThumb,
+  os as SliderTrack,
+  ns as Spacer,
+  as as Spinner,
+  is as Stack,
+  ss as Step,
+  ls as StepDescription,
+  ds as StepIcon,
+  cs as StepIndicator,
+  us as StepNumber,
+  fs as StepSeparator,
+  ps as StepStatus,
+  gs as StepTitle,
+  hs as Stepper,
+  bs as Tab,
+  ms as TabList,
+  ys as TabPanel,
+  vs as TabPanels,
+  Ss as Table,
+  xs as TableCaption,
+  ks as TableContainer,
+  ws as Tabs,
+  _s as Tag,
+  Cs as TagCloseButton,
+  Ts as TagLabel,
+  Rs as TagLeftIcon,
+  Es as TagRightIcon,
+  Fs as Tbody,
+  Bs as Td,
+  Is as Text,
+  Ps as Tfoot,
+  zs as Th,
+  $s as Thead,
+  Ja as ThemeProvider,
+  Ms as Tooltip,
+  Os as Tr,
+  Ds as UnorderedList,
+  As as VStack,
+  js as VisuallyHidden,
+  Ws as extendTheme,
+  Vs as styled,
+  Xa as theme,
+  Ls as useMediaQuery,
+  Gs as useRadioGroup,
+  Ys as useSteps,
+  Hs as useTab
 };