@telefonica/mistica 14.5.0 → 14.6.0

package/dist-es/avatar.js

@@ -80,27 +80,27 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 import * as g from "react";
 import E from "./badge.js";
 import P from "./generated/mistica-icons/icon-user-account-regular.js";
-import { useIsInverseVariant as k } from "./theme-variant-context.js";
-import { avatar as w, image as y } from "./avatar.css-mistica.js";
-import { vars as s } from "./skins/skin-contract.css-mistica.js";
+import { useIsInverseVariant as S } from "./theme-variant-context.js";
+import { avatar as k, image as y } from "./avatar.css-mistica.js";
+import { vars as n } from "./skins/skin-contract.css-mistica.js";
 import { getPrefixedDataAttributes as R } from "./utils/dom.js";
-import { jsx as n } from "./_virtual/jsx-runtime.js";
-const S = (r, o)=>{
+import { jsx as s } from "./_virtual/jsx-runtime.js";
+const B = (r, o)=>{
     if (!o) return 0;
     const t = r / 2, e = o === !0 ? 5 : 10;
     return t * (1 - Math.sin(Math.PI / 4)) - e;
-}, B = (r, o)=>{
+}, D = (r, o)=>{
     if (!o) return null;
     let t;
-    return r <= 40 ? t = 14 : r <= 64 ? t = 16 : t = 18, /* @__PURE__ */ n("span", {
+    return r <= 40 ? t = 14 : r <= 64 ? t = 16 : t = 18, /* @__PURE__ */ s("span", {
         style: {
             fontSize: t,
             textTransform: "uppercase"
         },
         children: o
     });
-}, O = (_param)=>{
-    var { size: r , src: o , Icon: t = P , badge: e , initials: c = "" , "aria-label": a , dataAttributes: h  } = _param, l = _objectWithoutProperties(_param, [
+}, U = (_param)=>{
+    var { size: r , src: o , Icon: t = P , badge: e , initials: l = "" , "aria-label": a , dataAttributes: h  } = _param, c = _objectWithoutProperties(_param, [
         "size",
         "src",
         "Icon",
@@ -109,41 +109,43 @@ const S = (r, o)=>{
         "aria-label",
         "dataAttributes"
     ]);
-    var d, f;
-    const i = k(), p = (d = l.backgroundColor) != null ? d : i ? s.colors.brandHigh : s.colors.brandLow, v = (f = l.textColor) != null ? f : i ? s.colors.textPrimaryInverse : s.colors.brand, [I, m] = g.useState(!1);
+    var u, f;
+    const i = S(), b = (u = c.backgroundColor) != null ? u : i ? n.colors.brandHigh : n.colors.brandLow, p = (f = c.textColor) != null ? f : i ? n.colors.textPrimaryInverse : n.colors.brand, [v, d] = g.useState(!1);
     g.useEffect(()=>{
-        m(!1);
+        d(!1);
     }, [
         o
     ]);
-    const x = c.trim().slice(0, 2), u = S(r, e), b = e === !0 ? void 0 : e || 0, C = !!o && !I, A = r <= 40 ? 16 : 24;
-    return /* @__PURE__ */ n(E, {
-        value: b,
-        top: u,
-        right: u,
-        children: /* @__PURE__ */ n("div", _objectSpreadProps(_objectSpread({
-            className: w,
+    const x = c.border ? `1px solid ${n.colors.borderLow}` : "none", I = l.trim().slice(0, 2), m = B(r, e), C = e === !0 ? void 0 : e || 0, w = !!o && !v, A = r <= 40 ? 16 : 24;
+    return /* @__PURE__ */ s(E, {
+        value: C,
+        top: m,
+        right: m,
+        children: /* @__PURE__ */ s("div", _objectSpreadProps(_objectSpread({
+            className: k,
             role: "img",
-            "aria-label": a != null ? a : c,
+            "aria-label": a != null ? a : l,
             style: {
                 width: r,
                 height: r,
-                color: v,
-                background: p
+                color: p,
+                background: b,
+                boxSizing: "border-box",
+                border: x
             }
         }, R(h, "Avatar")), {
-            children: C ? /* @__PURE__ */ n("img", {
+            children: w ? /* @__PURE__ */ s("img", {
                 src: o,
                 className: y,
-                onError: ()=>m(!0),
+                onError: ()=>d(!0),
                 role: "none",
                 width: r,
                 height: r
-            }) : B(r, x) || /* @__PURE__ */ n(t, {
+            }) : D(r, I) || /* @__PURE__ */ s(t, {
                 size: A,
                 color: "currentColor"
             })
         }))
     });
 };
-export { O as default };
+export { U as default };