twenty-ui 2.46.0 → 2.48.0

package/dist/input-CKcuJwhb.js

@@ -1,450 +0,0 @@
-import { t as y } from "./isDefined-fMi6eQ4r.js";
-import { Di as Te, Pn as ve, Tn as le, Uc as xe, Wo as Oe, Zc as Pe, hl as ke, js as we, pl as ze } from "./icon-Bo3y4NHM.js";
-import { r as ge } from "./theme-yAk9zrNA.js";
-import { t as A } from "./normalizeSearchText-DA4xMLCJ.js";
-import { n as fe, t as z } from "./Button-DQUIhQAm.js";
-import { t as W } from "./mergeClassNames-ClFMR1v0.js";
-import { t as se } from "./OverflowingTextWithTooltip-wRABzEWd.js";
-import { t as s } from "./Dropdown-CZVEnq0N.js";
-import { n as me, t as Ee } from "./Input-D3-FH2Zz.js";
-import { n as oe, t as Fe } from "./InputGroup-wM9PT12U.js";
-import { useRender as _e } from "@base-ui/react/use-render";
-import { isFunction as pe, isNonEmptyArray as V, isNonEmptyString as _ } from "@sniptt/guards";
-import { clsx as ce } from "clsx";
-import { useContext as be, useEffect as Be, useId as Q, useRef as De, useState as O } from "react";
-import { Fragment as U, jsx as e, jsxs as m } from "react/jsx-runtime";
-import { useMergedRefs as $e } from "@base-ui/utils/useMergedRefs";
-import { useStableCallback as je } from "@base-ui/utils/useStableCallback";
-var Me = "_root_1x3d7_1", Le = "_label_1x3d7_6", Re = "_flag_1x3d7_14", G = {
-  root: Me,
-  label: Le,
-  flag: Re
-}, Ae = ({ disabled: r, open: a, onOpenChange: t }) => {
-  const n = je(t);
-  return Be(() => {
-    !r || !a || n(!1);
-  }, [
-    r,
-    a,
-    n
-  ]), null;
-}, Ge = ({ countries: r, value: a, onValueChange: t, searchLabel: n, noCountryLabel: l, noResultsLabel: i }) => {
-  const [d, h] = O(""), c = A(d.trim()), b = _(c), v = r.filter((f) => A(f.label).includes(c)), o = A(l).includes(c), g = o || V(v), C = o && /* @__PURE__ */ e(s.OptionItem, {
-    selected: !_(a),
-    startIcon: /* @__PURE__ */ e("span", {
-      className: G.flag,
-      "aria-hidden": "true",
-      children: /* @__PURE__ */ e(ve, {})
-    }),
-    onSelect: () => t(""),
-    children: l
-  });
-  return /* @__PURE__ */ m(U, { children: [
-    /* @__PURE__ */ e(s.Search, {
-      value: d,
-      onValueChange: h,
-      placeholder: n,
-      "aria-label": n
-    }),
-    g && /* @__PURE__ */ e(s.Separator, {}),
-    g && /* @__PURE__ */ m(s.Section, {
-      scrollable: !0,
-      children: [
-        !b && C,
-        v.map((f) => /* @__PURE__ */ e(s.OptionItem, {
-          selected: f.value === a,
-          startIcon: /* @__PURE__ */ e("span", {
-            className: G.flag,
-            "aria-hidden": "true",
-            children: f.flag
-          }),
-          onSelect: () => t(f.value),
-          children: f.label
-        }, f.value)),
-        b && C
-      ]
-    }),
-    !g && /* @__PURE__ */ e(s.Empty, { children: i })
-  ] });
-}, Ve = ({ ariaLabelledBy: r, ariaLabel: a, visibleLabelId: t }) => {
-  if (_(r)) return r;
-  if (!_(a))
-    return t;
-}, L = (r) => r.preventBaseUIHandler?.(), Lr = ({ countries: r, value: a, onValueChange: t, label: n, searchLabel: l = "Search", noCountryLabel: i = "No country", noResultsLabel: d = "No results", open: h, onOpenChange: c, popupProps: b, disabled: v = !1, className: o, style: g, render: C, onClick: f, onMouseDown: P, onPointerDown: E, onKeyDown: u, onKeyUp: Y, id: ee, "aria-label": F, "aria-labelledby": H, "aria-describedby": re, ...K }) => {
-  const k = Q(), B = ee ?? k, q = `${k}-label`, D = `${k}-value`, $ = _(n), S = _(F) ? F : void 0, w = Ve({
-    ariaLabelledBy: H,
-    ariaLabel: S,
-    visibleLabelId: $ ? q : void 0
-  }), T = [re, y(w) || y(S) ? D : void 0].filter(_), [ae, te] = O(!1), p = v || !V(r), j = h ?? ae, x = !p && j, [M, X] = O(x), [de, Ce] = O(0);
-  M !== x && (X(x), x && Ce(de + 1));
-  const ne = r.find((I) => I.value === a), Ie = ne?.label ?? i, ye = y(ne) ? ne.flag : /* @__PURE__ */ e(ve, {}), ie = (I) => ({
-    ...I,
-    disabled: p
-  }), Se = W(ce(me.input, me.md, oe.trigger), o), ue = (I) => {
-    I && p || (te(I), c?.(I));
-  };
-  return /* @__PURE__ */ m("div", {
-    className: G.root,
-    children: [
-      /* @__PURE__ */ e(Ae, {
-        disabled: p,
-        open: j,
-        onOpenChange: ue
-      }),
-      $ && /* @__PURE__ */ e("label", {
-        id: q,
-        className: G.label,
-        htmlFor: B,
-        children: n
-      }),
-      /* @__PURE__ */ m(s.Root, {
-        type: "picker",
-        open: x,
-        onOpenChange: ue,
-        children: [/* @__PURE__ */ m(s.Trigger, {
-          ...K,
-          id: B,
-          "aria-label": S,
-          "aria-labelledby": w,
-          "aria-describedby": V(T) ? T.join(" ") : void 0,
-          "aria-disabled": p || void 0,
-          "data-disabled": p ? "" : void 0,
-          onClick: p ? L : f,
-          onMouseDown: p ? L : P,
-          onPointerDown: p ? L : E,
-          onKeyDown: p ? L : u,
-          onKeyUp: p ? L : Y,
-          className: (I) => Se(ie(I)),
-          style: pe(g) ? (I) => g(ie(I)) : g,
-          render: pe(C) ? (I, Ne) => C(I, ie(Ne)) : C,
-          children: [
-            /* @__PURE__ */ e("span", {
-              className: G.flag,
-              "aria-hidden": "true",
-              children: ye
-            }),
-            /* @__PURE__ */ e("span", {
-              className: oe.value,
-              id: D,
-              children: /* @__PURE__ */ e(se, { text: Ie })
-            }),
-            /* @__PURE__ */ e("span", {
-              className: oe.icon,
-              "aria-hidden": "true",
-              children: /* @__PURE__ */ e(le, {})
-            })
-          ]
-        }), /* @__PURE__ */ e(s.Content, {
-          ...b,
-          "aria-label": S,
-          "aria-labelledby": w,
-          children: /* @__PURE__ */ e(Ge, {
-            countries: r,
-            value: a,
-            onValueChange: t,
-            searchLabel: l,
-            noCountryLabel: i,
-            noResultsLabel: d
-          }, de)
-        })]
-      })
-    ]
-  });
-}, Ue = "_trigger_gi29o_1", We = "_chevron_gi29o_35", He = "_options_gi29o_40", Ke = "_emptyStatus_gi29o_46", J = {
-  trigger: Ue,
-  chevron: We,
-  options: He,
-  emptyStatus: Ke
-}, he = ({ code: r, name: a }) => `${a} (${r})`, qe = ({ currencies: r, value: a, onValueChange: t, disabled: n = !1, searchLabel: l = "Search", emptyLabel: i = "No results", className: d, render: h, ref: c, ...b }) => {
-  const [v, o] = O(""), g = v.trim().toLowerCase(), C = r.filter((u) => he(u).toLowerCase().includes(g)), f = V(C), P = C.find(({ code: u }) => u === a), E = y(P) ? [P, ...C.filter(({ code: u }) => u !== a)] : C;
-  return _e({
-    render: h,
-    ref: c,
-    props: {
-      ...b,
-      className: ce(J.options, d),
-      children: /* @__PURE__ */ m(U, { children: [
-        /* @__PURE__ */ e(s.Search, {
-          value: v,
-          placeholder: l,
-          "aria-label": l,
-          onValueChange: o,
-          disabled: n
-        }),
-        /* @__PURE__ */ e(s.Separator, {}),
-        f && /* @__PURE__ */ e(s.Section, {
-          scrollable: !0,
-          children: E.map((u) => /* @__PURE__ */ e(s.OptionItem, {
-            selected: u.code === a,
-            disabled: n || u.disabled,
-            onSelect: () => t(u.code),
-            children: /* @__PURE__ */ e(se, { text: he(u) })
-          }, u.code))
-        }),
-        /* @__PURE__ */ e(s.Empty, {
-          className: J.emptyStatus,
-          children: f ? null : i
-        })
-      ] })
-    }
-  });
-}, Xe = ({ value: r, className: a, ...t }) => /* @__PURE__ */ m(s.Trigger, {
-  ...t,
-  className: W(J.trigger, a),
-  children: [r, /* @__PURE__ */ e(le, {
-    "aria-hidden": "true",
-    className: J.chevron
-  })]
-}), Rr = {
-  Trigger: Xe,
-  Options: qe
-}, Ze = "_root_u3myi_1", Je = "_preview_u3myi_6", Qe = "_image_u3myi_35", Ye = "_fileInput_u3myi_48", er = "_content_u3myi_58", rr = "_actions_u3myi_67", ar = "_helperText_u3myi_73", tr = "_errorMessage_u3myi_78", N = {
-  root: Ze,
-  preview: Je,
-  image: Qe,
-  fileInput: Ye,
-  content: er,
-  actions: rr,
-  helperText: ar,
-  errorMessage: tr
-}, nr = ({ src: r }) => {
-  const a = ge(), [t, n] = O(!1);
-  return !_(r) || t ? /* @__PURE__ */ e(Oe, {
-    size: a.icon.size.lg,
-    "aria-hidden": !0
-  }) : /* @__PURE__ */ e("img", {
-    className: N.image,
-    src: r,
-    alt: "",
-    onError: () => n(!0)
-  });
-}, ir = "image/*", Ar = ({ src: r, onFileSelect: a, onRemove: t, onAbort: n, disabled: l = !1, isUploading: i = !1, helperText: d, errorMessage: h, uploadLabel: c = "Upload", removeLabel: b = "Remove", abortLabel: v = "Abort", accept: o = ir, inputRef: g, onChange: C, "aria-describedby": f, className: P, style: E, dir: u, render: Y, ref: ee, ...F }) => {
-  const H = De(null), re = $e(H, g), K = Q(), k = `${K}-helper`, B = `${K}-error`, q = _(r), D = _(d), $ = _(h), S = l || !y(a), w = l || !q || !y(t), T = S || i, ae = w || i, te = i && y(n), p = [
-    f,
-    D && k,
-    $ && B
-  ].filter(_).join(" ") || void 0, j = () => {
-    T || H.current?.click();
-  }, x = (M) => {
-    const X = M.currentTarget.files?.[0];
-    try {
-      C?.(M);
-    } finally {
-      M.currentTarget.value = "";
-    }
-    T || !y(X) || a?.(X);
-  };
-  return _e({
-    render: Y,
-    ref: ee,
-    props: {
-      className: ce(N.root, P),
-      style: E,
-      dir: u,
-      "aria-busy": i || F["aria-busy"],
-      children: /* @__PURE__ */ m(U, { children: [/* @__PURE__ */ e("button", {
-        className: N.preview,
-        type: "button",
-        disabled: S,
-        "aria-disabled": i || void 0,
-        "aria-label": c,
-        "aria-describedby": p,
-        onClick: j,
-        children: /* @__PURE__ */ e(nr, { src: r }, r)
-      }), /* @__PURE__ */ m("div", {
-        className: N.content,
-        children: [
-          /* @__PURE__ */ m("div", {
-            className: N.actions,
-            children: [
-              /* @__PURE__ */ e("input", {
-                "aria-label": c,
-                ...F,
-                ref: re,
-                className: N.fileInput,
-                dir: u,
-                children: void 0,
-                dangerouslySetInnerHTML: void 0,
-                type: "file",
-                multiple: !1,
-                value: void 0,
-                defaultValue: void 0,
-                accept: o,
-                disabled: T,
-                "aria-describedby": p,
-                hidden: !0,
-                onChange: x
-              }),
-              te ? /* @__PURE__ */ e(z, {
-                type: "button",
-                startIcon: /* @__PURE__ */ e(ke, {}),
-                onClick: n,
-                disabled: l,
-                variant: "outline",
-                children: v
-              }) : /* @__PURE__ */ e(z, {
-                type: "button",
-                startIcon: /* @__PURE__ */ e(Pe, {}),
-                onClick: j,
-                disabled: T,
-                focusableWhenDisabled: i && !S,
-                "aria-describedby": p,
-                variant: "outline",
-                children: c
-              }),
-              /* @__PURE__ */ e(z, {
-                type: "button",
-                startIcon: /* @__PURE__ */ e(xe, {}),
-                onClick: t,
-                disabled: ae,
-                focusableWhenDisabled: i && !w,
-                variant: "outline",
-                children: b
-              })
-            ]
-          }),
-          D && /* @__PURE__ */ e("span", {
-            className: N.helperText,
-            id: k,
-            children: d
-          }),
-          $ && /* @__PURE__ */ e("span", {
-            className: N.errorMessage,
-            id: B,
-            role: "alert",
-            children: h
-          })
-        ]
-      })] })
-    }
-  });
-}, or = "_button_k3e4y_1", lr = { button: or }, Gr = ({ className: r, emphasis: a = "standard", size: t, variant: n, ...l }) => {
-  const i = be(fe), d = t ?? i?.size ?? "sm", h = n ?? i?.variant ?? "ghost";
-  return /* @__PURE__ */ e(z, {
-    ...l,
-    size: d,
-    variant: h,
-    "data-emphasis": a,
-    className: W(lr.button, r)
-  });
-}, sr = "_button_1fwx7_1", cr = { button: sr }, Vr = ({ className: r, elevated: a = !0, variant: t, ...n }) => {
-  const l = be(fe), i = t ?? l?.variant ?? "solid";
-  return /* @__PURE__ */ e(z, {
-    ...n,
-    elevated: a,
-    variant: i,
-    className: W(cr.button, r)
-  });
-}, dr = "_trigger_1fjn7_1", ur = "_triggerFlag_1fjn7_31", mr = "_optionFlag_1fjn7_32", pr = "_chevron_1fjn7_52", hr = "_selectedCountryLabel_1fjn7_57", R = {
-  trigger: dr,
-  triggerFlag: ur,
-  optionFlag: mr,
-  chevron: pr,
-  selectedCountryLabel: hr
-}, vr = ({ label: r, callingCode: a }) => `${r} (+${a})`, gr = ({ countries: r, value: a, onValueChange: t, searchLabel: n = "Search", emptyLabel: l = "No results" }) => {
-  const [i, d] = O(""), h = A(i), c = r.filter(({ label: o }) => A(o).includes(h)), b = c.find((o) => o.value === a), v = y(b) ? [b, ...c.filter((o) => o.value !== a)] : c;
-  return /* @__PURE__ */ m(U, { children: [
-    /* @__PURE__ */ e(s.Search, {
-      value: i,
-      onValueChange: d,
-      placeholder: n,
-      "aria-label": n
-    }),
-    /* @__PURE__ */ e(s.Separator, {}),
-    /* @__PURE__ */ m(s.Section, {
-      scrollable: !0,
-      children: [!V(v) && /* @__PURE__ */ e(s.Empty, { children: l }), v.map((o) => {
-        const g = vr(o);
-        return /* @__PURE__ */ e(s.OptionItem, {
-          "aria-label": g,
-          selected: o.value === a,
-          onSelect: () => t(o.value),
-          startIcon: /* @__PURE__ */ e("span", {
-            className: R.optionFlag,
-            "aria-hidden": !0,
-            children: o.flag
-          }),
-          children: /* @__PURE__ */ e(se, {
-            text: /* @__PURE__ */ m(U, { children: [
-              o.label,
-              " (",
-              /* @__PURE__ */ m("bdi", {
-                dir: "ltr",
-                children: ["+", o.callingCode]
-              }),
-              ")"
-            ] }),
-            tooltipContent: g
-          })
-        }, o.value);
-      })]
-    })
-  ] });
-}, fr = ({ country: r, className: a, "aria-describedby": t, ...n }) => {
-  const l = Q(), i = [y(r) && l, t].filter(_).join(" ") || void 0;
-  return /* @__PURE__ */ m(s.Trigger, {
-    ...n,
-    "aria-describedby": i,
-    className: W(R.trigger, a),
-    children: [
-      /* @__PURE__ */ e("span", {
-        className: R.triggerFlag,
-        "aria-hidden": !0,
-        children: r?.flag ?? /* @__PURE__ */ e(ze, {})
-      }),
-      y(r) && /* @__PURE__ */ e("span", {
-        id: l,
-        className: R.selectedCountryLabel,
-        children: r.label
-      }),
-      /* @__PURE__ */ e(le, {
-        className: R.chevron,
-        "aria-hidden": !0
-      })
-    ]
-  });
-}, Ur = {
-  Trigger: fr,
-  Options: gr
-}, _r = "_wrapper_fz4xu_1", br = "_filterButton_fz4xu_8", Cr = "_inputGroup_fz4xu_17", Ir = "_searchIcon_fz4xu_23", Z = {
-  wrapper: _r,
-  filterButton: br,
-  inputGroup: Cr,
-  searchIcon: Ir
-}, Wr = ({ placeholder: r, filterDropdown: a, size: t = "md", id: n, filterButtonAriaLabel: l = "Filter", "aria-label": i, "aria-labelledby": d, ...h }) => {
-  const c = ge(), b = Q(), v = n ?? b, o = /* @__PURE__ */ e(z, {
-    variant: "outline",
-    size: t,
-    "aria-label": l,
-    startIcon: /* @__PURE__ */ e(Te, { size: c.icon.size.md }),
-    className: Z.filterButton
-  });
-  return /* @__PURE__ */ m("div", {
-    className: Z.wrapper,
-    children: [/* @__PURE__ */ e(Fe, {
-      className: Z.inputGroup,
-      size: t,
-      startElement: /* @__PURE__ */ e(we, {
-        className: Z.searchIcon,
-        size: c.icon.size.md,
-        "aria-hidden": !0
-      }),
-      children: /* @__PURE__ */ e(Ee, {
-        ...h,
-        id: v,
-        placeholder: r,
-        "aria-label": _(d) ? void 0 : i ?? r,
-        "aria-labelledby": d
-      })
-    }), a?.(o)]
-  });
-};
-export {
-  Ar as a,
-  Gr as i,
-  Ur as n,
-  Rr as o,
-  Vr as r,
-  Lr as s,
-  Wr as t
-};