UNPKG

dgz-ui

Version:

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

256 lines (255 loc) 7.68 kB
import { j as y } from "./jsx-runtime-DS1N_tNq.js"; import * as S from "react"; import b from "react"; import { c as q, u as O } from "./index-ljY4mZHt.js"; import { u as B } from "./index-DwYXX2sM.js"; import { P as x } from "./index-l3y0hILL.js"; import { c as K } from "./index-BhbquNdX.js"; import { c as w } from "./utils-B6fNqzRf.js"; var g = { exports: {} }, L = {}; /** * @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 I; function $() { if (I) return L; I = 1; var e = b; function t(o, d) { return o === d && (o !== 0 || 1 / o === 1 / d) || o !== o && d !== d; } var n = typeof Object.is == "function" ? Object.is : t, i = e.useState, s = e.useEffect, r = e.useLayoutEffect, v = e.useDebugValue; function f(o, d) { var a = d(), u = i({ inst: { value: a, getSnapshot: d } }), c = u[0].inst, m = u[1]; return r( function() { c.value = a, c.getSnapshot = d, l(c) && m({ inst: c }); }, [o, a, d] ), s( function() { return l(c) && m({ inst: c }), o(function() { l(c) && m({ inst: c }); }); }, [o] ), v(a), a; } function l(o) { var d = o.getSnapshot; o = o.value; try { var a = d(); return !n(o, a); } catch { return !0; } } function p(o, d) { return d(); } var E = typeof window > "u" || typeof window.document > "u" || typeof window.document.createElement > "u" ? p : f; return L.useSyncExternalStore = e.useSyncExternalStore !== void 0 ? e.useSyncExternalStore : E, L; } var A = {}; /** * @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 N; function F() { return N || (N = 1, process.env.NODE_ENV !== "production" && function() { function e(a, u) { return a === u && (a !== 0 || 1 / a === 1 / u) || a !== a && u !== u; } function t(a, u) { E || s.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 c = u(); if (!o) { var m = u(); r(c, m) || (console.error( "The result of getSnapshot should be cached to avoid an infinite loop" ), o = !0); } m = v({ inst: { value: c, getSnapshot: u } }); var _ = m[0].inst, h = m[1]; return l( function() { _.value = c, _.getSnapshot = u, n(_) && h({ inst: _ }); }, [a, c, u] ), f( function() { return n(_) && h({ inst: _ }), a(function() { n(_) && h({ inst: _ }); }); }, [a] ), p(c), c; } function n(a) { var u = a.getSnapshot; a = a.value; try { var c = u(); return !r(a, c); } catch { return !0; } } function i(a, u) { return u(); } typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error()); var s = b, r = typeof Object.is == "function" ? Object.is : e, v = s.useState, f = s.useEffect, l = s.useLayoutEffect, p = s.useDebugValue, E = !1, o = !1, d = typeof window > "u" || typeof window.document > "u" || typeof window.document.createElement > "u" ? i : t; A.useSyncExternalStore = s.useSyncExternalStore !== void 0 ? s.useSyncExternalStore : d, typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error()); }()), A; } var C; function P() { return C || (C = 1, process.env.NODE_ENV === "production" ? g.exports = $() : g.exports = F()), g.exports; } var W = P(); function Y() { return W.useSyncExternalStore( J, () => !0, () => !1 ); } function J() { return () => { }; } var R = "Avatar", [Q, fe] = q(R), [X, j] = Q(R), D = S.forwardRef( (e, t) => { const { __scopeAvatar: n, ...i } = e, [s, r] = S.useState("idle"); return /* @__PURE__ */ y.jsx( X, { scope: n, imageLoadingStatus: s, onImageLoadingStatusChange: r, children: /* @__PURE__ */ y.jsx(x.span, { ...i, ref: t }) } ); } ); D.displayName = R; var V = "AvatarImage", k = S.forwardRef( (e, t) => { const { __scopeAvatar: n, src: i, onLoadingStatusChange: s = () => { }, ...r } = e, v = j(V, n), f = Z(i, r), l = B((p) => { s(p), v.onImageLoadingStatusChange(p); }); return O(() => { f !== "idle" && l(f); }, [f, l]), f === "loaded" ? /* @__PURE__ */ y.jsx(x.img, { ...r, ref: t, src: i }) : null; } ); k.displayName = V; var G = "AvatarFallback", z = S.forwardRef( (e, t) => { const { __scopeAvatar: n, delayMs: i, ...s } = e, r = j(G, n), [v, f] = S.useState(i === void 0); return S.useEffect(() => { if (i !== void 0) { const l = window.setTimeout(() => f(!0), i); return () => window.clearTimeout(l); } }, [i]), v && r.imageLoadingStatus !== "loaded" ? /* @__PURE__ */ y.jsx(x.span, { ...s, ref: t }) : null; } ); z.displayName = G; function T(e, t) { return e ? t ? (e.src !== t && (e.src = t), e.complete && e.naturalWidth > 0 ? "loaded" : "loading") : "error" : "idle"; } function Z(e, { referrerPolicy: t, crossOrigin: n }) { const i = Y(), s = S.useRef(null), r = i ? (s.current || (s.current = new window.Image()), s.current) : null, [v, f] = S.useState( () => T(r, e) ); return O(() => { f(T(r, e)); }, [r, e]), O(() => { const l = (o) => () => { f(o); }; if (!r) return; const p = l("loaded"), E = l("error"); return r.addEventListener("load", p), r.addEventListener("error", E), t && (r.referrerPolicy = t), typeof n == "string" && (r.crossOrigin = n), () => { r.removeEventListener("load", p), r.removeEventListener("error", E); }; }, [r, n, t]), v; } var M = D, H = k, U = z; const ee = K( "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" } } ), te = S.forwardRef(({ className: e, size: t, ...n }, i) => /* @__PURE__ */ y.jsx( M, { ref: i, className: w(ee({ size: t }), e), ...n } )); te.displayName = M.displayName; const re = S.forwardRef(({ className: e, ...t }, n) => /* @__PURE__ */ y.jsx( H, { ref: n, className: w("aspect-square size-full", e), ...t } )); re.displayName = H.displayName; const ae = S.forwardRef(({ className: e, ...t }, n) => /* @__PURE__ */ y.jsx( U, { ref: n, className: w( "bg-muted flex size-full items-center justify-center rounded-full", e ), ...t } )); ae.displayName = U.displayName; export { te as A, ee as a, re as b, ae as c };