welcome-ui 8.0.0-alpha.0 → 8.1.0-alpha.0

package/dist/AXB53BZF-XKOjjeWO.mjs

@@ -0,0 +1,25 @@
+"use client";
+import { u } from "./P4IRICAX-CWSZLTGz.mjs";
+import { a as c } from "./VGCJ63VH-C0UPBY-5.mjs";
+import { f as l, c as p, h as D, _ as m, i as g, g as a, s as v } from "./LVA2YJMS-C-kJ1lkr.mjs";
+var f = "button", d = p(
+  function(r) {
+    var s = r, { store: o } = s, e = m(s, ["store"]);
+    const i = c();
+    o = o || i, g(
+      o,
+      process.env.NODE_ENV !== "production" && "DialogDisclosure must receive a `store` prop or be wrapped in a DialogProvider component."
+    );
+    const n = o.useState("contentElement");
+    return e = a({
+      "aria-haspopup": v(n, "dialog")
+    }, e), e = u(a({ store: o }, e)), e;
+  }
+), P = l(function(r) {
+  const s = d(r);
+  return D(f, s);
+});
+export {
+  P as D,
+  d as u
+};

package/dist/Accordion.mjs

@@ -1,21 +1,22 @@
 "use client";
-import t, { cloneElement as m } from "react";
-import r, { th as o } from "@xstyled/styled-components";
-import { D as u } from "./P4IRICAX-DzXqUYe-.mjs";
-import { d as p, e as f } from "./VGCJ63VH-B39w1tBw.mjs";
+import { j as o } from "./jsx-runtime-B7I4PJ0H.mjs";
+import { cloneElement as m } from "react";
 import "./Icon.mjs";
-import { R as g } from "./index-BRDOakbf.mjs";
-import { forwardRef as h } from "./System.mjs";
-const $ = r.divBox`
-  ${o("accordions.wrapper")};
+import { R as p } from "./index-CYmF7qCH.mjs";
+import { forwardRef as u } from "./System.mjs";
+import t, { th as i } from "@xstyled/styled-components";
+import { D as f } from "./P4IRICAX-CWSZLTGz.mjs";
+import { d as g, e as h } from "./VGCJ63VH-C0UPBY-5.mjs";
+const x = t.divBox`
+  ${i("accordions.wrapper")};
   transition: medium;
 
   &:hover {
     border-color: neutral-50;
   }
-`, n = r.divBox`
+`, n = t.divBox`
   flex-shrink: 0;
-  ${o("accordions.icon")};
+  ${i("accordions.icon")};
   transform: rotate3d(0);
   transition: medium;
   width: 32;
@@ -27,10 +28,10 @@ const $ = r.divBox`
   & *:first-child {
     margin: auto;
   }
-`, w = r(u)`
-  ${o("accordions.title")};
+`, $ = t(f)`
+  ${i("accordions.title")};
   width: 100%;
-  padding: ${o("accordions.padding")};
+  padding: ${i("accordions.padding")};
   background-color: transparent;
   border: 0;
   display: flex;
@@ -58,7 +59,7 @@ const $ = r.divBox`
       color: inherit;
     }
   }
-`, E = r(p)`
+`, j = t(g)`
   display: grid;
   grid-template-rows: 0fr;
   transition-property: grid-template-rows;
@@ -74,18 +75,24 @@ const $ = r.divBox`
   &[data-enter] {
     grid-template-rows: 1fr;
   }
-`, v = r.div`
-  ${o("accordions.content")};
-  padding: ${o("accordions.padding")};
+`, v = t.div`
+  ${i("accordions.content")};
+  padding: ${i("accordions.padding")};
   padding-top: 0;
   color: neutral-70;
-`, A = h(
-  ({ children: i, dataTestId: e, icon: c = /* @__PURE__ */ t.createElement(g, null), store: a, title: d, ...s }, l) => /* @__PURE__ */ t.createElement($, { "data-testid": e, ref: l, ...s }, /* @__PURE__ */ t.createElement(w, { "data-testid": e ? `${e}-title` : void 0, store: a }, d, /* @__PURE__ */ t.createElement(n, null, m(c, { size: "sm" }))), /* @__PURE__ */ t.createElement(E, { "data-testid": e ? `${e}-content` : void 0, store: a }, /* @__PURE__ */ t.createElement("div", null, /* @__PURE__ */ t.createElement(v, null, i))))
+`, B = u(
+  ({ children: e, dataTestId: r, icon: d = /* @__PURE__ */ o.jsx(p, {}), store: s, title: c, ...a }, l) => /* @__PURE__ */ o.jsxs(x, { "data-testid": r, ref: l, ...a, children: [
+    /* @__PURE__ */ o.jsxs($, { "data-testid": r ? `${r}-title` : void 0, store: s, children: [
+      c,
+      /* @__PURE__ */ o.jsx(n, { children: m(d, { size: "sm" }) })
+    ] }),
+    /* @__PURE__ */ o.jsx(j, { "data-testid": r ? `${r}-content` : void 0, store: s, children: /* @__PURE__ */ o.jsx("div", { children: /* @__PURE__ */ o.jsx(v, { children: e }) }) })
+  ] })
 );
-function B(i) {
-  return f({ animated: !0, ...i });
+function E(e) {
+  return h({ animated: !0, ...e });
 }
 export {
-  A as Accordion,
-  B as useAccordion
+  B as Accordion,
+  E as useAccordion
 };

package/dist/Alert.mjs

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

package/dist/AspectRatio.mjs

@@ -1,9 +1,9 @@
 "use client";
-import i from "react";
-import r, { css as s } from "@xstyled/styled-components";
-import { forwardRef as c } from "./System.mjs";
-const n = r.divBox(
-  ({ ratio: t }) => s`
+import { j as i } from "./jsx-runtime-B7I4PJ0H.mjs";
+import { forwardRef as s } from "./System.mjs";
+import r, { css as n } from "@xstyled/styled-components";
+const p = r.divBox(
+  ({ ratio: t = 4 / 3 }) => n`
     position: relative;
 
     & > * {
@@ -32,10 +32,8 @@ const n = r.divBox(
       padding-bottom: ${1 / t * 100}%;
     }
   `
-), a = c(
-  ({ ratio: t = 4 / 3, ...e }, o) => /* @__PURE__ */ i.createElement(n, { ratio: t, ref: o, ...e })
-);
-a.displayName = "AspectRatio";
+), c = s(({ ratio: t, ...o }, e) => /* @__PURE__ */ i.jsx(p, { ratio: t, ref: e, ...o }));
+c.displayName = "AspectRatio";
 export {
-  a as AspectRatio
+  c as AspectRatio
 };

package/dist/Avatar.mjs

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