welcome-ui 7.3.0 → 8.0.0-alpha.0

package/dist/Field.mjs

@@ -1,7 +1,7 @@
 "use client";
 import i from "react";
-import { u as _ } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
-import c, { css as n, th as s, system as w } from "@xstyled/styled-components";
+import { u as P } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
+import c, { css as n, th as s } from "@xstyled/styled-components";
 import { StyledLabel as H, Label as j } from "./Label.mjs";
 import { shouldForwardProp as z, forwardRef as C } from "./System.mjs";
 import { VariantIcon as D } from "./VariantIcon.mjs";
@@ -10,7 +10,7 @@ const V = n`
   ${s("defaultFields.checkablelabel.default")};
   align-items: flex-start;
   overflow-wrap: break-word;
-`, Y = c("div").withConfig({ shouldForwardProp: z })(
+`, Y = c.divBox.withConfig({ shouldForwardProp: z })(
   ({ checked: t, isCheckable: e, isRadioGroup: a, withHintText: m }) => n`
     ${e && n`
       input {
@@ -28,16 +28,15 @@ const V = n`
         margin-bottom: md;
       `}
     }
-    ${w};
   `
-), M = c.div`
+), _ = c.div`
   display: flex;
   align-items: flex-start;
   gap: sm;
-`, O = c.div`
+`, M = c.divBox`
   display: flex;
   flex-direction: column;
-`, q = c.divBox(
+`, O = c.divBox(
   ({ iconPlacement: t, size: e }) => n`
     position: absolute;
     top: 0;
@@ -51,7 +50,6 @@ const V = n`
     transition: medium;
     transition-timing-function: primary;
     color: neutral-90;
-    ${w};
 
     /* for button action */
     & > button {
@@ -65,7 +63,7 @@ const V = n`
       }
     `}
   `
-), A = c.divBox(
+), q = c.divBox(
   ({ size: t }) => n`
     position: absolute;
     padding: 0;
@@ -83,14 +81,14 @@ const V = n`
       }
     `}
   `
-), J = {
+), A = {
   Checkbox: "checkbox",
   Radio: "radio",
   InputText: "text",
   RadioTab: "radio",
   Select: "text",
   Toggle: "checkbox"
-}, K = (t) => J[t] || t, Q = ({
+}, J = (t) => A[t] || t, K = ({
   error: t,
   success: e,
   warning: a
@@ -98,48 +96,48 @@ const V = n`
   if (t) return "danger";
   if (a) return "warning";
   if (e) return "success";
-}, U = () => `wui-field-${Math.random().toString(36).slice(2)}`, X = ["disabled", "required", "variant"], Z = C(
+}, Q = () => `wui-field-${Math.random().toString(36).slice(2)}`, U = ["disabled", "required", "variant"], X = C(
   ({
     children: t,
     dataTestId: e,
     disabled: a,
     disabledIcon: m,
     error: u,
-    flexDirection: k,
-    hint: E,
+    flexDirection: w,
+    hint: k,
     label: f,
     required: h,
-    success: b,
-    transparent: v,
-    warning: g,
-    ...I
-  }, R) => {
-    const d = K(t.props.type || t.type.displayName), T = d === "radio", x = d === "RadioGroup", G = d === "FieldGroup", L = d === "checkbox", S = t.type.displayName === "Toggle", o = T || L || S, W = k || (o ? "row" : "column"), B = G || x, r = Q({ error: u, warning: g, success: b }), l = r ? u || g || b : E, N = !!l, p = t.props.id || t.props.name || U(), $ = i.cloneElement(i.Children.only(t), {
+    success: x,
+    transparent: E,
+    warning: b,
+    ...v
+  }, I) => {
+    const d = J(t.props.type || t.type.displayName), R = d === "radio", g = d === "RadioGroup", T = d === "FieldGroup", G = d === "checkbox", B = t.type.displayName === "Toggle", o = R || G || B, L = w || (o ? "row" : "column"), S = T || g, r = K({ error: u, warning: b, success: x }), l = r ? u || b || x : k, W = !!l, p = t.props.id || t.props.name || Q(), $ = i.cloneElement(i.Children.only(t), {
       disabled: a,
       id: p,
       required: h,
       variant: r,
-      transparent: v,
-      ...B ? { flexDirection: W } : {}
+      transparent: E,
+      ...S ? { flexDirection: L } : {}
     });
-    return _(() => {
+    return P(() => {
       Object.keys(t.props).forEach((y) => {
-        if (X.includes(y)) {
-          const P = document.getElementById(p);
-          console.warn(`You must pass the "${y}" prop to the <Field /> instead of`, P);
+        if (U.includes(y)) {
+          const N = document.getElementById(p);
+          console.warn(`You must pass the "${y}" prop to the <Field /> instead of`, N);
         }
       });
     }, [t.props, t.type.displayName, p]), /* @__PURE__ */ i.createElement(
       Y,
       {
-        ref: R,
-        ...I,
+        ref: I,
+        ...v,
         "data-testid": e,
         isCheckable: o,
-        isRadioGroup: x,
-        withHintText: N
+        isRadioGroup: g,
+        withHintText: W
       },
-      /* @__PURE__ */ i.createElement(M, null, o && $, /* @__PURE__ */ i.createElement(O, null, f && /* @__PURE__ */ i.createElement(
+      /* @__PURE__ */ i.createElement(_, null, o && $, /* @__PURE__ */ i.createElement(M, null, f && /* @__PURE__ */ i.createElement(
         j,
         {
           checkableField: o,
@@ -167,11 +165,11 @@ const V = n`
     );
   }
 );
-Z.displayName = "Field";
-const rt = q, lt = A;
+X.displayName = "Field";
+const at = O, rt = q;
 export {
-  Z as Field,
-  lt as IconGroupWrapper,
-  rt as IconWrapper,
-  K as getBaseType
+  X as Field,
+  rt as IconGroupWrapper,
+  at as IconWrapper,
+  J as getBaseType
 };

package/dist/FieldGroup.mjs

@@ -1,26 +1,25 @@
 "use client";
 import t from "react";
-import l, { th as a, system as s } from "@xstyled/styled-components";
-import { shouldForwardProp as n, forwardRef as f } from "./System.mjs";
-import { Label as p } from "./Label.mjs";
-const d = l.fieldsetBox.withConfig({ shouldForwardProp: n })`
+import l, { th as a } from "@xstyled/styled-components";
+import { shouldForwardProp as n, forwardRef as p } from "./System.mjs";
+import { Label as s } from "./Label.mjs";
+const i = l.fieldsetBox.withConfig({ shouldForwardProp: n })`
   width: 100%;
   min-width: 0;
   min-height: 0;
   margin: 0;
   padding: 0;
   ${a("defaultFields.fieldset")};
-  ${s};
 
   > * {
     margin-bottom: md;
   }
-`, u = f(
-  ({ children: i, dataTestId: o, label: e, required: r }, m) => /* @__PURE__ */ t.createElement(d, { "data-testid": o, ref: m }, e && /* @__PURE__ */ t.createElement(p, { as: "legend", required: r }, e), i)
+`, f = p(
+  ({ children: o, dataTestId: d, label: e, required: r }, m) => /* @__PURE__ */ t.createElement(i, { "data-testid": d, ref: m }, e && /* @__PURE__ */ t.createElement(s, { as: "legend", required: r }, e), o)
 );
-u.displayName = "FieldGroup";
-const w = d;
+f.displayName = "FieldGroup";
+const F = i;
 export {
-  u as FieldGroup,
-  w as StyledFieldGroup
+  f as FieldGroup,
+  F as StyledFieldGroup
 };