@telefonica/mistica 16.3.0 → 16.4.0

package/dist-es/list.js

@@ -78,28 +78,29 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-import { jsx as t, jsxs as P } from "react/jsx-runtime";
+import { jsx as t, jsxs as T } from "react/jsx-runtime";
 import * as m from "react";
 import s from "classnames";
-import { BaseTouchable as te } from "./touchable.js";
-import { Text3 as ve, Text1 as xe, Text2 as z } from "./text.js";
+import { BaseTouchable as ae } from "./touchable.js";
+import { Text3 as xe, Text1 as ge, Text2 as z } from "./text.js";
 import h from "./box.js";
-import C from "./stack.js";
-import ge from "./badge.js";
-import { useIsInverseOrMediaVariant as oe } from "./theme-variant-context.js";
+import I from "./stack.js";
+import we from "./badge.js";
+import { useIsInverseOrMediaVariant as de } from "./theme-variant-context.js";
 import ye from "./icons/icon-chevron.js";
-import we from "./switch-component.js";
-import ae, { useRadioContext as Be } from "./radio-button.js";
-import Re from "./checkbox.js";
+import Re from "./switch-component.js";
+import ie, { useRadioContext as Be } from "./radio-button.js";
+import Ce from "./checkbox.js";
 import { Boxed as Ie } from "./boxed.js";
-import Ce from "./divider.js";
-import { getPrefixedDataAttributes as X } from "./utils/dom.js";
-import { rowContent as G, touchableBackground as J, touchableBackgroundInverse as K, pointer as re, rowContentPadding as Te, row as Ne, content as Le, assetContainer as ke, center as Q, disabled as I, asset as Ae, rowBody as Se, badge as Ve, rightContent as Pe, rightRestrictedWidth as Ee, detail as Xe, detailRight as De, dualActionContainer as Me, dualActionLeft as Oe, dualActionDivider as We, dualActionRight as je } from "./list.css-mistica.js";
-import { vars as He } from "./image.css-mistica.js";
-import { vars as l } from "./skins/skin-contract.css-mistica.js";
-import { applyCssVars as Fe } from "./utils/css.js";
-import { IconButton as ne, ToggleIconButton as ie } from "./icon-button.js";
-const qe = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
+import Te from "./divider.js";
+import { getPrefixedDataAttributes as O } from "./utils/dom.js";
+import { rowContent as G, touchableBackground as J, touchableBackgroundInverse as K, pointer as re, rowContentPadding as Ne, row as Ae, content as Le, assetContainer as ke, center as Q, disabled as C, asset as Se, rowBody as Ve, badge as Pe, rightContent as Ee, rightRestrictedWidth as Oe, detail as Xe, detailRight as De, dualActionContainer as Me, dualActionLeft as We, dualActionDivider as je, dualActionRight as He } from "./list.css-mistica.js";
+import { vars as Fe } from "./image.css-mistica.js";
+import { vars as d } from "./skins/skin-contract.css-mistica.js";
+import { applyCssVars as qe } from "./utils/css.js";
+import { IconButton as ne, ToggleIconButton as oe } from "./icon-button.js";
+import ze from "./screen-reader-only.js";
+const Ge = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         centerY: a
     }) : a ? /* @__PURE__ */ t("div", {
         style: {
@@ -110,60 +111,67 @@ const qe = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         children: /* @__PURE__ */ t("div", {
             children: e
         })
-    }) : e, ze = (param)=>{
-    let { withChevron: e, headline: a, headlineRef: r, extraRef: o, title: d, titleAs: x, titleLinesMax: g, subtitle: v, subtitleLinesMax: D, description: w, descriptionLinesMax: M, detail: u, asset: E, danger: T, badge: N, right: y, rightRef: f, extra: L, labelId: O, disabled: c, control: k } = param;
-    const A = oe(), S = [
+    }) : e, Je = (param)=>{
+    let { withChevron: e, headline: a, headlineRef: i, extraRef: o, title: l, titleAs: x, titleLinesMax: g, subtitle: v, subtitleLinesMax: X, description: y, descriptionLinesMax: D, detail: u, asset: E, danger: N, badge: A, right: w, rightRef: b, extra: L, labelId: M, disabled: c, control: k } = param;
+    const S = de(), V = [
         a,
-        d,
+        l,
         v,
-        w,
+        y,
         L
     ].filter(Boolean).length === 1;
-    return /* @__PURE__ */ P("div", {
+    return /* @__PURE__ */ T("div", {
         className: Le,
-        id: O,
+        id: M,
         children: [
             E && /* @__PURE__ */ t("div", {
                 className: s(ke, {
-                    [Q]: S,
-                    [I]: c
+                    [Q]: V,
+                    [C]: c
                 }),
                 "aria-hidden": !0,
+                "data-testid": "asset",
                 children: /* @__PURE__ */ t("div", {
-                    className: Ae,
-                    style: Fe({
-                        color: T ? A ? l.colors.textErrorInverse : l.colors.textError : A ? l.colors.textPrimaryInverse : l.colors.textPrimary,
-                        [He.mediaBorderRadius]: l.borderRadii.mediaSmall
+                    className: Se,
+                    style: qe({
+                        color: N ? S ? d.colors.textErrorInverse : d.colors.textError : S ? d.colors.textPrimaryInverse : d.colors.textPrimary,
+                        [Fe.mediaBorderRadius]: d.borderRadii.mediaSmall
                     }),
                     children: E
                 })
             }),
-            /* @__PURE__ */ P("div", {
-                className: s(Se, {
-                    [I]: c
+            /* @__PURE__ */ T("div", {
+                className: s(Ve, {
+                    [C]: c
                 }),
                 style: {
-                    justifyContent: S ? "center" : "flex-start"
+                    justifyContent: V ? "center" : "flex-start"
                 },
                 children: [
-                    /* @__PURE__ */ t(ve, {
+                    /* @__PURE__ */ t(xe, {
                         regular: !0,
-                        color: T ? l.colors.textError : l.colors.textPrimary,
+                        color: N ? d.colors.textError : d.colors.textPrimary,
                         truncate: g,
                         hyphens: "auto",
                         as: x,
-                        children: d
+                        dataAttributes: {
+                            testid: "title"
+                        },
+                        children: l
                     }),
                     a && /* @__PURE__ */ t("div", {
-                        ref: r,
+                        ref: i,
                         style: {
                             order: -1,
                             paddingBottom: 4
                         },
-                        children: /* @__PURE__ */ t(xe, {
+                        children: /* @__PURE__ */ t(ge, {
                             regular: !0,
-                            color: l.colors.textPrimary,
+                            color: d.colors.textPrimary,
                             hyphens: "auto",
+                            dataAttributes: {
+                                testid: "headline"
+                            },
                             children: a
                         })
                     }),
@@ -171,79 +179,93 @@ const qe = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                         paddingTop: 2,
                         children: /* @__PURE__ */ t(z, {
                             regular: !0,
-                            color: l.colors.textPrimary,
-                            truncate: D,
+                            color: d.colors.textPrimary,
+                            truncate: X,
                             hyphens: "auto",
+                            dataAttributes: {
+                                testid: "subtitle"
+                            },
                             children: v
                         })
                     }),
-                    w && /* @__PURE__ */ t(h, {
+                    y && /* @__PURE__ */ t(h, {
                         paddingTop: 2,
                         children: /* @__PURE__ */ t(z, {
                             regular: !0,
-                            color: l.colors.textSecondary,
-                            truncate: M,
+                            color: d.colors.textSecondary,
+                            truncate: D,
                             hyphens: "auto",
-                            children: w
+                            dataAttributes: {
+                                testid: "description"
+                            },
+                            children: y
                         })
                     }),
                     L && /* @__PURE__ */ t(h, {
                         ref: o,
                         paddingTop: 2,
+                        dataAttributes: {
+                            testid: "slot"
+                        },
                         children: L
                     })
                 ]
             }),
-            N && /* @__PURE__ */ t(h, {
+            A && /* @__PURE__ */ t(h, {
                 paddingLeft: 16,
                 children: /* @__PURE__ */ t("div", {
-                    className: s(Ve, {
-                        [I]: c
+                    className: s(Pe, {
+                        [C]: c
                     }),
-                    children: /* @__PURE__ */ t(ge, {
-                        value: N === !0 ? void 0 : N
+                    children: /* @__PURE__ */ t(we, {
+                        value: A === !0 ? void 0 : A
                     })
                 })
             }),
-            (u || y || e || k) && /* @__PURE__ */ P("div", {
-                className: s(Pe, {
-                    [Ee]: !!u
+            (u || w || e || k) && /* @__PURE__ */ T("div", {
+                className: s(Ee, {
+                    [Oe]: !!u
                 }),
                 children: [
                     u && /* @__PURE__ */ t("div", {
                         className: s(Xe, {
-                            [I]: c
+                            [C]: c
                         }),
                         children: /* @__PURE__ */ t(z, {
                             regular: !0,
-                            color: l.colors.textSecondary,
+                            color: d.colors.textSecondary,
                             hyphens: "auto",
+                            dataAttributes: {
+                                testid: "detail"
+                            },
                             children: u
                         })
                     }),
-                    y && /* @__PURE__ */ t("div", {
+                    w && /* @__PURE__ */ t("div", {
                         className: s({
                             [De]: !!u,
-                            [I]: c
+                            [C]: c
                         }),
-                        ref: f,
-                        children: qe(y, S)
+                        ref: b,
+                        "data-testid": "endSlot",
+                        children: Ge(w, V)
                     }),
                     e && /* @__PURE__ */ t("div", {
                         style: {
-                            paddingLeft: u || y ? 4 : 0
+                            paddingLeft: u || w ? 4 : 0
                         },
                         className: s(Q, {
-                            [I]: c
+                            [C]: c
                         }),
+                        "data-testid": "chevron",
                         children: /* @__PURE__ */ t(ye, {
-                            color: A ? l.colors.inverse : l.colors.neutralMedium,
+                            color: S ? d.colors.inverse : d.colors.neutralMedium,
                             direction: "right"
                         })
                     }),
                     k && /* @__PURE__ */ t("div", {
                         style: {
-                            paddingLeft: u || y ? 8 : 0
+                            paddingLeft: u || w ? 8 : 0
                         },
                         className: Q,
                         children: k
@@ -252,31 +274,31 @@ const qe = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
             })
         ]
     });
-}, Ge = (param)=>{
-    let { value: e, defaultValue: a, onChange: r } = param;
-    const o = e !== void 0, [d, x] = m.useState(!!a);
+}, Ke = (param)=>{
+    let { value: e, defaultValue: a, onChange: i } = param;
+    const o = e !== void 0, [l, x] = m.useState(!!a);
     return [
-        o ? !!e : d,
+        o ? !!e : l,
         ()=>{
-            o || x(!d), r == null || r(o ? !e : !d);
+            o || x(!l), i == null || i(o ? !e : !l);
         }
     ];
-}, Je = (e)=>[
+}, Qe = (e)=>[
         "switch",
         "checkbox",
         "radioValue",
         "iconButton"
     ].some((a)=>e[a] !== void 0), le = /*#__PURE__*/ m.forwardRef((e, a)=>{
-    var p, ee;
-    const r = m.useId(), o = oe(), { asset: d, headline: x, title: g, titleAs: v, titleLinesMax: D, subtitle: w, subtitleLinesMax: M, description: u, descriptionLinesMax: E, detail: T, danger: N, badge: y, role: f, extra: L, withChevron: O, dataAttributes: c, right: k, "aria-label": A } = e, [U, S] = m.useState(""), [de, ce] = m.useState(""), [se, he] = m.useState(""), ue = [
+    var ee, te;
+    const i = m.useId(), o = de(), { asset: l, headline: x, title: g, titleAs: v, titleLinesMax: X, subtitle: y, subtitleLinesMax: D, description: u, descriptionLinesMax: E, detail: N, danger: A, badge: w, role: b, extra: L, withChevron: M, dataAttributes: c, right: k, "aria-label": S } = e, [U, V] = m.useState(""), [ce, se] = m.useState(""), [he, ue] = m.useState(""), me = [
         g,
         U,
-        w,
+        y,
         u,
-        de,
-        T,
-        se
-    ].filter(Boolean).join(" "), B = A !== null && A !== void 0 ? A : e.href || e.to ? ue : void 0, me = Be(), b = e.disabled || e.radioValue !== void 0 && me.disabled, W = !b && !o, j = !b && o, Y = Je(e), V = !!e.onPress || !!e.href || !!e.to, fe = Y ? !1 : O !== null && O !== void 0 ? O : V, Z = {
+        ce,
+        N,
+        he
+    ].filter(Boolean).join(" "), R = S !== null && S !== void 0 ? S : e.href || e.to ? me : void 0, be = Be(), f = e.disabled || e.radioValue !== void 0 && be.disabled, W = !f && !o, j = !f && o, Y = Qe(e), P = !!e.onPress || !!e.href || !!e.to, fe = Y ? !1 : M !== null && M !== void 0 ? M : P, Z = {
         href: e.href,
         newTab: e.newTab,
         loadOnTop: e.loadOnTop,
@@ -286,118 +308,118 @@ const qe = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         onNavigate: e.onNavigate,
         onPress: e.onPress,
         trackingEvent: e.trackingEvent
-    }, [_, $] = Ge(e.switch || e.checkbox || {}), R = (n)=>/* @__PURE__ */ t(ze, {
-            asset: d,
+    }, [_, $] = Ke(e.switch || e.checkbox || {}), B = (r)=>/* @__PURE__ */ t(Je, {
+            asset: l,
             headline: x,
-            headlineRef: (i)=>{
-                i && S(i.textContent || "");
+            headlineRef: (n)=>{
+                n && V(n.textContent || "");
             },
             title: g,
             titleAs: v,
-            subtitle: w,
+            subtitle: y,
             description: u,
-            badge: y,
-            titleLinesMax: D,
-            subtitleLinesMax: M,
+            badge: w,
+            titleLinesMax: X,
+            subtitleLinesMax: D,
             descriptionLinesMax: E,
-            detail: T,
-            danger: N,
+            detail: N,
+            danger: A,
             right: k,
-            rightRef: (i)=>{
-                i && he(i.innerText || i.textContent || "");
+            rightRef: (n)=>{
+                n && ue(n.innerText || n.textContent || "");
             },
-            control: n == null ? void 0 : n.control,
+            control: r == null ? void 0 : r.control,
             extra: L,
-            extraRef: (i)=>{
-                i && ce(i.innerText || i.textContent || "");
+            extraRef: (n)=>{
+                n && se(n.innerText || n.textContent || "");
             },
-            labelId: n == null ? void 0 : n.labelId,
-            disabled: b,
+            labelId: r == null ? void 0 : r.labelId,
+            disabled: f,
             withChevron: fe
         });
-    if (V && !Y) return /* @__PURE__ */ t(te, _object_spread_props(_object_spread({
+    if (P && !Y) return /* @__PURE__ */ t(ae, _object_spread_props(_object_spread({
         ref: a,
         className: s(G, {
             [J]: W,
             [K]: j,
-            [re]: !b
+            [re]: !f
         })
     }, Z), {
-        role: f,
+        role: b,
         dataAttributes: c,
-        disabled: b,
-        "aria-label": B,
+        disabled: f,
+        "aria-label": R,
         children: /* @__PURE__ */ t(h, {
             paddingX: 16,
             "aria-hidden": !!e.to || !!e.href || void 0,
-            children: R()
+            children: B()
         })
     }));
-    const H = (n)=>/* @__PURE__ */ P("div", _object_spread_props(_object_spread({
+    const H = (r)=>/* @__PURE__ */ T("div", _object_spread_props(_object_spread({
             className: Me,
             ref: a
-        }, X(c)), {
+        }, O(c)), {
             children: [
-                /* @__PURE__ */ t(te, _object_spread_props(_object_spread({
-                    disabled: b
+                /* @__PURE__ */ t(ae, _object_spread_props(_object_spread({
+                    disabled: f
                 }, Z), {
-                    role: f,
-                    className: s(Oe, {
+                    role: b,
+                    className: s(We, {
                         [J]: W,
                         [K]: j
                     }),
-                    "aria-label": B,
-                    children: R({
-                        labelId: r
+                    "aria-label": R,
+                    children: B({
+                        labelId: i
                     })
                 })),
                 /* @__PURE__ */ t("div", {
-                    className: We
+                    className: je
                 }),
-                n
+                r
             ]
-        })), F = (n, i)=>/* @__PURE__ */ t("div", _object_spread_props(_object_spread({
+        })), F = (r, n)=>/* @__PURE__ */ t("div", _object_spread_props(_object_spread({
             className: s(G, {
-                [J]: W && i,
-                [K]: j && i,
-                [re]: !b && i
+                [J]: W && n,
+                [K]: j && n,
+                [re]: !f && n
             }),
             ref: a
-        }, X(c)), {
-            children: n
+        }, O(c)), {
+            children: r
         }));
     if (e.switch || e.checkbox) {
         var _ref, _ref1;
-        const n = e.switch ? we : Re, i = (_ref1 = (_ref = (p = e.switch) == null ? void 0 : p.name) !== null && _ref !== void 0 ? _ref : (ee = e.checkbox) == null ? void 0 : ee.name) !== null && _ref1 !== void 0 ? _ref1 : r;
-        return V ? H(/* @__PURE__ */ t(n, {
-            disabled: b,
-            name: i,
+        const r = e.switch ? Re : Ce, n = (_ref1 = (_ref = (ee = e.switch) == null ? void 0 : ee.name) !== null && _ref !== void 0 ? _ref : (te = e.checkbox) == null ? void 0 : te.name) !== null && _ref1 !== void 0 ? _ref1 : i;
+        return P ? H(/* @__PURE__ */ t(r, {
+            disabled: f,
+            name: n,
             checked: _,
-            "aria-label": B,
-            "aria-labelledby": r,
+            "aria-label": R,
+            "aria-labelledby": i,
             onChange: $,
             render: (param)=>{
                 let { controlElement: q } = param;
                 return /* @__PURE__ */ t("div", {
-                    className: je,
+                    className: He,
                     children: q
                 });
             }
-        })) : F(/* @__PURE__ */ t(n, {
-            disabled: b,
-            name: i,
+        })) : F(/* @__PURE__ */ t(r, {
+            disabled: f,
+            name: n,
             checked: _,
-            "aria-label": B,
-            "aria-labelledby": r,
+            "aria-label": R,
+            "aria-labelledby": i,
             onChange: $,
             render: (param)=>{
-                let { controlElement: q, labelId: be } = param;
+                let { controlElement: q, labelId: ve } = param;
                 return /* @__PURE__ */ t(h, {
                     paddingX: 16,
-                    role: f,
-                    children: R({
-                        labelId: be,
-                        control: /* @__PURE__ */ t(C, {
+                    role: b,
+                    children: B({
+                        labelId: ve,
+                        control: /* @__PURE__ */ t(I, {
                             space: "around",
                             children: q
                         })
@@ -406,124 +428,140 @@ const qe = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
             }
         }), !0);
     }
-    return e.radioValue ? V ? H(/* @__PURE__ */ t(ae, {
+    if (e.radioValue) return P ? H(/* @__PURE__ */ t(ie, {
         value: e.radioValue,
-        "aria-label": B,
-        "aria-labelledby": r,
+        "aria-label": R,
+        "aria-labelledby": i,
         render: (param)=>{
-            let { controlElement: n } = param;
-            return /* @__PURE__ */ t(C, {
+            let { controlElement: r } = param;
+            return /* @__PURE__ */ t(I, {
                 space: "around",
                 children: /* @__PURE__ */ t(h, {
                     paddingX: 16,
-                    children: n
+                    children: r
                 })
             });
         }
-    })) : F(/* @__PURE__ */ t(ae, {
+    })) : F(/* @__PURE__ */ t(ie, {
         value: e.radioValue,
-        "aria-label": B,
-        "aria-labelledby": r,
+        "aria-label": R,
+        "aria-labelledby": i,
         render: (param)=>{
-            let { controlElement: n } = param;
+            let { controlElement: r } = param;
             return /* @__PURE__ */ t(h, {
                 paddingX: 16,
-                role: f,
-                children: R({
-                    labelId: r,
-                    control: /* @__PURE__ */ t(C, {
+                role: b,
+                children: B({
+                    labelId: i,
+                    control: /* @__PURE__ */ t(I, {
                         space: "around",
-                        children: n
+                        children: r
                     })
                 })
             });
         }
-    }), !0) : e.iconButton ? V ? H(/* @__PURE__ */ t(h, {
+    }), !0);
+    if (e.iconButton) return P ? H(/* @__PURE__ */ t(h, {
         padding: 16,
-        children: /* @__PURE__ */ t(C, {
+        children: /* @__PURE__ */ t(I, {
             space: "around",
             children: e.iconButton.Icon ? /* @__PURE__ */ t(ne, _object_spread_props(_object_spread({}, e.iconButton), {
                 disabled: e.disabled
-            })) : /* @__PURE__ */ t(ie, _object_spread_props(_object_spread({}, e.iconButton), {
+            })) : /* @__PURE__ */ t(oe, _object_spread_props(_object_spread({}, e.iconButton), {
                 disabled: e.disabled
             }))
         })
     })) : F(/* @__PURE__ */ t(h, {
         paddingX: 16,
-        children: R({
-            labelId: r,
-            control: /* @__PURE__ */ t(C, {
+        children: B({
+            labelId: i,
+            control: /* @__PURE__ */ t(I, {
                 space: "around",
                 children: e.iconButton.Icon ? /* @__PURE__ */ t(ne, _object_spread_props(_object_spread({}, e.iconButton), {
                     disabled: e.disabled,
-                    role: f
-                })) : /* @__PURE__ */ t(ie, _object_spread_props(_object_spread({}, e.iconButton), {
+                    role: b
+                })) : /* @__PURE__ */ t(oe, _object_spread_props(_object_spread({}, e.iconButton), {
                     disabled: e.disabled,
-                    role: f
+                    role: b
                 }))
             })
         })
-    })) : /* @__PURE__ */ t("div", _object_spread_props(_object_spread({
-        className: s(G, Te),
-        role: f
-    }, X(c)), {
+    }));
+    const p = !!e["aria-label"];
+    return /* @__PURE__ */ T("div", _object_spread_props(_object_spread({
+        className: s(G, Ne),
+        role: b
+    }, O(c)), {
         ref: a,
-        children: R()
+        children: [
+            /* @__PURE__ */ t("div", {
+                "aria-hidden": p,
+                children: B()
+            }),
+            p && /* @__PURE__ */ t(ze, {
+                children: /* @__PURE__ */ t("span", {
+                    children: e["aria-label"]
+                })
+            })
+        ]
     }));
-}), ut = /*#__PURE__*/ m.forwardRef((_param, o)=>{
-    var { dataAttributes: e, role: a = "listitem" } = _param, r = _object_without_properties(_param, [
+}), ft = /*#__PURE__*/ m.forwardRef((_param, o)=>{
+    var { dataAttributes: e, role: a = "listitem" } = _param, i = _object_without_properties(_param, [
         "dataAttributes",
         "role"
     ]);
     return /* @__PURE__ */ t("div", {
         role: a,
-        className: Ne,
-        children: /* @__PURE__ */ t(le, _object_spread_props(_object_spread({}, r), {
+        className: Ae,
+        children: /* @__PURE__ */ t(le, _object_spread_props(_object_spread({}, i), {
             ref: o,
             dataAttributes: _object_spread({
-                "component-name": "Row"
+                "component-name": "Row",
+                testid: "Row"
             }, e)
         }))
     });
-}), mt = (param)=>{
-    let { children: e, ariaLabelledby: a, role: r = "list", dataAttributes: o } = param;
-    const d = m.Children.toArray(e).filter(Boolean), x = d.length - 1;
+}), vt = (param)=>{
+    let { children: e, ariaLabelledby: a, role: i = "list", dataAttributes: o } = param;
+    const l = m.Children.toArray(e).filter(Boolean), x = l.length - 1;
     return /* @__PURE__ */ t("div", _object_spread_props(_object_spread({
-        role: r,
+        role: i,
         "aria-labelledby": a
-    }, X(o, "RowList")), {
-        children: d.map((g, v)=>/* @__PURE__ */ P(m.Fragment, {
+    }, O(o, "RowList")), {
+        children: l.map((g, v)=>/* @__PURE__ */ T(m.Fragment, {
                 children: [
                     g,
                     v < x && /* @__PURE__ */ t(h, {
                         paddingX: 16,
-                        children: /* @__PURE__ */ t(Ce, {})
+                        children: /* @__PURE__ */ t(Te, {})
                     })
                 ]
             }, v))
     }));
-}, ft = /*#__PURE__*/ m.forwardRef((_param, r)=>{
+}, xt = /*#__PURE__*/ m.forwardRef((_param, i)=>{
     var { dataAttributes: e } = _param, a = _object_without_properties(_param, [
         "dataAttributes"
     ]);
     return /* @__PURE__ */ t(Ie, {
-        isInverse: a.isInverse,
-        ref: r,
+        variant: a.isInverse ? "inverse" : "default",
+        ref: i,
         dataAttributes: _object_spread({
-            "component-name": "BoxedRow"
+            "component-name": "BoxedRow",
+            testid: "BoxedRow"
         }, e),
         children: /* @__PURE__ */ t(le, _object_spread({}, a))
     });
-}), bt = (param)=>{
-    let { children: e, ariaLabelledby: a, role: r = "list", dataAttributes: o } = param;
-    return /* @__PURE__ */ t(C, {
+}), gt = (param)=>{
+    let { children: e, ariaLabelledby: a, role: i = "list", dataAttributes: o } = param;
+    return /* @__PURE__ */ t(I, {
         space: 16,
-        role: r,
+        role: i,
         "aria-labelledby": a,
         dataAttributes: _object_spread({
-            "component-name": "BoxedRowList"
+            "component-name": "BoxedRowList",
+            testid: "BoxedRowList"
         }, o),
         children: e
     });
 };
-export { ft as BoxedRow, bt as BoxedRowList, ze as Content, ut as Row, mt as RowList };
+export { xt as BoxedRow, gt as BoxedRowList, Je as Content, ft as Row, vt as RowList };