welcome-ui 8.4.0 → 9.0.0-alpha.0

package/dist/Popover.mjs

@@ -1,151 +0,0 @@
-"use client";
-import { j as e } from "./jsx-runtime-Bqq1Hxg9.mjs";
-import { forwardRef as c } from "./System.mjs";
-import { Box as h } from "./Box.mjs";
-import { Button as x } from "./Button.mjs";
-import "./Icon.mjs";
-import { C as j } from "./index-KxL21VJb.mjs";
-import i, { th as p, css as l, system as u } from "@xstyled/styled-components";
-import { P, a as d } from "./QYJ6MIDR-CpwIyzxN.mjs";
-import { P as $, H as C, a as w, u as H, b as B } from "./BYC7LY2E-TZjhdRy3.mjs";
-const T = i(P)`
-  color: ${p("popovers.default.backgroundColor")};
-`, b = i.svgBox(
-  ({ $transform: t }) => l`
-    transform: ${t};
-  `
-), v = i.div`
-  ${p("popovers.content")};
-`, m = i.h6`
-  margin: 0;
-  ${p("popovers.title")};
-`, f = i($)(
-  ({ $withCloseButton: t }) => l`
-    ${p("popovers.default")};
-    outline: none;
-    opacity: 0;
-    transition: opacity 150ms ease-in-out;
-    ${u};
-
-    /* on open popover for animation */
-    &[data-enter] {
-      opacity: 1;
-    }
-
-    ${t && l`
-      ${m} {
-        padding-right: 50;
-      }
-    `}
-  `
-);
-i(d)`
-  ${u};
-`;
-const y = i(C)`
-  ${u};
-`, Z = {
-  bottom: "rotateZ(360deg)",
-  left: "rotateZ(90deg)",
-  right: "rotateZ(-90deg)",
-  top: "rotateZ(180deg)"
-}, A = ({ store: t }) => {
-  const r = t.useState("currentPlacement"), [o] = r.split("-"), n = Z[o];
-  return /* @__PURE__ */ e.jsx(T, { store: t, children: /* @__PURE__ */ e.jsxs(b, { $transform: n, h: 30, w: 30, xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ e.jsx("path", { d: "M7 30L15 22L23 30H7Z", fill: "currentColor", fillRule: "nonzero", id: "stroke" }),
-    /* @__PURE__ */ e.jsx("path", { d: "M8 30L15 23L22 30H8Z", fill: "currentColor", fillRule: "nonzero" })
-  ] }) });
-}, g = ({ children: t, onClose: r, store: o }) => {
-  const n = () => {
-    r && r(), o == null || o.hide();
-  }, { withCloseButton: s } = o;
-  return /* @__PURE__ */ e.jsxs(h, { position: "relative", children: [
-    /* @__PURE__ */ e.jsx(A, { store: o }),
-    t,
-    s ? /* @__PURE__ */ e.jsx(
-      x,
-      {
-        flex: "0 0 auto",
-        ml: "md",
-        onClick: n,
-        position: "absolute",
-        right: 1,
-        shape: "square",
-        size: "xs",
-        top: 1,
-        variant: "secondary",
-        children: /* @__PURE__ */ e.jsx(j, {})
-      }
-    ) : null
-  ] });
-}, L = c(
-  ({ as: t, store: r, ...o }, n) => /* @__PURE__ */ e.jsx(
-    d,
-    {
-      ref: n,
-      render: t ? (s) => /* @__PURE__ */ e.jsx(t, { ...s }) : void 0,
-      store: r,
-      ...o
-    }
-  )
-), R = c(
-  ({ as: t, store: r, ...o }, n) => /* @__PURE__ */ e.jsx(y, { store: r, ...o, forwardedAs: t, ref: n })
-), k = c(
-  ({ children: t, onClose: r, store: o, ...n }, s) => {
-    const { withCloseButton: a } = o;
-    return /* @__PURE__ */ e.jsx(f, { $withCloseButton: a, ref: s, store: o, ...n, children: /* @__PURE__ */ e.jsx(g, { onClose: r, store: o, children: t }) });
-  }
-), J = Object.assign(k, {
-  Content: v,
-  Title: m,
-  Trigger: L
-}), z = c(
-  ({ children: t, onClose: r, store: o, ...n }, s) => {
-    const { withCloseButton: a } = o;
-    return /* @__PURE__ */ e.jsx(
-      f,
-      {
-        as: w,
-        store: o,
-        ...n,
-        $withCloseButton: a,
-        ref: s,
-        children: /* @__PURE__ */ e.jsx(g, { onClose: r, store: o, children: t })
-      }
-    );
-  }
-), K = Object.assign(z, {
-  Content: v,
-  Title: m,
-  Trigger: R
-}), N = ({
-  animated: t = 150,
-  withCloseButton: r = !1,
-  ...o
-} = {}) => ({
-  ...H({
-    animated: t,
-    ...o
-  }),
-  withCloseButton: r
-}), Q = ({
-  animated: t = 150,
-  hideTimeout: r = 300,
-  showTimeout: o = 500,
-  withCloseButton: n = !1,
-  ...s
-} = {}) => ({
-  ...B({
-    animated: t,
-    hideTimeout: r,
-    showTimeout: o,
-    ...s
-  }),
-  withCloseButton: n
-});
-export {
-  J as Popover,
-  K as PopoverHover,
-  N as usePopover,
-  Q as usePopoverHover
-};

package/dist/QYJ6MIDR-CpwIyzxN.mjs

@@ -1,98 +0,0 @@
-"use client";
-import { u as E, b as j, P as C } from "./MTZPJQMC-DdjKPI9r.mjs";
-import { c as d, _ as m, d as P, e as x, g as i, f, h, i as w, y as N, E as V, F as R, b as z, D as O } from "./LVA2YJMS-B8X1PCyC.mjs";
-import { useMemo as T, useState as W } from "react";
-import { j as p } from "./jsx-runtime-Bqq1Hxg9.mjs";
-import { u as M } from "./AXB53BZF-BU4qmiUA.mjs";
-var H = "div", y = d(
-  function(t) {
-    var r = t, { store: e } = r, o = m(r, ["store"]);
-    const s = E();
-    return e = e || s, o = P(i({}, o), {
-      ref: x(e == null ? void 0 : e.setAnchorElement, o.ref)
-    }), o;
-  }
-);
-f(function(t) {
-  const r = y(t);
-  return h(H, r);
-});
-var g = "M23,27.8c1.1,1.2,3.4,2.2,5,2.2h2H0h2c1.7,0,3.9-1,5-2.2l6.6-7.2c0.7-0.8,2-0.8,2.7,0L23,27.8L23,27.8z", L = "div", v = 30, a = v / 2, B = {
-  top: `rotate(180 ${a} ${a})`,
-  right: `rotate(-90 ${a} ${a})`,
-  bottom: `rotate(0 ${a} ${a})`,
-  left: `rotate(90 ${a} ${a})`
-};
-function F(c) {
-  const [t, r] = W(), e = c.useState("contentElement");
-  return V(() => {
-    if (!e) return;
-    const s = R(e).getComputedStyle(e);
-    r(s);
-  }, [e]), t;
-}
-var I = d(
-  function(t) {
-    var r = t, { store: e, size: o = v } = r, s = m(r, ["store", "size"]);
-    const l = j();
-    e = e || l, w(
-      e,
-      process.env.NODE_ENV !== "production" && "PopoverArrow must be wrapped in a Popover component."
-    );
-    const u = e.useState(
-      (k) => k.currentPlacement.split("-")[0]
-    ), n = F(e), _ = (n == null ? void 0 : n.getPropertyValue("background-color")) || "none", A = (n == null ? void 0 : n.getPropertyValue(`border-${u}-color`)) || "none", S = (n == null ? void 0 : n.getPropertyValue(`border-${u}-width`)) || "0px", $ = Number.parseInt(S) * 2 * (v / o), b = B[u], D = T(
-      () => /* @__PURE__ */ p.jsx("svg", { display: "block", viewBox: "0 0 30 30", children: /* @__PURE__ */ p.jsxs("g", { transform: b, children: [
-        /* @__PURE__ */ p.jsx("path", { fill: "none", d: g }),
-        /* @__PURE__ */ p.jsx("path", { stroke: "none", d: g })
-      ] }) }),
-      [b]
-    );
-    return s = P(i({
-      children: D,
-      "aria-hidden": !0
-    }, s), {
-      ref: x(e.setArrowElement, s.ref),
-      style: i({
-        // server side rendering
-        position: "absolute",
-        fontSize: o,
-        width: "1em",
-        height: "1em",
-        pointerEvents: "none",
-        fill: _,
-        stroke: A,
-        strokeWidth: $
-      }, s.style)
-    }), N(s);
-  }
-), Y = f(function(t) {
-  const r = I(t);
-  return h(L, r);
-}), U = "button", q = d(function(t) {
-  var r = t, { store: e } = r, o = m(r, ["store"]);
-  const s = E();
-  e = e || s, w(
-    e,
-    process.env.NODE_ENV !== "production" && "PopoverDisclosure must receive a `store` prop or be wrapped in a PopoverProvider component."
-  );
-  const l = o.onClick, u = z((n) => {
-    e == null || e.setAnchorElement(n.currentTarget), l == null || l(n);
-  });
-  return o = O(
-    o,
-    (n) => /* @__PURE__ */ p.jsx(C, { value: e, children: n }),
-    [e]
-  ), o = P(i({}, o), {
-    onClick: u
-  }), o = y(i({ store: e }, o)), o = M(i({ store: e }, o)), o;
-}), Z = f(function(t) {
-  const r = q(t);
-  return h(U, r);
-});
-export {
-  Y as P,
-  Z as a,
-  q as b,
-  I as u
-};

package/dist/Radio.mjs

@@ -1,122 +0,0 @@
-"use client";
-import { j as i } from "./jsx-runtime-Bqq1Hxg9.mjs";
-import { Hint as b } from "./Hint.mjs";
-import { shouldForwardProp as g, forwardRef as $ } from "./System.mjs";
-import e, { th as r, system as k, css as j } from "@xstyled/styled-components";
-import { Label as w } from "./Label.mjs";
-import { d as y } from "./field-styles-CfVLcVQp.mjs";
-import { R } from "./NLEBE274-CnAMhwcR.mjs";
-const v = e(R).withConfig({ shouldForwardProp: g })(
-  ({ order: o = "-1", size: t, variant: s }) => j`
-    ${y({ size: t, variant: s })};
-    ${r("radios.default")}
-    position: relative;
-    padding: 0;
-    order: ${o};
-    cursor: pointer;
-    border-radius: 50%;
-    transition: medium;
-    ${k};
-
-    &::after {
-      content: '';
-      position: absolute;
-      width: 8;
-      height: 8;
-      border-radius: 8;
-      top: 3;
-      left: 3;
-      background-color: transparent;
-      transition: medium;
-    }
-
-    &[aria-checked='true'] {
-      &:not([disabled]) {
-        ${r("radios.checked")};
-      }
-
-      &[disabled] {
-        &::after {
-          background-color: ${r("radios.checkedCenteredColor.disabled")};
-        }
-      }
-
-      &::after {
-        background-color: ${r("radios.checkedCenteredColor.default")};
-      }
-    }
-  `
-), C = e(w)`
-  max-width: 100%;
-  /** we need to reset margin-bottom from Label component */
-  margin-bottom: 0 !important;
-`, L = e.divBox`
-  flex-shrink: 0;
-  position: relative;
-  align-items: center;
-  display: flex;
-`, F = e.divBox`
-  display: flex;
-  align-items: flex-start;
-  gap: sm;
-
-  input {
-    margin-top: xs;
-  }
-`, B = e.div`
-  display: flex;
-  flex-direction: column;
-`, D = $(
-  ({
-    dataTestId: o,
-    disabled: t,
-    disabledIcon: s,
-    flexDirection: p,
-    hint: d,
-    label: l,
-    maxWidth: f,
-    onChange: n,
-    onClick: c,
-    variant: m,
-    ...u
-  }, x) => {
-    const h = (a) => {
-      a.stopPropagation(), c && c(a), n && n(a);
-    };
-    return /* @__PURE__ */ i.jsx(
-      C,
-      {
-        alignItems: "flex-start",
-        checkableField: !0,
-        disabled: t,
-        disabledIcon: s,
-        flexDirection: "column",
-        maxWidth: f,
-        onClick: h,
-        variant: m,
-        withDisabledIcon: !1,
-        children: /* @__PURE__ */ i.jsxs(F, { flexDirection: p, children: [
-          /* @__PURE__ */ i.jsx(L, { children: /* @__PURE__ */ i.jsx(
-            v,
-            {
-              "data-testid": o,
-              disabled: t,
-              label: l,
-              ref: x,
-              variant: m,
-              ...u
-            }
-          ) }),
-          /* @__PURE__ */ i.jsxs(B, { children: [
-            /* @__PURE__ */ i.jsx("div", { "data-testid": o ? `${o}-label` : void 0, children: l }),
-            d ? /* @__PURE__ */ i.jsx(b, { "data-testid": o ? `${o}-hint` : void 0, mt: "0", children: d }) : null
-          ] })
-        ] })
-      }
-    );
-  }
-);
-D.displayName = "Radio";
-export {
-  D as Radio
-};

package/dist/RadioGroup.mjs

@@ -1,66 +0,0 @@
-"use client";
-import { j as s } from "./jsx-runtime-Bqq1Hxg9.mjs";
-import { FieldGroup as j } from "./FieldGroup.mjs";
-import { Radio as b } from "./Radio.mjs";
-import { forwardRef as h } from "./System.mjs";
-import n, { css as G } from "@xstyled/styled-components";
-import { u as w, R as y } from "./radio-group-C2Cv9SMd.mjs";
-const V = n.divBox(
-  ({ flexDirection: r }) => G`
-    display: flex;
-    flex-direction: ${r};
-    flex-wrap: wrap;
-    gap: md;
-  `
-), k = h(
-  ({
-    dataTestId: r,
-    flexDirection: d,
-    id: o,
-    label: t,
-    maxWidth: m,
-    name: i,
-    onChange: a,
-    options: f = [],
-    renderOption: c = b,
-    required: p,
-    value: v,
-    ...u
-  }, x) => {
-    const l = w({ defaultValue: v }), R = l.useState("value"), $ = (e) => {
-      u.disabled || (l.setValue(e), a == null || a(e));
-    };
-    return /* @__PURE__ */ s.jsx(
-      j,
-      {
-        as: y,
-        dataTestId: r,
-        label: t,
-        mb: 0,
-        ref: x,
-        required: p,
-        store: l,
-        children: /* @__PURE__ */ s.jsx(V, { flexDirection: d, children: f.map((e) => /* @__PURE__ */ s.jsx(
-          c,
-          {
-            checked: e.value === R,
-            dataTestId: r ? `${r}-${e.value}` : void 0,
-            hint: e.hint,
-            id: `${o || i}.${e.value}`,
-            label: e.label,
-            maxWidth: m,
-            name: i,
-            onChange: () => $(e.value),
-            value: e.value,
-            ...u
-          },
-          e.value
-        )) })
-      }
-    );
-  }
-);
-k.displayName = "RadioGroup";
-export {
-  k as RadioGroup
-};

package/dist/RadioTab.mjs

@@ -1,105 +0,0 @@
-"use client";
-import { j as d } from "./jsx-runtime-Bqq1Hxg9.mjs";
-import { Button as f } from "./Button.mjs";
-import { shouldForwardProp as u, forwardRef as b } from "./System.mjs";
-import s, { th as i, css as e } from "@xstyled/styled-components";
-import { d as h } from "./field-styles-CfVLcVQp.mjs";
-import { o as g } from "./overflow-ellipsis-DGV5Kgt-.mjs";
-import { R as c } from "./NLEBE274-CnAMhwcR.mjs";
-const y = s(c).withConfig({ shouldForwardProp: u })`
-  position: absolute;
-  top: 0;
-  left: 0;
-  opacity: 0;
-`, $ = e`
-  margin-top: -${i.borderWidth("sm")};
-
-  &:first-of-type {
-    border-bottom-right-radius: 0;
-    border-bottom-left-radius: 0;
-  }
-
-  &:last-of-type {
-    border-top-right-radius: 0;
-    border-top-left-radius: 0;
-  }
-`, x = e`
-  margin-left: -${i.borderWidth("sm")};
-
-  &:first-of-type {
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-  }
-
-  &:last-of-type {
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-  }
-`;
-s.labelBox(
-  ({ checked: o, flexDirection: t, size: r, variant: a }) => e`
-    ${i("radioTabs.default")};
-    flex: 1;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    min-width: 0;
-    min-height: ${i(`defaultFields.sizes.${r}.height`)};
-    max-width: 100%;
-    margin: 0;
-    text-align: center;
-    position: relative;
-    cursor: pointer;
-    transition: medium;
-
-    ${h({ size: r, variant: a })};
-    ${o && e`
-      ${i("radioTabs.checked")};
-      z-index: 2;
-    `};
-    ${t === "column" && $};
-    ${t === "row" && x};
-    padding-top: 0;
-    padding-bottom: 0;
-  `
-);
-s.div`
-  flex-shrink: 0;
-  position: relative;
-`;
-s.div`
-  ${g};
-  max-width: 100%;
-`;
-const w = b(
-  ({ checked: o, dataTestId: t, disabled: r, id: a, label: l, onChange: m, value: n }, p) => /* @__PURE__ */ d.jsxs(
-    f,
-    {
-      as: "label",
-      borderColor: !o && "neutral-30",
-      className: "label",
-      dataTestId: t,
-      disabled: r,
-      ref: p,
-      variant: o ? "primary" : "ghost",
-      children: [
-        /* @__PURE__ */ d.jsx(
-          y,
-          {
-            checked: o,
-            "data-testid": t ? `${t}-input` : void 0,
-            disabled: r,
-            id: a,
-            onChange: m,
-            value: n
-          }
-        ),
-        l
-      ]
-    }
-  )
-);
-w.displayName = "RadioTab";
-export {
-  w as RadioTab
-};

package/dist/SYRFVSLH-DPBHrVeS.mjs

@@ -1,49 +0,0 @@
-"use client";
-import { u as c } from "./X5NMLKT6-Ctro4-UX.mjs";
-import { b as d } from "./VGCJ63VH-C4H4_vtu.mjs";
-import { f as p, c as f, h as x, _ as D, b as g, d as h, g as k } from "./LVA2YJMS-B8X1PCyC.mjs";
-import { useMemo as v } from "react";
-import { j as r } from "./jsx-runtime-Bqq1Hxg9.mjs";
-var _ = "button", b = f(
-  function(i) {
-    var o = i, { store: e } = o, s = D(o, ["store"]);
-    const l = d();
-    e = e || l;
-    const t = s.onClick, u = g((a) => {
-      t == null || t(a), !a.defaultPrevented && (e == null || e.hide());
-    }), m = v(
-      () => /* @__PURE__ */ r.jsxs(
-        "svg",
-        {
-          "aria-label": "Dismiss popup",
-          display: "block",
-          fill: "none",
-          stroke: "currentColor",
-          strokeLinecap: "round",
-          strokeLinejoin: "round",
-          strokeWidth: 1.5,
-          viewBox: "0 0 16 16",
-          height: "1em",
-          width: "1em",
-          children: [
-            /* @__PURE__ */ r.jsx("line", { x1: "4", y1: "4", x2: "12", y2: "12" }),
-            /* @__PURE__ */ r.jsx("line", { x1: "4", y1: "12", x2: "12", y2: "4" })
-          ]
-        }
-      ),
-      []
-    );
-    return s = h(k({
-      "data-dialog-dismiss": "",
-      children: m
-    }, s), {
-      onClick: u
-    }), s = c(s), s;
-  }
-), E = p(function(i) {
-  const o = b(i);
-  return x(_, o);
-});
-export {
-  E as D
-};