@protonradio/proton-ui 0.7.8 → 0.7.10

package/dist/index.es.js

@@ -4,7 +4,7 @@ import { e as W, i as Nr, h as yi, a as _c, D as en, t as El } from "./utils-Bc2
 import { THEMES as Pt, BREAKPOINTS as $i } from "./constants.es.js";
 import { transparentize as Gn, parseToRgba as Rc } from "color2k";
 import { G as ge, S as tn, W as nn, D as rn } from "./colors-Dwh4VIMR.mjs";
-import { c as b4 } from "./colors-Dwh4VIMR.mjs";
+import { c as y4 } from "./colors-Dwh4VIMR.mjs";
 var cr = { exports: {} }, Mt = {};
 /**
  * @license React
@@ -158,7 +158,7 @@ function Lc() {
         T++;
       }
     }
-    function ke() {
+    function Te() {
       {
         if (T--, T === 0) {
           var h = {
@@ -278,7 +278,7 @@ function Lc() {
             }
         }
       } finally {
-        vt = !1, Se.current = ee, ke(), Error.prepareStackTrace = Z;
+        vt = !1, Se.current = ee, Te(), Error.prepareStackTrace = Z;
       }
       var gt = h ? h.displayName || h.name : "", lt = gt ? pt(gt) : "";
       return typeof h == "function" && ht.set(h, lt), lt;
@@ -4127,17 +4127,17 @@ function tp(t) {
 function jo(t) {
   let { selectionManager: e, keyboardDelegate: n, ref: r, autoFocus: l = !1, shouldFocusWrap: i = !1, disallowEmptySelection: o = !1, disallowSelectAll: a = !1, selectOnFocus: u = e.selectionBehavior === "replace", disallowTypeAhead: s = !1, shouldUseVirtualFocus: c, allowsTabNavigation: d = !1, isVirtualized: f, scrollRef: p = r, linkBehavior: m = "action" } = t, { direction: y } = He(), g = Yt(), C = (E) => {
     if (E.altKey && E.key === "Tab" && E.preventDefault(), !r.current.contains(E.target)) return;
-    const w = (O, ke) => {
+    const w = (O, Te) => {
       if (O != null) {
         if (e.isLink(O) && m === "selection" && u && !wr(E)) {
           Fc(() => {
-            e.setFocusedKey(O, ke);
+            e.setFocusedKey(O, Te);
           });
           let Se = p.current.querySelector(`[data-key="${CSS.escape(O.toString())}"]`), Ge = e.getItemProps(O);
           g.open(Se, E, Ge.href, Ge.routerOptions);
           return;
         }
-        if (e.setFocusedKey(O, ke), e.isLink(O) && m === "override") return;
+        if (e.setFocusedKey(O, Te), e.isLink(O) && m === "override") return;
         E.shiftKey && e.selectionMode === "multiple" ? e.extendSelection(O) : u && !wr(E) && e.replaceSelection(O);
       }
     };
@@ -4208,11 +4208,11 @@ function jo(t) {
           else {
             let O = $e(r.current, {
               tabbable: !0
-            }), ke, Se;
+            }), Te, Se;
             do
-              Se = O.lastChild(), Se && (ke = Se);
+              Se = O.lastChild(), Se && (Te = Se);
             while (Se);
-            ke && !ke.contains(document.activeElement) && Le(ke);
+            Te && !Te.contains(document.activeElement) && Le(Te);
           }
           break;
         }
@@ -4663,7 +4663,7 @@ Uo.getCollectionNode = function* (e) {
     }
   };
 };
-let Gh = Uo;
+let Yh = Uo;
 class lp {
   build(e, n) {
     return this.context = n, ei(() => this.iterateCollection(e));
@@ -5250,7 +5250,7 @@ function Ka(t, e, n) {
     // is slightly different from other collections because
     // actions are performed on key down rather than key up.
     linkBehavior: "none"
-  }), { pressProps: O, isPressed: ke } = ze({
+  }), { pressProps: O, isPressed: Te } = ze({
     onPressStart: xe,
     onPress: c,
     onPressUp: Be,
@@ -5310,7 +5310,7 @@ function Ka(t, e, n) {
     },
     isFocused: Ue,
     isSelected: B,
-    isPressed: ke,
+    isPressed: Te,
     isDisabled: R
   };
 }
@@ -7784,9 +7784,9 @@ class oi {
     this.lastKey = (i = r == null ? void 0 : r.key) !== null && i !== void 0 ? i : null;
   }
 }
-class Te extends Set {
+class Ae extends Set {
   constructor(e, n, r) {
-    super(e), e instanceof Te ? (this.anchorKey = n ?? e.anchorKey, this.currentKey = r ?? e.currentKey) : (this.anchorKey = n, this.currentKey = r);
+    super(e), e instanceof Ae ? (this.anchorKey = n ?? e.anchorKey, this.currentKey = r ?? e.currentKey) : (this.anchorKey = n, this.currentKey = r);
   }
 }
 function Gp(t, e) {
@@ -7798,7 +7798,7 @@ function Gp(t, e) {
 function rl(t) {
   let { selectionMode: e = "none", disallowEmptySelection: n, allowDuplicateSelectionEvents: r, selectionBehavior: l = "toggle", disabledBehavior: i = "all" } = t, o = M(!1), [, a] = z(!1), u = M(null), s = M(null), [, c] = z(null), d = V(() => ai(t.selectedKeys), [
     t.selectedKeys
-  ]), f = V(() => ai(t.defaultSelectedKeys, new Te()), [
+  ]), f = V(() => ai(t.defaultSelectedKeys, new Ae()), [
     t.defaultSelectedKeys
   ]), [p, m] = rt(d, f, t.onSelectionChange), y = V(() => t.disabledKeys ? new Set(t.disabledKeys) : /* @__PURE__ */ new Set(), [
     t.disabledKeys
@@ -7838,7 +7838,7 @@ function rl(t) {
   };
 }
 function ai(t, e) {
-  return t ? t === "all" ? "all" : new Te(t) : e;
+  return t ? t === "all" ? "all" : new Ae(t) : e;
 }
 class ll {
   /**
@@ -7961,14 +7961,14 @@ class ll {
     }
     e = this.getKey(e);
     let n;
-    if (this.state.selectedKeys === "all") n = new Te([
+    if (this.state.selectedKeys === "all") n = new Ae([
       e
     ], e, e);
     else {
       let i = this.state.selectedKeys;
       var r;
       let o = (r = i.anchorKey) !== null && r !== void 0 ? r : e;
-      n = new Te(i, o, e);
+      n = new Ae(i, o, e);
       var l;
       for (let a of this.getKeyRange(o, (l = i.currentKey) !== null && l !== void 0 ? l : e)) n.delete(a);
       for (let a of this.getKeyRange(e, o)) this.canSelectItem(a) && n.add(a);
@@ -8006,7 +8006,7 @@ class ll {
       return;
     }
     if (e = this.getKey(e), e == null) return;
-    let n = new Te(this.state.selectedKeys === "all" ? this.getSelectAllKeys() : this.state.selectedKeys);
+    let n = new Ae(this.state.selectedKeys === "all" ? this.getSelectAllKeys() : this.state.selectedKeys);
     n.has(e) ? n.delete(e) : this.canSelectItem(e) && (n.add(e), n.anchorKey = e, n.currentKey = e), !(this.disallowEmptySelection && n.size === 0) && this.state.setSelectedKeys(n);
   }
   /**
@@ -8014,9 +8014,9 @@ class ll {
   */
   replaceSelection(e) {
     if (this.selectionMode === "none" || (e = this.getKey(e), e == null)) return;
-    let n = this.canSelectItem(e) ? new Te([
+    let n = this.canSelectItem(e) ? new Ae([
       e
-    ], e, e) : new Te();
+    ], e, e) : new Ae();
     this.state.setSelectedKeys(n);
   }
   /**
@@ -8024,7 +8024,7 @@ class ll {
   */
   setSelectedKeys(e) {
     if (this.selectionMode === "none") return;
-    let n = new Te();
+    let n = new Ae();
     for (let r of e)
       if (r = this.getKey(r), r != null && (n.add(r), this.selectionMode === "single"))
         break;
@@ -8052,7 +8052,7 @@ class ll {
   * Removes all keys from the selection.
   */
   clearSelection() {
-    !this.disallowEmptySelection && (this.state.selectedKeys === "all" || this.state.selectedKeys.size > 0) && this.state.setSelectedKeys(new Te());
+    !this.disallowEmptySelection && (this.state.selectedKeys === "all" || this.state.selectedKeys.size > 0) && this.state.setSelectedKeys(new Ae());
   }
   /**
   * Toggles between select all and an empty selection.
@@ -8700,7 +8700,7 @@ Ls.getCollectionNode = function* (e, n) {
     }), yield* i;
   }
 };
-let Yh = Ls;
+let qh = Ls;
 function Os(t) {
   return null;
 }
@@ -8730,7 +8730,7 @@ Os.getCollectionNode = function* (e) {
     }
   };
 };
-let qh = Os;
+let Xh = Os;
 function zs(t) {
   return null;
 }
@@ -8823,7 +8823,7 @@ Br.getCollectionNode = function* (e, n) {
     }
   };
 };
-let Xh = Br;
+let uv = Br;
 function js(t) {
   return null;
 }
@@ -8838,11 +8838,11 @@ js.getCollectionNode = function* (e) {
     hasChildNodes: !1
   };
 };
-let uv = js;
-const sv = 1500, si = 500;
-let it = {}, cv = 0, Nt = !1, Re = null, ot = null;
+let sv = js;
+const cv = 1500, si = 500;
+let it = {}, dv = 0, Nt = !1, Re = null, ot = null;
 function Vs(t = {}) {
-  let { delay: e = sv, closeDelay: n = si } = t, { isOpen: r, open: l, close: i } = Rn(t), o = V(() => `${++cv}`, []), a = M(void 0), u = M(i), s = () => {
+  let { delay: e = cv, closeDelay: n = si } = t, { isOpen: r, open: l, close: i } = Rn(t), o = V(() => `${++dv}`, []), a = M(void 0), u = M(i), s = () => {
     it[o] = f;
   }, c = () => {
     for (let m in it) m !== o && (it[m](!0), delete it[m]);
@@ -8875,7 +8875,7 @@ function Vs(t = {}) {
     close: f
   };
 }
-class dv {
+class fv {
   *[Symbol.iterator]() {
     yield* this.iterable;
   }
@@ -8923,7 +8923,7 @@ class dv {
 function Hs(t) {
   let { onExpandedChange: e } = t, [n, r] = rt(t.expandedKeys ? new Set(t.expandedKeys) : void 0, t.defaultExpandedKeys ? new Set(t.defaultExpandedKeys) : /* @__PURE__ */ new Set(), e), l = rl(t), i = V(() => t.disabledKeys ? new Set(t.disabledKeys) : /* @__PURE__ */ new Set(), [
     t.disabledKeys
-  ]), o = Zr(t, X((u) => new dv(u, {
+  ]), o = Zr(t, X((u) => new fv(u, {
     expandedKeys: n
   }), [
     n
@@ -8938,17 +8938,17 @@ function Hs(t) {
     expandedKeys: n,
     disabledKeys: i,
     toggleKey: (u) => {
-      r(fv(n, u));
+      r(pv(n, u));
     },
     setExpandedKeys: r,
     selectionManager: new ll(o, l)
   };
 }
-function fv(t, e) {
+function pv(t, e) {
   let n = new Set(t);
   return n.has(e) ? n.delete(e) : n.add(e), n;
 }
-function pv(t = !0) {
+function vv(t = !0) {
   Kc(() => {
     if (!t) return;
     const e = window.getComputedStyle(document.body).overflow;
@@ -8957,7 +8957,7 @@ function pv(t = !0) {
     };
   }, [t]);
 }
-function vv({
+function hv({
   fadeIn: t = !1,
   onClose: e,
   children: n
@@ -8991,8 +8991,8 @@ function vv({
     }
   );
 }
-const hv = ({ children: t }) => {
-  const { className: e, style: n } = Ae(), r = (() => {
+const mv = ({ children: t }) => {
+  const { className: e, style: n } = ke(), r = (() => {
     let l = document.getElementById("action-menus-root");
     return l || (l = document.createElement("div"), l.id = "action-menus-root", document.body.appendChild(l)), l.className = e, Object.entries(n).forEach(([i, o]) => {
       l.style.setProperty(i, o);
@@ -9012,8 +9012,8 @@ const hv = ({ children: t }) => {
   onClose: s,
   "data-testid": c
 }) => {
-  pv(t);
-  const { className: d, theme: f } = Ae(), [p, m] = z(!1), [y, g] = z(0), C = M(null), S = M(null), $ = M(window.location.pathname), D = o && o.length > 0, P = () => {
+  vv(t);
+  const { className: d, theme: f } = ke(), [p, m] = z(!1), [y, g] = z(0), C = M(null), S = M(null), $ = M(window.location.pathname), D = o && o.length > 0, P = () => {
     m(!0), g(0), setTimeout(() => {
       s == null || s(), m(!1);
     }, 300);
@@ -9048,14 +9048,14 @@ const hv = ({ children: t }) => {
     a && ($.current && $.current !== location.pathname && P(), $.current = location.pathname);
   }, [p, a]);
   const v = C.current ? C.current.getBoundingClientRect().height > window.innerHeight : !1, B = l || D || i;
-  return t ? /* @__PURE__ */ b.jsx(hv, { children: /* @__PURE__ */ b.jsx(
+  return t ? /* @__PURE__ */ b.jsx(mv, { children: /* @__PURE__ */ b.jsx(
     "div",
     {
       className: "proton-ActionMenu__background-wrapper",
       style: {
         opacity: p ? 0 : 1
       },
-      children: /* @__PURE__ */ b.jsx(vv, { fadeIn: !0, onClose: P, children: /* @__PURE__ */ b.jsx(
+      children: /* @__PURE__ */ b.jsx(hv, { fadeIn: !0, onClose: P, children: /* @__PURE__ */ b.jsx(
         "div",
         {
           "data-testid": c || "ActionMenu-wrapper",
@@ -9079,7 +9079,7 @@ const hv = ({ children: t }) => {
                       e === "none" && "proton-ActionMenu__list--disabled"
                     ),
                     children: Array.from(k.collection).map((E) => /* @__PURE__ */ b.jsx(
-                      mv,
+                      bv,
                       {
                         item: E,
                         state: k,
@@ -9112,7 +9112,7 @@ const hv = ({ children: t }) => {
       ) })
     }
   ) }) : null;
-}, mv = ({ to: t, state: e, item: n }) => {
+}, bv = ({ to: t, state: e, item: n }) => {
   const r = M(null), { menuItemProps: l } = Ka({ key: n.key }, e, r), i = t ? "a" : "div", o = t && Nr(t);
   return /* @__PURE__ */ bi(
     i,
@@ -9132,12 +9132,12 @@ const hv = ({ children: t }) => {
     },
     n.rendered
   );
-}, Us = Q(void 0), Ae = () => {
+}, Us = Q(void 0), ke = () => {
   const t = Y(Us);
   if (t === void 0)
     throw new Error("useTheme must be used within a ThemeProvider");
   return t;
-}, bv = {
+}, gv = {
   [Pt.DARK]: "proton-ui__theme--dark",
   [Pt.CUSTOM_DARK]: "proton-ui__theme--custom-dark",
   [Pt.LIGHT]: "proton-ui__theme--light"
@@ -9146,8 +9146,8 @@ const hv = ({ children: t }) => {
   children: e,
   palette: n = _c
 }) => {
-  const r = M(null), l = bv[t], i = V(
-    () => yv(n, t),
+  const r = M(null), l = gv[t], i = V(
+    () => $v(n, t),
     [n, t]
   );
   return L(() => {
@@ -9166,7 +9166,7 @@ const hv = ({ children: t }) => {
       children: /* @__PURE__ */ b.jsx("div", { ref: r, children: e })
     }
   );
-}, gv = (t) => ({
+}, yv = (t) => ({
   //brand colors
   "--proton-color__primary": t.BRAND.PRIMARY,
   "--proton-color__primary-light": t.BRAND.PRIMARY_LIGHT,
@@ -9188,8 +9188,8 @@ const hv = ({ children: t }) => {
   "--proton-control__secondary-lightest": t.SECONDARY.SECONDARY_LIGHTEST,
   "--proton-control__secondary-super-light": t.SECONDARY.SECONDARY_SUPER_LIGHT
 });
-function yv(t, e) {
-  const n = Gn(t.BRAND.PRIMARY, 0.6), r = Gn(t.BRAND.PRIMARY_LIGHT, 0.4), l = gv(t);
+function $v(t, e) {
+  const n = Gn(t.BRAND.PRIMARY, 0.6), r = Gn(t.BRAND.PRIMARY_LIGHT, 0.4), l = yv(t);
   switch (e) {
     case Pt.DARK:
       return {
@@ -9236,7 +9236,7 @@ const Jh = {
   warning: "warning",
   danger: "danger"
 }, Qh = ({ variant: t, children: e, ...n }) => {
-  const { className: r } = Ae();
+  const { className: r } = ke();
   return /* @__PURE__ */ b.jsx(
     "div",
     {
@@ -9318,7 +9318,7 @@ const Ys = {
       d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z"
     }
   ) })
-}, $v = {
+}, xv = {
   default: {
     background: ge.GRAY_LIGHTEST,
     title: ge.GRAY_DARK,
@@ -9343,7 +9343,7 @@ const Ys = {
     content: rn.MEDIUM,
     icon: rn.LIGHT
   }
-}, xv = {
+}, Ev = {
   default: "default",
   success: "success",
   warning: "warning",
@@ -9380,7 +9380,7 @@ const Ys = {
       }
     )
   }
-) }), Ev = ({ children: t, ...e }) => {
+) }), Sv = ({ children: t, ...e }) => {
   const n = Y(Nn);
   if (!n) throw new Error("BannerTitle must be used within a Banner");
   return /* @__PURE__ */ b.jsx(
@@ -9395,7 +9395,7 @@ const Ys = {
       children: t
     }
   );
-}, Sv = ({ children: t, ...e }) => {
+}, Cv = ({ children: t, ...e }) => {
   const n = Y(Nn);
   if (!n) throw new Error("BannerContent must be used within a Banner");
   return /* @__PURE__ */ b.jsx(
@@ -9410,7 +9410,7 @@ const Ys = {
       children: t
     }
   );
-}, Cv = ({ children: t, icon: e, ...n }) => {
+}, wv = ({ children: t, icon: e, ...n }) => {
   const r = Y(Nn);
   if (!r) throw new Error("BannerIcon must be used within a Banner");
   const i = Mc(e) ? e : e === !0 ? Ys[r] : t || null;
@@ -9423,17 +9423,17 @@ const Ys = {
       children: i
     }
   ) : null;
-}, wv = ({ children: t, ...e }) => /* @__PURE__ */ b.jsx(Gs, { ...e, children: t }), Pv = ({ children: t }) => /* @__PURE__ */ b.jsx("div", { className: "proton-Banner__actions", children: t });
-We.Title = Ev;
-We.Content = Sv;
-We.Icon = Cv;
-We.Action = wv;
-We.Actions = Pv;
-We.colors = $v;
+}, Pv = ({ children: t, ...e }) => /* @__PURE__ */ b.jsx(Gs, { ...e, children: t }), Dv = ({ children: t }) => /* @__PURE__ */ b.jsx("div", { className: "proton-Banner__actions", children: t });
+We.Title = Sv;
+We.Content = Cv;
+We.Icon = wv;
+We.Action = Pv;
+We.Actions = Dv;
+We.colors = xv;
 We.icons = Ys;
-We.variants = xv;
+We.variants = Ev;
 let qs = Q(null);
-function Dv(t) {
+function kv(t) {
   let e = {
     ...t,
     "data-testid": void 0
@@ -9449,7 +9449,7 @@ function Dv(t) {
     }
   );
 }
-Dv.Option = function(e) {
+kv.Option = function(e) {
   let n = {
     ...e,
     "data-testid": void 0
@@ -9477,14 +9477,14 @@ function e4({ title: t, children: e, ...n }) {
     e
   ] });
 }
-const kv = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cdefs%3e%3csymbol%20id='external-link'%20viewBox='0%200%20512%20512'%3e%3cpath%20d='M384%20224v184a40%2040%200%2001-40%2040H104a40%2040%200%2001-40-40V168a40%2040%200%200140-40h167.48M336%2064h112v112M224%20288L440%2072'%20fill='none'%20stroke='currentColor'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='32'/%3e%3c/symbol%3e%3csymbol%20id='caret-down'%20viewBox='0%200%20512%20512'%3e%3cpath%20fill='currentColor'%20d='M233.4%20406.6c12.5%2012.5%2032.8%2012.5%2045.3%200l192-192c12.5-12.5%2012.5-32.8%200-45.3s-32.8-12.5-45.3%200L256%20338.7L86.6%20169.4c-12.5-12.5-32.8-12.5-45.3%200s-12.5%2032.8%200%2045.3l192%20192z'/%3e%3c/symbol%3e%3c/defs%3e%3c/svg%3e";
-function Tv(t) {
+const Tv = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cdefs%3e%3csymbol%20id='external-link'%20viewBox='0%200%20512%20512'%3e%3cpath%20d='M384%20224v184a40%2040%200%2001-40%2040H104a40%2040%200%2001-40-40V168a40%2040%200%200140-40h167.48M336%2064h112v112M224%20288L440%2072'%20fill='none'%20stroke='currentColor'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='32'/%3e%3c/symbol%3e%3csymbol%20id='caret-down'%20viewBox='0%200%20512%20512'%3e%3cpath%20fill='currentColor'%20d='M233.4%20406.6c12.5%2012.5%2032.8%2012.5%2045.3%200l192-192c12.5-12.5%2012.5-32.8%200-45.3s-32.8-12.5-45.3%200L256%20338.7L86.6%20169.4c-12.5-12.5-32.8-12.5-45.3%200s-12.5%2032.8%200%2045.3l192%20192z'/%3e%3c/symbol%3e%3c/defs%3e%3c/svg%3e";
+function Av(t) {
   let e = {
     height: t.size || void 0,
     width: t.size || void 0,
     color: t.color || void 0
   };
-  return /* @__PURE__ */ b.jsx("svg", { style: e, ...t, children: /* @__PURE__ */ b.jsx("use", { href: `${kv}#${t.id}` }) });
+  return /* @__PURE__ */ b.jsx("svg", { style: e, ...t, children: /* @__PURE__ */ b.jsx("use", { href: `${Tv}#${t.id}` }) });
 }
 function t4(t) {
   const [e, n] = z("");
@@ -9497,10 +9497,10 @@ function t4(t) {
         style: { display: "none" }
       }
     ),
-    /* @__PURE__ */ b.jsx(Tv, { ...t })
+    /* @__PURE__ */ b.jsx(Av, { ...t })
   ] }) : null;
 }
-const Av = dt(
+const Bv = dt(
   ({
     prefix: t,
     suffix: e,
@@ -9518,7 +9518,7 @@ const Av = dt(
     autoComplete: p,
     "data-testid": m
   }, y) => {
-    const g = M(null), { className: C, palette: S, theme: $ } = Ae(), D = y || g, { labelProps: P, inputProps: k, descriptionProps: R, errorMessageProps: v } = Qi(
+    const g = M(null), { className: C, palette: S, theme: $ } = ke(), D = y || g, { labelProps: P, inputProps: k, descriptionProps: R, errorMessageProps: v } = Qi(
       {
         label: a,
         name: u,
@@ -9638,7 +9638,7 @@ const Av = dt(
       "data-testid": u,
       role: "search",
       children: /* @__PURE__ */ b.jsx(
-        Av,
+        Bv,
         {
           ...p,
           type: "search",
@@ -9737,7 +9737,7 @@ function il({
   offset: r,
   ...l
 }) {
-  const i = M(null), { popoverRef: o = i } = l, { className: a, style: u } = Ae();
+  const i = M(null), { popoverRef: o = i } = l, { className: a, style: u } = ke();
   let { popoverProps: s, underlayProps: c, arrowProps: d, placement: f } = Gf(
     {
       ...l,
@@ -9791,7 +9791,7 @@ class ol {
     this.value = null, this.level = 0, this.hasChildNodes = !1, this.rendered = null, this.textValue = "", this["aria-label"] = void 0, this.index = 0, this.parentKey = null, this.prevKey = null, this.nextKey = null, this.firstChildKey = null, this.lastChildKey = null, this.props = {}, this.type = e, this.key = n;
   }
 }
-class Bv {
+class Kv {
   get size() {
     return this.keyMap.size;
   }
@@ -9983,7 +9983,7 @@ class Ut extends Xs {
     super(n), this.nodeType = 8, this._index = 0, this.hasSetProps = !1, this.node = new ol(e, `react-aria-${++n.nodeId}`), this.ownerDocument.startTransaction();
   }
 }
-class Kv extends Xs {
+class Mv extends Xs {
   get isConnected() {
     return this.isMounted;
   }
@@ -10093,8 +10093,8 @@ if (typeof HTMLTemplateElement < "u") {
     }
   });
 }
-const Kr = /* @__PURE__ */ Q(!1), Mv = typeof DocumentFragment < "u" ? new DocumentFragment() : null;
-function Iv(t) {
+const Kr = /* @__PURE__ */ Q(!1), Iv = typeof DocumentFragment < "u" ? new DocumentFragment() : null;
+function Fv(t) {
   let e = Y(Kr), n = nt();
   if (e)
     return /* @__PURE__ */ A.createElement(A.Fragment, null, t.children);
@@ -10103,9 +10103,9 @@ function Iv(t) {
   }, t.children);
   return n ? /* @__PURE__ */ A.createElement("template", {
     "data-react-aria-hidden": !0
-  }, r) : /* @__PURE__ */ gi(r, Mv);
+  }, r) : /* @__PURE__ */ gi(r, Iv);
 }
-function Fv(t) {
+function _v(t) {
   let e = (n, r) => Y(Kr) ? null : t(n, r);
   return e.displayName = t.displayName || t.name, dt(e);
 }
@@ -10120,7 +10120,7 @@ var Mr = { exports: {} }, ur = {};
  * LICENSE file in the root directory of this source tree.
  */
 var ci;
-function _v() {
+function Rv() {
   if (ci) return ur;
   ci = 1;
   var t = A;
@@ -10165,7 +10165,7 @@ var sr = {};
  * LICENSE file in the root directory of this source tree.
  */
 var di;
-function Rv() {
+function Nv() {
   return di || (di = 1, process.env.NODE_ENV !== "production" && function() {
     typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
     var t = A, e = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
@@ -10235,35 +10235,35 @@ function Rv() {
     sr.useSyncExternalStore = S, typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error());
   }()), sr;
 }
-process.env.NODE_ENV === "production" ? Mr.exports = _v() : Mr.exports = Rv();
-var Nv = Mr.exports;
+process.env.NODE_ENV === "production" ? Mr.exports = Rv() : Mr.exports = Nv();
+var Lv = Mr.exports;
 const Js = /* @__PURE__ */ Q(!1), Gt = /* @__PURE__ */ Q(null);
-function Lv(t) {
+function Ov(t) {
   if (Y(Gt))
     return t.content;
-  let { collection: n, document: r } = Vv(t.createCollection);
-  return /* @__PURE__ */ A.createElement(A.Fragment, null, /* @__PURE__ */ A.createElement(Iv, null, /* @__PURE__ */ A.createElement(Gt.Provider, {
+  let { collection: n, document: r } = Hv(t.createCollection);
+  return /* @__PURE__ */ A.createElement(A.Fragment, null, /* @__PURE__ */ A.createElement(Fv, null, /* @__PURE__ */ A.createElement(Gt.Provider, {
     value: r
-  }, t.content)), /* @__PURE__ */ A.createElement(Ov, {
+  }, t.content)), /* @__PURE__ */ A.createElement(zv, {
     render: t.children,
     collection: n
   }));
 }
-function Ov({ collection: t, render: e }) {
+function zv({ collection: t, render: e }) {
   return e(t);
 }
-function zv(t, e, n) {
+function jv(t, e, n) {
   let r = nt(), l = M(r);
   l.current = r;
   let i = X(() => l.current ? n() : e(), [
     e,
     n
   ]);
-  return Nv.useSyncExternalStore(t, i);
+  return Lv.useSyncExternalStore(t, i);
 }
-const jv = typeof A.useSyncExternalStore == "function" ? A.useSyncExternalStore : zv;
-function Vv(t) {
-  let [e] = z(() => new Kv((t == null ? void 0 : t()) || new Bv())), n = X((o) => e.subscribe(o), [
+const Vv = typeof A.useSyncExternalStore == "function" ? A.useSyncExternalStore : jv;
+function Hv(t) {
+  let [e] = z(() => new Mv((t == null ? void 0 : t()) || new Kv())), n = X((o) => e.subscribe(o), [
     e
   ]), r = X(() => {
     let o = e.getCollection();
@@ -10272,7 +10272,7 @@ function Vv(t) {
     e
   ]), l = X(() => (e.isSSR = !0, e.getCollection()), [
     e
-  ]), i = jv(n, r, l);
+  ]), i = Vv(n, r, l);
   return J(() => (e.isMounted = !0, () => {
     e.isMounted = !1;
   }), [
@@ -10283,7 +10283,7 @@ function Vv(t) {
   };
 }
 const Ir = /* @__PURE__ */ Q(null);
-function Hv(t, e, n, r, l, i) {
+function Wv(t, e, n, r, l, i) {
   let o = X((u) => {
     u == null || u.setProps(e, n, r, i);
   }, [
@@ -10302,32 +10302,32 @@ function Hv(t, e, n, r, l, i) {
     ref: o
   }, l);
 }
-function Wv(t, e) {
+function Uv(t, e) {
   let n = ({ node: l }) => e(l.props, l.props.ref, l), r = dt((l, i) => {
     if (!Y(Js)) {
       if (e.length >= 3) throw new Error(e.name + " cannot be rendered outside a collection.");
       return e(l, i);
     }
-    return Hv(t, l, i, "children" in l ? l.children : null, null, (a) => /* @__PURE__ */ A.createElement(n, {
+    return Wv(t, l, i, "children" in l ? l.children : null, null, (a) => /* @__PURE__ */ A.createElement(n, {
       node: a
     }));
   });
   return r.displayName = e.name, r;
 }
-function Uv(t) {
+function Gv(t) {
   return Zs({
     ...t,
     addIdAndValue: !0
   });
 }
 const fi = /* @__PURE__ */ Q(null);
-function Gv(t) {
-  let e = Y(fi), n = ((e == null ? void 0 : e.dependencies) || []).concat(t.dependencies), r = t.idScope || (e == null ? void 0 : e.idScope), l = Uv({
+function Yv(t) {
+  let e = Y(fi), n = ((e == null ? void 0 : e.dependencies) || []).concat(t.dependencies), r = t.idScope || (e == null ? void 0 : e.idScope), l = Gv({
     ...t,
     idScope: r,
     dependencies: n
   });
-  return Y(Gt) && (l = /* @__PURE__ */ A.createElement(Yv, null, l)), e = V(() => ({
+  return Y(Gt) && (l = /* @__PURE__ */ A.createElement(qv, null, l)), e = V(() => ({
     dependencies: n,
     idScope: r
   }), [
@@ -10337,7 +10337,7 @@ function Gv(t) {
     value: e
   }, l);
 }
-function Yv({ children: t }) {
+function qv({ children: t }) {
   let e = Y(Gt), n = V(() => /* @__PURE__ */ A.createElement(Gt.Provider, {
     value: null
   }, /* @__PURE__ */ A.createElement(Js.Provider, {
@@ -10349,7 +10349,7 @@ function Yv({ children: t }) {
     value: e
   }, n) : /* @__PURE__ */ gi(n, e);
 }
-const qv = /* @__PURE__ */ Q(null), Xv = {
+const Xv = /* @__PURE__ */ Q(null), Zv = {
   CollectionRoot({ collection: t, renderDropIndicator: e }) {
     return pi(t, null, e);
   },
@@ -10380,8 +10380,8 @@ function pi(t, e, n) {
     }
   });
 }
-const Qs = /* @__PURE__ */ Q(Xv);
-function Zv(t) {
+const Qs = /* @__PURE__ */ Q(Zv);
+function Jv(t) {
   return V(() => t != null ? /* @__PURE__ */ new Set([
     t
   ]) : null, [
@@ -10467,7 +10467,7 @@ function Zt(t, e, n) {
     o
   ];
 }
-function Jv() {
+function Qv() {
   let [t, e] = z(!0), n = M(!1), r = X((l) => {
     n.current = !0, e(!!l);
   }, []);
@@ -10478,11 +10478,11 @@ function Jv() {
     t
   ];
 }
-function Qv(t, e = !0) {
+function eh(t, e = !0) {
   let [n, r] = z(!0);
   return tc(t, n && e, X(() => r(!1), [])), n && e;
 }
-function eh(t, e) {
+function th(t, e) {
   let [n, r] = z(!1), [l, i] = z("idle");
   return !e && t.current && l === "idle" && (n = !0, r(!0), i("exiting")), !t.current && l === "exited" && i("idle"), tc(t, n, X(() => {
     i("exited"), r(!1);
@@ -10510,7 +10510,7 @@ function tc(t, e, n) {
     n
   ]);
 }
-const th = /* @__PURE__ */ Q(null), nh = /* @__PURE__ */ new Set([
+const nh = /* @__PURE__ */ Q(null), rh = /* @__PURE__ */ new Set([
   "form",
   "formAction",
   "formEncType",
@@ -10519,9 +10519,9 @@ const th = /* @__PURE__ */ Q(null), nh = /* @__PURE__ */ new Set([
   "formTarget",
   "name",
   "value"
-]), rh = /* @__PURE__ */ Q({});
-function lh(t, e) {
-  [t, e] = Zt(t, e, rh), t = ih(t);
+]), lh = /* @__PURE__ */ Q({});
+function ih(t, e) {
+  [t, e] = Zt(t, e, lh), t = oh(t);
   let n = t, { isPending: r } = n, { buttonProps: l, isPressed: i } = Fn(t, e), { focusProps: o, isFocused: a, isFocusVisible: u } = Xt(t), { hoverProps: s, isHovered: c } = kt({
     ...t,
     isDisabled: t.isDisabled || r
@@ -10551,7 +10551,7 @@ function lh(t, e) {
     p
   ]), /* @__PURE__ */ A.createElement("button", {
     ...fe(t, {
-      propNames: nh
+      propNames: rh
     }),
     ...H(l, o, s),
     ...f,
@@ -10566,19 +10566,19 @@ function lh(t, e) {
     "data-focused": a || void 0,
     "data-pending": r || void 0,
     "data-focus-visible": u || void 0
-  }, /* @__PURE__ */ A.createElement(th.Provider, {
+  }, /* @__PURE__ */ A.createElement(nh.Provider, {
     value: {
       id: m
     }
   }, f.children));
 }
-function ih(t) {
+function oh(t) {
   return t.isPending && (t.onPress = void 0, t.onPressStart = void 0, t.onPressEnd = void 0, t.onPressChange = void 0, t.onPressUp = void 0, t.onKeyDown = void 0, t.onKeyUp = void 0, t.onClick = void 0, t.href = void 0), t;
 }
-const nc = /* @__PURE__ */ Fv(lh), oh = /* @__PURE__ */ Q({}), ah = /* @__PURE__ */ Q({}), uh = /* @__PURE__ */ Q({}), rc = /* @__PURE__ */ Q({
+const nc = /* @__PURE__ */ _v(ih), ah = /* @__PURE__ */ Q({}), uh = /* @__PURE__ */ Q({}), sh = /* @__PURE__ */ Q({}), rc = /* @__PURE__ */ Q({
   placement: "bottom"
 });
-function sh(t, e) {
+function ch(t, e) {
   [t, e] = Zt(t, e, rc);
   let n = t.placement, r = {
     position: "absolute",
@@ -10602,8 +10602,8 @@ function sh(t, e) {
     "data-placement": n
   });
 }
-const ch = /* @__PURE__ */ dt(sh), Fr = /* @__PURE__ */ Q(null), dh = /* @__PURE__ */ Q(null), fh = /* @__PURE__ */ Q({}), lc = /* @__PURE__ */ Q(null), al = /* @__PURE__ */ Q(null), ic = /* @__PURE__ */ Q(null);
-function ph(t) {
+const dh = /* @__PURE__ */ dt(ch), Fr = /* @__PURE__ */ Q(null), fh = /* @__PURE__ */ Q(null), ph = /* @__PURE__ */ Q({}), lc = /* @__PURE__ */ Q(null), al = /* @__PURE__ */ Q(null), ic = /* @__PURE__ */ Q(null);
+function vh(t) {
   let e = Xp(t), n = M(null), { menuTriggerProps: r, menuProps: l } = Ta({
     ...t,
     type: "menu"
@@ -10627,7 +10627,7 @@ function ph(t) {
         }
       ],
       [
-        dh,
+        fh,
         e
       ],
       [
@@ -10653,17 +10653,17 @@ function ph(t) {
     isPressed: e.isOpen
   }, t.children));
 }
-const vh = /* @__PURE__ */ Q(null);
-function hh(t, e) {
-  return [t, e] = Zt(t, e, lc), /* @__PURE__ */ A.createElement(Lv, {
-    content: /* @__PURE__ */ A.createElement(Gv, t)
-  }, (n) => n.size > 0 && /* @__PURE__ */ A.createElement(mh, {
+const hh = /* @__PURE__ */ Q(null);
+function mh(t, e) {
+  return [t, e] = Zt(t, e, lc), /* @__PURE__ */ A.createElement(Ov, {
+    content: /* @__PURE__ */ A.createElement(Yv, t)
+  }, (n) => n.size > 0 && /* @__PURE__ */ A.createElement(bh, {
     props: t,
     collection: n,
     menuRef: e
   }));
 }
-function mh({ props: t, collection: e, menuRef: n }) {
+function bh({ props: t, collection: e, menuRef: n }) {
   let r = Hs({
     ...t,
     collection: e,
@@ -10714,7 +10714,7 @@ function mh({ props: t, collection: e, menuRef: n }) {
         r
       ],
       [
-        uh,
+        sh,
         {
           elementType: "div"
         }
@@ -10726,13 +10726,13 @@ function mh({ props: t, collection: e, menuRef: n }) {
         }
       ],
       [
-        qv,
+        Xv,
         {
-          render: gh
+          render: yh
         }
       ],
       [
-        vh,
+        hh,
         {
           parentMenuRef: n
         }
@@ -10744,7 +10744,7 @@ function mh({ props: t, collection: e, menuRef: n }) {
     ]
   }, /* @__PURE__ */ A.createElement(a, {
     collection: e,
-    persistedKeys: Zv(r.selectionManager.focusedKey),
+    persistedKeys: Jv(r.selectionManager.focusedKey),
     scrollRef: n
   }))), /* @__PURE__ */ A.createElement("div", {
     ref: i,
@@ -10756,10 +10756,10 @@ function mh({ props: t, collection: e, menuRef: n }) {
     }
   }));
 }
-const bh = /* @__PURE__ */ dt(hh);
-function gh(t, e, n) {
+const gh = /* @__PURE__ */ dt(mh);
+function yh(t, e, n) {
   var r, l;
-  let i = Y(al), { CollectionBranch: o } = Y(Qs), [a, u] = Jv();
+  let i = Y(al), { CollectionBranch: o } = Y(Qs), [a, u] = Qv();
   var s;
   let { headingProps: c, groupProps: d } = up({
     heading: u,
@@ -10775,7 +10775,7 @@ function gh(t, e, n) {
     ...d,
     ...f,
     ref: e
-  }, /* @__PURE__ */ A.createElement(ah.Provider, {
+  }, /* @__PURE__ */ A.createElement(uh.Provider, {
     value: {
       ...c,
       ref: a
@@ -10785,7 +10785,7 @@ function gh(t, e, n) {
     parent: n
   })));
 }
-const _r = /* @__PURE__ */ Q(null), yh = /* @__PURE__ */ Wv("item", function(e, n, r) {
+const _r = /* @__PURE__ */ Q(null), $h = /* @__PURE__ */ Uv("item", function(e, n, r) {
   var l;
   [e, n] = Zt(e, n, _r);
   let i = (l = ec(_r)) === null || l === void 0 ? void 0 : l.id, o = Y(al), a = Dn(n), { menuItemProps: u, labelProps: s, descriptionProps: c, keyboardShortcutProps: d, ...f } = Ka({
@@ -10825,7 +10825,7 @@ const _r = /* @__PURE__ */ Q(null), yh = /* @__PURE__ */ Wv("item", function(e,
   }, /* @__PURE__ */ A.createElement(Ln, {
     values: [
       [
-        oh,
+        ah,
         {
           slots: {
             label: s,
@@ -10834,13 +10834,13 @@ const _r = /* @__PURE__ */ Q(null), yh = /* @__PURE__ */ Wv("item", function(e,
         }
       ],
       [
-        fh,
+        ph,
         d
       ]
     ]
   }, C.children));
 }), ul = /* @__PURE__ */ Q(null), oc = /* @__PURE__ */ Q(null);
-function $h(t) {
+function xh(t) {
   let e = Vs(t), n = M(null), { triggerProps: r, tooltipProps: l } = Up(t, e, n);
   return /* @__PURE__ */ A.createElement(Ln, {
     values: [
@@ -10861,19 +10861,19 @@ function $h(t) {
     ref: n
   }, t.children));
 }
-function xh({ UNSTABLE_portalContainer: t, ...e }, n) {
+function Eh({ UNSTABLE_portalContainer: t, ...e }, n) {
   [e, n] = Zt(e, n, oc);
-  let r = Y(ul), l = Vs(e), i = e.isOpen != null || e.defaultOpen != null || !r ? l : r, o = eh(n, i.isOpen) || e.isExiting || !1;
+  let r = Y(ul), l = Vs(e), i = e.isOpen != null || e.defaultOpen != null || !r ? l : r, o = th(n, i.isOpen) || e.isExiting || !1;
   return !i.isOpen && !o ? null : /* @__PURE__ */ A.createElement(Vf, {
     portalContainer: t
-  }, /* @__PURE__ */ A.createElement(Sh, {
+  }, /* @__PURE__ */ A.createElement(Ch, {
     ...e,
     tooltipRef: n,
     isExiting: o
   }));
 }
-const Eh = /* @__PURE__ */ dt(xh);
-function Sh(t) {
+const Sh = /* @__PURE__ */ dt(Eh);
+function Ch(t) {
   let e = Y(ul), n = M(null), [r, l] = z(0);
   J(() => {
     n.current && e.isOpen && l(n.current.getBoundingClientRect().width);
@@ -10891,7 +10891,7 @@ function Sh(t) {
     arrowSize: r,
     arrowBoundaryOffset: t.arrowBoundaryOffset,
     shouldFlip: t.shouldFlip
-  }), u = Qv(t.tooltipRef, !!a) || t.isEntering || !1, s = At({
+  }), u = eh(t.tooltipRef, !!a) || t.isEntering || !1, s = At({
     ...t,
     defaultClassName: "react-aria-Tooltip",
     values: {
@@ -10934,7 +10934,7 @@ function ac(t, e = "down") {
     return i.addEventListener("change", o), () => i.removeEventListener("change", o);
   }, [n]), r;
 }
-const Ch = ({ size: t }) => /* @__PURE__ */ b.jsx("svg", { viewBox: "0 0 24 24", width: t, height: t, children: /* @__PURE__ */ b.jsx(
+const wh = ({ size: t }) => /* @__PURE__ */ b.jsx("svg", { viewBox: "0 0 24 24", width: t, height: t, children: /* @__PURE__ */ b.jsx(
   "path",
   {
     fill: "currentColor",
@@ -10951,7 +10951,7 @@ function l4({
   testId: o,
   menuTestId: a
 }) {
-  const { className: u } = Ae(), s = ac($i.SMALL), [c, d] = z(!1), f = M(null), p = {
+  const { className: u } = ke(), s = ac($i.SMALL), [c, d] = z(!1), f = M(null), p = {
     disabled: l,
     "data-testid": o,
     "aria-label": "Menu"
@@ -10963,7 +10963,7 @@ function l4({
       onPress: () => d((g) => !g),
       isDisabled: l,
       className: `proton-ResponsiveMenuTrigger__button ${u}`,
-      children: /* @__PURE__ */ b.jsx(Ch, { size: n })
+      children: /* @__PURE__ */ b.jsx(wh, { size: n })
     }
   ), y = t ? t(
     { ...p, onClick: () => d((g) => !g) },
@@ -10986,7 +10986,7 @@ function l4({
         "data-testid": a
       }
     )
-  ] }) : /* @__PURE__ */ b.jsxs(ph, { children: [
+  ] }) : /* @__PURE__ */ b.jsxs(vh, { children: [
     y,
     c && /* @__PURE__ */ b.jsx(
       il,
@@ -11001,14 +11001,14 @@ function l4({
         triggerRef: f,
         arrow: !1,
         children: /* @__PURE__ */ b.jsx(
-          bh,
+          gh,
           {
             className: "proton-ListBox proton-ResponsiveMenuTrigger__menu",
             id: e,
             autoFocus: !0,
             "data-testid": a,
             children: r.map((g) => /* @__PURE__ */ b.jsx(
-              yh,
+              $h,
               {
                 href: g.to,
                 target: "_blank",
@@ -11039,11 +11039,11 @@ const Rr = (t) => {
       ref: e,
       "data-testid": "listbox",
       className: "proton-ListBox",
-      children: [...n.collection].map((l) => /* @__PURE__ */ b.jsx(wh, { item: l, state: n }, l.key))
+      children: [...n.collection].map((l) => /* @__PURE__ */ b.jsx(Ph, { item: l, state: n }, l.key))
     }
   ) });
 };
-function wh({ item: t, state: e }) {
+function Ph({ item: t, state: e }) {
   let n = M(null), { optionProps: r, isSelected: l, isFocused: i, isDisabled: o } = op(
     { key: t.key },
     e,
@@ -11089,7 +11089,7 @@ const uc = dt(
     );
   }
 );
-function Ph({
+function Dh({
   label: t,
   name: e,
   isDisabled: n,
@@ -11201,10 +11201,10 @@ function Ph({
   );
 }
 const i4 = {
-  Menu: Ph,
+  Menu: Dh,
   Option: Xr
 };
-function Dh({
+function kh({
   label: t,
   name: e,
   isDisabled: n,
@@ -11315,7 +11315,7 @@ function Dh({
   );
 }
 const o4 = {
-  Menu: Dh,
+  Menu: kh,
   Option: Xr
 };
 function a4(t) {
@@ -11347,11 +11347,11 @@ function a4(t) {
     }
   );
 }
-function kh({ item: t, state: e, children: n }) {
+function Th({ item: t, state: e, children: n }) {
   let r = M(), { rowProps: l } = jp({ node: t }, e);
   return /* @__PURE__ */ b.jsx("tr", { className: W("proton-Table__headerRow"), ...l, ref: r, children: n });
 }
-function Th({ column: t, state: e }) {
+function Ah({ column: t, state: e }) {
   var u, s;
   let n = M(), { columnHeaderProps: r } = Op(
     { node: t },
@@ -11402,30 +11402,36 @@ function hi({ type: t, children: e }) {
     }
   );
 }
-function Ah({ item: t, children: e, state: n }) {
-  let r = M(), l = n.selectionManager.isSelected(t.key), { rowProps: i, isPressed: o } = zp(
+function Bh({
+  item: t,
+  children: e,
+  state: n,
+  backgroundColor: r
+}) {
+  let l = M(), i = n.selectionManager.isSelected(t.key), { rowProps: o, isPressed: a } = zp(
     {
       node: t
     },
     n,
-    r
-  ), { isFocusVisible: a, focusProps: u } = Xt();
+    l
+  ), { isFocusVisible: u, focusProps: s } = Xt();
   return /* @__PURE__ */ b.jsx(
     "tr",
     {
       className: W(
         "proton-Table__row",
-        l ? "proton-Table__row--selected" : null,
-        o ? "proton-Table__row--pressed" : null,
-        a ? "proton-Table__row--focused" : null
+        i ? "proton-Table__row--selected" : null,
+        a ? "proton-Table__row--pressed" : null,
+        u ? "proton-Table__row--focused" : null
       ),
-      ...H(i, u),
-      ref: r,
+      style: r ? { backgroundColor: r } : void 0,
+      ...H(o, s),
+      ref: l,
       children: e
     }
   );
 }
-function Bh({ cell: t, state: e, ...n }) {
+function Kh({ cell: t, state: e, ...n }) {
   let r = M(), { gridCellProps: l } = Vp({ node: t }, e, r), { isFocusVisible: i, focusProps: o } = Xt();
   const { align: a } = t.props;
   return /* @__PURE__ */ b.jsx(
@@ -11442,8 +11448,8 @@ function Bh({ cell: t, state: e, ...n }) {
     }
   );
 }
-const u4 = av, s4 = uv;
-function c4(t) {
+const u4 = av, s4 = sv, c4 = uv;
+function d4(t) {
   let e = ov({
     ...t
   }), n = M(), { collection: r } = e, { gridProps: l } = Np(
@@ -11452,33 +11458,71 @@ function c4(t) {
     n
   );
   return /* @__PURE__ */ b.jsxs("table", { ...l, ref: n, className: W("proton-Table"), children: [
-    /* @__PURE__ */ b.jsx(hi, { type: "thead", children: r.headerRows.map((i) => /* @__PURE__ */ b.jsx(kh, { item: i, state: e, children: Array.from(r.getChildren(i.key)).map((o) => /* @__PURE__ */ b.jsx(
-      Th,
+    /* @__PURE__ */ b.jsx(hi, { type: "thead", children: r.headerRows.map((i) => /* @__PURE__ */ b.jsx(Th, { item: i, state: e, children: Array.from(r.getChildren(i.key)).map((o) => /* @__PURE__ */ b.jsx(
+      Ah,
       {
         column: o,
         state: e
       },
       o.key
     )) }, i.key)) }),
-    /* @__PURE__ */ b.jsx(hi, { type: "tbody", children: Array.from(r.body.childNodes).map((i) => /* @__PURE__ */ b.jsx(Ah, { item: i, state: e, children: Array.from(r.getChildren(i.key)).map((o) => /* @__PURE__ */ b.jsx(Bh, { cell: o, state: e }, o.key)) }, i.key)) })
+    /* @__PURE__ */ b.jsx(hi, { type: "tbody", children: Array.from(r.body.childNodes).map((i) => /* @__PURE__ */ b.jsx(
+      Bh,
+      {
+        item: i,
+        state: e,
+        backgroundColor: i.props.backgroundColor,
+        children: Array.from(r.getChildren(i.key)).map((o) => /* @__PURE__ */ b.jsx(Kh, { cell: o, state: e }, o.key))
+      },
+      i.key
+    )) })
   ] });
 }
-function Kh({ children: t, arrow: e, ...n }) {
-  const { style: r, className: l } = Ae();
+const f4 = ({
+  children: t,
+  maxWidth: e,
+  singleLine: n = !0,
+  lines: r = 1,
+  title: l,
+  className: i,
+  "data-testid": o
+}) => {
+  const { className: a } = ke(), u = l || (typeof t == "string" ? t : void 0);
+  return /* @__PURE__ */ b.jsx(
+    "div",
+    {
+      className: W(
+        "proton-TextEllipsis",
+        n || r === 1 ? "proton-TextEllipsis--single-line" : r > 1 ? "proton-TextEllipsis--multi-line" : "",
+        i,
+        a
+      ),
+      style: {
+        maxWidth: e,
+        WebkitLineClamp: r
+      },
+      title: u,
+      "data-testid": o,
+      children: t
+    }
+  );
+};
+function Mh({ children: t, arrow: e, ...n }) {
+  const { style: r, className: l } = ke();
   return /* @__PURE__ */ b.jsxs(
-    Eh,
+    Sh,
     {
       ...n,
       className: W("proton__Tooltip", "proton-Dialog", l),
       style: r,
       children: [
-        e && /* @__PURE__ */ b.jsx(ch, { className: W("proton__TooltipArrow", l), children: /* @__PURE__ */ b.jsx("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ b.jsx("path", { d: "M0 0 L4 4 L8 0" }) }) }),
+        e && /* @__PURE__ */ b.jsx(dh, { className: W("proton__TooltipArrow", l), children: /* @__PURE__ */ b.jsx("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ b.jsx("path", { d: "M0 0 L4 4 L8 0" }) }) }),
         t
       ]
     }
   );
 }
-function Mh({
+function Ih({
   children: t,
   // trigger props
   delay: e = 500,
@@ -11493,7 +11537,7 @@ function Mh({
 }) {
   const [s, c] = z(!1), d = M(!1), f = M(!1);
   return /* @__PURE__ */ b.jsxs(
-    $h,
+    xh,
     {
       delay: e,
       closeDelay: n,
@@ -11515,18 +11559,18 @@ function Mh({
             children: t
           }
         ),
-        /* @__PURE__ */ b.jsx(Kh, { ...u, children: a })
+        /* @__PURE__ */ b.jsx(Mh, { ...u, children: a })
       ]
     }
   );
 }
-const d4 = ({
+const p4 = ({
   to: t,
   children: e,
   tooltipProps: n,
   "data-testid": r
 }) => {
-  const { className: l } = Ae(), i = n ? /* @__PURE__ */ b.jsx(Mh, { delay: 50, closeDelay: 75, ...n, children: e }) : e;
+  const { className: l } = ke(), i = n ? /* @__PURE__ */ b.jsx(Ih, { delay: 50, closeDelay: 75, ...n, children: e }) : e;
   if (t) {
     const o = Nr(t);
     return /* @__PURE__ */ b.jsx(
@@ -11564,7 +11608,7 @@ const d4 = ({
     }
   );
 };
-function Ih({
+function Fh({
   amplitude: t,
   isDisabled: e,
   isPlayed: n,
@@ -11632,8 +11676,8 @@ function Ih({
     }
   );
 }
-const Fh = Lh(100);
-function f4({
+const _h = Oh(100);
+function v4({
   data: t,
   resolution: e = 2,
   startDuration: n,
@@ -11645,11 +11689,11 @@ function f4({
   "data-testid": u
 }) {
   var E;
-  const { className: s } = Ae(), c = M(null), [d, f] = z([]), [p, m] = z(null), [y, g] = z(!1), [C, S] = z(!1), $ = t || Fh, D = e;
+  const { className: s } = ke(), c = M(null), [d, f] = z([]), [p, m] = z(null), [y, g] = z(!1), [C, S] = z(!1), $ = t || _h, D = e;
   L(() => {
     if (!c.current) return;
     const w = (F) => {
-      const T = Math.floor(F / (e + D)), U = Rh($, T);
+      const T = Math.floor(F / (e + D)), U = Nh($, T);
       f(U);
     }, I = c.current.clientWidth;
     w(I);
@@ -11711,7 +11755,7 @@ function f4({
           d.map((w, I) => {
             const x = I / d.length * o, F = n !== void 0 && r !== void 0 && (x < n || x > r), T = l === 0 ? !1 : x <= l, U = p !== null && x <= p;
             return /* @__PURE__ */ b.jsx(
-              Ih,
+              Fh,
               {
                 amplitude: w,
                 isDisabled: F,
@@ -11753,40 +11797,40 @@ function mi({
         "proton-Waveform__timestamp",
         `proton-Waveform__timestamp--${t}`
       ),
-      children: _h(e)
+      children: Rh(e)
     }
   );
 }
-function _h(t) {
+function Rh(t) {
   const e = Math.floor(t / 60), n = Math.floor(t % 60);
   return `${e}:${n < 10 ? "0" : ""}${n.toFixed(0)}`;
 }
-function Rh(t, e) {
+function Nh(t, e) {
   const n = t.length, r = n / e, l = new Array(e).fill(0).map((i, o) => {
     const a = o * r, u = Math.floor(a), s = Math.min(u + 1, n - 1), c = a - u;
     return t[u] * (1 - c) + t[s] * c;
   });
-  return Nh(l);
+  return Lh(l);
 }
-function Nh(t) {
+function Lh(t) {
   const e = Math.min(...t), n = Math.max(...t);
   return t.map((r) => {
     const l = (r - e) / (n - e);
     return Math.max(l * 0.8 + 0.1, 0.1);
   });
 }
-function Lh(t) {
+function Oh(t) {
   return Array.from({ length: t }, (e, n) => {
     const l = n / (t - 1) * 6 * 2 * Math.PI - Math.PI / 2;
     return Math.sin(l) * 0.5 + 0.5;
   });
 }
-const p4 = ({
+const h4 = ({
   width: t = "100%",
   height: e = "1.5rem",
   borderRadius: n = "4px"
 }) => {
-  const { theme: r, palette: l } = Ae(), i = {
+  const { theme: r, palette: l } = ke(), i = {
     "--tombstone-custom-background": l.PRIMARY.PRIMARY_MEDIUM,
     "--tombstone-custom-primary": El(
       l.PRIMARY.PRIMARY_DARK,
@@ -11809,7 +11853,7 @@ const p4 = ({
       }
     }
   );
-}, Oh = (t) => {
+}, zh = (t) => {
   const [e, n, r] = t, l = e + n + r;
   if (l < 65) {
     const i = l / 100;
@@ -11817,12 +11861,12 @@ const p4 = ({
   }
   return "";
 };
-function v4({
+function m4({
   image: t,
   imageUrl: e = "",
   onLoad: n
 }) {
-  const { palette: r } = Ae(), l = Rc(r.BASE_COLOR), i = Oh(l);
+  const { palette: r } = ke(), l = Rc(r.BASE_COLOR), i = zh(l);
   return /* @__PURE__ */ b.jsxs(
     "div",
     {
@@ -11869,34 +11913,35 @@ export {
   Jh as BadgeVariants,
   We as Banner,
   Gs as Button,
-  Dv as ButtonGroup,
-  b4 as COLORS,
+  kv as ButtonGroup,
+  y4 as COLORS,
   s4 as Cell,
   u4 as Column,
   e4 as Dialog,
   t4 as Icon,
-  v4 as ImageBackground,
-  Av as Input,
+  m4 as ImageBackground,
+  Bv as Input,
   il as Popover,
   l4 as ResponsiveMenuTrigger,
   o4 as ResponsiveSelect,
-  Xh as Row,
-  vv as ScreenOverlay,
+  c4 as Row,
+  hv as ScreenOverlay,
   n4 as SearchInput,
-  Gh as Section,
+  Yh as Section,
   i4 as Select,
   a4 as Switch,
   Pt as THEMES,
-  c4 as Table,
-  qh as TableBody,
-  Yh as TableHeader,
-  d4 as TextEmphasis,
+  d4 as Table,
+  Xh as TableBody,
+  qh as TableHeader,
+  f4 as TextEllipsis,
+  p4 as TextEmphasis,
   Zh as ThemeProvider,
-  p4 as Tombstone,
-  Kh as Tooltip,
-  Mh as TooltipTrigger,
-  f4 as Waveform,
+  h4 as Tombstone,
+  Mh as Tooltip,
+  Ih as TooltipTrigger,
+  v4 as Waveform,
   r4 as usePopoverTrigger,
-  Ae as useTheme
+  ke as useTheme
 };
 //# sourceMappingURL=index.es.js.map