welcome-ui
Version:
Customizable design system with react • styled-components • styled-system and ariakit.
99 lines (98 loc) • 3.21 kB
JavaScript
"use client";
import { u as E, b as j, P as C } from "./MTZPJQMC-TybFZCho.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-C-kJ1lkr.mjs";
import { useMemo as T, useState as W } from "react";
import { j as p } from "./jsx-runtime-B7I4PJ0H.mjs";
import { u as M } from "./AXB53BZF-XKOjjeWO.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
};