welcome-ui 8.3.0 → 9.0.0-alpha.0

package/dist/DatePicker.mjs

@@ -1,113 +0,0 @@
-"use client";
-import { j as d } from "./jsx-runtime-B7I4PJ0H.mjs";
-import { useState as k, useRef as w, useEffect as E } from "react";
-import { g as G, D as R, S as J, c as Q, C as V, b as W } from "./CustomPopper-DezjKb9n.mjs";
-import { forwardRef as X } from "./System.mjs";
-const Z = X(
-  ({
-    autoFocus: I,
-    dataTestId: P,
-    dateFormat: S = "dd/MM/yyyy",
-    disabled: b,
-    endYear: F = R.getFullYear(),
-    icon: p,
-    iconPlacement: u = "left",
-    locale: l,
-    onBlur: i,
-    onChange: s,
-    onFocus: m,
-    placeholder: H,
-    popperProps: M,
-    preventVirtualKeyboard: g = !1,
-    showMonthYearPicker: f,
-    size: y = "md",
-    startYear: h = 1900,
-    transparent: C,
-    useWeekdaysShort: N = !0,
-    value: t = R,
-    ...o
-  }, c) => {
-    const A = o == null ? void 0 : o.timeIntervals, r = (e) => G(e, A), K = H || o.placeholderText, [B, D] = k(I && "date" || null), [L, a] = k(r(t)), x = w();
-    E(() => {
-      s && s(r(t));
-    }, []), E(() => {
-      var j;
-      const e = r(t), n = typeof t == "object" ? t == null ? void 0 : t.toISOString() : t;
-      ((j = new Date(Date.parse(n))) == null ? void 0 : j.getTime()) - (e == null ? void 0 : e.getTime()) !== 0 && s && s(e), a(e);
-    }, [t]);
-    const T = () => {
-      var e;
-      return (e = x.current) == null ? void 0 : e.blur();
-    }, O = (e) => {
-      D("date"), m && m(e);
-    }, U = (e) => {
-      D(null), i && i(e);
-    }, Y = (e) => {
-      ["Enter", "Escape"].includes(e.key) && T();
-    }, _ = (e) => {
-      e.preventDefault(), T(), a(null), s && s(null);
-    }, q = (e) => {
-      if (!e) return;
-      const n = r(e);
-      e.setHours(n.getHours(), n.getMinutes()), a(e), s && s(new Date(e));
-    };
-    return (
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore
-      /* @__PURE__ */ d.jsx(
-        J,
-        {
-          autoComplete: "off",
-          calendarClassName: "date-picker-popper",
-          customInput: /* @__PURE__ */ d.jsx(
-            W,
-            {
-              className: "date-picker",
-              "data-testid": P,
-              focused: B,
-              handleBlur: (e) => U(e),
-              handleFocus: (e) => O(e),
-              icon: p,
-              iconPlacement: u,
-              inputMode: g ? "none" : "text",
-              onReset: _,
-              ref: (e) => {
-                x.current = e, typeof c == "function" ? c(e) : c.current = e;
-              },
-              size: y
-            }
-          ),
-          dateFormat: S,
-          disabled: b,
-          iconPlacement: !!p && u,
-          locale: l,
-          onChange: q,
-          onKeyDown: Y,
-          placeholderText: K,
-          popperContainer: Q,
-          popperProps: M,
-          renderCustomHeader: (e) => /* @__PURE__ */ d.jsx(
-            V,
-            {
-              endYear: F,
-              isMonthYearPicker: f,
-              locale: l,
-              startYear: h,
-              ...e
-            }
-          ),
-          selected: L,
-          showMonthYearPicker: f,
-          size: y,
-          transparent: C,
-          useWeekdaysShort: N,
-          ...o
-        }
-      )
-    );
-  }
-);
-Z.displayName = "DatePicker";
-export {
-  Z as DatePicker
-};

package/dist/DateTimePicker.mjs

@@ -1,113 +0,0 @@
-"use client";
-import { j as s } from "./jsx-runtime-B7I4PJ0H.mjs";
-import D, { Children as d, useState as h, useEffect as g, cloneElement as $ } from "react";
-import { DatePicker as b } from "./DatePicker.mjs";
-import { S as j, a as w, g as E, D as S } from "./CustomPopper-DezjKb9n.mjs";
-import { forwardRef as _ } from "./System.mjs";
-import { TimePicker as A } from "./TimePicker.mjs";
-import N, { css as R } from "@xstyled/styled-components";
-const P = R`
-  &:focus {
-    position: relative;
-    z-index: 1;
-  }
-`, C = N.divBox`
-  position: relative;
-  display: inline-flex;
-  flex-wrap: nowrap;
-
-  .react-datepicker-wrapper {
-    flex-grow: 1;
-    ${j} {
-      ${P};
-      border-top-right-radius: 0;
-      border-bottom-right-radius: 0;
-    }
-    ${w} {
-      ${P};
-      border-top-left-radius: 0;
-      border-bottom-left-radius: 0;
-    }
-  }
-
-  .react-datepicker-wrapper:first-child:not(:only-child) {
-    margin-right: -1px;
-  }
-
-  .react-datepicker__input-container {
-    display: block;
-  }
-
-  .react-datepicker {
-    font-family: inherit;
-  }
-`, F = _(
-  ({
-    children: i,
-    dataTestId: m,
-    disabled: l,
-    locale: c,
-    onChange: a,
-    size: f = "md",
-    transparent: n,
-    value: t = S
-  }, k) => {
-    const u = d.count(i) > 1 && d.toArray(i).find(
-      (e) => e.type.displayName === "TimePicker"
-    ), x = D.isValidElement(u) ? u.props.timeIntervals : void 0, p = (e) => E(e, x), [T, y] = h(p(t)), r = (e) => {
-      y(e || null), a && a(e && new Date(e));
-    };
-    return g(() => {
-      a && r(p(t));
-    }, []), g(() => {
-      var o;
-      const e = p(t);
-      ((o = new Date(t)) == null ? void 0 : o.getTime()) - (e == null ? void 0 : e.getTime()) !== 0 && a && r(e), y(e);
-    }, [t]), /* @__PURE__ */ s.jsxs(C, { "data-testid": m, children: [
-      i ? d.map(
-        i,
-        (e, o) => $(e, {
-          // give ref only to the first child
-          inputRef: o < 1 ? k : null,
-          key: o,
-          locale: c,
-          onChange: r,
-          timeIntervals: x,
-          transparent: n,
-          value: T
-        })
-      ) : null,
-      !i && /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
-        /* @__PURE__ */ s.jsx(
-          b,
-          {
-            dataTestId: `${m}-datePicker`,
-            disabled: l,
-            locale: c,
-            onChange: r,
-            ref: k,
-            size: f,
-            transparent: n,
-            value: t
-          }
-        ),
-        /* @__PURE__ */ s.jsx(
-          A,
-          {
-            dataTestId: `${m}-timePicker`,
-            disabled: l,
-            locale: c,
-            onChange: r,
-            size: f,
-            transparent: n,
-            value: t
-          }
-        )
-      ] })
-    ] });
-  }
-);
-F.displayName = "DateTimePicker";
-export {
-  F as DateTimePicker
-};

package/dist/DateTimePickerCommon.mjs

@@ -1,14 +0,0 @@
-"use client";
-import { C as a, b as t, c as r, D as o, S as i, a as g, f as m, g as u, d as D, e as c } from "./CustomPopper-DezjKb9n.mjs";
-export {
-  a as CustomHeader,
-  t as CustomInput,
-  r as CustomPopper,
-  o as DEFAULT_DATE,
-  i as StyledDatePicker,
-  g as StyledTimePicker,
-  m as fixAriaMessageStyle,
-  u as getDate,
-  D as getMonths,
-  c as getYears
-};

package/dist/Drawer.mjs

@@ -1,288 +0,0 @@
-"use client";
-import { j as e } from "./jsx-runtime-B7I4PJ0H.mjs";
-import { forwardRef as d } from "./System.mjs";
-import n, { th as s, css as c, useTheme as h } from "@xstyled/styled-components";
-import { Box as l } from "./Box.mjs";
-import { Button as v } from "./Button.mjs";
-import "./Icon.mjs";
-import { A as k } from "./index-QaLwIvZS.mjs";
-import { Text as g } from "./Text.mjs";
-import { CloseButton as C } from "./CloseButton.mjs";
-import { D as I } from "./SYRFVSLH-B6m278Vb.mjs";
-import { D as O, u as S } from "./JC64G2H7-afsomHuH.mjs";
-import { D as T } from "./AXB53BZF-XKOjjeWO.mjs";
-const F = n.divBox`
-  flex: 1;
-  margin: 0 auto;
-  width: 100%;
-`, A = n.divBox(
-  ({ size: t }) => c`
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-shrink: 0;
-    height: 48;
-    width: 48;
-    border-radius: md;
-    background-color: beige-20;
-    transition: background-color ${s("transitions.medium")};
-
-    ${t === "sm" && c`
-      height: 32;
-      width: 32;
-    `}
-  `
-), R = d(
-  ({
-    children: t,
-    getPersistentElements: r,
-    maxWidth: o = 820,
-    store: i,
-    ...a
-  }, m) => {
-    const u = h(), x = () => Array.from(
-      r ? r() : document.querySelectorAll("[data-wui-persistent]")
-    ), b = !!r || (($) => {
-      const D = $.target;
-      return !x().some(
-        (B) => B.contains(D)
-      );
-    });
-    return /* @__PURE__ */ e.jsx(
-      N,
-      {
-        ...a,
-        autoFocusOnShow: !1,
-        getPersistentElements: x,
-        h: { _: "100%", md: "calc(100% - 3rem)" },
-        hideOnInteractOutside: b,
-        overflow: "hidden",
-        placement: "bottom",
-        ref: m,
-        store: i,
-        style: {
-          borderTopLeftRadius: u.radii.xxl,
-          borderTopRightRadius: u.radii.xxl
-        },
-        withBackdrop: !0,
-        children: /* @__PURE__ */ e.jsx(l, { h: "100%", mt: { _: "xl", md: "3xl" }, overflowY: "auto", w: "100%", children: /* @__PURE__ */ e.jsx(F, { maxWidth: o, children: /* @__PURE__ */ e.jsx(l, { p: { _: "0 md xl", md: "0 xl 3xl" }, children: t }) }) })
-      }
-    );
-  }
-), _ = ({
-  action: t,
-  icon: r,
-  onBackButtonClick: o,
-  subtitle: i,
-  title: a
-}) => /* @__PURE__ */ e.jsxs(
-  l,
-  {
-    alignItems: { md: "center" },
-    backgroundColor: "neutral-10",
-    display: "flex",
-    flexDirection: { _: "column", md: "row" },
-    gap: "xl",
-    justifyContent: "space-between",
-    mb: "xl",
-    pb: "md",
-    position: "sticky",
-    top: 0,
-    zIndex: 1,
-    children: [
-      /* @__PURE__ */ e.jsxs(l, { alignItems: "center", display: "flex", gap: { _: "md", md: "xl" }, children: [
-        !!o && /* @__PURE__ */ e.jsx(v, { onClick: o, shape: "circle", size: "lg", variant: "ghost", children: /* @__PURE__ */ e.jsx(k, {}) }),
-        !!r && /* @__PURE__ */ e.jsx(E, { icon: r }),
-        /* @__PURE__ */ e.jsxs(l, { display: "flex", flexDirection: "column", gap: "xxs", children: [
-          /* @__PURE__ */ e.jsx(g, { pr: "xl", variant: "h3", children: a }),
-          i
-        ] })
-      ] }),
-      t ? /* @__PURE__ */ e.jsx(l, { alignItems: "center", display: "flex", flexShrink: 0, gap: "md", children: t }) : null
-    ]
-  }
-), E = ({ icon: t, size: r = "md" }) => /* @__PURE__ */ e.jsx(A, { size: r, children: /* @__PURE__ */ e.jsx(t, { color: "neutral-90", size: r }) }), P = (t) => {
-  switch (t) {
-    case "bottom":
-      return {
-        bottom: 0,
-        left: 0,
-        right: 0,
-        transform: "translateY(100%)"
-      };
-    case "left":
-      return {
-        bottom: 0,
-        left: 0,
-        top: "0 !important",
-        transform: "translateX(-100%)"
-      };
-    case "right":
-      return {
-        bottom: 0,
-        right: 0,
-        top: "0 !important",
-        transform: "translateX(100%)"
-      };
-    case "top":
-      return {
-        left: 0,
-        right: 0,
-        top: "0 !important",
-        transform: "translateY(-100%)"
-      };
-  }
-}, f = ["sm", "md", "lg"], Y = (t, r) => {
-  switch (r) {
-    case "bottom":
-    case "top":
-      return f.includes(t) ? s(`drawers.sizes.vertical.${t}`) : {
-        height: t
-      };
-    case "left":
-    case "right":
-      return f.includes(t) ? s(`drawers.sizes.horizontal.${t}`) : {
-        width: t
-      };
-  }
-}, L = n.divBox(
-  ({ placement: t, size: r }) => c`
-    ${s("cards.default")};
-    ${s("drawers.default")};
-    ${P(t)}
-    ${Y(r, t)}
-    position: fixed;
-    display: flex;
-    flex-direction: column;
-    overflow: auto;
-    opacity: 0;
-    transition: medium;
-    max-width: 100%;
-
-    &[data-enter] {
-      opacity: 1;
-      transform: translate(0, 0);
-    }
-  `
-), w = n.divBox.withConfig({
-  shouldForwardProp: (t) => !["hideOnInteractOutside"].includes(t)
-})(
-  ({ hideOnInteractOutside: t }) => c`
-    ${s("drawers.backdrop")};
-    position: fixed;
-    top: 0;
-    right: 0;
-    left: 0;
-    bottom: 0;
-    opacity: 0;
-    transition: opacity 150ms ease-in-out;
-
-    ${t && c`
-      cursor: pointer;
-    `}
-
-    &[data-enter] {
-      opacity: 1;
-    }
-  `
-), W = n.divBox`
-  ${s("drawers.title")};
-`, X = n.divBox`
-  ${s("drawers.content")};
-`, q = n(C)`
-  ${s("drawers.closeButton")};
-`, z = n.divBox`
-  ${s("drawers.footer")};
-`, j = ({ zIndex: t = "2", ...r }) => {
-  const o = h();
-  return /* @__PURE__ */ e.jsx(l, { h: "0", position: "sticky", top: 0, zIndex: t, children: /* @__PURE__ */ e.jsx(
-    I,
-    {
-      render: /* @__PURE__ */ e.jsx(
-        q,
-        {
-          left: `calc(100% - ${o.space.lg} - ${o.buttons.sizes.sm.height})`,
-          mt: "lg",
-          ...r
-        }
-      )
-    }
-  ) });
-}, H = d((t, r) => /* @__PURE__ */ e.jsx(X, { flex: "1", overflowY: { md: "auto" }, ref: r, ...t })), Z = d((t, r) => /* @__PURE__ */ e.jsx(
-  z,
-  {
-    bottom: { md: "auto", xs: 0 },
-    position: { md: "static", xs: "sticky" },
-    ref: r,
-    w: "100%",
-    ...t
-  }
-)), J = ({ children: t, zIndex: r = "1", ...o }) => /* @__PURE__ */ e.jsx(
-  W,
-  {
-    alignItems: "center",
-    display: "flex",
-    justifyContent: "space-between",
-    position: { md: "static", xs: "sticky" },
-    top: { md: "auto", xs: 0 },
-    w: "100%",
-    zIndex: r,
-    ...o,
-    children: /* @__PURE__ */ e.jsx(g, { m: "0", variant: "h3", w: "100%", children: t })
-  }
-), K = d(
-  ({
-    children: t,
-    hideOnInteractOutside: r = !0,
-    placement: o = "right",
-    size: i = "lg",
-    store: a,
-    withBackdrop: m = !1,
-    withCloseButton: u = !0,
-    ...x
-  }, p) => /* @__PURE__ */ e.jsx(
-    O,
-    {
-      backdrop: m ? /* @__PURE__ */ e.jsx(w, { hideOnInteractOutside: r }) : !1,
-      hideOnInteractOutside: r,
-      modal: m,
-      ref: p,
-      render: /* @__PURE__ */ e.jsx(L, { placement: o, size: i }),
-      store: a,
-      ...x,
-      children: /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-        u ? /* @__PURE__ */ e.jsx(j, {}) : null,
-        t
-      ] })
-    }
-  )
-);
-function ct(t = {}) {
-  return S({ animated: !0, ...t });
-}
-const M = ({
-  hideOnInteractOutside: t = !0,
-  ...r
-}) => /* @__PURE__ */ e.jsx(w, { hideOnInteractOutside: t, ...r }), y = d(({ as: t, store: r, ...o }, i) => /* @__PURE__ */ e.jsx(
-  T,
-  {
-    ref: i,
-    render: t ? (a) => /* @__PURE__ */ e.jsx(t, { ...a }) : void 0,
-    store: r,
-    ...o
-  }
-)), N = Object.assign(K, {
-  Backdrop: M,
-  Close: j,
-  Content: H,
-  Footer: Z,
-  Title: J,
-  Trigger: y
-}), dt = Object.assign(R, { Header: _, Trigger: y });
-export {
-  dt as AssetDrawer,
-  N as Drawer,
-  M as DrawerBackdrop,
-  y as Trigger,
-  ct as useDrawer
-};