@redis-ui/styles 12.7.0 → 12.9.0

package/dist/index.js

@@ -1,5 +1,5 @@
-import { useTheme as To, css as $r, ThemeProvider as Fo, createGlobalStyle as Io } from "styled-components";
-import Ae, { useRef as Ge, useCallback as wr, useState as Ce, useEffect as Dr, useLayoutEffect as Eo, createContext as Oo, useMemo as Mo, useContext as _o } from "react";
+import { useTheme as To, css as zr, ThemeProvider as Fo, createGlobalStyle as Io } from "styled-components";
+import Ae, { useRef as Ge, useCallback as wr, useState as Ce, useEffect as Dr, useLayoutEffect as Eo, createContext as Bo, useMemo as Oo, useContext as Mo } from "react";
 const l = {
   transparent: "#00000000",
   pink500: "#de47bb",
@@ -391,7 +391,7 @@ const l = {
       color: l.blue600
     }
   }
-}, Bo = {
+}, _o = {
   sizes: {
     L: {
       size: "3rem",
@@ -1202,14 +1202,14 @@ function Qo(t, a) {
   var { space: s, values: u, alpha: d } = Zo(t);
   return s[0] === "h" ? `${s}a(${u[0]}, ${u[1]}%, ${u[2]}%, ${a})` : `${s}a(${u}, ${a})`;
 }
-function B() {
-  return B = Object.assign ? Object.assign.bind() : function(t) {
+function _() {
+  return _ = Object.assign ? Object.assign.bind() : function(t) {
     for (var a = 1; a < arguments.length; a++) {
       var s = arguments[a];
       for (var u in s) ({}).hasOwnProperty.call(s, u) && (t[u] = s[u]);
     }
     return t;
-  }, B.apply(null, arguments);
+  }, _.apply(null, arguments);
 }
 function rt(t) {
   if (t === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
@@ -1527,11 +1527,11 @@ var Y = /* @__PURE__ */ function(t) {
   }
   return a;
 }(/* @__PURE__ */ Gr(Error));
-function Br(t) {
+function _r(t) {
   return Math.round(t * 255);
 }
 function lt(t, a, s) {
-  return Br(t) + "," + Br(a) + "," + Br(s);
+  return _r(t) + "," + _r(a) + "," + _r(s);
 }
 function br(t, a, s, u) {
   if (u === void 0 && (u = lt), a === 0)
@@ -1847,7 +1847,7 @@ function qr(t, a, s) {
     return Xr("#" + or(t.red) + or(t.green) + or(t.blue));
   throw new Y(6);
 }
-function zr(t, a, s, u) {
+function $r(t, a, s, u) {
   if (typeof t == "string" && typeof a == "number") {
     var d = tr(t);
     return "rgba(" + d.red + "," + d.green + "," + d.blue + "," + a + ")";
@@ -1870,7 +1870,7 @@ var yt = function(a) {
 };
 function Q(t) {
   if (typeof t != "object") throw new Y(8);
-  if (kt(t)) return zr(t);
+  if (kt(t)) return $r(t);
   if (yt(t)) return qr(t);
   if (wt(t)) return ht(t);
   if (vt(t)) return Ct(t);
@@ -1888,7 +1888,7 @@ function H(t) {
 function St(t, a) {
   if (a === "transparent") return a;
   var s = Z(a);
-  return Q(B({}, s, {
+  return Q(_({}, s, {
     hue: s.hue + parseFloat(t)
   }));
 }
@@ -1896,18 +1896,18 @@ H(St);
 function cr(t, a, s) {
   return Math.max(t, Math.min(a, s));
 }
-function $t(t, a) {
+function zt(t, a) {
   if (a === "transparent") return a;
   var s = Z(a);
-  return Q(B({}, s, {
+  return Q(_({}, s, {
     lightness: cr(0, 1, s.lightness - parseFloat(t))
   }));
 }
-var zt = H($t), Rt = zt;
+var $t = H(zt), Rt = $t;
 function Pt(t, a) {
   if (a === "transparent") return a;
   var s = Z(a);
-  return Q(B({}, s, {
+  return Q(_({}, s, {
     saturation: cr(0, 1, s.saturation - parseFloat(t))
   }));
 }
@@ -1923,7 +1923,7 @@ function Wt(t) {
 function Tt(t, a) {
   if (a === "transparent") return a;
   var s = Z(a);
-  return Q(B({}, s, {
+  return Q(_({}, s, {
     lightness: cr(0, 1, s.lightness + parseFloat(t))
   }));
 }
@@ -1932,9 +1932,9 @@ function Et(t, a, s) {
   if (a === "transparent") return s;
   if (s === "transparent") return a;
   if (t === 0) return s;
-  var u = tr(a), d = B({}, u, {
+  var u = tr(a), d = _({}, u, {
     alpha: typeof u.alpha == "number" ? u.alpha : 1
-  }), g = tr(s), f = B({}, g, {
+  }), g = tr(s), f = _({}, g, {
     alpha: typeof g.alpha == "number" ? g.alpha : 1
   }), h = d.alpha - f.alpha, C = parseFloat(t) * 2 - 1, y = C * h === -1 ? C : C + h, k = 1 + C * h, S = (y / k + 1) / 2, p = 1 - S, R = {
     red: Math.floor(d.red * S + f.red * p),
@@ -1942,39 +1942,39 @@ function Et(t, a, s) {
     blue: Math.floor(d.blue * S + f.blue * p),
     alpha: d.alpha * parseFloat(t) + f.alpha * (1 - parseFloat(t))
   };
-  return zr(R);
+  return $r(R);
 }
-var Ot = H(Et), Ne = Ot;
-function Mt(t, a) {
+var Bt = H(Et), Ne = Bt;
+function Ot(t, a) {
   if (a === "transparent") return a;
-  var s = tr(a), u = typeof s.alpha == "number" ? s.alpha : 1, d = B({}, s, {
+  var s = tr(a), u = typeof s.alpha == "number" ? s.alpha : 1, d = _({}, s, {
     alpha: cr(0, 1, (u * 100 + parseFloat(t) * 100) / 100)
   });
-  return zr(d);
+  return $r(d);
 }
-H(Mt);
-function _t(t, a) {
+H(Ot);
+function Mt(t, a) {
   if (a === "transparent") return a;
   var s = Z(a);
-  return Q(B({}, s, {
+  return Q(_({}, s, {
     saturation: cr(0, 1, s.saturation + parseFloat(t))
   }));
 }
-H(_t);
-function Bt(t, a) {
-  return a === "transparent" ? a : Q(B({}, Z(a), {
+H(Mt);
+function _t(t, a) {
+  return a === "transparent" ? a : Q(_({}, Z(a), {
     hue: parseFloat(t)
   }));
 }
-H(Bt);
+H(_t);
 function Ht(t, a) {
-  return a === "transparent" ? a : Q(B({}, Z(a), {
+  return a === "transparent" ? a : Q(_({}, Z(a), {
     lightness: parseFloat(t)
   }));
 }
 H(Ht);
 function jt(t, a) {
-  return a === "transparent" ? a : Q(B({}, Z(a), {
+  return a === "transparent" ? a : Q(_({}, Z(a), {
     saturation: parseFloat(t)
   }));
 }
@@ -1989,14 +1989,14 @@ function Dt(t, a) {
 H(Dt);
 function At(t, a) {
   if (a === "transparent") return a;
-  var s = tr(a), u = typeof s.alpha == "number" ? s.alpha : 1, d = B({}, s, {
+  var s = tr(a), u = typeof s.alpha == "number" ? s.alpha : 1, d = _({}, s, {
     alpha: cr(0, 1, +(u * 100 - parseFloat(t) * 100).toFixed(2) / 100)
   });
-  return zr(d);
+  return $r(d);
 }
 H(At);
 const F = (t, a) => Qo(t, a);
-function _n(t) {
+function Mn(t) {
   const a = Wt(t), s = Math.max(Math.abs(a - 0.5) * 1.2, 0.3);
   return a < 0.5 ? It(s, t) : Rt(s, t);
 }
@@ -3221,6 +3221,31 @@ const Gt = {
       color: o.semantic.color.text.neutral700
     }
   },
+  pagination: {
+    bar: {
+      borderColor: o.semantic.color.border.neutral400,
+      borderSize: "1px 0 0",
+      gap: "3.2rem",
+      height: "4rem",
+      padding: "0 1.2rem",
+      fontSize: "1.2rem",
+      textColor: o.semantic.color.text.neutral700
+    },
+    navButton: {
+      color: o.semantic.color.text.neutral700,
+      disabledColor: o.semantic.color.text.neutral600,
+      width: "1.6rem",
+      height: "2rem",
+      padding: "0.4rem 0.2rem"
+    },
+    select: {
+      height: "2rem",
+      padding: "0 0.4rem",
+      gap: "0.4rem",
+      fontSize: "1.2rem",
+      textColor: o.semantic.color.text.neutral800
+    }
+  },
   components: {
     tablePagination: {
       paginationIconButton: {
@@ -3345,13 +3370,13 @@ const Gt = {
       }
     }
   }
-}, K = "transparent", $e = "0.4rem 0.6rem", ze = "0", Re = "0.4rem", Pe = "0", Ca = {
+}, K = "transparent", ze = "0.4rem 0.6rem", $e = "0", Re = "0.4rem", Pe = "0", Ca = {
   gap: "0.4rem",
   height: "2.7rem",
   lineHeight: "1.9rem",
   variants: {
     primary: {
-      padding: $e,
+      padding: ze,
       borderRadius: Re,
       states: {
         normal: {
@@ -3371,7 +3396,7 @@ const Gt = {
       }
     },
     destructive: {
-      padding: $e,
+      padding: ze,
       borderRadius: Re,
       states: {
         normal: {
@@ -3391,7 +3416,7 @@ const Gt = {
       }
     },
     "primary-inline": {
-      padding: ze,
+      padding: $e,
       borderRadius: Pe,
       states: {
         normal: {
@@ -3411,7 +3436,7 @@ const Gt = {
       }
     },
     "destructive-inline": {
-      padding: ze,
+      padding: $e,
       borderRadius: Pe,
       states: {
         normal: {
@@ -3539,6 +3564,10 @@ const Gt = {
         fontSize: o.core.font.fontSize.s14,
         fontWeight: "600"
       }
+    },
+    fontWeight: {
+      bold: "700",
+      semiBold: "600"
     }
   },
   body: {
@@ -3625,13 +3654,13 @@ const Gt = {
       borderColor: o.semantic.color.border.neutral300
     }
   }
-}, $a = {
+}, za = {
   bgColor: o.semantic.color.background.neutral100,
   textColor: o.semantic.color.background.neutral700,
   fontFamily: o.core.font.fontFamily.regular,
   fontSize: o.core.font.fontSize.s14,
   lineHeight: "1.4"
-}, za = {
+}, $a = {
   width: "0.5rem",
   height: "0.5rem",
   bgColor: o.semantic.color.background.neutral300,
@@ -3640,11 +3669,11 @@ const Gt = {
     bgColor: o.semantic.color.background.neutral600,
     borderRadius: "99rem"
   }
-}, Bn = {
+}, _n = {
   name: "old",
   ...o,
   components: {
-    actionIconButton: Bo,
+    actionIconButton: _o,
     appBar: Ho,
     appSelectionMenu: jo,
     autoComplete: Lo,
@@ -3697,8 +3726,8 @@ const Gt = {
     windowBar: Sa
   },
   globals: {
-    body: $a,
-    scrollbar: za
+    body: za,
+    scrollbar: $a
   }
 }, c = {
   transparent: "#00000000",
@@ -4325,7 +4354,7 @@ const Gt = {
   defaultItem: {
     gap: "0.4rem"
   }
-}, Oa = {
+}, Ba = {
   gap: "0.2rem",
   sizes: {
     small: {
@@ -4435,7 +4464,7 @@ const Gt = {
       }
     }
   }
-}, Ma = {
+}, Oa = {
   borderRadius: "0.4rem",
   border: `1px solid ${e.semantic.color.border.neutral600}`,
   fontSize: "1.4rem",
@@ -4478,13 +4507,13 @@ const Gt = {
       }
     }
   }
-}, _a = {
+}, Ma = {
   width: "100%",
   height: "fit-content",
   bgColor: e.semantic.color.background.neutral100,
   shadow: e.core.shadow.shadow4,
   borderRadius: "0.8rem"
-}, Ba = {
+}, _a = {
   width: "1.8rem",
   height: "1.8rem",
   padding: "0",
@@ -5449,7 +5478,7 @@ const Gt = {
 }, G = {
   bgColor: { disabled: e.semantic.color.background.neutral400 },
   textColor: { disabled: e.semantic.color.text.neutral600 }
-}, O = {
+}, B = {
   borderColor: { disabled: e.semantic.color.border.neutral500 },
   bgColor: { disabled: "transparent" },
   textColor: { disabled: e.semantic.color.text.neutral500 }
@@ -5492,9 +5521,9 @@ const Gt = {
           bgColor: X(e.semantic.color.background.success700, 12)
         },
         disabled: {
-          borderColor: O.borderColor.disabled,
-          bgColor: O.bgColor.disabled,
-          textColor: O.textColor.disabled
+          borderColor: B.borderColor.disabled,
+          bgColor: B.bgColor.disabled,
+          textColor: B.textColor.disabled
         }
       }
     },
@@ -5528,9 +5557,9 @@ const Gt = {
           bgColor: X(e.semantic.color.background.attention700, 12)
         },
         disabled: {
-          borderColor: O.borderColor.disabled,
-          bgColor: O.bgColor.disabled,
-          textColor: O.textColor.disabled
+          borderColor: B.borderColor.disabled,
+          bgColor: B.bgColor.disabled,
+          textColor: B.textColor.disabled
         }
       }
     },
@@ -5564,9 +5593,9 @@ const Gt = {
           bgColor: X(e.semantic.color.background.danger700, 12)
         },
         disabled: {
-          borderColor: O.borderColor.disabled,
-          bgColor: O.bgColor.disabled,
-          textColor: O.textColor.disabled
+          borderColor: B.borderColor.disabled,
+          bgColor: B.bgColor.disabled,
+          textColor: B.textColor.disabled
         }
       }
     },
@@ -5600,9 +5629,9 @@ const Gt = {
           bgColor: X(e.semantic.color.background.notice700, 12)
         },
         disabled: {
-          borderColor: O.borderColor.disabled,
-          bgColor: O.bgColor.disabled,
-          textColor: O.textColor.disabled
+          borderColor: B.borderColor.disabled,
+          bgColor: B.bgColor.disabled,
+          textColor: B.textColor.disabled
         }
       }
     },
@@ -5636,9 +5665,9 @@ const Gt = {
           bgColor: X(e.semantic.color.background.informative700, 12)
         },
         disabled: {
-          borderColor: O.borderColor.disabled,
-          bgColor: O.bgColor.disabled,
-          textColor: O.textColor.disabled
+          borderColor: B.borderColor.disabled,
+          bgColor: B.bgColor.disabled,
+          textColor: B.textColor.disabled
         }
       }
     }
@@ -5938,6 +5967,31 @@ const Gt = {
       color: e.semantic.color.text.neutral700
     }
   },
+  pagination: {
+    bar: {
+      borderColor: e.color.dusk200,
+      borderSize: "1px 0 0",
+      gap: "3.2rem",
+      height: "4rem",
+      padding: "0 1.2rem",
+      fontSize: "1.2rem",
+      textColor: e.semantic.color.text.neutral700
+    },
+    navButton: {
+      color: e.semantic.color.text.neutral700,
+      disabledColor: e.semantic.color.text.neutral600,
+      width: "1.6rem",
+      height: "2rem",
+      padding: "0.4rem 0.2rem"
+    },
+    select: {
+      height: "2rem",
+      padding: "0 0.4rem",
+      gap: "0.4rem",
+      fontSize: "1.2rem",
+      textColor: e.color.dusk800
+    }
+  },
   components: {
     tablePagination: {
       paginationIconButton: {
@@ -5945,7 +5999,7 @@ const Gt = {
         disabledColor: e.semantic.color.text.neutral700
       },
       paginationRow: {
-        borderTop: e.semantic.color.border.neutral400
+        borderTop: e.color.dusk200
       },
       countInfoText: {
         color: e.semantic.color.text.neutral700
@@ -6070,7 +6124,7 @@ const Gt = {
       }
     }
   }
-}, J = "transparent", Fe = "0.4rem 0.6rem", Ie = "0", Ee = "0.4rem", Oe = "0", x0 = {
+}, J = "transparent", Fe = "0.4rem 0.6rem", Ie = "0", Ee = "0.4rem", Be = "0", x0 = {
   gap: "0.4rem",
   height: "2.7rem",
   lineHeight: "1.9rem",
@@ -6118,7 +6172,7 @@ const Gt = {
     },
     "primary-inline": {
       padding: Ie,
-      borderRadius: Oe,
+      borderRadius: Be,
       states: {
         normal: {
           bgColor: J,
@@ -6138,7 +6192,7 @@ const Gt = {
     },
     "destructive-inline": {
       padding: Ie,
-      borderRadius: Oe,
+      borderRadius: Be,
       states: {
         normal: {
           bgColor: J,
@@ -6278,6 +6332,10 @@ const Gt = {
         fontSize: e.core.font.fontSize.s14,
         fontWeight: "600"
       }
+    },
+    fontWeight: {
+      bold: "700",
+      semiBold: "600"
     }
   },
   body: {
@@ -6370,7 +6428,7 @@ const Gt = {
   fontFamily: e.core.font.fontFamily.regular,
   fontSize: e.core.font.fontSize.s14,
   lineHeight: "1.4"
-}, $0 = {
+}, z0 = {
   width: "0.5rem",
   height: "0.5rem",
   bgColor: e.color.dusk100,
@@ -6379,7 +6437,7 @@ const Gt = {
     bgColor: e.color.dusk400,
     borderRadius: "99rem"
   }
-}, z0 = {
+}, $0 = {
   name: "light",
   ...e,
   components: {
@@ -6390,10 +6448,10 @@ const Gt = {
     badge: Fa,
     banner: Ia,
     boxSelectionGroup: Ea,
-    button: Oa,
-    buttonGroup: Ma,
-    card: _a,
-    checkbox: Ba,
+    button: Ba,
+    buttonGroup: Oa,
+    card: Ma,
+    checkbox: _a,
     chip: Ha,
     chipList: ja,
     countryFlag: La,
@@ -6437,7 +6495,7 @@ const Gt = {
   },
   globals: {
     body: S0,
-    scrollbar: $0
+    scrollbar: z0
   }
 }, i = {
   transparent: "#00000000",
@@ -6943,12 +7001,12 @@ const Gt = {
     screenMarginHeight: "6px",
     maxHeight: "50vh"
   }
-}, Me = "1px", F0 = {
+}, Oe = "1px", F0 = {
   padding: `${r.core.space.space025} ${r.core.space.space050}`,
   gap: r.core.space.space025,
   borderRadius: "2px",
-  height: `calc(${r.core.space.space200} + ${Me} * 2)`,
-  borderWidth: Me,
+  height: `calc(${r.core.space.space200} + ${Oe} * 2)`,
+  borderWidth: Oe,
   borderStyle: "solid",
   variants: {
     white: {
@@ -7064,7 +7122,7 @@ const Gt = {
   defaultItem: {
     gap: "0.4rem"
   }
-}, O0 = {
+}, B0 = {
   gap: "0.2rem",
   sizes: {
     small: {
@@ -7178,7 +7236,7 @@ const Gt = {
       }
     }
   }
-}, M0 = {
+}, O0 = {
   borderRadius: "0.4rem",
   border: `1px solid ${r.semantic.color.border.neutral600}`,
   fontSize: "1.4rem",
@@ -7221,13 +7279,13 @@ const Gt = {
       }
     }
   }
-}, _0 = {
+}, M0 = {
   width: "100%",
   height: "fit-content",
   bgColor: r.semantic.color.background.neutral100,
   shadow: r.core.shadow.shadow4,
   borderRadius: "0.8rem"
-}, B0 = {
+}, _0 = {
   width: "1.8rem",
   height: "1.8rem",
   padding: "0",
@@ -8171,7 +8229,7 @@ const Gt = {
 }, q = {
   bgColor: { disabled: r.semantic.color.background.neutral400 },
   textColor: { disabled: r.semantic.color.text.neutral600 }
-}, M = {
+}, O = {
   borderColor: { disabled: r.semantic.color.border.neutral500 },
   bgColor: { disabled: "transparent" },
   textColor: { disabled: r.semantic.color.text.neutral500 }
@@ -8214,9 +8272,9 @@ const Gt = {
           bgColor: N(r.semantic.color.background.success700, 12)
         },
         disabled: {
-          borderColor: M.borderColor.disabled,
-          bgColor: M.bgColor.disabled,
-          textColor: M.textColor.disabled
+          borderColor: O.borderColor.disabled,
+          bgColor: O.bgColor.disabled,
+          textColor: O.textColor.disabled
         }
       }
     },
@@ -8250,9 +8308,9 @@ const Gt = {
           bgColor: N(r.semantic.color.background.attention700, 12)
         },
         disabled: {
-          borderColor: M.borderColor.disabled,
-          bgColor: M.bgColor.disabled,
-          textColor: M.textColor.disabled
+          borderColor: O.borderColor.disabled,
+          bgColor: O.bgColor.disabled,
+          textColor: O.textColor.disabled
         }
       }
     },
@@ -8286,9 +8344,9 @@ const Gt = {
           bgColor: N(r.semantic.color.background.danger700, 12)
         },
         disabled: {
-          borderColor: M.borderColor.disabled,
-          bgColor: M.bgColor.disabled,
-          textColor: M.textColor.disabled
+          borderColor: O.borderColor.disabled,
+          bgColor: O.bgColor.disabled,
+          textColor: O.textColor.disabled
         }
       }
     },
@@ -8322,9 +8380,9 @@ const Gt = {
           bgColor: N(r.semantic.color.background.notice700, 12)
         },
         disabled: {
-          borderColor: M.borderColor.disabled,
-          bgColor: M.bgColor.disabled,
-          textColor: M.textColor.disabled
+          borderColor: O.borderColor.disabled,
+          bgColor: O.bgColor.disabled,
+          textColor: O.textColor.disabled
         }
       }
     },
@@ -8358,9 +8416,9 @@ const Gt = {
           bgColor: N(r.semantic.color.background.informative700, 12)
         },
         disabled: {
-          borderColor: M.borderColor.disabled,
-          bgColor: M.bgColor.disabled,
-          textColor: M.textColor.disabled
+          borderColor: O.borderColor.disabled,
+          bgColor: O.bgColor.disabled,
+          textColor: O.textColor.disabled
         }
       }
     }
@@ -8660,6 +8718,31 @@ const Gt = {
       color: r.semantic.color.text.neutral700
     }
   },
+  pagination: {
+    bar: {
+      borderColor: r.semantic.color.border.neutral400,
+      borderSize: "1px 0 0",
+      gap: "3.2rem",
+      height: "4rem",
+      padding: "0 1.2rem",
+      fontSize: "1.2rem",
+      textColor: r.color.dark200
+    },
+    navButton: {
+      color: r.color.dark200,
+      disabledColor: r.color.dark300,
+      width: "1.6rem",
+      height: "2rem",
+      padding: "0.4rem 0.2rem"
+    },
+    select: {
+      height: "2rem",
+      padding: "0 0.4rem",
+      gap: "0.4rem",
+      fontSize: "1.2rem",
+      textColor: r.color.dark50
+    }
+  },
   components: {
     tablePagination: {
       paginationIconButton: {
@@ -8795,13 +8878,13 @@ const Gt = {
       }
     }
   }
-}, V = "transparent", _e = "0.4rem 0.6rem", Be = "0", He = "0.4rem", je = "0", Cn = {
+}, V = "transparent", Me = "0.4rem 0.6rem", _e = "0", He = "0.4rem", je = "0", Cn = {
   gap: "0.4rem",
   height: "2.7rem",
   lineHeight: "1.9rem",
   variants: {
     primary: {
-      padding: _e,
+      padding: Me,
       borderRadius: He,
       states: {
         normal: {
@@ -8822,7 +8905,7 @@ const Gt = {
       }
     },
     destructive: {
-      padding: _e,
+      padding: Me,
       borderRadius: He,
       states: {
         normal: {
@@ -8842,7 +8925,7 @@ const Gt = {
       }
     },
     "primary-inline": {
-      padding: Be,
+      padding: _e,
       borderRadius: je,
       states: {
         normal: {
@@ -8862,7 +8945,7 @@ const Gt = {
       }
     },
     "destructive-inline": {
-      padding: Be,
+      padding: _e,
       borderRadius: je,
       states: {
         normal: {
@@ -9003,6 +9086,10 @@ const Gt = {
         fontSize: r.core.font.fontSize.s14,
         fontWeight: "600"
       }
+    },
+    fontWeight: {
+      bold: "700",
+      semiBold: "600"
     }
   },
   body: {
@@ -9089,13 +9176,13 @@ const Gt = {
       borderColor: r.semantic.color.border.neutral300
     }
   }
-}, $n = {
+}, zn = {
   bgColor: r.semantic.color.background.neutral100,
   textColor: r.semantic.color.background.neutral700,
   fontFamily: r.core.font.fontFamily.regular,
   fontSize: r.core.font.fontSize.s14,
   lineHeight: "1.4"
-}, zn = {
+}, $n = {
   width: "0.5rem",
   height: "0.5rem",
   bgColor: r.color.dark700,
@@ -9115,10 +9202,10 @@ const Gt = {
     badge: F0,
     banner: I0,
     boxSelectionGroup: E0,
-    button: O0,
-    buttonGroup: M0,
-    card: _0,
-    checkbox: B0,
+    button: B0,
+    buttonGroup: O0,
+    card: M0,
+    checkbox: _0,
     chip: H0,
     chipList: j0,
     countryFlag: L0,
@@ -9161,15 +9248,15 @@ const Gt = {
     windowBar: Sn
   },
   globals: {
-    body: $n,
-    scrollbar: zn
+    body: zn,
+    scrollbar: $n
   }
-}, lr = () => To() || z0, jn = (t) => $r`
+}, lr = () => To() || $0, jn = (t) => zr`
     &:focus-visible {
       outline: ${() => lr().core.focus.size} solid ${() => lr().core.focus.color};
       outline-offset: ${() => t || lr().core.focus.margin};
     }
-  `, Ln = (t) => $r`
+  `, Ln = (t) => zr`
     outline: ${() => lr().core.focus.size} solid ${() => lr().core.focus.color};
     outline-offset: ${() => t || lr().core.focus.margin};
   `, Lr = () => window.matchMedia("(prefers-color-scheme: dark)"), Rn = (t) => {
@@ -9277,12 +9364,12 @@ function Tn() {
     }
     function Ue(n, m, b) {
       {
-        var x = L.ReactDebugCurrentFrame, $ = x.getStackAddendum();
-        $ !== "" && (m += "%s", b = b.concat([$]));
-        var z = b.map(function(w) {
+        var x = L.ReactDebugCurrentFrame, z = x.getStackAddendum();
+        z !== "" && (m += "%s", b = b.concat([z]));
+        var $ = b.map(function(w) {
           return String(w);
         });
-        z.unshift("Warning: " + m), Function.prototype.apply.call(console[n], console, z);
+        $.unshift("Warning: " + m), Function.prototype.apply.call(console[n], console, $);
       }
     }
     var Ke = !1, Je = !1, Ve = !1, Ze = !1, Qe = !1, Ur;
@@ -9298,8 +9385,8 @@ function Tn() {
       var x = n.displayName;
       if (x)
         return x;
-      var $ = m.displayName || m.name || "";
-      return $ !== "" ? b + "(" + $ + ")" : b;
+      var z = m.displayName || m.name || "";
+      return z !== "" ? b + "(" + z + ")" : b;
     }
     function Kr(n) {
       return n.displayName || "Context";
@@ -9339,9 +9426,9 @@ function Tn() {
             var x = n.displayName || null;
             return x !== null ? x : D(n.type) || "Memo";
           case p: {
-            var $ = n, z = $._payload, w = $._init;
+            var z = n, $ = z._payload, w = z._init;
             try {
-              return D(w(z));
+              return D(w($));
             } catch {
               return null;
             }
@@ -9417,8 +9504,8 @@ function Tn() {
         if (Wr === void 0)
           try {
             throw Error();
-          } catch ($) {
-            var x = $.stack.trim().match(/\n( *(at )?)/);
+          } catch (z) {
+            var x = z.stack.trim().match(/\n( *(at )?)/);
             Wr = x && x[1] || "";
           }
         return `
@@ -9440,10 +9527,10 @@ function Tn() {
       }
       var x;
       Tr = !0;
-      var $ = Error.prepareStackTrace;
+      var z = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
-      var z;
-      z = Pr.current, Pr.current = null, oo();
+      var $;
+      $ = Pr.current, Pr.current = null, oo();
       try {
         if (m) {
           var w = function() {
@@ -9456,29 +9543,29 @@ function Tn() {
           }), typeof Reflect == "object" && Reflect.construct) {
             try {
               Reflect.construct(w, []);
-            } catch (_) {
-              x = _;
+            } catch (M) {
+              x = M;
             }
             Reflect.construct(n, [], w);
           } else {
             try {
               w.call();
-            } catch (_) {
-              x = _;
+            } catch (M) {
+              x = M;
             }
             n.call(w.prototype);
           }
         } else {
           try {
             throw Error();
-          } catch (_) {
-            x = _;
+          } catch (M) {
+            x = M;
           }
           n();
         }
-      } catch (_) {
-        if (_ && x && typeof _.stack == "string") {
-          for (var v = _.stack.split(`
+      } catch (M) {
+        if (M && x && typeof M.stack == "string") {
+          for (var v = M.stack.split(`
 `), I = x.stack.split(`
 `), P = v.length - 1, W = I.length - 1; P >= 1 && W >= 0 && v[P] !== I[W]; )
             W--;
@@ -9496,7 +9583,7 @@ function Tn() {
             }
         }
       } finally {
-        Tr = !1, Pr.current = z, to(), Error.prepareStackTrace = $;
+        Tr = !1, Pr.current = $, to(), Error.prepareStackTrace = z;
       }
       var nr = n ? n.displayName || n.name : "", er = nr ? fr(nr) : "";
       return typeof n == "function" && xr.set(n, er), er;
@@ -9528,9 +9615,9 @@ function Tn() {
           case S:
             return Cr(n.type, m, b);
           case p: {
-            var x = n, $ = x._payload, z = x._init;
+            var x = n, z = x._payload, $ = x._init;
             try {
-              return Cr(z($), m, b);
+              return Cr($(z), m, b);
             } catch {
             }
           }
@@ -9545,11 +9632,11 @@ function Tn() {
       } else
         le.setExtraStackFrame(null);
     }
-    function co(n, m, b, x, $) {
+    function co(n, m, b, x, z) {
       {
-        var z = Function.call.bind(sr);
+        var $ = Function.call.bind(sr);
         for (var w in n)
-          if (z(n, w)) {
+          if ($(n, w)) {
             var v = void 0;
             try {
               if (typeof n[w] != "function") {
@@ -9560,7 +9647,7 @@ function Tn() {
             } catch (P) {
               v = P;
             }
-            v && !(v instanceof Error) && (hr($), 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).", x || "React class", b, w, typeof v), hr(null)), v instanceof Error && !(v.message in ne) && (ne[v.message] = !0, hr($), T("Failed %s type: %s", b, v.message), hr(null));
+            v && !(v instanceof Error) && (hr(z), 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).", x || "React class", b, w, typeof v), hr(null)), v instanceof Error && !(v.message in ne) && (ne[v.message] = !0, hr(z), T("Failed %s type: %s", b, v.message), hr(null));
           }
       }
     }
@@ -9639,7 +9726,7 @@ function Tn() {
         });
       }
     }
-    var Co = function(n, m, b, x, $, z, w) {
+    var Co = function(n, m, b, x, z, $, w) {
       var v = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: a,
@@ -9649,7 +9736,7 @@ function Tn() {
         ref: b,
         props: w,
         // Record the component responsible for creating this element.
-        _owner: z
+        _owner: $
       };
       return v._store = {}, Object.defineProperty(v._store, "validated", {
         configurable: !1,
@@ -9665,25 +9752,25 @@ function Tn() {
         configurable: !1,
         enumerable: !1,
         writable: !1,
-        value: $
+        value: z
       }), Object.freeze && (Object.freeze(v.props), Object.freeze(v)), v;
     };
-    function ho(n, m, b, x, $) {
+    function ho(n, m, b, x, z) {
       {
-        var z, w = {}, v = null, I = null;
-        b !== void 0 && (ie(b), v = "" + b), bo(m) && (ie(m.key), v = "" + m.key), go(m) && (I = m.ref, po(m, $));
-        for (z in m)
-          sr.call(m, z) && !uo.hasOwnProperty(z) && (w[z] = m[z]);
+        var $, w = {}, v = null, I = null;
+        b !== void 0 && (ie(b), v = "" + b), bo(m) && (ie(m.key), v = "" + m.key), go(m) && (I = m.ref, po(m, z));
+        for ($ in m)
+          sr.call(m, $) && !uo.hasOwnProperty($) && (w[$] = m[$]);
         if (n && n.defaultProps) {
           var P = n.defaultProps;
-          for (z in P)
-            w[z] === void 0 && (w[z] = P[z]);
+          for ($ in P)
+            w[$] === void 0 && (w[$] = P[$]);
         }
         if (v || I) {
           var W = typeof n == "function" ? n.displayName || n.name || "Unknown" : n;
           v && fo(w, W), I && xo(w, W);
         }
-        return Co(n, v, I, $, x, dr.current, w);
+        return Co(n, v, I, z, x, dr.current, w);
       }
     }
     var Er = L.ReactCurrentOwner, me = L.ReactDebugCurrentFrame;
@@ -9694,9 +9781,9 @@ function Tn() {
       } else
         me.setExtraStackFrame(null);
     }
-    var Or;
-    Or = !1;
-    function Mr(n) {
+    var Br;
+    Br = !1;
+    function Or(n) {
       return typeof n == "object" && n !== null && n.$$typeof === a;
     }
     function ue() {
@@ -9747,15 +9834,15 @@ Check the top-level render call using <` + b + ">.");
         if (Fr(n))
           for (var b = 0; b < n.length; b++) {
             var x = n[b];
-            Mr(x) && be(x, m);
+            Or(x) && be(x, m);
           }
-        else if (Mr(n))
+        else if (Or(n))
           n._store && (n._store.validated = !0);
         else if (n) {
-          var $ = pr(n);
-          if (typeof $ == "function" && $ !== n.entries)
-            for (var z = $.call(n), w; !(w = z.next()).done; )
-              Mr(w.value) && be(w.value, m);
+          var z = pr(n);
+          if (typeof z == "function" && z !== n.entries)
+            for (var $ = z.call(n), w; !(w = $.next()).done; )
+              Or(w.value) && be(w.value, m);
         }
       }
     }
@@ -9776,10 +9863,10 @@ Check the top-level render call using <` + b + ">.");
         if (b) {
           var x = D(m);
           co(b, n.props, "prop", x, n);
-        } else if (m.PropTypes !== void 0 && !Or) {
-          Or = !0;
-          var $ = D(m);
-          T("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", $ || "Unknown");
+        } else if (m.PropTypes !== void 0 && !Br) {
+          Br = !0;
+          var z = D(m);
+          T("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", z || "Unknown");
         }
         typeof m.getDefaultProps == "function" && !m.getDefaultProps.isReactClassApproved && T("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
       }
@@ -9797,7 +9884,7 @@ Check the top-level render call using <` + b + ">.");
       }
     }
     var fe = {};
-    function xe(n, m, b, x, $, z) {
+    function xe(n, m, b, x, z, $) {
       {
         var w = ro(n);
         if (!w) {
@@ -9808,7 +9895,7 @@ Check the top-level render call using <` + b + ">.");
           var P;
           n === null ? P = "null" : Fr(n) ? P = "array" : n !== void 0 && n.$$typeof === a ? (P = "<" + (D(n.type) || "Unknown") + " />", v = " Did you accidentally export a JSX literal instead of a component?") : P = typeof n, 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, v);
         }
-        var W = ho(n, m, b, $, z);
+        var W = ho(n, m, b, z, $);
         if (W == null)
           return W;
         if (w) {
@@ -9825,17 +9912,17 @@ Check the top-level render call using <` + b + ">.");
               pe(j, n);
         }
         if (sr.call(m, "key")) {
-          var er = D(n), _ = Object.keys(m).filter(function(Wo) {
+          var er = D(n), M = Object.keys(m).filter(function(Wo) {
             return Wo !== "key";
-          }), _r = _.length > 0 ? "{key: someKey, " + _.join(": ..., ") + ": ...}" : "{key: someKey}";
-          if (!fe[er + _r]) {
-            var Po = _.length > 0 ? "{" + _.join(": ..., ") + ": ...}" : "{}";
+          }), Mr = M.length > 0 ? "{key: someKey, " + M.join(": ..., ") + ": ...}" : "{key: someKey}";
+          if (!fe[er + Mr]) {
+            var Po = M.length > 0 ? "{" + M.join(": ..., ") + ": ...}" : "{}";
             T(`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} />`, _r, er, Po, er), fe[er + _r] = !0;
+  <%s key={someKey} {...props} />`, Mr, er, Po, er), fe[er + Mr] = !0;
           }
         }
         return n === u ? wo(W) : vo(W), W;
@@ -9844,20 +9931,20 @@ React keys must be passed directly to JSX without using spread:
     function So(n, m, b) {
       return xe(n, m, b, !0);
     }
-    function $o(n, m, b) {
+    function zo(n, m, b) {
       return xe(n, m, b, !1);
     }
-    var zo = $o, Ro = So;
-    ur.Fragment = u, ur.jsx = zo, ur.jsxs = Ro;
+    var $o = zo, Ro = So;
+    ur.Fragment = u, ur.jsx = $o, ur.jsxs = Ro;
   }()), ur;
 }
 process.env.NODE_ENV === "production" ? Nr.exports = Wn() : Nr.exports = Tn();
 var Yr = Nr.exports;
-const Ye = Oo(null), Fn = ({ children: t, selectedTheme: a, setSelectedTheme: s, lightThemeName: u, darkThemeName: d, systemThemeName: g }) => {
-  const f = Mo(() => ({ selectedTheme: a, setSelectedTheme: s, lightThemeName: u, darkThemeName: d, systemThemeName: g }), [a, s, u, d, g]);
+const Ye = Bo(null), Fn = ({ children: t, selectedTheme: a, setSelectedTheme: s, lightThemeName: u, darkThemeName: d, systemThemeName: g }) => {
+  const f = Oo(() => ({ selectedTheme: a, setSelectedTheme: s, lightThemeName: u, darkThemeName: d, systemThemeName: g }), [a, s, u, d, g]);
   return Yr.jsx(Ye.Provider, { value: f, children: t });
 }, Dn = () => {
-  const t = _o(Ye);
+  const t = Mo(Ye);
   if (!t)
     throw new Error("Missing ThemeSwitchContext");
   return t;
@@ -9867,7 +9954,7 @@ const Ye = Oo(null), Fn = ({ children: t, selectedTheme: a, setSelectedTheme: s,
     ...C
   });
   return Pn({ storageKey: g, value: y, onChange: k }), Yr.jsx(Fo, { theme: S === (s == null ? void 0 : s.name) ? s : a, children: Yr.jsx(Fn, { selectedTheme: y, setSelectedTheme: k, ...C, children: t }) });
-}, In = $r`
+}, In = zr`
   body {
     background: ${({ theme: t }) => t.globals.body.bgColor};
     color: ${({ theme: t }) => t.globals.body.textColor};
@@ -9877,7 +9964,7 @@ const Ye = Oo(null), Fn = ({ children: t, selectedTheme: a, setSelectedTheme: s,
 
     color-scheme: only ${({ theme: t }) => t.name === "dark" ? "dark" : "light"};
   }
-`, En = $r`
+`, En = zr`
   @media (pointer: fine) {
     @-moz-document url-prefix() {
       * {
@@ -9924,14 +10011,14 @@ export {
   Fn as ThemeSwitchProvider,
   jn as getFocusStyle,
   Ln as getFocusStyleProperties,
-  z0 as theme,
+  $0 as theme,
   Hn as themeDark,
-  z0 as themeLight,
-  Bn as themeOld,
+  $0 as themeLight,
+  _n as themeOld,
   Pn as useStorage,
   lr as useTheme,
   Rn as useThemeSelector,
   Dn as useThemeSwitchContext,
-  _n as withContrast,
+  Mn as withContrast,
   F as withOpacity
 };