UNPKG

dgz-ui

Version:

Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript

334 lines (333 loc) 9.76 kB
import { jsx as h } from "react/jsx-runtime"; import * as v from "react"; import T from "react"; import { u as H } from "./index-DwYXX2sM.es.js"; import { u as A } from "./index-Dt3MSLsk.es.js"; import "react-dom"; import { c as B } from "./index-DvGm4EwH.es.js"; import { c as U } from "./index-xA4mlFw5.es.js"; import { c as O } from "./utils-CnvKSirc.es.js"; function q(e, t = []) { let n = []; function i(r, f) { const o = v.createContext(f); o.displayName = r + "Context"; const d = n.length; n = [...n, f]; const S = (u) => { var _; const { scope: l, children: s, ...c } = u, p = ((_ = l == null ? void 0 : l[e]) == null ? void 0 : _[d]) || o, m = v.useMemo(() => c, Object.values(c)); return /* @__PURE__ */ h(p.Provider, { value: m, children: s }); }; S.displayName = r + "Provider"; function E(u, l) { var p; const s = ((p = l == null ? void 0 : l[e]) == null ? void 0 : p[d]) || o, c = v.useContext(s); if (c) return c; if (f !== void 0) return f; throw new Error(`\`${u}\` must be used within \`${r}\``); } return [S, E]; } const a = () => { const r = n.map((f) => v.createContext(f)); return function(o) { const d = (o == null ? void 0 : o[e]) || r; return v.useMemo( () => ({ [`__scope${e}`]: { ...o, [e]: d } }), [o, d] ); }; }; return a.scopeName = e, [i, K(a, ...t)]; } function K(...e) { const t = e[0]; if (e.length === 1) return t; const n = () => { const i = e.map((a) => ({ useScope: a(), scopeName: a.scopeName })); return function(r) { const f = i.reduce((o, { useScope: d, scopeName: S }) => { const u = d(r)[`__scope${S}`]; return { ...o, ...u }; }, {}); return v.useMemo(() => ({ [`__scope${t.scopeName}`]: f }), [f]); }; }; return n.scopeName = t.scopeName, n; } var F = [ "a", "button", "div", "form", "h2", "h3", "img", "input", "label", "li", "nav", "ol", "p", "select", "span", "svg", "ul" ], w = F.reduce((e, t) => { const n = B(`Primitive.${t}`), i = v.forwardRef((a, r) => { const { asChild: f, ...o } = a, d = f ? n : t; return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ h(d, { ...o, ref: r }); }); return i.displayName = `Primitive.${t}`, { ...e, [t]: i }; }, {}), y = { exports: {} }, x = {}; /** * @license React * use-sync-external-store-shim.production.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var R; function W() { if (R) return x; R = 1; var e = T; function t(u, l) { return u === l && (u !== 0 || 1 / u === 1 / l) || u !== u && l !== l; } var n = typeof Object.is == "function" ? Object.is : t, i = e.useState, a = e.useEffect, r = e.useLayoutEffect, f = e.useDebugValue; function o(u, l) { var s = l(), c = i({ inst: { value: s, getSnapshot: l } }), p = c[0].inst, m = c[1]; return r( function() { p.value = s, p.getSnapshot = l, d(p) && m({ inst: p }); }, [u, s, l] ), a( function() { return d(p) && m({ inst: p }), u(function() { d(p) && m({ inst: p }); }); }, [u] ), f(s), s; } function d(u) { var l = u.getSnapshot; u = u.value; try { var s = l(); return !n(u, s); } catch { return !0; } } function S(u, l) { return l(); } var E = typeof window > "u" || typeof window.document > "u" || typeof window.document.createElement > "u" ? S : o; return x.useSyncExternalStore = e.useSyncExternalStore !== void 0 ? e.useSyncExternalStore : E, x; } var L = {}; /** * @license React * use-sync-external-store-shim.development.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var b; function Y() { return b || (b = 1, process.env.NODE_ENV !== "production" && (function() { function e(s, c) { return s === c && (s !== 0 || 1 / s === 1 / c) || s !== s && c !== c; } function t(s, c) { E || a.startTransition === void 0 || (E = !0, console.error( "You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release." )); var p = c(); if (!u) { var m = c(); r(p, m) || (console.error( "The result of getSnapshot should be cached to avoid an infinite loop" ), u = !0); } m = f({ inst: { value: p, getSnapshot: c } }); var _ = m[0].inst, g = m[1]; return d( function() { _.value = p, _.getSnapshot = c, n(_) && g({ inst: _ }); }, [s, p, c] ), o( function() { return n(_) && g({ inst: _ }), s(function() { n(_) && g({ inst: _ }); }); }, [s] ), S(p), p; } function n(s) { var c = s.getSnapshot; s = s.value; try { var p = c(); return !r(s, p); } catch { return !0; } } function i(s, c) { return c(); } typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error()); var a = T, r = typeof Object.is == "function" ? Object.is : e, f = a.useState, o = a.useEffect, d = a.useLayoutEffect, S = a.useDebugValue, E = !1, u = !1, l = typeof window > "u" || typeof window.document > "u" || typeof window.document.createElement > "u" ? i : t; L.useSyncExternalStore = a.useSyncExternalStore !== void 0 ? a.useSyncExternalStore : l, typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error()); })()), L; } var N; function J() { return N || (N = 1, process.env.NODE_ENV === "production" ? y.exports = W() : y.exports = Y()), y.exports; } var Q = J(); function X() { return Q.useSyncExternalStore( Z, () => !0, () => !1 ); } function Z() { return () => { }; } var C = "Avatar", [ee] = q(C), [te, $] = ee(C), D = v.forwardRef( (e, t) => { const { __scopeAvatar: n, ...i } = e, [a, r] = v.useState("idle"); return /* @__PURE__ */ h( te, { scope: n, imageLoadingStatus: a, onImageLoadingStatusChange: r, children: /* @__PURE__ */ h(w.span, { ...i, ref: t }) } ); } ); D.displayName = C; var M = "AvatarImage", P = v.forwardRef( (e, t) => { const { __scopeAvatar: n, src: i, onLoadingStatusChange: a = () => { }, ...r } = e, f = $(M, n), o = re(i, r), d = H((S) => { a(S), f.onImageLoadingStatusChange(S); }); return A(() => { o !== "idle" && d(o); }, [o, d]), o === "loaded" ? /* @__PURE__ */ h(w.img, { ...r, ref: t, src: i }) : null; } ); P.displayName = M; var V = "AvatarFallback", k = v.forwardRef( (e, t) => { const { __scopeAvatar: n, delayMs: i, ...a } = e, r = $(V, n), [f, o] = v.useState(i === void 0); return v.useEffect(() => { if (i !== void 0) { const d = window.setTimeout(() => o(!0), i); return () => window.clearTimeout(d); } }, [i]), f && r.imageLoadingStatus !== "loaded" ? /* @__PURE__ */ h(w.span, { ...a, ref: t }) : null; } ); k.displayName = V; function I(e, t) { return e ? t ? (e.src !== t && (e.src = t), e.complete && e.naturalWidth > 0 ? "loaded" : "loading") : "error" : "idle"; } function re(e, { referrerPolicy: t, crossOrigin: n }) { const i = X(), a = v.useRef(null), r = i ? (a.current || (a.current = new window.Image()), a.current) : null, [f, o] = v.useState( () => I(r, e) ); return A(() => { o(I(r, e)); }, [r, e]), A(() => { const d = (u) => () => { o(u); }; if (!r) return; const S = d("loaded"), E = d("error"); return r.addEventListener("load", S), r.addEventListener("error", E), t && (r.referrerPolicy = t), typeof n == "string" && (r.crossOrigin = n), () => { r.removeEventListener("load", S), r.removeEventListener("error", E); }; }, [r, n, t]), f; } var G = D, j = P, z = k; const ne = U( "relative flex shrink-0 overflow-hidden rounded-full", { variants: { size: { /** Small avatar - 32x32px */ sm: "size-8", /** Default avatar - 40x40px */ default: "size-10", /** Medium avatar - 52x52px */ md: "size-13", /** Large avatar - 64x64px */ lg: "size-16", /** Extra large avatar - 80x80px */ xl: "size-20" } }, defaultVariants: { size: "default" } } ), ae = v.forwardRef(({ className: e, size: t, ...n }, i) => /* @__PURE__ */ h( G, { ref: i, className: O(ne({ size: t }), e), ...n } )); ae.displayName = G.displayName; const oe = v.forwardRef(({ className: e, ...t }, n) => /* @__PURE__ */ h( j, { ref: n, className: O("aspect-square size-full", e), ...t } )); oe.displayName = j.displayName; const se = v.forwardRef(({ className: e, ...t }, n) => /* @__PURE__ */ h( z, { ref: n, className: O( "bg-muted flex size-full items-center justify-center rounded-full", e ), ...t } )); se.displayName = z.displayName; export { ae as A, se as a, oe as b, ne as c }; //# sourceMappingURL=avatar-zl4cf4c2.es.js.map