welcome-ui 1.0.0-beta.3 → 1.0.0-beta.4

package/dist/DropdownMenu.mjs

@@ -0,0 +1,776 @@
+"use client";
+import C, { useCallback as Ve, useRef as le, createContext as ge, useState as we, useEffect as Me, createRef as Re, useMemo as Be } from "react";
+import Y, { th as U, css as Ke, system as Se, useTheme as ze } from "@xstyled/styled-components";
+import { forwardRef as J } from "./System.mjs";
+import { h as ce, j as je, C as Ee, a as xe, u as We } from "./P2CTZE2T-5jxBu6ix.mjs";
+import { e as Ze, f as Ue, c as qe, d as Ge, g as Ye, h as Je } from "./BYC7LY2E-BAjGN7k_.mjs";
+import { c as D, _ as O, i as K, a7 as Qe, u as ae, e as V, a9 as Z, V as Xe, h as y, j as re, a as v, z as Ce, w as ye, f as k, b as F, Z as et, $ as tt, I as Pe, R as nt, q as rt, p as ot, ab as ut, n as Oe, A as at, B as G, C as W, D as L, a3 as st, H as it, x as Ae, E as _e, m as se, Y as lt, ac as ct, o as dt, ad as Ie, g as ft, ae as pt, af as mt } from "./LVA2YJMS-Dm5ieEMw.mjs";
+import { u as bt, b as vt } from "./QYJ6MIDR-Cy39pEs2.mjs";
+import { m as ht, o as gt, p as wt, t as Mt, s as be, d as ve, c as St, a as Et, b as xt, u as R } from "./YV4JVR4I-1ezWeCCz.mjs";
+import { Box as Ct } from "./Box.mjs";
+import { c as yt, u as Pt, a as Ot } from "./ITI7HKP4-Couz1Z73.mjs";
+import { i as At } from "./VGCJ63VH-fv0YLRh8.mjs";
+import { c as _t, R as It } from "./JC64G2H7-CQsqXPS_.mjs";
+import { a as Tt } from "./VEVQD5MH-De4r89YE.mjs";
+var Ht = "div";
+function Te(n) {
+  const t = n.relatedTarget;
+  return (t == null ? void 0 : t.nodeType) === Node.ELEMENT_NODE ? t : null;
+}
+function Dt(n) {
+  const t = Te(n);
+  return t ? et(n.currentTarget, t) : !1;
+}
+var ie = Symbol("composite-hover");
+function kt(n) {
+  let t = Te(n);
+  if (!t) return !1;
+  do {
+    if (tt(t, ie) && t[ie]) return !0;
+    t = t.parentElement;
+  } while (t);
+  return !1;
+}
+var He = D(
+  function(t) {
+    var r = t, {
+      store: e,
+      focusOnHover: u = !0,
+      blurOnHoverEnd: s = !!u
+    } = r, a = O(r, [
+      "store",
+      "focusOnHover",
+      "blurOnHoverEnd"
+    ]);
+    const o = ce();
+    e = e || o, K(
+      e,
+      process.env.NODE_ENV !== "production" && "CompositeHover must be wrapped in a Composite component."
+    );
+    const l = Qe(), c = a.onMouseMove, i = ae(u), w = V((f) => {
+      if (c == null || c(f), !f.defaultPrevented && l() && i(f)) {
+        if (!Z(f.currentTarget)) {
+          const M = e == null ? void 0 : e.getState().baseElement;
+          M && !Xe(M) && M.focus();
+        }
+        e == null || e.setActiveId(f.currentTarget.id);
+      }
+    }), m = a.onMouseLeave, d = ae(s), E = V((f) => {
+      var M;
+      m == null || m(f), !f.defaultPrevented && l() && (Dt(f) || kt(f) || i(f) && d(f) && (e == null || e.setActiveId(null), (M = e == null ? void 0 : e.getState().baseElement) == null || M.focus()));
+    }), p = Ve((f) => {
+      f && (f[ie] = !0);
+    }, []);
+    return a = y(v({}, a), {
+      ref: re(p, a.ref),
+      onMouseMove: w,
+      onMouseLeave: E
+    }), Ce(a);
+  }
+);
+ye(
+  k(function(t) {
+    const r = He(t);
+    return F(Ht, r);
+  })
+);
+var Ft = "hr", De = D(
+  function(t) {
+    var r = t, { orientation: e = "horizontal" } = r, u = O(r, ["orientation"]);
+    return u = v({
+      role: "separator",
+      "aria-orientation": e
+    }, u), u;
+  }
+);
+k(function(t) {
+  const r = De(t);
+  return F(Ft, r);
+});
+var Nt = "hr", ke = D(function(t) {
+  var r = t, { store: e } = r, u = O(r, ["store"]);
+  const s = ce();
+  e = e || s, K(
+    e,
+    process.env.NODE_ENV !== "production" && "CompositeSeparator must be wrapped in a Composite component."
+  );
+  const a = e.useState(
+    (o) => o.orientation === "horizontal" ? "vertical" : "horizontal"
+  );
+  return u = De(y(v({}, u), { orientation: a })), u;
+});
+k(function(t) {
+  const r = ke(t);
+  return F(Nt, r);
+});
+var $t = "div", N = "";
+function ue() {
+  N = "";
+}
+function Lt(n) {
+  const t = n.target;
+  return t && rt(t) ? !1 : n.key === " " && N.length ? !0 : n.key.length === 1 && !n.ctrlKey && !n.altKey && !n.metaKey && /^[\p{Letter}\p{Number}]$/u.test(n.key);
+}
+function Vt(n, t) {
+  if (ot(n)) return !0;
+  const r = n.target;
+  return r ? t.some((u) => u.element === r) : !1;
+}
+function Rt(n) {
+  return n.filter((t) => !t.disabled);
+}
+function ne(n, t) {
+  var r;
+  const e = ((r = n.element) == null ? void 0 : r.textContent) || n.children || // The composite item object itself doesn't include a value property, but
+  // other components like Select do. Since CompositeTypeahead is a generic
+  // component that can be used with those as well, we also consider the value
+  // property as a fallback for the typeahead text content.
+  "value" in n && n.value;
+  return e ? ut(e).trim().toLowerCase().startsWith(t.toLowerCase()) : !1;
+}
+function Bt(n, t, r) {
+  if (!r) return n;
+  const e = n.find((u) => u.id === r);
+  return !e || !ne(e, t) || N !== t && ne(e, N) ? n : (N = t, je(
+    n.filter((u) => ne(u, N)),
+    r
+  ).filter((u) => u.id !== r));
+}
+var de = D(function(t) {
+  var r = t, { store: e, typeahead: u = !0 } = r, s = O(r, ["store", "typeahead"]);
+  const a = ce();
+  e = e || a, K(
+    e,
+    process.env.NODE_ENV !== "production" && "CompositeTypeahead must be a Composite component"
+  );
+  const o = s.onKeyDownCapture, l = le(0), c = V((i) => {
+    if (o == null || o(i), i.defaultPrevented || !u || !e) return;
+    if (!Lt(i))
+      return ue();
+    const { renderedItems: w, items: m, activeId: d, id: E } = e.getState();
+    let p = Rt(
+      m.length > w.length ? m : w
+    );
+    const f = Pe(i.currentTarget), M = `[data-offscreen-id="${E}"]`, b = f.querySelectorAll(M);
+    for (const S of b) {
+      const T = S.ariaDisabled === "true" || "disabled" in S && !!S.disabled;
+      p.push({ id: S.id, element: S, disabled: T });
+    }
+    if (b.length && (p = nt(p, (S) => S.element)), !Vt(i, p)) return ue();
+    i.preventDefault(), window.clearTimeout(l.current), l.current = window.setTimeout(() => {
+      N = "";
+    }, 500);
+    const A = i.key.toLowerCase();
+    N += A, p = Bt(p, A, d);
+    const P = p.find((S) => ne(S, N));
+    P ? e.move(P.id) : ue();
+  });
+  return s = y(v({}, s), {
+    onKeyDownCapture: c
+  }), Ce(s);
+});
+k(function(t) {
+  const r = de(t);
+  return F($t, r);
+});
+var Fe = Oe(
+  [xe],
+  [Ee]
+), Kt = Fe.useContext, zt = Fe.useScopedContext;
+ge(
+  void 0
+);
+var Q = Oe(
+  [xe, Ue],
+  [Ee, Ze]
+), fe = Q.useContext, jt = Q.useScopedContext, oe = Q.useProviderContext, Wt = Q.ContextProvider, Zt = Q.ScopedContextProvider;
+ge(
+  void 0
+);
+function Ut(n = {}) {
+  var t = n, {
+    combobox: r,
+    parent: e,
+    menubar: u
+  } = t, s = at(t, [
+    "combobox",
+    "parent",
+    "menubar"
+  ]);
+  const a = !!u && !e, o = ht(
+    s.store,
+    wt(e, ["values"]),
+    gt(r, [
+      "arrowElement",
+      "anchorElement",
+      "contentElement",
+      "popoverElement",
+      "disclosureElement"
+    ])
+  );
+  Mt(s, o);
+  const l = o.getState(), c = yt(G(L({}, s), {
+    store: o,
+    orientation: W(
+      s.orientation,
+      l.orientation,
+      "vertical"
+    )
+  })), i = qe(G(L({}, s), {
+    store: o,
+    placement: W(
+      s.placement,
+      l.placement,
+      "bottom-start"
+    ),
+    timeout: W(
+      s.timeout,
+      l.timeout,
+      a ? 0 : 150
+    ),
+    hideTimeout: W(s.hideTimeout, l.hideTimeout, 0)
+  })), w = G(L(L({}, c.getState()), i.getState()), {
+    initialFocus: W(l.initialFocus, "container"),
+    values: W(
+      s.values,
+      l.values,
+      s.defaultValues,
+      {}
+    )
+  }), m = St(w, c, i, o);
+  return be(
+    m,
+    () => ve(m, ["mounted"], (d) => {
+      d.mounted || m.setState("activeId", null);
+    })
+  ), be(
+    m,
+    () => ve(e, ["orientation"], (d) => {
+      m.setState(
+        "placement",
+        d.orientation === "vertical" ? "right-start" : "bottom-start"
+      );
+    })
+  ), G(L(L(L({}, c), i), m), {
+    combobox: r,
+    parent: e,
+    menubar: u,
+    hideAll: () => {
+      i.hide(), e == null || e.hideAll();
+    },
+    setInitialFocus: (d) => m.setState("initialFocus", d),
+    setValues: (d) => m.setState("values", d),
+    setValue: (d, E) => {
+      d !== "__proto__" && d !== "constructor" && (Array.isArray(d) || m.setState("values", (p) => {
+        const f = p[d], M = st(E, f);
+        return M === f ? p : G(L({}, p), {
+          [d]: M !== void 0 && M
+        });
+      }));
+    }
+  });
+}
+function qt(n, t, r) {
+  return it(t, [r.combobox, r.parent, r.menubar]), xt(n, r, "values", "setValues"), Object.assign(
+    Ge(
+      Pt(n, t, r),
+      t,
+      r
+    ),
+    {
+      combobox: r.combobox,
+      parent: r.parent,
+      menubar: r.menubar
+    }
+  );
+}
+function Gt(n = {}) {
+  const t = fe(), r = Kt(), e = Tt();
+  n = y(v({}, n), {
+    parent: n.parent !== void 0 ? n.parent : t,
+    menubar: n.menubar !== void 0 ? n.menubar : r,
+    combobox: n.combobox !== void 0 ? n.combobox : e
+  });
+  const [u, s] = Et(Ut, n);
+  return qt(u, s, n);
+}
+var Yt = "div";
+function Jt(n) {
+  var t = n, { store: r } = t, e = O(t, ["store"]);
+  const [u, s] = we(void 0), a = e["aria-label"], o = R(r, "disclosureElement"), l = R(r, "contentElement");
+  return Me(() => {
+    const c = o;
+    if (!c) return;
+    const i = l;
+    if (!i) return;
+    a || i.hasAttribute("aria-label") ? s(void 0) : c.id && s(c.id);
+  }, [a, o, l]), u;
+}
+var Ne = D(
+  function(t) {
+    var r = t, { store: e, alwaysVisible: u, composite: s } = r, a = O(r, ["store", "alwaysVisible", "composite"]);
+    const o = oe();
+    e = e || o, K(
+      e,
+      process.env.NODE_ENV !== "production" && "MenuList must receive a `store` prop or be wrapped in a MenuProvider component."
+    );
+    const l = e.parent, c = e.menubar, i = !!l, w = Ae(a.id), m = a.onKeyDown, d = e.useState(
+      (g) => g.placement.split("-")[0]
+    ), E = e.useState(
+      (g) => g.orientation === "both" ? void 0 : g.orientation
+    ), p = E !== "vertical", f = R(
+      c,
+      (g) => !!g && g.orientation !== "vertical"
+    ), M = V((g) => {
+      if (m == null || m(g), !g.defaultPrevented) {
+        if (i || c && !p) {
+          const _ = {
+            ArrowRight: () => d === "left" && !p,
+            ArrowLeft: () => d === "right" && !p,
+            ArrowUp: () => d === "bottom" && p,
+            ArrowDown: () => d === "top" && p
+          }[g.key];
+          if (_ != null && _())
+            return g.stopPropagation(), g.preventDefault(), e == null ? void 0 : e.hide();
+        }
+        if (c) {
+          const _ = {
+            ArrowRight: () => {
+              if (f)
+                return c.next();
+            },
+            ArrowLeft: () => {
+              if (f)
+                return c.previous();
+            },
+            ArrowDown: () => {
+              if (!f)
+                return c.next();
+            },
+            ArrowUp: () => {
+              if (!f)
+                return c.previous();
+            }
+          }[g.key], $ = _ == null ? void 0 : _();
+          $ !== void 0 && (g.stopPropagation(), g.preventDefault(), c.move($));
+        }
+      }
+    });
+    a = _e(
+      a,
+      (g) => /* @__PURE__ */ se.jsx(Zt, { value: e, children: g }),
+      [e]
+    );
+    const b = Jt(v({ store: e }, a)), A = e.useState("mounted"), P = At(A, a.hidden, u), S = P ? y(v({}, a.style), { display: "none" }) : a.style;
+    a = y(v({
+      id: w,
+      "aria-labelledby": b,
+      hidden: P
+    }, a), {
+      ref: re(w ? e.setContentElement : null, a.ref),
+      style: S,
+      onKeyDown: M
+    });
+    const T = !!e.combobox;
+    return s = s ?? !T, s && (a = v({
+      role: "menu",
+      "aria-orientation": E
+    }, a)), a = Ot(v({ store: e, composite: s }, a)), a = de(v({ store: e, typeahead: !T }, a)), a;
+  }
+);
+k(function(t) {
+  const r = Ne(t);
+  return F(Yt, r);
+});
+var Qt = "div", Xt = D(function(t) {
+  var r = t, {
+    store: e,
+    modal: u = !1,
+    portal: s = !!u,
+    hideOnEscape: a = !0,
+    autoFocusOnShow: o = !0,
+    hideOnHoverOutside: l,
+    alwaysVisible: c
+  } = r, i = O(r, [
+    "store",
+    "modal",
+    "portal",
+    "hideOnEscape",
+    "autoFocusOnShow",
+    "hideOnHoverOutside",
+    "alwaysVisible"
+  ]);
+  const w = oe();
+  e = e || w, K(
+    e,
+    process.env.NODE_ENV !== "production" && "Menu must receive a `store` prop or be wrapped in a MenuProvider component."
+  );
+  const m = le(null), d = e.parent, E = e.menubar, p = !!d, f = !!E && !p;
+  i = y(v({}, i), {
+    ref: re(m, i.ref)
+  });
+  const M = Ne(v({
+    store: e,
+    alwaysVisible: c
+  }, i)), { "aria-labelledby": b } = M;
+  i = O(M, ["aria-labelledby"]);
+  const [P, S] = we(), T = e.useState("autoFocusOnShow"), g = e.useState("initialFocus"), z = e.useState("baseElement"), _ = e.useState("renderedItems");
+  Me(() => {
+    let H = !1;
+    return S((x) => {
+      var ee, pe, me;
+      if (H || !T) return;
+      if ((ee = x == null ? void 0 : x.current) != null && ee.isConnected) return x;
+      const te = Re();
+      switch (g) {
+        case "first":
+          te.current = ((pe = _.find((q) => !q.disabled && q.element)) == null ? void 0 : pe.element) || null;
+          break;
+        case "last":
+          te.current = ((me = [..._].reverse().find((q) => !q.disabled && q.element)) == null ? void 0 : me.element) || null;
+          break;
+        default:
+          te.current = z;
+      }
+      return te;
+    }), () => {
+      H = !0;
+    };
+  }, [e, T, g, _, z]);
+  const $ = p ? !1 : u, h = !!o, I = !!P || !!i.initialFocus || !!$, j = R(
+    e.combobox || e,
+    "contentElement"
+  ), B = R(
+    (d == null ? void 0 : d.combobox) || d,
+    "contentElement"
+  ), X = Be(() => {
+    if (!B || !j) return;
+    const H = j.getAttribute("role"), x = B.getAttribute("role");
+    if (!((x === "menu" || x === "menubar") && H === "menu"))
+      return B;
+  }, [j, B]);
+  return X !== void 0 && (i = v({
+    preserveTabOrderAnchor: X
+  }, i)), i = Ye(y(v({
+    store: e,
+    alwaysVisible: c,
+    initialFocus: P,
+    autoFocusOnShow: h ? I && o : T || !!$
+  }, i), {
+    hideOnEscape(H) {
+      return lt(a, H) ? !1 : (e == null || e.hideAll(), !0);
+    },
+    hideOnHoverOutside(H) {
+      const x = e == null ? void 0 : e.getState().disclosureElement;
+      return (typeof l == "function" ? l(H) : l ?? (p ? !0 : f ? x ? !Z(x) : !0 : !1)) ? H.defaultPrevented || !p || !x || (ct(x, "mouseout", H), !Z(x)) ? !0 : (requestAnimationFrame(() => {
+        Z(x) || e == null || e.hide();
+      }), !1) : !1;
+    },
+    modal: $,
+    portal: s,
+    backdrop: p ? !1 : i.backdrop
+  })), i = v({
+    "aria-labelledby": b
+  }, i), i;
+}), en = _t(
+  k(function(t) {
+    const r = Xt(t);
+    return F(Qt, r);
+  }),
+  oe
+), tn = "div", nn = D(
+  function(t) {
+    var r = t, { store: e } = r, u = O(r, ["store"]);
+    const s = fe();
+    return e = e || s, bt(v({ store: e }, u));
+  }
+), rn = k(function(t) {
+  const r = nn(t);
+  return F(tn, r);
+}), on = "button";
+function un(n, t) {
+  return {
+    ArrowDown: t === "bottom" || t === "top" ? "first" : !1,
+    ArrowUp: t === "bottom" || t === "top" ? "last" : !1,
+    ArrowRight: t === "right" ? "first" : !1,
+    ArrowLeft: t === "left" ? "first" : !1
+  }[n.key];
+}
+function he(n, t) {
+  return !!(n != null && n.some((r) => !r.element || r.element === t ? !1 : r.element.getAttribute("aria-expanded") === "true"));
+}
+var an = D(
+  function(t) {
+    var r = t, {
+      store: e,
+      focusable: u,
+      accessibleWhenDisabled: s,
+      showOnHover: a
+    } = r, o = O(r, [
+      "store",
+      "focusable",
+      "accessibleWhenDisabled",
+      "showOnHover"
+    ]);
+    const l = oe();
+    e = e || l, K(
+      e,
+      process.env.NODE_ENV !== "production" && "MenuButton must receive a `store` prop or be wrapped in a MenuProvider component."
+    );
+    const c = le(null), i = e.parent, w = e.menubar, m = !!i, d = !!w && !m, E = dt(o), p = () => {
+      const h = c.current;
+      h && (e == null || e.setDisclosureElement(h), e == null || e.setAnchorElement(h), e == null || e.show());
+    }, f = o.onFocus, M = V((h) => {
+      if (f == null || f(h), E || h.defaultPrevented || (e == null || e.setAutoFocusOnShow(!1), e == null || e.setActiveId(null), !w) || !d) return;
+      const { items: I } = w.getState();
+      he(I, h.currentTarget) && p();
+    }), b = R(
+      e,
+      (h) => h.placement.split("-")[0]
+    ), A = o.onKeyDown, P = V((h) => {
+      if (A == null || A(h), E || h.defaultPrevented) return;
+      const I = un(h, b);
+      I && (h.preventDefault(), p(), e == null || e.setAutoFocusOnShow(!0), e == null || e.setInitialFocus(I));
+    }), S = o.onClick, T = V((h) => {
+      if (S == null || S(h), h.defaultPrevented || !e) return;
+      const I = !h.detail, { open: j } = e.getState();
+      (!j || I) && ((!m || I) && e.setAutoFocusOnShow(!0), e.setInitialFocus(I ? "first" : "container")), m && p();
+    });
+    o = _e(
+      o,
+      (h) => /* @__PURE__ */ se.jsx(Wt, { value: e, children: h }),
+      [e]
+    ), m && (o = y(v({}, o), {
+      render: /* @__PURE__ */ se.jsx(It.div, { render: o.render })
+    }));
+    const g = Ae(o.id), z = R(
+      (i == null ? void 0 : i.combobox) || i,
+      "contentElement"
+    ), _ = m || d ? Ie(z, "menuitem") : void 0, $ = e.useState("contentElement");
+    return o = y(v({
+      id: g,
+      role: _,
+      "aria-haspopup": ft($, "menu")
+    }, o), {
+      ref: re(c, o.ref),
+      onFocus: M,
+      onKeyDown: P,
+      onClick: T
+    }), o = Je(y(v({
+      store: e,
+      focusable: u,
+      accessibleWhenDisabled: s
+    }, o), {
+      showOnHover: (h) => {
+        if (!(() => {
+          if (typeof a == "function") return a(h);
+          if (a != null) return a;
+          if (m) return !0;
+          if (!w) return !1;
+          const { items: X } = w.getState();
+          return d && he(X);
+        })()) return !1;
+        const B = d ? w : i;
+        return B && B.setActiveId(h.currentTarget.id), !0;
+      }
+    })), o = vt(v({
+      store: e,
+      toggleOnClick: !m,
+      focusable: u,
+      accessibleWhenDisabled: s
+    }, o)), o = de(v({
+      store: e,
+      typeahead: d
+    }, o)), o;
+  }
+), sn = k(function(t) {
+  const r = an(t);
+  return F(on, r);
+}), ln = "div";
+function cn(n, t, r) {
+  var e;
+  if (!n) return !1;
+  if (Z(n)) return !0;
+  const u = t == null ? void 0 : t.find((l) => {
+    var c;
+    return l.element === r ? !1 : ((c = l.element) == null ? void 0 : c.getAttribute("aria-expanded")) === "true";
+  }), s = (e = u == null ? void 0 : u.element) == null ? void 0 : e.getAttribute("aria-controls");
+  if (!s) return !1;
+  const o = Pe(n).getElementById(s);
+  return o ? Z(o) ? !0 : !!o.querySelector("[role=menuitem][aria-expanded=true]") : !1;
+}
+var dn = D(
+  function(t) {
+    var r = t, {
+      store: e,
+      hideOnClick: u = !0,
+      preventScrollOnKeyDown: s = !0,
+      focusOnHover: a,
+      blurOnHoverEnd: o
+    } = r, l = O(r, [
+      "store",
+      "hideOnClick",
+      "preventScrollOnKeyDown",
+      "focusOnHover",
+      "blurOnHoverEnd"
+    ]);
+    const c = jt(!0), i = zt();
+    e = e || c || i, K(
+      e,
+      process.env.NODE_ENV !== "production" && "MenuItem must be wrapped in a MenuList, Menu or Menubar component"
+    );
+    const w = l.onClick, m = ae(u), d = "hideAll" in e ? e.hideAll : void 0, E = !!d, p = V((b) => {
+      w == null || w(b), !(b.defaultPrevented || pt(b) || mt(b) || !d || b.currentTarget.getAttribute("aria-haspopup") === "menu") && m(b) && d();
+    }), f = R(
+      e,
+      (b) => "contentElement" in b ? b.contentElement : null
+    ), M = Ie(f, "menuitem");
+    return l = y(v({
+      role: M
+    }, l), {
+      onClick: p
+    }), l = We(v({
+      store: e,
+      preventScrollOnKeyDown: s
+    }, l)), l = He(y(v({
+      store: e
+    }, l), {
+      focusOnHover(b) {
+        const A = () => typeof a == "function" ? a(b) : a ?? !0;
+        if (!e || !A()) return !1;
+        const { baseElement: P, items: S } = e.getState();
+        return E ? (b.currentTarget.hasAttribute("aria-expanded") && b.currentTarget.focus(), !0) : cn(P, S, b.currentTarget) ? (b.currentTarget.focus(), !0) : !1;
+      },
+      blurOnHoverEnd(b) {
+        return typeof o == "function" ? o(b) : o ?? E;
+      }
+    })), l;
+  }
+), fn = ye(
+  k(function(t) {
+    const r = dn(t);
+    return F(ln, r);
+  })
+), pn = "hr", mn = D(
+  function(t) {
+    var r = t, { store: e } = r, u = O(r, ["store"]);
+    const s = fe();
+    return e = e || s, u = ke(v({ store: e }, u)), u;
+  }
+), bn = k(function(t) {
+  const r = mn(t);
+  return F(pn, r);
+});
+const vn = Y.divBox`
+  display: flex;
+  z-index: 2;
+  color: ${U("defaultCards.backgroundColor")};
+  stroke-width: 0 !important;
+
+  #stroke {
+    color: ${U("defaultCards.borderColor")};
+  }
+`, hn = Y.svgBox(
+  ({ $transform: n }) => Ke`
+    transform: ${n};
+  `
+), gn = {
+  top: "rotateZ(180deg)",
+  right: "rotateZ(-90deg)",
+  bottom: "rotateZ(360deg)",
+  left: "rotateZ(90deg)"
+}, $e = J(({ store: n }, t) => {
+  const r = n == null ? void 0 : n.useState("currentPlacement"), [e] = r.split("-");
+  return /* @__PURE__ */ C.createElement(rn, { ref: t, render: /* @__PURE__ */ C.createElement(vn, null) }, /* @__PURE__ */ C.createElement(
+    hn,
+    {
+      $transform: gn[e],
+      h: 30,
+      viewBox: "0 0 30 30",
+      w: 30,
+      xmlns: "http://www.w3.org/2000/svg"
+    },
+    /* @__PURE__ */ C.createElement("path", { d: "M7 30L15 22L23 30H7Z", fill: "currentColor", fillRule: "nonzero", id: "stroke" }),
+    /* @__PURE__ */ C.createElement("path", { d: "M8 30L15 23L22 30H8Z", fill: "currentColor", fillRule: "nonzero" })
+  ));
+});
+$e.displayName = "Arrow";
+const wn = Y.button`
+  ${U("dropdownMenu.item")};
+  display: flex;
+  align-items: center;
+  width: 100%;
+  border: 0;
+  appearance: none;
+  cursor: pointer;
+  transition: medium;
+  text-decoration: none;
+  padding: md;
+
+  &:focus {
+    outline: none !important; /* important for firefox */
+  }
+
+  ${Se};
+`, Le = J(({ as: n, ...t }, r) => /* @__PURE__ */ C.createElement(fn, { ref: r, type: "button", ...t, render: /* @__PURE__ */ C.createElement(wn, { as: n }) }));
+Le.displayName = "Item";
+const Mn = Y.hr`
+  ${U("dropdownMenu.separator")};
+  border: 0;
+  height: 1px;
+  margin: 0;
+`, Sn = J((n, t) => /* @__PURE__ */ C.createElement(bn, { ref: t, render: /* @__PURE__ */ C.createElement(Mn, null), ...n })), En = Y(Ct)`
+  ${U("cards.default")};
+  ${U("dropdownMenu.inner")};
+  z-index: 1;
+  opacity: 0;
+  transition: opacity 150ms ease-in-out;
+  ${Se};
+
+  &[data-enter] {
+    opacity: 1;
+  }
+`, xn = J(
+  ({ children: n, dataTestId: t, gutter: r = "xs", innerProps: e = {}, store: u, ...s }, a) => {
+    const o = ze(), l = u.useState("arrowElement");
+    let c = r;
+    return typeof c == "string" && (c = parseInt(o.toPx(parseFloat(o.space[r])), 10) || 0), l && (c = 0), /* @__PURE__ */ C.createElement(
+      en,
+      {
+        "aria-label": "dropdown-menu",
+        "data-testid": t,
+        gutter: c,
+        ref: a,
+        render: /* @__PURE__ */ C.createElement(En, { ...e }),
+        store: u,
+        tabIndex: 0,
+        ...s
+      },
+      n
+    );
+  }
+);
+function Ln(n = {}) {
+  return Gt({
+    animated: !0,
+    ...n
+  });
+}
+const Cn = J(({ as: n, store: t, ...r }, e) => /* @__PURE__ */ C.createElement(
+  sn,
+  {
+    ref: e,
+    render: n ? (u) => /* @__PURE__ */ C.createElement(n, { ...u }) : void 0,
+    store: t,
+    ...r
+  }
+)), Vn = Object.assign(xn, {
+  Trigger: Cn,
+  Item: Le,
+  Separator: Sn,
+  Arrow: $e
+});
+export {
+  Vn as DropdownMenu,
+  Ln as useDropdownMenu
+};