@chaibuilder/pages 0.4.18 → 0.4.19

package/dist/digital-asset-manager-BjrjrGhU.js

@@ -1,737 +0,0 @@
-import { jsx as e, jsxs as l, Fragment as z } from "react/jsx-runtime";
-import te, { useState as f, useMemo as be, useEffect as Z, useCallback as T, Suspense as Ae } from "react";
-import { mergeClasses as le } from "@chaibuilder/sdk";
-import { Button as m, Label as q, Textarea as Se, Input as Ce, Dialog as Ee, DialogContent as ke, DialogHeader as De, DialogTitle as Te, DialogDescription as Pe, DialogFooter as je } from "@chaibuilder/sdk/ui";
-import { find as ze, merge as Fe, pick as Ie, first as Ue } from "lodash-es";
-import { Loader as F, AlertCircle as $e, ChevronLeft as Be, Pencil as qe, Search as Le, Archive as Me, Film as Oe, ImageIcon as _e, Edit as Ke, Trash2 as Qe, Check as Ge, Upload as Re } from "lucide-react";
-import { useDropzone as Ve } from "react-dropzone";
-import { useQueryClient as K, useMutation as Q, useQuery as ie } from "@tanstack/react-query";
-import { toast as P } from "sonner";
-import { W as I, X as U, Y as v, Z as $ } from "./index-DOVQkWCn.js";
-const We = () => {
-  const n = I(), a = K(), s = U();
-  return Q({
-    mutationFn: async ({
-      file: i,
-      folderId: o,
-      name: r
-    }) => s(n, {
-      action: v.UPLOAD_ASSET,
-      data: { file: i, folderId: o, name: r }
-    }),
-    onSuccess: (i) => {
-      if (i != null && i.error)
-        throw new Error(i == null ? void 0 : i.error);
-      a.invalidateQueries({
-        queryKey: [$, v.GET_ASSETS]
-      }), P.success("Asset uploaded successfully");
-    },
-    onError: () => {
-      P.error("Failed to upload asset");
-    }
-  });
-}, Ye = () => {
-  const n = I(), a = K(), s = U();
-  return Q({
-    mutationFn: async (i) => s(n, {
-      action: v.DELETE_ASSET,
-      data: { id: i }
-    }),
-    onSuccess: (i) => {
-      if (i != null && i.error)
-        throw new Error(i == null ? void 0 : i.error);
-      a.invalidateQueries({
-        queryKey: [$, v.GET_ASSETS]
-      }), P.success("Asset deleted successfully");
-    },
-    onError: () => {
-      P.error("Failed to delete asset");
-    }
-  });
-}, He = () => {
-  const n = I(), a = K(), s = U();
-  return Q({
-    mutationFn: async (i) => s(n, {
-      action: v.UPDATE_ASSET,
-      data: i
-    }),
-    onSuccess: (i) => {
-      if (i != null && i.error)
-        throw new Error(i == null ? void 0 : i.error);
-      a.invalidateQueries({
-        queryKey: [$, v.GET_ASSETS]
-      }), P.success("Asset updated successfully");
-    },
-    onError: () => {
-      P.error("Failed to update asset");
-    }
-  });
-}, Xe = (n = {}) => {
-  const a = I(), s = U(), { search: i, page: o = 1, limit: r = 30 } = n;
-  return ie({
-    queryKey: [$, v.GET_ASSETS, i, o, r],
-    queryFn: async () => {
-      const x = await s(a, {
-        action: v.GET_ASSETS,
-        data: {
-          search: i,
-          page: o,
-          limit: r
-        }
-      });
-      return x.page = o, x.limit = r, x;
-    },
-    staleTime: 1e3 * 60 * 5,
-    retry: 1
-  });
-}, Ze = (n) => {
-  const a = I(), s = U();
-  return ie({
-    queryKey: [$, v.GET_ASSET, n],
-    queryFn: async () => n ? await s(a, {
-      action: v.GET_ASSET,
-      data: { id: n }
-    }) : null,
-    staleTime: 1e3 * 60 * 5,
-    retry: 1
-  });
-};
-function Je(n) {
-  const a = isNaN(n) ? 0 : typeof n == "number" ? n : parseInt(n);
-  return a ? a < 1024 ? `${a.toFixed(2)} B` : a < 1024 * 1024 ? `${(a / 1024).toFixed(2)} KB` : `${(a / (1024 * 1024)).toFixed(2)} MB` : "0 B";
-}
-function J(n) {
-  if (!n) return "N/A";
-  const a = new Date(n);
-  return new Intl.DateTimeFormat("en-US", {
-    month: "short",
-    day: "numeric",
-    year: "numeric",
-    hour: "2-digit",
-    minute: "2-digit"
-  }).format(a);
-}
-function ee(n, a) {
-  let s = n, i = a == null ? void 0 : a.description;
-  return (!i || typeof i != "string") && (i = ""), (!s || typeof s != "string") && (s = ""), s !== i;
-}
-const et = ({
-  assetId: n,
-  onBack: a,
-  onEdit: s,
-  onSave: i,
-  isSaving: o
-}) => {
-  var p, A, S;
-  const { data: r, isLoading: x, isError: N } = Ze(n || ""), [g, u] = f("");
-  return te.useEffect(() => {
-    r != null && r.description && u(r.description);
-  }, [r]), x ? /* @__PURE__ */ e("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ e(F, { className: "h-8 w-8 animate-spin" }) }) : N || !(r != null && r.id) ? /* @__PURE__ */ e("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ l("div", { className: "text-center max-w-md mx-auto p-6", children: [
-    /* @__PURE__ */ e("div", { className: "flex justify-center mb-4", children: /* @__PURE__ */ e($e, { className: "h-12 w-12 text-gray-400" }) }),
-    /* @__PURE__ */ e("h3", { className: "text-lg font-medium text-gray-900 mb-2", children: "No Asset Found" }),
-    /* @__PURE__ */ e("p", { className: "text-sm text-gray-500 mb-6", children: N ? "There was an error loading the asset. Please try again later." : "The asset you're looking for doesn't exist or has been removed." }),
-    /* @__PURE__ */ l("div", { className: "flex justify-center gap-4", children: [
-      /* @__PURE__ */ e(m, { variant: "outline", onClick: a, children: "Back to Assets" }),
-      N && /* @__PURE__ */ e(
-        m,
-        {
-          variant: "default",
-          onClick: () => window.location.reload(),
-          children: "Try Again"
-        }
-      )
-    ] })
-  ] }) }) : /* @__PURE__ */ l("div", { className: "flex-1 flex flex-col gap-y-4 overflow-hidden", children: [
-    /* @__PURE__ */ l("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ l(
-        m,
-        {
-          variant: "outline",
-          size: "sm",
-          onClick: a,
-          disabled: o,
-          children: [
-            /* @__PURE__ */ e(Be, { className: "h-4 w-4" }),
-            "Back to Assets"
-          ]
-        }
-      ),
-      /* @__PURE__ */ l("div", { className: "flex gap-2", children: [
-        /* @__PURE__ */ e(m, { variant: "outline", onClick: a, disabled: o, children: "Cancel" }),
-        /* @__PURE__ */ l(
-          m,
-          {
-            variant: "default",
-            onClick: () => s(r),
-            disabled: o,
-            children: [
-              /* @__PURE__ */ e(qe, { className: "h-4 w-4" }),
-              "Edit Image"
-            ]
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ l("div", { className: "grid grid-cols-2 items-start gap-6 flex-1 overflow-hidden", children: [
-      /* @__PURE__ */ e("div", { className: "relative h-[calc(80vh-200px)] w-full flex items-start justify-center", children: /* @__PURE__ */ e(
-        "img",
-        {
-          src: `${r.url}?v=${((p = r.metadata) == null ? void 0 : p.updatedAt) || r.createdAt}`,
-          alt: r.name,
-          className: "w-full h-full object-contain rounded-lg max-h-max max-w-max shadow-2xl shadow-black/30"
-        }
-      ) }),
-      /* @__PURE__ */ l("div", { className: "space-y-6", children: [
-        /* @__PURE__ */ l("div", { className: "grid gap-3 border rounded-md pt-2 bg-gray-100", children: [
-          /* @__PURE__ */ e(q, { className: "w-full text-center", children: "Details" }),
-          /* @__PURE__ */ e("div", { className: "grid grid-cols-1 gap-2 text-sm border rounded-md p-2 bg-white", children: [
-            { label: "File Name", value: r.name },
-            { label: "Type", value: r.type, capitalize: !0 },
-            {
-              label: "Format",
-              value: ((A = r.metadata) == null ? void 0 : A.format) || r.type,
-              capitalize: !0
-            },
-            {
-              label: "Size",
-              value: Je(r.size)
-            },
-            {
-              label: "Dimensions",
-              value: `${r.width || 0} × ${r.height || 0}`
-            },
-            {
-              label: "Created",
-              value: J(r.createdAt)
-            },
-            {
-              label: "Updated",
-              value: J(
-                ((S = r.metadata) == null ? void 0 : S.updatedAt) || r.createdAt
-              )
-            }
-          ].map((c) => /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ e(q, { className: "w-max text-left px-2 w-1/4 font-normal text-gray-700", children: c.label }),
-            ":",
-            /* @__PURE__ */ e(
-              "div",
-              {
-                className: "w-max text-left font-medium text-gray-900" + c.capitalize ? " capitalize" : "",
-                children: c.value
-              }
-            )
-          ] }, c.label)) })
-        ] }),
-        r.usedOn && r.usedOn.length > 0 && /* @__PURE__ */ l("div", { className: "grid gap-3", children: [
-          /* @__PURE__ */ e(q, { children: "Used On" }),
-          /* @__PURE__ */ e("div", { className: "grid grid-cols-1 gap-2 text-sm border rounded-md p-2", children: r.usedOn.map((c, h) => /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ e("div", { className: "w-max text-left font-medium text-gray-900", children: c.name }),
-            /* @__PURE__ */ l("div", { className: "text-gray-500", children: [
-              "(",
-              c.slug,
-              ")"
-            ] })
-          ] }, h)) })
-        ] }),
-        /* @__PURE__ */ l("div", { className: "grid gap-3 border rounded-md pt-2 bg-gray-100 relative", children: [
-          /* @__PURE__ */ e(q, { className: "w-full text-center", children: "Description" }),
-          /* @__PURE__ */ e(
-            Se,
-            {
-              id: "description",
-              value: g,
-              placeholder: "Enter a description for the asset",
-              onChange: (c) => u(c.target.value),
-              rows: 3,
-              disabled: o,
-              className: "hover:border-black/40 bg-white"
-            }
-          ),
-          /* @__PURE__ */ e("div", { className: "flex justify-end items-start absolute top-1.5 right-2", children: /* @__PURE__ */ e(
-            "button",
-            {
-              type: "button",
-              onClick: () => i(g),
-              disabled: o || !ee(g, r),
-              className: `py-0 bg-blue-500 text-white px-3 py-0.5 rounded-md text-sm ${o || !ee(g, r) ? "opacity-50 cursor-not-allowed" : ""}`,
-              children: o ? /* @__PURE__ */ l(z, { children: [
-                /* @__PURE__ */ e(F, { className: "h-4 w-4 mr-2 animate-spin" }),
-                "Saving..."
-              ] }) : "Save"
-            }
-          ) })
-        ] })
-      ] })
-    ] })
-  ] });
-}, tt = te.lazy(() => import("./image-editor-CzFST20j.js"));
-function lt(n) {
-  const a = isNaN(n) ? 0 : typeof n == "number" ? n : parseInt(n);
-  return a ? a < 1024 ? `${a.toFixed(2)} B` : a < 1024 * 1024 ? `${(a / 1024).toFixed(2)} KB` : `${(a / (1024 * 1024)).toFixed(2)} MB` : "0 B";
-}
-const it = ({
-  isUpdatingAsset: n,
-  allowedTypes: a,
-  maxFileSize: s,
-  uploadAsset: i,
-  isUploadingAsset: o
-}) => {
-  const r = n || o, x = T(
-    async (p) => new Promise((A, S) => {
-      const c = p[0], h = new FileReader();
-      h.readAsDataURL(c), h.onload = async () => {
-        const j = await i({
-          file: h.result,
-          folderId: void 0,
-          name: c.name
-        });
-        A(j);
-      }, h.onerror = (j) => S(j);
-    }),
-    [i]
-  ), { getRootProps: N, getInputProps: g, isDragActive: u } = Ve({
-    onDrop: x,
-    accept: {
-      "image/*": a.includes("image") ? [] : []
-    },
-    maxSize: s * 1024 * 1024,
-    disabled: n || o
-  });
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      className: `flex flex-col items-center justify-center w-full border-2 hover:border-black/50 border-dashed p-0 rounded-lg border-slate-300 py-2 h-[60px] ${r ? "opacity-90 bg-gray-100 pointer-events-none" : "hover:border-black/50 hover:bg-gray-100"}`,
-      children: /* @__PURE__ */ l(
-        "div",
-        {
-          ...N(),
-          className: le(
-            "rounded-lg text-center cursor-pointer w-full h-max flex flex-col items-center justify-center",
-            u ? "border-primary bg-primary/5" : "border-muted-foreground/20"
-          ),
-          children: [
-            /* @__PURE__ */ e("input", { ...g() }),
-            r ? /* @__PURE__ */ e("div", { className: "flex flex-col items-center", children: /* @__PURE__ */ l("div", { className: "leading-tight flex items-center gap-2", children: [
-              /* @__PURE__ */ e(
-                "div",
-                {
-                  className: "flex items-center justify-center rounded-full bg-indigo-100 p-2",
-                  children: /* @__PURE__ */ e(F, { className: "h-4 w-4 text-indigo-500 animate-spin" })
-                }
-              ),
-              /* @__PURE__ */ l("div", { className: "text-left", children: [
-                /* @__PURE__ */ e("div", { className: "font-medium", children: n ? "Updating file..." : "Uploading file..." }),
-                /* @__PURE__ */ l("div", { className: "text-xs text-muted-foreground font-light", children: [
-                  "Please wait while we ",
-                  n ? "update" : "upload",
-                  " ",
-                  "your file..."
-                ] })
-              ] })
-            ] }) }) : /* @__PURE__ */ e("div", { className: "flex flex-col items-center", children: /* @__PURE__ */ l("div", { className: "leading-tight flex items-center gap-2", children: [
-              /* @__PURE__ */ e(
-                "div",
-                {
-                  className: "flex items-center justify-center rounded-full bg-indigo-100 p-2 border border-indigo-500",
-                  children: /* @__PURE__ */ e(Re, { className: "h-4 w-4 text-indigo-500" })
-                }
-              ),
-              /* @__PURE__ */ l("div", { className: "text-left", children: [
-                /* @__PURE__ */ l("div", { className: "font-medium", children: [
-                  "Drop your file here or",
-                  " ",
-                  /* @__PURE__ */ e("span", { className: "text-indigo-500 cursor-pointer hover:underline", children: "browse" })
-                ] }),
-                /* @__PURE__ */ l("div", { className: "text-xs text-muted-foreground font-light", children: [
-                  /* @__PURE__ */ l("span", { className: "", children: [
-                    "Accepted file types:",
-                    " ",
-                    /* @__PURE__ */ e("span", { className: "capitalize text-indigo-400", children: a.join(", ") }),
-                    " & "
-                  ] }),
-                  /* @__PURE__ */ l("span", { children: [
-                    "Max file size:",
-                    " ",
-                    /* @__PURE__ */ l("span", { className: "capitalize text-indigo-400", children: [
-                      s,
-                      " MB"
-                    ] })
-                  ] })
-                ] })
-              ] })
-            ] }) })
-          ]
-        }
-      )
-    }
-  );
-};
-function ft({
-  close: n,
-  onSelect: a,
-  mode: s = "image",
-  assetId: i
-}) {
-  const x = be(() => [s], [s]), [N, g] = f(null), [u, p] = f(null), [A, S] = f(null), [c, h] = f({ show: !1, file: "" }), [j, G] = f(!1), [ae, L] = f(
-    i ? "details" : "grid"
-  ), [M, re] = f(""), [B, ne] = f(""), [y, R] = f(1), [V] = f(30), [C, W] = f([]);
-  Z(() => {
-    i && (g(i), L("details"));
-  }, [i]), Z(() => {
-    const t = setTimeout(() => {
-      re(B), R(1);
-    }, 300);
-    return () => clearTimeout(t);
-  }, [B]);
-  const { data: k, isLoading: Y } = Xe({
-    search: M.toLowerCase().trim(),
-    page: y,
-    limit: V
-  }), E = (k == null ? void 0 : k.assets) || [], se = (k == null ? void 0 : k.total) || 0, w = Math.ceil(se / V), O = y < w, _ = y > 1, ce = (E == null ? void 0 : E.length) > 0, { mutate: de } = Ye(), { mutate: H, isPending: oe } = We(), { mutate: X, isPending: ue } = He(), D = T(
-    (t) => {
-      t >= 1 && t <= w && R(t);
-    },
-    [w]
-  ), me = T(() => {
-    O && D(y + 1);
-  }, [y, O, D]), he = T(() => {
-    _ && D(y - 1);
-  }, [y, _, D]), fe = (t) => {
-    ne(t.target.value);
-  }, ge = T(
-    (t) => {
-      W((d) => ze(d, { id: t.id }) ? [] : [t]);
-    },
-    [!1]
-  ), pe = T(() => {
-    W([]);
-  }, []), ve = () => {
-    C.length !== 0 && (a(
-      Ie(Ue(C), [
-        "id",
-        "url",
-        "width",
-        "height",
-        "description"
-      ])
-    ), n());
-  }, xe = async (t) => {
-    p(t);
-  }, Ne = async () => {
-    u && (S(u == null ? void 0 : u.id), await de(u.id, {
-      onSuccess: () => {
-        S(null), p(null);
-      },
-      onError: () => {
-        S(null);
-      }
-    }), p(null));
-  }, ye = (t) => {
-    g(t.id), L("details");
-  }, we = async (t, d) => {
-    try {
-      d ? (await H({
-        file: t,
-        folderId: void 0,
-        name: c.name || ""
-      }), h({ show: !1, file: "" })) : (await X({
-        id: c.id || "",
-        file: t
-      }), h({ show: !1, file: "" }));
-    } catch (b) {
-      console.error("Error saving edited image:", b);
-    }
-  };
-  return /* @__PURE__ */ l(z, { children: [
-    /* @__PURE__ */ l("div", { className: "max-w-[1232px] max-h-[1232px] w-[80vw] h-[80vh] space-y-4 flex flex-col", children: [
-      /* @__PURE__ */ e("h1", { className: "text-lg font-medium", children: "Digital Asset Manager" }),
-      ae === "grid" ? /* @__PURE__ */ l(z, { children: [
-        /* @__PURE__ */ e(
-          it,
-          {
-            maxFileSize: 10,
-            allowedTypes: x,
-            uploadAsset: H,
-            isUpdatingAsset: ue,
-            isUploadingAsset: oe
-          }
-        ),
-        /* @__PURE__ */ l("div", { className: "border p-2 rounded-lg flex-1 flex flex-col gap-y-3 overflow-hidden relative", children: [
-          /* @__PURE__ */ l("div", { className: "flex items-center justify-between gap-3", children: [
-            /* @__PURE__ */ l("div", { className: "relative w-1/2 ", children: [
-              /* @__PURE__ */ e(
-                Le,
-                {
-                  strokeWidth: 3,
-                  className: `absolute left-2 top-2.5 h-4 w-4 text-muted-foreground ${B.length > 0 ? "text-indigo-800" : ""}`
-                }
-              ),
-              /* @__PURE__ */ e(
-                Ce,
-                {
-                  placeholder: "Search assets...",
-                  onChange: fe,
-                  value: B,
-                  className: "pl-8 hover:shadow-lg"
-                }
-              )
-            ] }),
-            C.length > 0 ? /* @__PURE__ */ e("div", { className: "flex justify-between items-center", children: /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
-              C.length > 0 && /* @__PURE__ */ e(z, { children: /* @__PURE__ */ e(
-                m,
-                {
-                  variant: "outline",
-                  size: "sm",
-                  onClick: () => pe(),
-                  title: "Clear selection",
-                  children: "Clear"
-                }
-              ) }),
-              /* @__PURE__ */ e(
-                m,
-                {
-                  size: "sm",
-                  onClick: ve,
-                  disabled: C.length === 0,
-                  children: "Select Asset"
-                }
-              )
-            ] }) }) : null
-          ] }),
-          /* @__PURE__ */ e("div", { className: "flex-1 overflow-y-auto", children: Y ? /* @__PURE__ */ l("div", { className: "columns-1 gap-3 space-y-3 sm:columns-3 md:columns-5", children: [
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" }),
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" }),
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" }),
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" }),
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" }),
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" }),
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" }),
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" }),
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" }),
-            /* @__PURE__ */ e("div", { className: "bg-gray-200 h-64 w-full animate-pulse rounded" })
-          ] }) : !Y && !ce ? /* @__PURE__ */ l("div", { className: "flex flex-col items-center justify-center h-full border rounded-lg", children: [
-            /* @__PURE__ */ e("div", { className: "text-muted-foreground", children: /* @__PURE__ */ e(Me, { className: "h-9 w-9 text-indigo-500" }) }),
-            /* @__PURE__ */ e("div", { className: "text-muted-foreground text-lg", children: "No assets found" }),
-            /* @__PURE__ */ e("div", { className: "text-muted-foreground text-sm", children: M.length > 0 ? "No assets found for your search: " + M : "Start uploading assets to get started" }),
-            /* @__PURE__ */ e("br", {})
-          ] }) : /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-3 p-1", children: E == null ? void 0 : E.map((t) => /* @__PURE__ */ l(
-            "div",
-            {
-              className: le(
-                "relative cursor-pointer overflow-hidden transition-all rounded-lg border-2 group max-w-[180px] max-h-[180px] flex flex-col justify-between",
-                C.some((d) => d.id === t.id) ? "border-4 border-blue-500" : "hover:border-black/50",
-                A && (u == null ? void 0 : u.id) === t.id ? "opacity-50 pointer-events-none" : "",
-                A === t.id ? "opacity-50 pointer-events-none" : ""
-              ),
-              onClick: () => ge(t),
-              children: [
-                /* @__PURE__ */ l("div", { className: "aspect-square relative overflow-hidden", children: [
-                  A === t.id ? /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center bg-black/50", children: /* @__PURE__ */ e(F, { className: "h-8 w-8 animate-spin text-white" }) }) : null,
-                  t.type === "image" ? /* @__PURE__ */ e(
-                    "img",
-                    {
-                      src: `${t.thumbnailUrl || "/placeholder.svg"}?v=${(t == null ? void 0 : t.updatedAt) || t.createdAt}`,
-                      alt: t.name,
-                      className: "object-contain w-full h-full min-h-[80px]"
-                    }
-                  ) : /* @__PURE__ */ l("div", { className: "flex items-center justify-center h-full", children: [
-                    /* @__PURE__ */ e(Oe, { className: "h-12 w-12 text-muted-foreground" }),
-                    t.thumbnailUrl && /* @__PURE__ */ e(
-                      "img",
-                      {
-                        src: `${t.thumbnailUrl || "/placeholder.svg"}?v=${(t == null ? void 0 : t.updatedAt) || t.createdAt}`,
-                        alt: t.name,
-                        className: "absolute inset-0 object-cover w-full h-full"
-                      }
-                    )
-                  ] })
-                ] }),
-                /* @__PURE__ */ l("div", { className: "py-1 px-2", children: [
-                  /* @__PURE__ */ e("div", { className: "text-xs truncate", title: t.name, children: t.name }),
-                  /* @__PURE__ */ l("div", { className: "text-[10px] font-light text-muted-foreground flex items-center justify-between", children: [
-                    /* @__PURE__ */ e("span", { children: lt((t == null ? void 0 : t.size) || 0) }),
-                    /* @__PURE__ */ l("span", { children: [
-                      "Used on",
-                      " ",
-                      /* @__PURE__ */ l("span", { className: "font-normal", children: [
-                        (t == null ? void 0 : t.usedOnCount) || 0,
-                        " "
-                      ] }),
-                      (t == null ? void 0 : t.usedOnCount) === 1 ? "page" : "pages"
-                    ] })
-                  ] })
-                ] }),
-                /* @__PURE__ */ l("div", { className: "absolute inset-0 bg-black/80 border-white border-4 rounded-lg opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center gap-2", children: [
-                  /* @__PURE__ */ e(
-                    m,
-                    {
-                      variant: "secondary",
-                      size: "icon",
-                      className: "h-8 w-8 rounded-full",
-                      onClick: (d) => {
-                        d.stopPropagation(), ye(t);
-                      },
-                      children: /* @__PURE__ */ e(_e, { className: "h-4 w-4" })
-                    }
-                  ),
-                  /* @__PURE__ */ e(
-                    m,
-                    {
-                      variant: "secondary",
-                      size: "icon",
-                      className: "h-8 w-8 rounded-full",
-                      onClick: (d) => {
-                        d.stopPropagation(), h({
-                          id: t.id,
-                          show: !0,
-                          file: t.url,
-                          name: t.name
-                        });
-                      },
-                      children: /* @__PURE__ */ e(Ke, { className: "h-4 w-4" })
-                    }
-                  ),
-                  /* @__PURE__ */ e(
-                    m,
-                    {
-                      variant: "destructive",
-                      size: "icon",
-                      className: "h-8 w-8 rounded-full",
-                      onClick: (d) => {
-                        d.stopPropagation(), xe(t);
-                      },
-                      children: /* @__PURE__ */ e(Qe, { className: "h-4 w-4" })
-                    }
-                  )
-                ] }),
-                C.some((d) => d.id === t.id) && /* @__PURE__ */ e("div", { className: "absolute top-2 right-2 border border-white h-max rounded-full bg-blue-500 p-1", children: /* @__PURE__ */ e(
-                  Ge,
-                  {
-                    className: "w-3 h-3 text-white",
-                    strokeWidth: 5
-                  }
-                ) })
-              ]
-            },
-            t.id
-          )) }) }),
-          w > 1 && /* @__PURE__ */ e("div", { className: "absolute bottom-0 left-0 right-0 bg-white border-t p-4", children: /* @__PURE__ */ l("div", { className: "flex items-center justify-center space-x-2", children: [
-            /* @__PURE__ */ e(
-              m,
-              {
-                variant: "outline",
-                size: "sm",
-                onClick: he,
-                disabled: !_,
-                children: "Previous"
-              }
-            ),
-            Array.from({ length: Math.min(5, w) }, (t, d) => {
-              const b = d + 1;
-              return /* @__PURE__ */ e(
-                m,
-                {
-                  variant: y === b ? "default" : "outline",
-                  size: "sm",
-                  onClick: () => D(b),
-                  children: b
-                },
-                b
-              );
-            }),
-            w > 5 && /* @__PURE__ */ l(z, { children: [
-              /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "..." }),
-              /* @__PURE__ */ e(
-                m,
-                {
-                  variant: y === w ? "default" : "outline",
-                  size: "sm",
-                  onClick: () => D(w),
-                  children: w
-                }
-              )
-            ] }),
-            /* @__PURE__ */ e(
-              m,
-              {
-                variant: "outline",
-                size: "sm",
-                onClick: me,
-                disabled: !O,
-                children: "Next"
-              }
-            )
-          ] }) })
-        ] })
-      ] }) : /* @__PURE__ */ e(
-        et,
-        {
-          assetId: N || i || "",
-          onBack: () => {
-            L("grid"), g(null);
-          },
-          onEdit: (t) => {
-            h({
-              id: t.id,
-              show: !0,
-              file: t.url,
-              name: t.name
-            });
-          },
-          onSave: async (t) => {
-            if (N) {
-              G(!0);
-              try {
-                const d = E.find((b) => b.id === N);
-                d && await X(Fe(d, { description: t }));
-              } finally {
-                G(!1);
-              }
-            }
-          },
-          isSaving: j
-        }
-      )
-    ] }),
-    c.show && /* @__PURE__ */ e(
-      Ae,
-      {
-        fallback: /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ e(F, { className: "h-8 w-8 animate-spin" }) }),
-        children: /* @__PURE__ */ e(
-          tt,
-          {
-            imageUrl: c.file,
-            onSave: we,
-            onClose: () => h({ show: !1, file: "" }),
-            defaultSavedImageName: c.name,
-            isEditing: !!c.id
-          }
-        )
-      }
-    ),
-    u && /* @__PURE__ */ e(
-      Ee,
-      {
-        open: !!u,
-        onOpenChange: () => p(null),
-        children: /* @__PURE__ */ l(ke, { children: [
-          /* @__PURE__ */ l(De, { children: [
-            /* @__PURE__ */ e(Te, { children: "Delete Asset" }),
-            /* @__PURE__ */ l(Pe, { children: [
-              'Are you sure you want to delete "',
-              u.name,
-              '"? This action cannot be undone.'
-            ] })
-          ] }),
-          /* @__PURE__ */ l(je, { className: "gap-2 sm:gap-0", children: [
-            /* @__PURE__ */ e(m, { variant: "outline", onClick: () => p(null), children: "Cancel" }),
-            /* @__PURE__ */ e(m, { variant: "destructive", onClick: Ne, children: "Delete" })
-          ] })
-        ] })
-      }
-    )
-  ] });
-}
-export {
-  ft as default
-};