@telefonica/mistica 17.7.0 → 17.9.0

package/dist/list.js

@@ -11,31 +11,31 @@ function _export(target, all) {
 }
 _export(exports, {
     get BoxedRow () {
-        return Gt;
+        return Yt;
     },
     get BoxedRowList () {
-        return Jt;
+        return $t;
     },
     get Content () {
-        return gt;
+        return Nt;
     },
     get ListContext () {
-        return ce;
+        return F;
     },
     get ListItem () {
-        return Xt;
+        return ta;
     },
     get OrderedList () {
-        return Qt;
+        return ea;
     },
     get Row () {
-        return Zt;
+        return Qt;
     },
     get RowList () {
-        return _t;
+        return Xt;
     },
     get UnorderedList () {
-        return Kt;
+        return pt;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -187,9 +187,9 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const ce = /*#__PURE__*/ _react.createContext({
+const F = /*#__PURE__*/ _react.createContext({
     small: !1
-}), vt = (e, a)=>typeof e == "function" ? e === null || e === void 0 ? void 0 : e({
+}), wt = (e, a)=>typeof e == "function" ? e === null || e === void 0 ? void 0 : e({
         centerY: a
     }) : a ? /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
         style: {
@@ -200,68 +200,73 @@ const ce = /*#__PURE__*/ _react.createContext({
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
             children: e
         })
-    }) : e, gt = (param)=>{
-    let { withChevron: e, headline: a, headlineRef: i, slotRef: l, title: r, titleAs: c, titleLinesMax: b, subtitle: u, subtitleLinesMax: H, description: k, descriptionLinesMax: z, detail: g, asset: A, danger: W, badge: R, right: w, rightRef: Z, slot: h, labelId: M, disabled: x, control: P, withDivider: B } = param;
-    const D = (0, _themevariantcontext.useThemeVariant)(), N = [
+    }) : e, Nt = (param)=>{
+    let { withChevron: e, headline: a, headlineRef: i, slotRef: l, title: r, titleAs: u, titleLinesMax: m, subtitle: h, subtitleLinesMax: k, description: A, descriptionLinesMax: U, detail: f, asset: z, danger: I, badge: P, right: C, rightRef: Z, slot: D, labelId: b, disabled: v, control: V, withDivider: _ } = param;
+    const w = (0, _themevariantcontext.useThemeVariant)(), R = [
         a,
         r,
-        u,
-        k,
-        h
-    ].filter(Boolean).length === 1, { textPresets: I } = (0, _hooks.useTheme)(), { small: f } = _react.useContext(ce), C = f ? I.text2 : I.text3, _ = f ? _text.Text1 : _text.Text2, G = f ? _text.Text1 : _text.Text2, J = f ? _text.Text1 : _text.Text2;
+        h,
+        A,
+        D
+    ].filter(Boolean).length === 1, { textPresets: B } = (0, _hooks.useTheme)(), { small: g } = _react.useContext(F), x = g ? B.text2 : B.text3, W = g ? _text.Text1 : _text.Text2, G = g ? _text.Text1 : _text.Text2, J = g ? _text.Text1 : _text.Text2;
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
-        className: _listcssmistica.content,
-        id: M,
+        className: (0, _classnames.default)(_listcssmistica.content, {
+            [_listcssmistica.contentSmall]: g
+        }),
+        id: b,
         children: [
-            A && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            z && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: (0, _classnames.default)(_listcssmistica.assetContainer, {
-                    [_listcssmistica.center]: N,
-                    [_listcssmistica.disabled]: x
+                    [_listcssmistica.assetContainerSmall]: g,
+                    [_listcssmistica.center]: R,
+                    [_listcssmistica.disabled]: v
                 }),
                 "aria-hidden": !0,
                 "data-testid": "asset",
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                     className: _listcssmistica.asset,
                     style: (0, _css.applyCssVars)({
-                        color: W ? ({
+                        color: I ? ({
                             default: _skincontractcssmistica.vars.colors.textError,
                             alternative: _skincontractcssmistica.vars.colors.textError,
                             brand: _skincontractcssmistica.vars.colors.textErrorBrand,
                             negative: _skincontractcssmistica.vars.colors.textErrorNegative,
                             media: _skincontractcssmistica.vars.colors.textErrorBrand
-                        })[D] : ({
+                        })[w] : ({
                             default: _skincontractcssmistica.vars.colors.textPrimary,
                             alternative: _skincontractcssmistica.vars.colors.textPrimary,
                             brand: _skincontractcssmistica.vars.colors.textPrimaryBrand,
                             negative: _skincontractcssmistica.vars.colors.textPrimaryNegative,
                             media: _skincontractcssmistica.vars.colors.textPrimaryMedia
-                        })[D],
+                        })[w],
                         [_imagecssmistica.vars.mediaBorderRadius]: _skincontractcssmistica.vars.borderRadii.mediaSmall
                     }),
-                    children: A
+                    children: z
                 })
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
-                className: _listcssmistica.innerContent,
+                className: (0, _classnames.default)(_listcssmistica.innerContent, {
+                    [_listcssmistica.innerContentSmall]: g
+                }),
                 children: [
                     /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
                         className: (0, _classnames.default)(_listcssmistica.rowBody, {
-                            [_listcssmistica.disabled]: x
+                            [_listcssmistica.disabled]: v
                         }),
                         style: {
-                            justifyContent: N ? "center" : "flex-start"
+                            justifyContent: R ? "center" : "flex-start"
                         },
                         children: [
                             /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text, {
-                                mobileSize: C.size.mobile,
-                                desktopSize: C.size.desktop,
-                                mobileLineHeight: C.lineHeight.mobile,
-                                desktopLineHeight: C.lineHeight.desktop,
-                                weight: I.rowTitle.weight,
-                                color: W ? _skincontractcssmistica.vars.colors.textError : _skincontractcssmistica.vars.colors.textPrimary,
-                                truncate: b,
+                                mobileSize: x.size.mobile,
+                                desktopSize: x.size.desktop,
+                                mobileLineHeight: x.lineHeight.mobile,
+                                desktopLineHeight: x.lineHeight.desktop,
+                                weight: B.rowTitle.weight,
+                                color: I ? _skincontractcssmistica.vars.colors.textError : _skincontractcssmistica.vars.colors.textPrimary,
+                                truncate: m,
                                 hyphens: "auto",
-                                as: c,
+                                as: u,
                                 dataAttributes: {
                                     testid: "title"
                                 },
@@ -283,59 +288,59 @@ const ce = /*#__PURE__*/ _react.createContext({
                                     children: a
                                 })
                             }),
-                            u && /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
+                            h && /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                                 paddingTop: 2,
-                                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_, {
+                                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(W, {
                                     regular: !0,
                                     color: _skincontractcssmistica.vars.colors.textPrimary,
-                                    truncate: H,
+                                    truncate: k,
                                     hyphens: "auto",
                                     dataAttributes: {
                                         testid: "subtitle"
                                     },
-                                    children: u
+                                    children: h
                                 })
                             }),
-                            k && /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
+                            A && /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                                 paddingTop: 2,
                                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(G, {
                                     regular: !0,
                                     color: _skincontractcssmistica.vars.colors.textSecondary,
-                                    truncate: z,
+                                    truncate: U,
                                     hyphens: "auto",
                                     dataAttributes: {
                                         testid: "description"
                                     },
-                                    children: k
+                                    children: A
                                 })
                             }),
-                            h && /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
+                            D && /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                                 ref: l,
                                 paddingTop: 2,
                                 dataAttributes: {
                                     testid: "slot"
                                 },
-                                children: h
+                                children: D
                             })
                         ]
                     }),
-                    R && /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
+                    P && /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                         paddingLeft: 16,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                             className: (0, _classnames.default)(_listcssmistica.badge, {
-                                [_listcssmistica.disabled]: x
+                                [_listcssmistica.disabled]: v
                             }),
                             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_badge.default, {
-                                value: R === !0 ? void 0 : R
+                                value: P === !0 ? void 0 : P
                             })
                         })
                     }),
-                    (g || w || e || P) && /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
+                    (f || C || e || V) && /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
                         className: _listcssmistica.rightContent,
                         children: [
-                            g && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                            f && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                                 className: (0, _classnames.default)(_listcssmistica.detail, {
-                                    [_listcssmistica.disabled]: x
+                                    [_listcssmistica.disabled]: v
                                 }),
                                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(J, {
                                     regular: !0,
@@ -344,24 +349,24 @@ const ce = /*#__PURE__*/ _react.createContext({
                                     dataAttributes: {
                                         testid: "detail"
                                     },
-                                    children: g
+                                    children: f
                                 })
                             }),
-                            w && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                            C && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                                 className: (0, _classnames.default)({
-                                    [_listcssmistica.detailRight]: !!g,
-                                    [_listcssmistica.disabled]: x
+                                    [_listcssmistica.detailRight]: !!f,
+                                    [_listcssmistica.disabled]: v
                                 }),
                                 ref: Z,
                                 "data-testid": "endSlot",
-                                children: vt(w, N)
+                                children: wt(C, R)
                             }),
                             e && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                                 style: {
-                                    paddingLeft: g || w ? 4 : 0
+                                    paddingLeft: f || C ? 4 : 0
                                 },
                                 className: (0, _classnames.default)(_listcssmistica.center, {
-                                    [_listcssmistica.disabled]: x
+                                    [_listcssmistica.disabled]: v
                                 }),
                                 "data-testid": "chevron",
                                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconchevronrightfilled.default, {
@@ -372,42 +377,42 @@ const ce = /*#__PURE__*/ _react.createContext({
                                         brand: _skincontractcssmistica.vars.colors.textSecondaryBrand,
                                         negative: _skincontractcssmistica.vars.colors.textSecondaryNegative,
                                         media: _skincontractcssmistica.vars.colors.textSecondaryBrand
-                                    }[D]
+                                    }[w]
                                 })
                             }),
-                            P && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                            V && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                                 style: {
-                                    paddingLeft: g || w ? 8 : 0
+                                    paddingLeft: f || C ? 8 : 0
                                 },
                                 className: _listcssmistica.center,
-                                children: P
+                                children: V
                             })
                         ]
                     })
                 ]
             }),
-            B && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            _ && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: _listcssmistica.rowDivider,
                 "data-testid": "row-divider",
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_divider.default, {})
             })
         ]
     });
-}, xt = (param)=>{
+}, Rt = (param)=>{
     let { value: e, defaultValue: a, onChange: i } = param;
-    const l = e !== void 0, [r, c] = _react.useState(!!a);
+    const l = e !== void 0, [r, u] = _react.useState(!!a);
     return [
         l ? !!e : r,
         ()=>{
-            l || c(!r), i === null || i === void 0 ? void 0 : i(l ? !e : !r);
+            l || u(!r), i === null || i === void 0 ? void 0 : i(l ? !e : !r);
         }
     ];
-}, yt = (e)=>[
+}, Bt = (e)=>[
         "switch",
         "checkbox",
         "radioValue",
         "iconButton"
-    ].some((a)=>e[a] !== void 0), wt = (e)=>{
+    ].some((a)=>e[a] !== void 0), St = (e)=>{
     let a = "";
     const i = (l)=>{
         if (l && /*#__PURE__*/ _react.isValidElement(l)) {
@@ -420,24 +425,24 @@ const ce = /*#__PURE__*/ _react.createContext({
     const a = (e === null || e === void 0 ? void 0 : e.innerText) || (e === null || e === void 0 ? void 0 : e.textContent) || "";
     return process.env.NODE_ENV === "test" ? a.replace(/\s+/g, " ").replace(/([^ ])([A-ZÁÉÍÓÚÑ])/g, "$1 $2").trim() : a;
 }, Te = /*#__PURE__*/ _react.forwardRef((e, a)=>{
-    const i = _react.useId(), l = (0, _themevariantcontext.useThemeVariant)(), r = l === "brand" || l === "media" || l === "negative", { asset: c, headline: b, title: u, titleAs: H, titleLinesMax: k, subtitle: z, subtitleLinesMax: g, description: A, descriptionLinesMax: W, detail: R, danger: w, badge: Z, role: h, touchableRole: M, slot: x, withChevron: P, dataAttributes: B, right: D, "aria-label": j, tabIndex: N, atomicReading: I, hasDivider: f, onSelectedChange: C } = e, [_, G] = _react.useState(""), [J, Le] = _react.useState(""), [ke, Ae] = _react.useState(""), Pe = wt(c), [De, Ie] = _react.useState(0), Ve = _react.useCallback((n)=>{
-        if (!n || !f) return;
+    const i = _react.useId(), l = (0, _themevariantcontext.useThemeVariant)(), r = l === "brand" || l === "media" || l === "negative", { small: u } = _react.useContext(F), { asset: m, headline: h, title: k, titleAs: A, titleLinesMax: U, subtitle: f, subtitleLinesMax: z, description: I, descriptionLinesMax: P, detail: C, danger: Z, badge: D, role: b, touchableRole: v, slot: V, withChevron: _, dataAttributes: w, right: ce, "aria-label": R, tabIndex: B, atomicReading: g, hasDivider: x, onSelectedChange: W } = e, [G, J] = _react.useState(""), [Le, ke] = _react.useState(""), [Ae, Ie] = _react.useState(""), Pe = St(m), [De, Ve] = _react.useState(0), Oe = _react.useCallback((n)=>{
+        if (!n || !x) return;
         const d = n.querySelector(`.${_listcssmistica.innerContent}`);
         if (!d) return;
         const te = n.getBoundingClientRect().left, ae = d.getBoundingClientRect().left;
-        Ie(ae - te);
+        Ve(ae - te);
     }, [
-        f
+        x
     ]), ue = [
-        u,
+        k,
         Pe,
-        _,
-        z,
-        A,
-        J,
-        R,
-        ke
-    ].filter(Boolean).join(" "), S = !!e.onPress || !!e.href || !!e.to, V = j !== null && j !== void 0 ? j : S ? ue : void 0, he = (0, _radiobutton.useRadioContext)(), v = e.disabled || e.radioValue !== void 0 && he.disabled, K = !v && !r, Q = !v && r, me = yt(e), Oe = me ? !1 : P !== null && P !== void 0 ? P : S, be = {
+        G,
+        f,
+        I,
+        Le,
+        C,
+        Ae
+    ].filter(Boolean).join(" "), S = !!e.onPress || !!e.href || !!e.to, O = R !== null && R !== void 0 ? R : S ? ue : void 0, me = (0, _radiobutton.useRadioContext)(), y = e.disabled || e.radioValue !== void 0 && me.disabled, K = !y && !r, Q = !y && r, he = Bt(e), Ee = he ? !1 : _ !== null && _ !== void 0 ? _ : S, be = {
         href: e.href,
         newTab: e.newTab,
         loadOnTop: e.loadOnTop,
@@ -447,93 +452,93 @@ const ce = /*#__PURE__*/ _react.createContext({
         onNavigate: e.onNavigate,
         onPress: e.onPress,
         trackingEvent: e.trackingEvent,
-        "aria-label": V,
+        "aria-label": O,
         "aria-labelledby": e["aria-labelledby"],
         "aria-description": e["aria-description"],
         "aria-describedby": e["aria-describedby"],
         "aria-current": e["aria-current"]
-    }, [X, fe] = xt(e.switch || e.checkbox || {}), Y = e.switch || e.checkbox ? X : e.radioValue !== void 0 ? he.selectedValue === e.radioValue : void 0;
+    }, [X, fe] = Rt(e.switch || e.checkbox || {}), Y = e.switch || e.checkbox ? X : e.radioValue !== void 0 ? me.selectedValue === e.radioValue : void 0;
     _react.useEffect(()=>{
-        Y !== void 0 && (C === null || C === void 0 ? void 0 : C(Y));
+        Y !== void 0 && (W === null || W === void 0 ? void 0 : W(Y));
     }, [
-        C,
+        W,
         Y
     ]);
     const T = (n)=>{
         var _n_withDivider;
-        return /* @__PURE__ */ (0, _jsxruntime.jsx)(gt, {
-            asset: c,
-            headline: b,
+        return /* @__PURE__ */ (0, _jsxruntime.jsx)(Nt, {
+            asset: m,
+            headline: h,
             headlineRef: (d)=>{
-                d && G(de(d));
+                d && J(de(d));
             },
-            title: u,
-            titleAs: H,
-            subtitle: z,
-            description: A,
-            badge: Z,
-            titleLinesMax: k,
-            subtitleLinesMax: g,
-            descriptionLinesMax: W,
-            detail: R,
-            danger: w,
-            right: D,
+            title: k,
+            titleAs: A,
+            subtitle: f,
+            description: I,
+            badge: D,
+            titleLinesMax: U,
+            subtitleLinesMax: z,
+            descriptionLinesMax: P,
+            detail: C,
+            danger: Z,
+            right: ce,
             rightRef: (d)=>{
-                d && Ae(de(d));
+                d && Ie(de(d));
             },
             control: n === null || n === void 0 ? void 0 : n.control,
             role: n === null || n === void 0 ? void 0 : n.role,
-            slot: x,
+            slot: V,
             slotRef: (d)=>{
-                d && Le(de(d));
+                d && ke(de(d));
             },
             labelId: n === null || n === void 0 ? void 0 : n.labelId,
-            disabled: v,
-            withChevron: Oe,
-            withDivider: (_n_withDivider = n === null || n === void 0 ? void 0 : n.withDivider) !== null && _n_withDivider !== void 0 ? _n_withDivider : f
+            disabled: y,
+            withChevron: Ee,
+            withDivider: (_n_withDivider = n === null || n === void 0 ? void 0 : n.withDivider) !== null && _n_withDivider !== void 0 ? _n_withDivider : x
         });
     };
-    if (S && !me) return /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({
+    if (S && !he) return /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({
         ref: a,
         className: (0, _classnames.default)(_listcssmistica.rowContent, {
             [_listcssmistica.touchableBackground]: K,
             [_listcssmistica.touchableBackgroundBrand]: Q,
-            [_listcssmistica.pointer]: !v
+            [_listcssmistica.pointer]: !y
         })
     }, be), {
-        role: M,
-        dataAttributes: B,
-        disabled: v,
-        tabIndex: N,
+        role: v,
+        dataAttributes: w,
+        disabled: y,
+        tabIndex: B,
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
             className: _listcssmistica.rowContentPadding,
             "aria-hidden": !!e.to || !!e.href || e.touchableRole === "link" || void 0,
             "data-testid": "content-container",
             children: T({
-                role: h
+                role: b
             })
         })
     }));
     const $ = (n)=>/* @__PURE__ */ (0, _jsxruntime.jsxs)("div", _object_spread_props(_object_spread({
             className: _listcssmistica.dualActionContainer,
-            ref: (0, _common.combineRefs)(a, Ve)
-        }, (0, _dom.getPrefixedDataAttributes)(B)), {
+            ref: (0, _common.combineRefs)(a, Oe)
+        }, (0, _dom.getPrefixedDataAttributes)(w)), {
             children: [
                 /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
                     className: _listcssmistica.dualActionBody,
                     children: [
                         /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({
-                            disabled: v
+                            disabled: y
                         }, be), {
-                            role: M,
+                            role: v,
                             className: (0, _classnames.default)(_listcssmistica.dualActionLeft, {
                                 [_listcssmistica.touchableBackground]: K,
                                 [_listcssmistica.touchableBackgroundBrand]: Q
                             }),
-                            tabIndex: N,
+                            tabIndex: B,
                             children: T({
                                 labelId: i,
-                                role: h,
+                                role: b,
                                 withDivider: !1
                             })
                         })),
@@ -543,7 +548,7 @@ const ce = /*#__PURE__*/ _react.createContext({
                         n
                     ]
                 }),
-                f && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                x && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                     className: _listcssmistica.rowDividerDualAction,
                     "data-testid": "row-divider-dual-action",
                     style: {
@@ -556,10 +561,10 @@ const ce = /*#__PURE__*/ _react.createContext({
             className: (0, _classnames.default)(_listcssmistica.rowContent, {
                 [_listcssmistica.touchableBackground]: K && d,
                 [_listcssmistica.touchableBackgroundBrand]: Q && d,
-                [_listcssmistica.pointer]: !v && d
+                [_listcssmistica.pointer]: !y && d
             }),
             ref: a
-        }, (0, _dom.getPrefixedDataAttributes)(B)), {
+        }, (0, _dom.getPrefixedDataAttributes)(w)), {
             children: n
         })), ve = (param)=>{
         let { controlElement: n } = param;
@@ -573,25 +578,25 @@ const ce = /*#__PURE__*/ _react.createContext({
         var _e_switch_name, _ref;
         const n = e.switch ? _switchcomponent.default : _checkbox.default, d = (_ref = (_e_switch_name = (_e_switch = e.switch) === null || _e_switch === void 0 ? void 0 : _e_switch.name) !== null && _e_switch_name !== void 0 ? _e_switch_name : (_e_checkbox = e.checkbox) === null || _e_checkbox === void 0 ? void 0 : _e_checkbox.name) !== null && _ref !== void 0 ? _ref : i;
         return S ? $(/* @__PURE__ */ (0, _jsxruntime.jsx)(n, {
-            disabled: v,
+            disabled: y,
             name: d,
             checked: X,
-            "aria-label": V,
+            "aria-label": O,
             "aria-labelledby": i,
             onChange: fe,
             render: ve
         })) : p(/* @__PURE__ */ (0, _jsxruntime.jsx)(n, {
-            disabled: v,
+            disabled: y,
             name: d,
             checked: X,
-            "aria-label": V,
+            "aria-label": O,
             "aria-labelledby": i,
             onChange: fe,
             render: (param)=>{
                 let { controlElement: te, labelId: ae } = param;
                 return /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                     className: _listcssmistica.rowContentPadding,
-                    role: h,
+                    role: b,
                     children: T({
                         labelId: ae,
                         control: /* @__PURE__ */ (0, _jsxruntime.jsx)(_stack.default, {
@@ -605,18 +610,18 @@ const ce = /*#__PURE__*/ _react.createContext({
     }
     if (e.radioValue) return S ? $(/* @__PURE__ */ (0, _jsxruntime.jsx)(_radiobutton.default, {
         value: e.radioValue,
-        "aria-label": V,
+        "aria-label": O,
         "aria-labelledby": i,
         render: ve
     })) : p(/* @__PURE__ */ (0, _jsxruntime.jsx)(_radiobutton.default, {
         value: e.radioValue,
-        "aria-label": V,
+        "aria-label": O,
         "aria-labelledby": i,
         render: (param)=>{
             let { controlElement: n } = param;
             return /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: _listcssmistica.rowContentPadding,
-                role: h,
+                role: b,
                 children: T({
                     labelId: i,
                     control: /* @__PURE__ */ (0, _jsxruntime.jsx)(_stack.default, {
@@ -628,7 +633,9 @@ const ce = /*#__PURE__*/ _react.createContext({
         }
     }), !0);
     if (e.iconButton) return S ? $(/* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-        className: _listcssmistica.dualActionRightIconButton,
+        className: (0, _classnames.default)(_listcssmistica.dualActionRightIconButton, {
+            [_listcssmistica.dualActionRightIconButtonSmall]: u
+        }),
         children: e.iconButton.Icon ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.IconButton, _object_spread_props(_object_spread({}, e.iconButton), {
             disabled: e.disabled
         })) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.ToggleIconButton, _object_spread_props(_object_spread({}, e.iconButton), {
@@ -642,39 +649,39 @@ const ce = /*#__PURE__*/ _react.createContext({
                 space: "around",
                 children: e.iconButton.Icon ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.IconButton, _object_spread_props(_object_spread({}, e.iconButton), {
                     disabled: e.disabled,
-                    role: h
+                    role: b
                 })) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.ToggleIconButton, _object_spread_props(_object_spread({}, e.iconButton), {
                     disabled: e.disabled,
-                    role: h
+                    role: b
                 }))
             })
         })
     }));
-    const ee = !!j || I;
+    const ee = !!R || g;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-        role: h,
+        role: b,
         children: /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", _object_spread_props(_object_spread({
             className: (0, _classnames.default)(_listcssmistica.rowContent, _listcssmistica.rowContentPadding),
             role: ee ? "text" : void 0
-        }, (0, _dom.getPrefixedDataAttributes)(B)), {
+        }, (0, _dom.getPrefixedDataAttributes)(w)), {
             ref: a,
-            tabIndex: N,
+            tabIndex: B,
             children: [
                 /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                     "aria-hidden": ee,
                     children: T({
-                        role: h
+                        role: b
                     })
                 }),
                 ee && /* @__PURE__ */ (0, _jsxruntime.jsx)(_screenreaderonly.default, {
                     children: /* @__PURE__ */ (0, _jsxruntime.jsx)("span", {
-                        children: j !== null && j !== void 0 ? j : ue
+                        children: R !== null && R !== void 0 ? R : ue
                     })
                 })
             ]
         }))
     });
-}), Zt = /*#__PURE__*/ _react.forwardRef((_param, l)=>{
+}), Qt = /*#__PURE__*/ _react.forwardRef((_param, l)=>{
     var { dataAttributes: e, role: a = "listitem" } = _param, i = _object_without_properties(_param, [
         "dataAttributes",
         "role"
@@ -690,35 +697,35 @@ const ce = /*#__PURE__*/ _react.createContext({
             }, e)
         }))
     });
-}), _t = (param)=>{
-    let { children: e, role: a = "list", "aria-label": i, "aria-labelledby": l, "aria-live": r = "off", "aria-atomic": c = !1, dataAttributes: b, small: u = !1 } = param;
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(ce.Provider, {
+}), Xt = (param)=>{
+    let { children: e, role: a = "list", "aria-label": i, "aria-labelledby": l, "aria-live": r = "off", "aria-atomic": u = !1, dataAttributes: m, small: h = !1 } = param;
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(F.Provider, {
         value: {
-            small: u
+            small: h
         },
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", _object_spread_props(_object_spread({
             role: a,
             "aria-labelledby": l,
             "aria-label": i,
             "aria-live": r,
-            "aria-atomic": c
+            "aria-atomic": u
         }, (0, _dom.getPrefixedDataAttributes)(_object_spread({
             testid: "RowList"
-        }, b))), {
+        }, m))), {
             children: e
         }))
     });
-}, Gt = /*#__PURE__*/ _react.forwardRef((_param, i)=>{
+}, Yt = /*#__PURE__*/ _react.forwardRef((_param, i)=>{
     var { dataAttributes: e } = _param, a = _object_without_properties(_param, [
         "dataAttributes"
     ]);
     const { selected: l } = a, r = _object_without_properties(a, [
         "selected"
-    ]), c = (0, _themevariantcontext.useThemeVariant)(), [b, u] = _react.useState(!1);
+    ]), u = (0, _themevariantcontext.useThemeVariant)(), [m, h] = _react.useState(!1);
     var _r_variant;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)(_boxed.InternalBoxed, {
         overflow: "visible",
-        className: (0, _classnames.default)(_listcssmistica.boxed, _listcssmistica.selectionOutline, (l !== null && l !== void 0 ? l : b) && _listcssmistica.selectionOutlineColor[c]),
+        className: (0, _classnames.default)(_listcssmistica.boxed, _listcssmistica.selectionOutline, (l !== null && l !== void 0 ? l : m) && _listcssmistica.selectionOutlineColor[u]),
         variant: (_r_variant = r.variant) !== null && _r_variant !== void 0 ? _r_variant : "default",
         ref: i,
         dataAttributes: _object_spread({
@@ -726,29 +733,29 @@ const ce = /*#__PURE__*/ _react.createContext({
         }, e),
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(Te, _object_spread_props(_object_spread({}, r), {
             hasDivider: !1,
-            onSelectedChange: u
+            onSelectedChange: h
         }))
     });
-}), Jt = (param)=>{
-    let { children: e, role: a = "list", dataAttributes: i, "aria-label": l, "aria-labelledby": r, "aria-live": c = "off", "aria-atomic": b = !1, small: u = !1 } = param;
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(ce.Provider, {
+}), $t = (param)=>{
+    let { children: e, role: a = "list", dataAttributes: i, "aria-label": l, "aria-labelledby": r, "aria-live": u = "off", "aria-atomic": m = !1, small: h = !1 } = param;
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(F.Provider, {
         value: {
-            small: u
+            small: h
         },
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_stack.default, {
             space: 16,
             role: a,
             "aria-label": l,
             "aria-labelledby": r,
-            "aria-live": c,
-            "aria-atomic": b,
+            "aria-live": u,
+            "aria-atomic": m,
             dataAttributes: _object_spread({
                 testid: "BoxedRowList"
             }, i),
             children: e
         })
     });
-}, Kt = (param)=>{
+}, pt = (param)=>{
     let { children: e, "aria-label": a, "aria-labelledby": i } = param;
     return(// eslint-disable-next-line jsx-a11y/no-redundant-roles
     /* @__PURE__ */ (0, _jsxruntime.jsx)("ul", {
@@ -758,7 +765,7 @@ const ce = /*#__PURE__*/ _react.createContext({
         "aria-labelledby": i,
         children: e
     }));
-}, Qt = (param)=>{
+}, ea = (param)=>{
     let { children: e, "aria-label": a, "aria-labelledby": i } = param;
     return(// eslint-disable-next-line jsx-a11y/no-redundant-roles
     /* @__PURE__ */ (0, _jsxruntime.jsx)("ol", {
@@ -768,7 +775,7 @@ const ce = /*#__PURE__*/ _react.createContext({
         "aria-labelledby": i,
         children: e
     }));
-}, Xt = (param)=>{
+}, ta = (param)=>{
     let { children: e, Icon: a, icon: i, withMarker: l = !0 } = param;
     return l ? a || i ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("li", {
         className: _listcssmistica.liWithCustomIcon,