dgz-ui
Version:
Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript
687 lines (681 loc) • 22.7 kB
JavaScript
import * as u from "react";
import { useState as pe } from "react";
import { u as ge } from "./index-DLcqcWxM.js";
import { P as oe } from "./index-l3y0hILL.js";
import { u as z } from "./index-DwYXX2sM.js";
import { j as ce } from "./jsx-runtime-DS1N_tNq.js";
import ye from "react-dom";
import { u as be } from "./index-ljY4mZHt.js";
var _ = "focusScope.autoFocusOnMount", j = "focusScope.autoFocusOnUnmount", Z = { bubbles: !1, cancelable: !0 }, Ee = "FocusScope", Se = u.forwardRef((e, t) => {
const {
loop: r = !1,
trapped: n = !1,
onMountAutoFocus: c,
onUnmountAutoFocus: i,
...l
} = e, [a, S] = u.useState(null), b = z(c), g = z(i), f = u.useRef(null), v = ge(t, (o) => S(o)), h = u.useRef({
paused: !1,
pause() {
this.paused = !0;
},
resume() {
this.paused = !1;
}
}).current;
u.useEffect(() => {
if (n) {
let o = function(p) {
if (h.paused || !a) return;
const y = p.target;
a.contains(y) ? f.current = y : A(f.current, { select: !0 });
}, s = function(p) {
if (h.paused || !a) return;
const y = p.relatedTarget;
y !== null && (a.contains(y) || A(f.current, { select: !0 }));
}, d = function(p) {
if (document.activeElement === document.body)
for (const E of p)
E.removedNodes.length > 0 && A(a);
};
document.addEventListener("focusin", o), document.addEventListener("focusout", s);
const m = new MutationObserver(d);
return a && m.observe(a, { childList: !0, subtree: !0 }), () => {
document.removeEventListener("focusin", o), document.removeEventListener("focusout", s), m.disconnect();
};
}
}, [n, a, h.paused]), u.useEffect(() => {
if (a) {
Q.add(h);
const o = document.activeElement;
if (!a.contains(o)) {
const d = new CustomEvent(_, Z);
a.addEventListener(_, b), a.dispatchEvent(d), d.defaultPrevented || (we(ke(ue(a)), { select: !0 }), document.activeElement === o && A(a));
}
return () => {
a.removeEventListener(_, b), setTimeout(() => {
const d = new CustomEvent(j, Z);
a.addEventListener(j, g), a.dispatchEvent(d), d.defaultPrevented || A(o ?? document.body, { select: !0 }), a.removeEventListener(j, g), Q.remove(h);
}, 0);
};
}
}, [a, b, g, h]);
const w = u.useCallback(
(o) => {
if (!r && !n || h.paused) return;
const s = o.key === "Tab" && !o.altKey && !o.ctrlKey && !o.metaKey, d = document.activeElement;
if (s && d) {
const m = o.currentTarget, [p, y] = Ce(m);
p && y ? !o.shiftKey && d === y ? (o.preventDefault(), r && A(p, { select: !0 })) : o.shiftKey && d === p && (o.preventDefault(), r && A(y, { select: !0 })) : d === m && o.preventDefault();
}
},
[r, n, h.paused]
);
return /* @__PURE__ */ ce.jsx(oe.div, { tabIndex: -1, ...l, ref: v, onKeyDown: w });
});
Se.displayName = Ee;
function we(e, { select: t = !1 } = {}) {
const r = document.activeElement;
for (const n of e)
if (A(n, { select: t }), document.activeElement !== r) return;
}
function Ce(e) {
const t = ue(e), r = q(t, e), n = q(t.reverse(), e);
return [r, n];
}
function ue(e) {
const t = [], r = document.createTreeWalker(e, NodeFilter.SHOW_ELEMENT, {
acceptNode: (n) => {
const c = n.tagName === "INPUT" && n.type === "hidden";
return n.disabled || n.hidden || c ? NodeFilter.FILTER_SKIP : n.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
}
});
for (; r.nextNode(); ) t.push(r.currentNode);
return t;
}
function q(e, t) {
for (const r of e)
if (!Re(r, { upTo: t })) return r;
}
function Re(e, { upTo: t }) {
if (getComputedStyle(e).visibility === "hidden") return !0;
for (; e; ) {
if (t !== void 0 && e === t) return !1;
if (getComputedStyle(e).display === "none") return !0;
e = e.parentElement;
}
return !1;
}
function Ae(e) {
return e instanceof HTMLInputElement && "select" in e;
}
function A(e, { select: t = !1 } = {}) {
if (e && e.focus) {
const r = document.activeElement;
e.focus({ preventScroll: !0 }), e !== r && Ae(e) && t && e.select();
}
}
var Q = Te();
function Te() {
let e = [];
return {
add(t) {
const r = e[0];
t !== r && (r == null || r.pause()), e = $(e, t), e.unshift(t);
},
remove(t) {
var r;
e = $(e, t), (r = e[0]) == null || r.resume();
}
};
}
function $(e, t) {
const r = [...e], n = r.indexOf(t);
return n !== -1 && r.splice(n, 1), r;
}
function ke(e) {
return e.filter((t) => t.tagName !== "A");
}
var Pe = "Portal", Me = u.forwardRef((e, t) => {
var a;
const { container: r, ...n } = e, [c, i] = u.useState(!1);
be(() => i(!0), []);
const l = r || c && ((a = globalThis == null ? void 0 : globalThis.document) == null ? void 0 : a.body);
return l ? ye.createPortal(/* @__PURE__ */ ce.jsx(oe.div, { ...n, ref: t }), l) : null;
});
Me.displayName = Pe;
var U = 0;
function Ct() {
u.useEffect(() => {
const e = document.querySelectorAll("[data-radix-focus-guard]");
return document.body.insertAdjacentElement("afterbegin", e[0] ?? J()), document.body.insertAdjacentElement("beforeend", e[1] ?? J()), U++, () => {
U === 1 && document.querySelectorAll("[data-radix-focus-guard]").forEach((t) => t.remove()), U--;
};
}, []);
}
function J() {
const e = document.createElement("span");
return e.setAttribute("data-radix-focus-guard", ""), e.tabIndex = 0, e.style.outline = "none", e.style.opacity = "0", e.style.position = "fixed", e.style.pointerEvents = "none", e;
}
var C = function() {
return C = Object.assign || function(t) {
for (var r, n = 1, c = arguments.length; n < c; n++) {
r = arguments[n];
for (var i in r) Object.prototype.hasOwnProperty.call(r, i) && (t[i] = r[i]);
}
return t;
}, C.apply(this, arguments);
};
function ie(e, t) {
var r = {};
for (var n in e) Object.prototype.hasOwnProperty.call(e, n) && t.indexOf(n) < 0 && (r[n] = e[n]);
if (e != null && typeof Object.getOwnPropertySymbols == "function")
for (var c = 0, n = Object.getOwnPropertySymbols(e); c < n.length; c++)
t.indexOf(n[c]) < 0 && Object.prototype.propertyIsEnumerable.call(e, n[c]) && (r[n[c]] = e[n[c]]);
return r;
}
function Ne(e, t, r) {
if (r || arguments.length === 2) for (var n = 0, c = t.length, i; n < c; n++)
(i || !(n in t)) && (i || (i = Array.prototype.slice.call(t, 0, n)), i[n] = t[n]);
return e.concat(i || Array.prototype.slice.call(t));
}
var W = "right-scroll-bar-position", B = "width-before-scroll-bar", Oe = "with-scroll-bars-hidden", Fe = "--removed-body-scroll-bar-size";
function K(e, t) {
return typeof e == "function" ? e(t) : e && (e.current = t), e;
}
function Le(e, t) {
var r = pe(function() {
return {
// value
value: e,
// last callback
callback: t,
// "memoized" public interface
facade: {
get current() {
return r.value;
},
set current(n) {
var c = r.value;
c !== n && (r.value = n, r.callback(n, c));
}
}
};
})[0];
return r.callback = t, r.facade;
}
var xe = typeof window < "u" ? u.useLayoutEffect : u.useEffect, ee = /* @__PURE__ */ new WeakMap();
function Ie(e, t) {
var r = Le(null, function(n) {
return e.forEach(function(c) {
return K(c, n);
});
});
return xe(function() {
var n = ee.get(r);
if (n) {
var c = new Set(n), i = new Set(e), l = r.current;
c.forEach(function(a) {
i.has(a) || K(a, null);
}), i.forEach(function(a) {
c.has(a) || K(a, l);
});
}
ee.set(r, e);
}, [e]), r;
}
function We(e) {
return e;
}
function Be(e, t) {
t === void 0 && (t = We);
var r = [], n = !1, c = {
read: function() {
if (n)
throw new Error("Sidecar: could not `read` from an `assigned` medium. `read` could be used only with `useMedium`.");
return r.length ? r[r.length - 1] : e;
},
useMedium: function(i) {
var l = t(i, n);
return r.push(l), function() {
r = r.filter(function(a) {
return a !== l;
});
};
},
assignSyncMedium: function(i) {
for (n = !0; r.length; ) {
var l = r;
r = [], l.forEach(i);
}
r = {
push: function(a) {
return i(a);
},
filter: function() {
return r;
}
};
},
assignMedium: function(i) {
n = !0;
var l = [];
if (r.length) {
var a = r;
r = [], a.forEach(i), l = r;
}
var S = function() {
var g = l;
l = [], g.forEach(i);
}, b = function() {
return Promise.resolve().then(S);
};
b(), r = {
push: function(g) {
l.push(g), b();
},
filter: function(g) {
return l = l.filter(g), r;
}
};
}
};
return c;
}
function De(e) {
e === void 0 && (e = {});
var t = Be(null);
return t.options = C({ async: !0, ssr: !1 }, e), t;
}
var le = function(e) {
var t = e.sideCar, r = ie(e, ["sideCar"]);
if (!t)
throw new Error("Sidecar: please provide `sideCar` property to import the right car");
var n = t.read();
if (!n)
throw new Error("Sidecar medium not found");
return u.createElement(n, C({}, r));
};
le.isSideCarExport = !0;
function _e(e, t) {
return e.useMedium(t), le;
}
var se = De(), H = function() {
}, D = u.forwardRef(function(e, t) {
var r = u.useRef(null), n = u.useState({
onScrollCapture: H,
onWheelCapture: H,
onTouchMoveCapture: H
}), c = n[0], i = n[1], l = e.forwardProps, a = e.children, S = e.className, b = e.removeScrollBar, g = e.enabled, f = e.shards, v = e.sideCar, h = e.noRelative, w = e.noIsolation, o = e.inert, s = e.allowPinchZoom, d = e.as, m = d === void 0 ? "div" : d, p = e.gapMode, y = ie(e, ["forwardProps", "children", "className", "removeScrollBar", "enabled", "shards", "sideCar", "noRelative", "noIsolation", "inert", "allowPinchZoom", "as", "gapMode"]), E = v, T = Ie([r, t]), R = C(C({}, y), c);
return u.createElement(
u.Fragment,
null,
g && u.createElement(E, { sideCar: se, removeScrollBar: b, shards: f, noRelative: h, noIsolation: w, inert: o, setCallbacks: i, allowPinchZoom: !!s, lockRef: r, gapMode: p }),
l ? u.cloneElement(u.Children.only(a), C(C({}, R), { ref: T })) : u.createElement(m, C({}, R, { className: S, ref: T }), a)
);
});
D.defaultProps = {
enabled: !0,
removeScrollBar: !0,
inert: !1
};
D.classNames = {
fullWidth: B,
zeroRight: W
};
var je = function() {
if (typeof __webpack_nonce__ < "u")
return __webpack_nonce__;
};
function Ue() {
if (!document)
return null;
var e = document.createElement("style");
e.type = "text/css";
var t = je();
return t && e.setAttribute("nonce", t), e;
}
function Ke(e, t) {
e.styleSheet ? e.styleSheet.cssText = t : e.appendChild(document.createTextNode(t));
}
function He(e) {
var t = document.head || document.getElementsByTagName("head")[0];
t.appendChild(e);
}
var Ve = function() {
var e = 0, t = null;
return {
add: function(r) {
e == 0 && (t = Ue()) && (Ke(t, r), He(t)), e++;
},
remove: function() {
e--, !e && t && (t.parentNode && t.parentNode.removeChild(t), t = null);
}
};
}, Xe = function() {
var e = Ve();
return function(t, r) {
u.useEffect(function() {
return e.add(t), function() {
e.remove();
};
}, [t && r]);
};
}, fe = function() {
var e = Xe(), t = function(r) {
var n = r.styles, c = r.dynamic;
return e(n, c), null;
};
return t;
}, Ye = {
left: 0,
top: 0,
right: 0,
gap: 0
}, V = function(e) {
return parseInt(e || "", 10) || 0;
}, Ge = function(e) {
var t = window.getComputedStyle(document.body), r = t[e === "padding" ? "paddingLeft" : "marginLeft"], n = t[e === "padding" ? "paddingTop" : "marginTop"], c = t[e === "padding" ? "paddingRight" : "marginRight"];
return [V(r), V(n), V(c)];
}, ze = function(e) {
if (e === void 0 && (e = "margin"), typeof window > "u")
return Ye;
var t = Ge(e), r = document.documentElement.clientWidth, n = window.innerWidth;
return {
left: t[0],
top: t[1],
right: t[2],
gap: Math.max(0, n - r + t[2] - t[0])
};
}, Ze = fe(), N = "data-scroll-locked", qe = function(e, t, r, n) {
var c = e.left, i = e.top, l = e.right, a = e.gap;
return r === void 0 && (r = "margin"), `
.`.concat(Oe, ` {
overflow: hidden `).concat(n, `;
padding-right: `).concat(a, "px ").concat(n, `;
}
body[`).concat(N, `] {
overflow: hidden `).concat(n, `;
overscroll-behavior: contain;
`).concat([
t && "position: relative ".concat(n, ";"),
r === "margin" && `
padding-left: `.concat(c, `px;
padding-top: `).concat(i, `px;
padding-right: `).concat(l, `px;
margin-left:0;
margin-top:0;
margin-right: `).concat(a, "px ").concat(n, `;
`),
r === "padding" && "padding-right: ".concat(a, "px ").concat(n, ";")
].filter(Boolean).join(""), `
}
.`).concat(W, ` {
right: `).concat(a, "px ").concat(n, `;
}
.`).concat(B, ` {
margin-right: `).concat(a, "px ").concat(n, `;
}
.`).concat(W, " .").concat(W, ` {
right: 0 `).concat(n, `;
}
.`).concat(B, " .").concat(B, ` {
margin-right: 0 `).concat(n, `;
}
body[`).concat(N, `] {
`).concat(Fe, ": ").concat(a, `px;
}
`);
}, te = function() {
var e = parseInt(document.body.getAttribute(N) || "0", 10);
return isFinite(e) ? e : 0;
}, Qe = function() {
u.useEffect(function() {
return document.body.setAttribute(N, (te() + 1).toString()), function() {
var e = te() - 1;
e <= 0 ? document.body.removeAttribute(N) : document.body.setAttribute(N, e.toString());
};
}, []);
}, $e = function(e) {
var t = e.noRelative, r = e.noImportant, n = e.gapMode, c = n === void 0 ? "margin" : n;
Qe();
var i = u.useMemo(function() {
return ze(c);
}, [c]);
return u.createElement(Ze, { styles: qe(i, !t, c, r ? "" : "!important") });
}, Y = !1;
if (typeof window < "u")
try {
var F = Object.defineProperty({}, "passive", {
get: function() {
return Y = !0, !0;
}
});
window.addEventListener("test", F, F), window.removeEventListener("test", F, F);
} catch {
Y = !1;
}
var k = Y ? { passive: !1 } : !1, Je = function(e) {
return e.tagName === "TEXTAREA";
}, de = function(e, t) {
if (!(e instanceof Element))
return !1;
var r = window.getComputedStyle(e);
return (
// not-not-scrollable
r[t] !== "hidden" && // contains scroll inside self
!(r.overflowY === r.overflowX && !Je(e) && r[t] === "visible")
);
}, et = function(e) {
return de(e, "overflowY");
}, tt = function(e) {
return de(e, "overflowX");
}, re = function(e, t) {
var r = t.ownerDocument, n = t;
do {
typeof ShadowRoot < "u" && n instanceof ShadowRoot && (n = n.host);
var c = ve(e, n);
if (c) {
var i = he(e, n), l = i[1], a = i[2];
if (l > a)
return !0;
}
n = n.parentNode;
} while (n && n !== r.body);
return !1;
}, rt = function(e) {
var t = e.scrollTop, r = e.scrollHeight, n = e.clientHeight;
return [
t,
r,
n
];
}, nt = function(e) {
var t = e.scrollLeft, r = e.scrollWidth, n = e.clientWidth;
return [
t,
r,
n
];
}, ve = function(e, t) {
return e === "v" ? et(t) : tt(t);
}, he = function(e, t) {
return e === "v" ? rt(t) : nt(t);
}, at = function(e, t) {
return e === "h" && t === "rtl" ? -1 : 1;
}, ot = function(e, t, r, n, c) {
var i = at(e, window.getComputedStyle(t).direction), l = i * n, a = r.target, S = t.contains(a), b = !1, g = l > 0, f = 0, v = 0;
do {
if (!a)
break;
var h = he(e, a), w = h[0], o = h[1], s = h[2], d = o - s - i * w;
(w || d) && ve(e, a) && (f += d, v += w);
var m = a.parentNode;
a = m && m.nodeType === Node.DOCUMENT_FRAGMENT_NODE ? m.host : m;
} while (
// portaled content
!S && a !== document.body || // self content
S && (t.contains(a) || t === a)
);
return (g && Math.abs(f) < 1 || !g && Math.abs(v) < 1) && (b = !0), b;
}, L = function(e) {
return "changedTouches" in e ? [e.changedTouches[0].clientX, e.changedTouches[0].clientY] : [0, 0];
}, ne = function(e) {
return [e.deltaX, e.deltaY];
}, ae = function(e) {
return e && "current" in e ? e.current : e;
}, ct = function(e, t) {
return e[0] === t[0] && e[1] === t[1];
}, ut = function(e) {
return `
.block-interactivity-`.concat(e, ` {pointer-events: none;}
.allow-interactivity-`).concat(e, ` {pointer-events: all;}
`);
}, it = 0, P = [];
function lt(e) {
var t = u.useRef([]), r = u.useRef([0, 0]), n = u.useRef(), c = u.useState(it++)[0], i = u.useState(fe)[0], l = u.useRef(e);
u.useEffect(function() {
l.current = e;
}, [e]), u.useEffect(function() {
if (e.inert) {
document.body.classList.add("block-interactivity-".concat(c));
var o = Ne([e.lockRef.current], (e.shards || []).map(ae), !0).filter(Boolean);
return o.forEach(function(s) {
return s.classList.add("allow-interactivity-".concat(c));
}), function() {
document.body.classList.remove("block-interactivity-".concat(c)), o.forEach(function(s) {
return s.classList.remove("allow-interactivity-".concat(c));
});
};
}
}, [e.inert, e.lockRef.current, e.shards]);
var a = u.useCallback(function(o, s) {
if ("touches" in o && o.touches.length === 2 || o.type === "wheel" && o.ctrlKey)
return !l.current.allowPinchZoom;
var d = L(o), m = r.current, p = "deltaX" in o ? o.deltaX : m[0] - d[0], y = "deltaY" in o ? o.deltaY : m[1] - d[1], E, T = o.target, R = Math.abs(p) > Math.abs(y) ? "h" : "v";
if ("touches" in o && R === "h" && T.type === "range")
return !1;
var O = re(R, T);
if (!O)
return !0;
if (O ? E = R : (E = R === "v" ? "h" : "v", O = re(R, T)), !O)
return !1;
if (!n.current && "changedTouches" in o && (p || y) && (n.current = E), !E)
return !0;
var G = n.current || E;
return ot(G, s, o, G === "h" ? p : y);
}, []), S = u.useCallback(function(o) {
var s = o;
if (!(!P.length || P[P.length - 1] !== i)) {
var d = "deltaY" in s ? ne(s) : L(s), m = t.current.filter(function(E) {
return E.name === s.type && (E.target === s.target || s.target === E.shadowParent) && ct(E.delta, d);
})[0];
if (m && m.should) {
s.cancelable && s.preventDefault();
return;
}
if (!m) {
var p = (l.current.shards || []).map(ae).filter(Boolean).filter(function(E) {
return E.contains(s.target);
}), y = p.length > 0 ? a(s, p[0]) : !l.current.noIsolation;
y && s.cancelable && s.preventDefault();
}
}
}, []), b = u.useCallback(function(o, s, d, m) {
var p = { name: o, delta: s, target: d, should: m, shadowParent: st(d) };
t.current.push(p), setTimeout(function() {
t.current = t.current.filter(function(y) {
return y !== p;
});
}, 1);
}, []), g = u.useCallback(function(o) {
r.current = L(o), n.current = void 0;
}, []), f = u.useCallback(function(o) {
b(o.type, ne(o), o.target, a(o, e.lockRef.current));
}, []), v = u.useCallback(function(o) {
b(o.type, L(o), o.target, a(o, e.lockRef.current));
}, []);
u.useEffect(function() {
return P.push(i), e.setCallbacks({
onScrollCapture: f,
onWheelCapture: f,
onTouchMoveCapture: v
}), document.addEventListener("wheel", S, k), document.addEventListener("touchmove", S, k), document.addEventListener("touchstart", g, k), function() {
P = P.filter(function(o) {
return o !== i;
}), document.removeEventListener("wheel", S, k), document.removeEventListener("touchmove", S, k), document.removeEventListener("touchstart", g, k);
};
}, []);
var h = e.removeScrollBar, w = e.inert;
return u.createElement(
u.Fragment,
null,
w ? u.createElement(i, { styles: ut(c) }) : null,
h ? u.createElement($e, { noRelative: e.noRelative, gapMode: e.gapMode }) : null
);
}
function st(e) {
for (var t = null; e !== null; )
e instanceof ShadowRoot && (t = e.host, e = e.host), e = e.parentNode;
return t;
}
const ft = _e(se, lt);
var dt = u.forwardRef(function(e, t) {
return u.createElement(D, C({}, e, { ref: t, sideCar: ft }));
});
dt.classNames = D.classNames;
var vt = function(e) {
if (typeof document > "u")
return null;
var t = Array.isArray(e) ? e[0] : e;
return t.ownerDocument.body;
}, M = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), I = {}, X = 0, me = function(e) {
return e && (e.host || me(e.parentNode));
}, ht = function(e, t) {
return t.map(function(r) {
if (e.contains(r))
return r;
var n = me(r);
return n && e.contains(n) ? n : (console.error("aria-hidden", r, "in not contained inside", e, ". Doing nothing"), null);
}).filter(function(r) {
return !!r;
});
}, mt = function(e, t, r, n) {
var c = ht(t, Array.isArray(e) ? e : [e]);
I[r] || (I[r] = /* @__PURE__ */ new WeakMap());
var i = I[r], l = [], a = /* @__PURE__ */ new Set(), S = new Set(c), b = function(f) {
!f || a.has(f) || (a.add(f), b(f.parentNode));
};
c.forEach(b);
var g = function(f) {
!f || S.has(f) || Array.prototype.forEach.call(f.children, function(v) {
if (a.has(v))
g(v);
else
try {
var h = v.getAttribute(n), w = h !== null && h !== "false", o = (M.get(v) || 0) + 1, s = (i.get(v) || 0) + 1;
M.set(v, o), i.set(v, s), l.push(v), o === 1 && w && x.set(v, !0), s === 1 && v.setAttribute(r, "true"), w || v.setAttribute(n, "true");
} catch (d) {
console.error("aria-hidden: cannot operate on ", v, d);
}
});
};
return g(t), a.clear(), X++, function() {
l.forEach(function(f) {
var v = M.get(f) - 1, h = i.get(f) - 1;
M.set(f, v), i.set(f, h), v || (x.has(f) || f.removeAttribute(n), x.delete(f)), h || f.removeAttribute(r);
}), X--, X || (M = /* @__PURE__ */ new WeakMap(), M = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), I = {});
};
}, Rt = function(e, t, r) {
r === void 0 && (r = "data-aria-hidden");
var n = Array.from(Array.isArray(e) ? e : [e]), c = vt(e);
return c ? (n.push.apply(n, Array.from(c.querySelectorAll("[aria-live], script"))), mt(n, c, r, "aria-hidden")) : function() {
return null;
};
};
export {
Se as F,
Me as P,
dt as R,
Rt as h,
Ct as u
};