welcome-ui 8.1.0 → 8.2.0-alpha.0

package/dist/Alert.mjs

@@ -1,8 +1,8 @@
 "use client";
 import { j as s } from "./jsx-runtime-B7I4PJ0H.mjs";
-import j, { Children as B, cloneElement as m } from "react";
-import { Box as w } from "./Box.mjs";
-import { Button as A } from "./Button.mjs";
+import R, { Children as j, cloneElement as m } from "react";
+import { Box as B } from "./Box.mjs";
+import { Button as w } from "./Button.mjs";
 import { CloseButton as _ } from "./CloseButton.mjs";
 import { forwardRef as d } from "./System.mjs";
 import c, { th as r, css as f, system as D } from "@xstyled/styled-components";
@@ -15,7 +15,7 @@ const x = c.divBox`
   justify-content: space-between;
   align-items: flex-start;
   flex: 1;
-`, b = c(q)`
+`, A = c(q)`
   position: absolute;
   align-self: flex-start;
 `, F = c.divBox(({ icon: n, isFullWidth: o, size: e, variant: l }) => f`
@@ -41,7 +41,7 @@ const x = c.divBox`
         font-size: ${r("fontSizes.md")};
       }
 
-      ${b} {
+      ${A} {
         margin-top: -3;
       }
     `}
@@ -50,28 +50,28 @@ const x = c.divBox`
     ${r("alerts.title.default")};
     ${r(`alerts.title.sizes.${n}`)};
     ${D};
-  `), v = ({ children: n, dataTestId: o, variant: e }) => /* @__PURE__ */ s.jsx(G, { "data-testid": o, variant: e, children: n }), H = d(
+  `), b = ({ children: n, dataTestId: o, variant: e }) => /* @__PURE__ */ s.jsx(G, { "data-testid": o, variant: e, children: n }), H = d(
   ({
     children: n,
     cta: o,
     dataTestId: e,
     handleClose: l,
     icon: p,
-    isFullWidth: E,
+    isFullWidth: h,
     size: i = "sm",
     variant: a = "default",
-    ...I
-  }, V) => {
-    const h = e ? `${e}-close-button` : void 0, k = a === "beige" ? "default" : a, u = a === "ai", T = B.toArray(n).map((t) => j.isValidElement(t) && t.type === v ? m(t, { variant: i }) : t), $ = (t) => {
+    ...C
+  }, I) => {
+    const k = e ? `${e}-close-button` : void 0, E = a === "beige" ? "default" : a, u = a === "ai", T = j.toArray(n).map((t) => t.type === b ? m(t, { variant: i }) : t), $ = (t) => {
       var y;
       if (t) {
-        if (t.type === S)
+        if (t.type === v)
           return m(t, {
             ai: u,
             size: i,
             variant: u ? "primary" : void 0
           });
-        if (t.type === C)
+        if (t.type === S)
           return m(t, {
             ai: u,
             size: i
@@ -79,29 +79,29 @@ const x = c.divBox`
         if ((y = t.props) != null && y.children)
           return m(t, {
             ...t.props,
-            children: B.map(
+            children: j.map(
               t.props.children,
-              (R) => $(R)
+              (V) => $(V)
             )
           });
       }
       return t;
-    }, g = j.isValidElement(o) ? $(o) : o;
+    }, g = R.isValidElement(o) ? $(o) : o;
     return /* @__PURE__ */ s.jsxs(
       F,
       {
         "data-testid": e,
         icon: p,
-        isFullWidth: E,
-        ref: V,
+        isFullWidth: h,
+        ref: I,
         size: i,
         variant: a,
-        ...I,
+        ...C,
         children: [
           !!l && /* @__PURE__ */ s.jsx(
             _,
             {
-              dataTestId: h,
+              dataTestId: k,
               onClick: l,
               position: "absolute",
               right: "sm",
@@ -109,23 +109,23 @@ const x = c.divBox`
               top: "sm"
             }
           ),
-          p !== null && /* @__PURE__ */ s.jsx(b, { icon: p, size: i, variant: k }),
+          p !== null && /* @__PURE__ */ s.jsx(A, { icon: p, size: i, variant: E }),
           /* @__PURE__ */ s.jsxs(x, { children: [
-            /* @__PURE__ */ s.jsx(w, { flex: 1, children: T }),
-            !!g && /* @__PURE__ */ s.jsx(w, { alignItems: "center", display: "flex", gap: "sm", children: g })
+            /* @__PURE__ */ s.jsx(B, { flex: 1, children: T }),
+            !!g && /* @__PURE__ */ s.jsx(B, { alignItems: "center", display: "flex", gap: "sm", children: g })
           ] })
         ]
       }
     );
   }
+), v = d(
+  ({ variant: n = "secondary", ...o }, e) => /* @__PURE__ */ s.jsx(w, { flexShrink: 0, ref: e, w: "fit-content", ...o, variant: n })
 ), S = d(
-  ({ variant: n = "secondary", ...o }, e) => /* @__PURE__ */ s.jsx(A, { flexShrink: 0, ref: e, w: "fit-content", ...o, variant: n })
-), C = d(
-  ({ variant: n = "tertiary", ...o }, e) => /* @__PURE__ */ s.jsx(A, { flexShrink: 0, ref: e, w: "fit-content", ...o, variant: n })
+  ({ variant: n = "tertiary", ...o }, e) => /* @__PURE__ */ s.jsx(w, { flexShrink: 0, ref: e, w: "fit-content", ...o, variant: n })
 ), X = Object.assign(H, {
-  Button: S,
-  SecondaryButton: C,
-  Title: v
+  Button: v,
+  SecondaryButton: S,
+  Title: b
 });
 export {
   X as Alert

package/dist/Avatar.mjs

@@ -1,57 +1,60 @@
 "use client";
 import { j as s } from "./jsx-runtime-B7I4PJ0H.mjs";
 import m, { th as g, useTheme as j } from "@xstyled/styled-components";
-import { Box as v } from "./Box.mjs";
-import { forwardRef as y } from "./System.mjs";
-import { Shape as C } from "./Shape.mjs";
-import { Text as $ } from "./Text.mjs";
-const b = m(C)`
+import { memo as v } from "react";
+import { Box as y } from "./Box.mjs";
+import { forwardRef as C } from "./System.mjs";
+import { Shape as $ } from "./Shape.mjs";
+import { Text as b } from "./Text.mjs";
+const A = m($)`
   flex-shrink: 0;
-`, A = m($)`
+`, z = m(b)`
   ${g("avatars.text")};
 `;
-function z(o, t = "") {
-  const r = Object.keys(o).filter((e) => e.startsWith("secondary-")), a = t.length % r.length;
+function S(e, t = "") {
+  const r = Object.keys(e).filter((o) => o.startsWith("secondary-")), a = t.length % r.length;
   return r[a];
 }
-function S(o = "") {
-  const [t, r] = o.split(" ");
+function T(e = "") {
+  const [t, r] = e.split(" ");
   return t && r ? `${t.charAt(0).toUpperCase()}${r.charAt(0).toUpperCase()}` : t.substring(0, 2).toUpperCase();
 }
-const T = y(
-  ({
-    color: o,
-    fontSize: t,
-    getInitials: r = S,
-    h: a,
-    name: e,
-    shape: p = "circle",
-    size: f = "md",
-    src: i,
-    w: n,
-    ...h
-  }, x) => {
-    const l = j(), u = o || z(l.colors, e), c = l.avatars.sizes[f], d = t || `calc(${n ? l.toRem(n) : c} / 2.5)`;
-    return /* @__PURE__ */ s.jsxs(
-      b,
-      {
-        "aria-label": e,
-        backgroundColor: u,
-        h: a || c,
-        ref: x,
-        role: "img",
-        shape: p,
-        w: n || c,
-        ...h,
-        children: [
-          i ? /* @__PURE__ */ s.jsx("img", { alt: e, src: i }) : null,
-          !i && /* @__PURE__ */ s.jsx(v, { children: /* @__PURE__ */ s.jsx(A, { fontSize: d, m: 0, children: r(e) }) })
-        ]
-      }
-    );
-  }
+const k = v(
+  C(
+    ({
+      color: e,
+      fontSize: t,
+      getInitials: r = T,
+      h: a,
+      name: o,
+      shape: p = "circle",
+      size: f = "md",
+      src: i,
+      w: n,
+      ...h
+    }, x) => {
+      const l = j(), u = e || S(l.colors, o), c = l.avatars.sizes[f], d = t || `calc(${n ? l.toRem(n) : c} / 2.5)`;
+      return /* @__PURE__ */ s.jsxs(
+        A,
+        {
+          "aria-label": o,
+          backgroundColor: u,
+          h: a || c,
+          ref: x,
+          role: "img",
+          shape: p,
+          w: n || c,
+          ...h,
+          children: [
+            i ? /* @__PURE__ */ s.jsx("img", { alt: o, src: i }) : null,
+            !i && /* @__PURE__ */ s.jsx(y, { children: /* @__PURE__ */ s.jsx(z, { fontSize: d, m: 0, children: r(o) }) })
+          ]
+        }
+      );
+    }
+  )
 );
-T.displayName = "Avatar";
+k.displayName = "Avatar";
 export {
-  T as Avatar
+  k as Avatar
 };