welcome-ui 8.1.3 → 8.2.0-alpha.1

package/dist/Button.mjs

@@ -1,24 +1,24 @@
 "use client";
-import r from "react";
-import h, { th as t, system as p, css as e } from "@xstyled/styled-components";
-import { B as y } from "./X5NMLKT6-CvSCix-_.mjs";
-import { h as w } from "./hide-focus-rings-root-BNyva1yb.mjs";
-import { shouldForwardProp as g, forwardRef as x } from "./System.mjs";
-import { Loader as B } from "./Loader.mjs";
-import { Box as c } from "./Box.mjs";
-const E = (i, s = "square") => e`
-  width: ${t(`buttons.sizes.${i}.height`)};
+import { j as r } from "./jsx-runtime-B7I4PJ0H.mjs";
+import { Box as l } from "./Box.mjs";
+import { Loader as f } from "./Loader.mjs";
+import { shouldForwardProp as p, forwardRef as y } from "./System.mjs";
+import { B as w } from "./X5NMLKT6-BJw3xE-K.mjs";
+import x, { th as t, system as g, css as n } from "@xstyled/styled-components";
+import { h as j } from "./hide-focus-rings-root-CCXdysih.mjs";
+const B = (s, i = "square") => n`
+  width: ${t(`buttons.sizes.${s}.height`)};
   padding: 0;
-  ${s === "circle" && e`
-    border-radius: ${t(`buttons.sizes.${i}.height`)};
+  ${i === "circle" && n`
+    border-radius: ${t(`buttons.sizes.${s}.height`)};
   `};
-`, d = h(y).withConfig({ shouldForwardProp: g })(
-  ({ ai: i, danger: s, disabled: u, shape: $, size: n = "md", variant: o = "primary" }) => e`
+`, c = x(w).withConfig({ shouldForwardProp: p })(
+  ({ ai: s, danger: i, disabled: u, shape: $, size: e = "md", variant: o = "primary" }) => n`
     ${t(`buttons.${o}`)};
-    ${i && e`
+    ${s && n`
       ${t(`buttons.ai.${o}`)};
     `}
-    ${s && e`
+    ${i && n`
       ${t(`buttons.danger.${o}`)};
     `}
     position: relative;
@@ -26,7 +26,7 @@ const E = (i, s = "square") => e`
     align-items: center;
     justify-content: center;
     width: auto;
-    ${t(`buttons.sizes.${n}`)};
+    ${t(`buttons.sizes.${e}`)};
     text-decoration: none;
     text-align: center;
     white-space: nowrap;
@@ -37,22 +37,22 @@ const E = (i, s = "square") => e`
     appearance: none;
     overflow: hidden;
     transition: medium;
-    ${$ && E(n, $)};
-    ${p};
+    ${$ && B(e, $)};
+    ${g};
 
     & > svg.wui-icon,
     & > i.wui-icon-font {
       font-weight: initial;
 
       &:only-child {
-        width: ${t(`buttons.icon.only.${n}`)};
-        height: ${t(`buttons.icon.only.${n}`)};
-        font-size: ${t(`buttons.icon.only.${n}`)};
+        width: ${t(`buttons.icon.only.${e}`)};
+        height: ${t(`buttons.icon.only.${e}`)};
+        font-size: ${t(`buttons.icon.only.${e}`)};
       }
       &:not(:only-child) {
-        width: ${t(`buttons.icon.default.${n}`)};
-        height: ${t(`buttons.icon.default.${n}`)};
-        font-size: ${t(`buttons.icon.default.${n}`)};
+        width: ${t(`buttons.icon.default.${e}`)};
+        height: ${t(`buttons.icon.default.${e}`)};
+        font-size: ${t(`buttons.icon.default.${e}`)};
       }
     }
 
@@ -60,34 +60,34 @@ const E = (i, s = "square") => e`
       margin-right: sm;
     }
 
-    ${!u && e`
-      [${w}] &:focus {
+    ${!u && n`
+      [${j}] &:focus {
         box-shadow: none;
       }
       &:focus {
         ${t(`buttons.focus.${o}`)};
-        ${i && e`
+        ${s && n`
           ${t(`buttons.focus.ai.${o}`)};
         `}
-        ${s && e`
+        ${i && n`
           ${t(`buttons.focus.danger.${o}`)};
         `}
       }
       &:hover {
         ${t(`buttons.hover.${o}`)};
-        ${i && e`
+        ${s && n`
           ${t(`buttons.hover.ai.${o}`)};
         `}
-        ${s && e`
+        ${i && n`
           ${t(`buttons.hover.danger.${o}`)};
         `}
       }
       &:active {
         ${t(`buttons.active.${o}`)};
-        ${i && e`
+        ${s && n`
           ${t(`buttons.active.ai.${o}`)};
         `}
-        ${s && e`
+        ${i && n`
           ${t(`buttons.active.danger.${o}`)};
         `}
       }
@@ -97,54 +97,59 @@ const E = (i, s = "square") => e`
       cursor: not-allowed;
     }
   `
-), R = x(
+), R = y(
   ({
-    ai: i,
-    children: s,
+    ai: s,
+    children: i,
     danger: u,
     dataTestId: $,
-    disabled: n,
+    disabled: e,
     isLoading: o,
-    size: a = "md",
-    variant: m = "primary",
+    size: h = "md",
+    variant: a = "primary",
     ...b
-  }, f) => {
-    const l = n || o;
-    return /* @__PURE__ */ r.createElement(
-      d,
+  }, m) => {
+    const d = e || o;
+    return /* @__PURE__ */ r.jsxs(
+      c,
       {
-        ai: i,
+        ai: s,
         danger: u,
         "data-loading": o,
         "data-testid": $,
-        disabled: l,
-        ref: f,
-        size: a,
-        variant: l ? "disabled" : m,
-        ...b
-      },
-      o && /* @__PURE__ */ r.createElement("div", null, /* @__PURE__ */ r.createElement(
-        c,
-        {
-          alignItems: "center",
-          bottom: 0,
-          display: "flex",
-          justifyContent: "center",
-          left: 0,
-          m: 0,
-          position: "absolute",
-          right: 0,
-          top: 0
-        },
-        /* @__PURE__ */ r.createElement(B, { size: "xs" })
-      ), /* @__PURE__ */ r.createElement(c, { opacity: "0" }, s)),
-      !o && s
+        disabled: d,
+        ref: m,
+        size: h,
+        variant: d ? "disabled" : a,
+        ...b,
+        children: [
+          o ? /* @__PURE__ */ r.jsxs("div", { children: [
+            /* @__PURE__ */ r.jsx(
+              l,
+              {
+                alignItems: "center",
+                bottom: 0,
+                display: "flex",
+                justifyContent: "center",
+                left: 0,
+                m: 0,
+                position: "absolute",
+                right: 0,
+                top: 0,
+                children: /* @__PURE__ */ r.jsx(f, { size: "xs" })
+              }
+            ),
+            /* @__PURE__ */ r.jsx(l, { opacity: "0", children: i })
+          ] }) : null,
+          !o && i
+        ]
+      }
     );
   }
 );
 R.displayName = "Button";
-const q = d;
+const E = c;
 export {
   R as Button,
-  q as StyledButton
+  E as StyledButton
 };

package/dist/ButtonGroup.mjs

@@ -1,7 +1,8 @@
 "use client";
-import d, { Children as p, cloneElement as u } from "react";
+import { j as l } from "./jsx-runtime-B7I4PJ0H.mjs";
+import { Children as d, cloneElement as m } from "react";
+import { forwardRef as u } from "./System.mjs";
 import f from "@xstyled/styled-components";
-import { forwardRef as m } from "./System.mjs";
 const b = f.divBox`
   display: inline-flex;
   flex-wrap: wrap;
@@ -31,19 +32,19 @@ const b = f.divBox`
       }
     }
   }
-`, x = m(
-  ({ children: t, dataTestId: o, disabled: e, size: i, variant: a }, n) => {
-    function l(s) {
-      return p.toArray(s).filter(Boolean).map((r) => u(r, {
+`, y = u(
+  ({ children: t, dataTestId: o, disabled: i, size: e, variant: s }, a) => {
+    function n(p) {
+      return d.toArray(p).filter(Boolean).map((r) => m(r, {
         ...r.props,
-        disabled: e || r.props.disabled,
-        size: i || r.props.size,
-        variant: a || r.props.variant
+        disabled: i || r.props.disabled,
+        size: e || r.props.size,
+        variant: s || r.props.variant
       }));
     }
-    return /* @__PURE__ */ d.createElement(b, { "data-testid": o, ref: n }, l(t));
+    return /* @__PURE__ */ l.jsx(b, { "data-testid": o, ref: a, children: n(t) });
   }
 );
 export {
-  x as ButtonGroup
+  y as ButtonGroup
 };

package/dist/Card.mjs

@@ -1,23 +1,23 @@
 "use client";
-import r from "react";
-import t, { th as d } from "@xstyled/styled-components";
-import { Shape as c } from "./Shape.mjs";
-import { forwardRef as a } from "./System.mjs";
-const i = t(c)`
-  ${d("cards.cover")};
-`, s = ({ src: e, ...o }) => /* @__PURE__ */ r.createElement(i, { ...o }, /* @__PURE__ */ r.createElement("img", { src: e })), m = t.divBox`
+import { j as d } from "./jsx-runtime-B7I4PJ0H.mjs";
+import { forwardRef as n } from "./System.mjs";
+import e, { th as t } from "@xstyled/styled-components";
+import { Shape as i } from "./Shape.mjs";
+const c = e(i)`
+  ${t("cards.cover")};
+`, a = ({ src: o, ...r }) => /* @__PURE__ */ d.jsx(c, { ...r, children: /* @__PURE__ */ d.jsx("img", { src: o }) }), m = e.divBox`
   overflow: 'hidden';
   border-radius: md;
-  ${d("cards.default")};
+  ${t("cards.default")};
   background-size: cover;
   background-position: center;
-`, f = t.divBox`
+`, p = e.divBox`
   padding: lg;
-`, l = a(({ children: e, ...o }, n) => /* @__PURE__ */ r.createElement(m, { ref: n, ...o }, e)), C = Object.assign(l, {
-  Body: f,
-  Cover: s
+`, f = n(({ children: o, ...r }, s) => /* @__PURE__ */ d.jsx(m, { ref: s, ...r, children: o })), j = Object.assign(f, {
+  Body: p,
+  Cover: a
 });
 export {
-  C as Card,
-  l as CardComponent
+  j as Card,
+  f as CardComponent
 };

package/dist/Checkbox.mjs

@@ -1,6 +1,6 @@
-import "react";
-import { a as t } from "./index-5PUh49rV.mjs";
+import "./jsx-runtime-B7I4PJ0H.mjs";
 import "./System.mjs";
+import { a as t } from "./index-62h-enZF.mjs";
 export {
   t as Checkbox
 };

package/dist/ClearButton.mjs

@@ -1,27 +1,27 @@
 "use client";
-import t from "react";
-import n, { keyframes as i, css as s, th as m } from "@xstyled/styled-components";
-import { Button as c } from "./Button.mjs";
+import { j as t } from "./jsx-runtime-B7I4PJ0H.mjs";
 import "./Icon.mjs";
-import { C as l } from "./index-C7zM96J_.mjs";
-import { forwardRef as f } from "./System.mjs";
-const p = i`
+import { C as i } from "./index-BaLGEKs7.mjs";
+import { forwardRef as n } from "./System.mjs";
+import a, { keyframes as m, css as c, th as p } from "@xstyled/styled-components";
+import { Button as f } from "./Button.mjs";
+const l = m`
   from {
     opacity: 0;
   }
   to {
     opacity: 1;
   }
-`, u = s`
-  ${p}
-`, e = n(c)`
+`, u = c`
+  ${l}
+`, o = a(f)`
   pointer-events: auto;
-  animation: ${m("transitions.medium")};
+  animation: ${p("transitions.medium")};
   animation-name: ${u};
-`, h = f(
-  ({ size: o = "xs", ...r }, a) => /* @__PURE__ */ t.createElement(e, { ref: a, shape: "circle", size: o, title: "Clear", variant: "ghost", ...r }, /* @__PURE__ */ t.createElement(l, { size: "xxs" }))
-), R = e;
+`, B = n(
+  ({ size: r = "xs", ...e }, s) => /* @__PURE__ */ t.jsx(o, { ref: s, shape: "circle", size: r, title: "Clear", variant: "ghost", ...e, children: /* @__PURE__ */ t.jsx(i, { size: "xxs" }) })
+), $ = o;
 export {
-  h as ClearButton,
-  R as StyledClearButton
+  B as ClearButton,
+  $ as StyledClearButton
 };

package/dist/CloseButton.mjs

@@ -1,16 +1,16 @@
 "use client";
-import t from "react";
-import s, { th as e } from "@xstyled/styled-components";
-import { Button as m } from "./Button.mjs";
+import { j as o } from "./jsx-runtime-B7I4PJ0H.mjs";
 import "./Icon.mjs";
-import { C as i } from "./index-C7zM96J_.mjs";
-import { forwardRef as l } from "./System.mjs";
-const c = s(m)`
+import { C as e } from "./index-BaLGEKs7.mjs";
+import { forwardRef as i } from "./System.mjs";
+import m, { th as t } from "@xstyled/styled-components";
+import { Button as l } from "./Button.mjs";
+const n = m(l)`
   & > svg:only-child {
-    width: ${e("space.md")};
-    height: ${e("space.md")};
+    width: ${t("space.md")};
+    height: ${t("space.md")};
   }
-`, u = l((o, r) => /* @__PURE__ */ t.createElement(c, { ref: r, shape: "circle", size: "sm", title: "Close", variant: "ghost", ...o }, /* @__PURE__ */ t.createElement(i, { size: "lg" })));
+`, u = i((s, r) => /* @__PURE__ */ o.jsx(n, { ref: r, shape: "circle", size: "sm", title: "Close", variant: "ghost", ...s, children: /* @__PURE__ */ o.jsx(e, { size: "lg" }) }));
 export {
   u as CloseButton
 };