@fabio.caffarello/react-design-system 4.6.0 → 4.7.0

package/dist/index.js

@@ -8306,39 +8306,43 @@ const mn = Ne(
   );
 });
 ra.displayName = "Chip";
-const as = be(function(u, c) {
-  var p = u, {
+const as = be(function(p, u) {
+  var m = p, {
     src: t,
     alt: r,
     fallback: s,
     size: a = "md",
     variant: o = "circle",
-    "aria-label": i,
-    className: l = ""
-  } = p, d = P(p, [
+    loading: i = "eager",
+    "aria-label": l,
+    className: d = ""
+  } = m, c = P(m, [
     "src",
     "alt",
     "fallback",
     "size",
     "variant",
+    "loading",
     "aria-label",
     "className"
   ]);
-  const [m, b] = V(!1), [h, w] = V(!1), y = {
+  const [b, h] = V(!1), [w, y] = V(!1), g = {
     xs: "h-6 w-6 text-xs",
     sm: "h-8 w-8 text-sm",
     md: "h-10 w-10 text-base",
     lg: "h-12 w-12 text-lg",
-    xl: "h-16 w-16 text-xl"
-  }, g = {
+    xl: "h-16 w-16 text-xl",
+    "2xl": "h-24 w-24 text-3xl",
+    "3xl": "h-28 w-28 text-4xl"
+  }, v = {
     circle: G("full"),
     square: G("none"),
     rounded: G("md")
-  }, v = !t || m, k = typeof s == "string" ? s.toUpperCase().slice(0, 2) : s, $ = i || r || "User avatar";
+  }, k = !t || b, $ = typeof s == "string" ? s.toUpperCase().slice(0, 2) : s, C = l || r || "User avatar";
   return /* @__PURE__ */ n.jsxs(
     "div",
     L(A({
-      ref: c,
+      ref: u,
       className: x(
         "relative",
         "inline-flex",
@@ -8347,38 +8351,39 @@ const as = be(function(u, c) {
         "shrink-0",
         "font-medium",
         "overflow-hidden",
-        y[a],
-        g[o],
+        g[a],
+        v[o],
         "bg-surface-muted",
         "text-fg-primary",
-        l
+        d
       ),
       role: "img",
-      "aria-label": $
-    }, d), {
+      "aria-label": C
+    }, c), {
       children: [
-        !v && t && /* @__PURE__ */ n.jsx(
+        !k && t && /* @__PURE__ */ n.jsx(
           "img",
           {
             src: t,
             alt: r || "",
+            loading: i,
             className: x(
               "w-full",
               "h-full",
               "object-cover",
-              g[o],
-              h ? "opacity-100" : "opacity-0",
+              v[o],
+              w ? "opacity-100" : "opacity-0",
               "transition-opacity",
               "duration-200"
             ),
-            onLoad: () => w(!0),
+            onLoad: () => y(!0),
             onError: () => {
-              b(!0), w(!1);
+              h(!0), y(!1);
             },
             "aria-hidden": "true"
           }
         ),
-        v && /* @__PURE__ */ n.jsx(
+        k && /* @__PURE__ */ n.jsx(
           "span",
           {
             className: x(
@@ -8387,10 +8392,10 @@ const as = be(function(u, c) {
               "justify-center",
               "w-full",
               "h-full",
-              g[o]
+              v[o]
             ),
             "aria-hidden": "true",
-            children: k || "?"
+            children: $ || "?"
           }
         )
       ]