welcome-ui 8.0.0 → 8.1.0-alpha.0

package/dist/{field-styles-DLIhqG_8.mjs → field-styles-BVlRlvuu.mjs}

@@ -1,5 +1,5 @@
 "use client";
-import { css as a, th as d } from "@xstyled/styled-components";
+import { th as d, css as a } from "@xstyled/styled-components";
 const o = {
   lg: "sm",
   md: "sm",
@@ -12,7 +12,7 @@ const o = {
   transparent: $,
   variant: s
 }) => {
-  const t = o[l];
+  const t = o[l || "md"];
   return a`
     ${d("defaultFields.default")};
     ${s && d(`defaultFields.variants.${s}`)};

package/dist/{hex-to-rgba-BIDK-3ab.mjs → hex-to-rgba-DU_XzKIK.mjs}

@@ -1,11 +1,11 @@
 "use client";
 const s = (t, n, o) => parseInt(t.substring(n, o), 16), c = (t) => /(^[0-9a-fA-F]{6}$)|(^[0-9a-fA-F]{3}$)/.test(t), i = (t) => {
   if (!t || (t = t.replace("#", ""), !c(t)))
-    return;
+    return "";
   t.length === 3 && (t = `${t[0]}${t[0]}${t[1]}${t[1]}${t[2]}${t[2]}`);
   const n = (r) => s(r, 0, 2), o = (r) => s(r, 2, 4), $ = (r) => s(r, 4, 6);
   return `${n(t)}, ${o(t)}, ${$(t)}`;
-}, a = (t, n = 1) => t ? t.startsWith("#") ? `rgba(${i(t)}, ${n})` : t : void 0;
+}, a = (t, n = 1) => t ? t.startsWith("#") ? `rgba(${i(t)}, ${n})` : t : "";
 export {
   a as h
 };

package/dist/hide-focus-rings-root-CCXdysih.mjs

@@ -0,0 +1,15 @@
+"use client";
+import "./jsx-runtime-B7I4PJ0H.mjs";
+import { createGlobalStyle as t, css as o } from "@xstyled/styled-components";
+import "react";
+const e = "data-wui-hidefocusrings";
+t(
+  () => o`
+    [${e}] *:focus {
+      outline: none;
+    }
+  `
+);
+export {
+  e as h
+};

package/dist/index-5HBq1O6Z.mjs

@@ -0,0 +1,185 @@
+"use client";
+import { j as L } from "./jsx-runtime-B7I4PJ0H.mjs";
+import { shouldForwardProp as B, forwardRef as D } from "./System.mjs";
+import Z, { th as C, system as H, css as F } from "@xstyled/styled-components";
+import { d as O } from "./field-styles-BVlRlvuu.mjs";
+import { t as V, f as W, c as q, h as z, _ as G, j as I, l as J, x as K, b as E, D as Q, d as X, e as Y, g as y, y as ee } from "./LVA2YJMS-C-kJ1lkr.mjs";
+import { createContext as te, useState as re, useRef as oe, useEffect as ie } from "react";
+import { u as ae } from "./KUU7WJ55-CzsjuIMv.mjs";
+import { u as ce } from "./YV4JVR4I-DPC8mMuG.mjs";
+var ne = te(!1), se = V(), de = se.useContext, j = "input";
+function _(t, o) {
+  o ? t.indeterminate = !0 : t.indeterminate && (t.indeterminate = !1);
+}
+function le(t, o) {
+  return t === "input" && (!o || o === "checkbox");
+}
+function A(t) {
+  return Array.isArray(t) ? t.toString() : t;
+}
+var ue = q(
+  function(o) {
+    var n = o, {
+      store: a,
+      name: s,
+      value: i,
+      checked: d,
+      defaultChecked: p
+    } = n, r = G(n, [
+      "store",
+      "name",
+      "value",
+      "checked",
+      "defaultChecked"
+    ]);
+    const v = de();
+    a = a || v;
+    const [x, u] = re(p ?? !1), f = ce(a, (e) => {
+      if (d !== void 0) return d;
+      if ((e == null ? void 0 : e.value) === void 0) return x;
+      if (i != null) {
+        if (Array.isArray(e.value)) {
+          const m = A(i);
+          return e.value.includes(m);
+        }
+        return e.value === i;
+      }
+      return Array.isArray(e.value) ? !1 : typeof e.value == "boolean" ? e.value : !1;
+    }), b = oe(null), R = I(b, j), c = le(R, r.type), g = f ? f === "mixed" : void 0, h = f === "mixed" ? !1 : f, S = J(r), [T, N] = K();
+    ie(() => {
+      const e = b.current;
+      e && (_(e, g), !c && (e.checked = h, s !== void 0 && (e.name = s), i !== void 0 && (e.value = `${i}`)));
+    }, [T, g, c, h, s, i]);
+    const w = r.onChange, $ = E((e) => {
+      if (S) {
+        e.stopPropagation(), e.preventDefault();
+        return;
+      }
+      if (_(e.currentTarget, g), c || (e.currentTarget.checked = !e.currentTarget.checked, N()), w == null || w(e), e.defaultPrevented) return;
+      const m = e.currentTarget.checked;
+      u(m), a == null || a.setValue((l) => {
+        if (i == null) return m;
+        const k = A(i);
+        return Array.isArray(l) ? m ? l.includes(k) ? l : [...l, k] : l.filter((U) => U !== k) : l === k ? !1 : k;
+      });
+    }), P = r.onClick, M = E((e) => {
+      P == null || P(e), !e.defaultPrevented && (c || $(e));
+    });
+    return r = Q(
+      r,
+      (e) => /* @__PURE__ */ L.jsx(ne.Provider, { value: h, children: e }),
+      [h]
+    ), r = X(y({
+      role: c ? void 0 : "checkbox",
+      type: c ? "checkbox" : void 0,
+      "aria-checked": f
+    }, r), {
+      ref: Y(b, r.ref),
+      onChange: $,
+      onClick: M
+    }), r = ae(y({ clickOnEnter: !c }, r)), ee(y({
+      name: c ? s : void 0,
+      value: c ? i : void 0,
+      checked: h
+    }, r));
+  }
+), fe = W(function(o) {
+  const n = ue(o);
+  return z(j, n);
+});
+const he = Z(fe).withConfig({
+  shouldForwardProp: B
+})(
+  ({ indeterminate: t, order: o = "-1", size: n, theme: a, variant: s }) => F`
+    ${O({ size: n, variant: s })};
+    ${C("checkboxes.default")}
+    position: relative;
+    padding: 0;
+    order: ${o};
+    cursor: pointer;
+    transition: medium;
+    overflow: hidden;
+    ${H};
+
+    &[aria-checked='true'] {
+      &:not([disabled]) {
+        ${C("checkboxes.checked")};
+      }
+
+      &:not([indeterminate]) {
+        &::after {
+          content: url(${`'data:image/svg+xml; utf8, <svg viewBox="0 0 10 8" xmlns="http://www.w3.org/2000/svg"><path fill="${a.defaultFields.checkableField.checked.color}" d="M7.96171 0.596898C8.24912 0.27893 8.74024 0.25262 9.06024 0.537743C9.37208 0.815607 9.40671 1.28712 9.14514 1.60662L9.11975 1.63611L3.90331 7.40311C3.75365 7.5687 3.54304 7.66003 3.32401 7.66003C3.15017 7.66003 2.98077 7.60235 2.84241 7.49383L2.80848 7.46564L0.943652 5.82577C0.620151 5.54147 0.590221 5.04928 0.877091 4.72749C1.15398 4.41772 1.62383 4.38076 1.94536 4.6368L1.97506 4.66166L3.26156 5.79276L7.96171 0.596898Z" /></svg>'`});
+          position: absolute;
+          top: -2;
+          right: 0;
+          bottom: 0;
+          left: 0;
+          width: 10;
+          margin: auto;
+          text-align: center;
+        }
+      }
+    }
+
+    ${t && F`
+      &:not([disabled]) {
+        ${C("checkboxes.checked")};
+      }
+
+      /* stylelint-disable string-no-newline */
+      &::after {
+        content: url("data:image/svg+xml,%3Csvg width='10' height='4' viewBox='0 0 10 4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.3973 1.76919C0.953776 1.81988 0.634816 2.04775 0.685235 2.49156C0.732149 2.90436 1.08212 3.03624 1.48789 3.03624L8.6029 2.23086C9.04669 2.18017 9.36538 1.9523 9.31469 1.50849C9.26427 1.06468 8.86389 0.917163 8.41956 0.969201C4.90971 1.38026 4.90828 1.36792 1.3973 1.76919Z' fill='${a.defaultFields.checkableField.checked.color}'/%3E%3C/svg%3E");
+        position: absolute;
+        top: -3.5;
+        right: 0;
+        bottom: 0;
+        left: 2;
+        margin: auto;
+      }
+    `}
+
+    &[disabled] {
+      ${C("checkboxes.disabled")}
+
+      &::after {
+        opacity: ${a.defaultFields.checkableField.disabled.opacity};
+      }
+    }
+  `
+), me = D(
+  ({
+    checked: t = !1,
+    Component: o = he,
+    dataTestId: n,
+    disabled: a,
+    indeterminate: s = !1,
+    name: i,
+    onChange: d,
+    size: p,
+    ...r
+  }, v) => {
+    const x = (u) => {
+      u.target.checked = !u.target.checked, d == null || d(u);
+    };
+    return /* @__PURE__ */ L.jsx(
+      o,
+      {
+        checked: t,
+        "data-testid": n,
+        disabled: a,
+        id: i,
+        indeterminate: s,
+        name: i,
+        onChange: x,
+        ref: v,
+        size: p,
+        ...r
+      }
+    );
+  }
+);
+me.displayName = "Checkbox";
+export {
+  fe as C,
+  me as a
+};

package/dist/{index-C7zM96J_.mjs → index-BaLGEKs7.mjs}

@@ -1,11 +1,11 @@
 "use client";
-import o from "react";
-import { Icon as e } from "./Icon.mjs";
-const c = 15, l = 15, n = '<path fill="currentColor" fill-rule="evenodd" d="M73.528 77.997a5.039 5.039 0 0 0 3.376 1.296 5.067 5.067 0 0 0 3.817-1.735c1.863-2.134 1.668-5.393-.437-7.283l-23.067-20.69 23.48-26.48c1.878-2.122 1.706-5.381-.39-7.285a5.047 5.047 0 0 0-7.193.395l-23.523 26.53-23.119-20.736a5.052 5.052 0 0 0-7.193.436c-1.863 2.133-1.668 5.393.437 7.282l23.067 20.691-23.48 26.48c-1.878 2.118-1.706 5.38.39 7.282a5.02 5.02 0 0 0 3.4 1.32 5.06 5.06 0 0 0 3.793-1.712L50.409 57.26l23.119 20.736Z" clip-rule="evenodd"/>', r = {
-  width: c,
-  height: l,
-  block: n
-}, i = (t) => /* @__PURE__ */ o.createElement(e, { alt: "Cross", content: r, ...t });
+import { j as t } from "./jsx-runtime-B7I4PJ0H.mjs";
+import { Icon as c } from "./Icon.mjs";
+const l = 15, n = 15, r = '<path fill="currentColor" fill-rule="evenodd" d="M73.528 77.997a5.039 5.039 0 0 0 3.376 1.296 5.067 5.067 0 0 0 3.817-1.735c1.863-2.134 1.668-5.393-.437-7.283l-23.067-20.69 23.48-26.48c1.878-2.122 1.706-5.381-.39-7.285a5.047 5.047 0 0 0-7.193.395l-23.523 26.53-23.119-20.736a5.052 5.052 0 0 0-7.193.436c-1.863 2.133-1.668 5.393.437 7.282l23.067 20.691-23.48 26.48c-1.878 2.118-1.706 5.38.39 7.282a5.02 5.02 0 0 0 3.4 1.32 5.06 5.06 0 0 0 3.793-1.712L50.409 57.26l23.119 20.736Z" clip-rule="evenodd"/>', s = {
+  width: l,
+  height: n,
+  block: r
+}, a = (o) => /* @__PURE__ */ t.jsx(c, { alt: "Cross", content: s, ...o });
 export {
-  i as C
+  a as C
 };