convex-cms 0.0.2 → 0.0.3

package/admin-dist/server/_ssr/media-CSx3XttC.mjs

@@ -0,0 +1,1832 @@
+import { r as reactExports, j as jsxRuntimeExports } from "../_chunks/_libs/react.mjs";
+import { d as useNavigate } from "../_chunks/_libs/@tanstack/react-router.mjs";
+import { u as useSettingsConfig, a as api, c as cn, D as DropdownMenu, d as DropdownMenuTrigger, e as DropdownMenuContent, f as DropdownMenuItem, g as DropdownMenuSeparator, B as Button } from "./router-DDWcF-kt.mjs";
+import { T as Tabs, a as TabsList, b as TabsTrigger, U as UploadDropzone } from "./tabs-DzMdRB1A.mjs";
+import { C as CmsPageHeader } from "./CmsPageHeader-CseW0AHm.mjs";
+import { C as CmsToolbar } from "./CmsToolbar-X75ex6ek.mjs";
+import { I as Input, a as Checkbox, C as CmsEmptyState, D as Dialog, d as DialogContent, e as DialogHeader, f as DialogTitle, g as DialogFooter, b as CmsConfirmDialog, c as CmsDialog } from "./CmsEmptyState-DU7-7-mV.mjs";
+import { B as Badge, C as CmsButton } from "./badge-6BsP37vG.mjs";
+import { T as TaxonomyFilter } from "./TaxonomyFilter-Bwrq0-cz.mjs";
+import { L as Label } from "./label-C8Dko1j7.mjs";
+import { S as Select, a as SelectTrigger, b as SelectValue, c as SelectContent, d as SelectItem } from "./select-BUhDDf4T.mjs";
+import { a as VisuallyHidden } from "../_chunks/_libs/@radix-ui/react-visually-hidden.mjs";
+import { T as Textarea } from "./textarea-9jNeYJSc.mjs";
+import { u as useQuery, d as useMutation } from "../_libs/convex.mjs";
+import { I as Image, w as Trash2, H as House, a1 as ChevronLeft, a2 as FolderPlus, a3 as Upload, N as Search, X, o as Folder, R as RotateCcw, a4 as Ellipsis, W as Pencil, a5 as FolderInput, a6 as EllipsisVertical, h as Eye, a7 as Download, a8 as Link2, a9 as File, J as FileText, aa as Music, ab as Video, ac as Copy, f as ChevronRight, V as Tag, L as LoaderCircle, Q as Plus } from "../_libs/lucide-react.mjs";
+import "../_libs/tiny-warning.mjs";
+import "../_chunks/_libs/@tanstack/router-core.mjs";
+import "../_libs/cookie-es.mjs";
+import "../_chunks/_libs/@tanstack/store.mjs";
+import "../_chunks/_libs/@tanstack/history.mjs";
+import "../_libs/tiny-invariant.mjs";
+import "../_libs/seroval.mjs";
+import "../_libs/seroval-plugins.mjs";
+import "node:stream/web";
+import "node:stream";
+import "../_chunks/_libs/react-dom.mjs";
+import "util";
+import "crypto";
+import "async_hooks";
+import "stream";
+import "../_libs/isbot.mjs";
+import "../_chunks/_libs/@tanstack/react-store.mjs";
+import "../_libs/use-sync-external-store.mjs";
+import "../_libs/clsx.mjs";
+import "../_libs/tailwind-merge.mjs";
+import "../_chunks/_libs/@radix-ui/react-slot.mjs";
+import "../_chunks/_libs/@radix-ui/react-compose-refs.mjs";
+import "../_chunks/_libs/@radix-ui/react-dropdown-menu.mjs";
+import "../_chunks/_libs/@radix-ui/primitive.mjs";
+import "../_chunks/_libs/@radix-ui/react-context.mjs";
+import "../_chunks/_libs/@radix-ui/react-use-controllable-state.mjs";
+import "../_chunks/_libs/@radix-ui/react-use-layout-effect.mjs";
+import "../_chunks/_libs/@radix-ui/react-primitive.mjs";
+import "../_chunks/_libs/@radix-ui/react-menu.mjs";
+import "../_chunks/_libs/@radix-ui/react-collection.mjs";
+import "../_chunks/_libs/@radix-ui/react-direction.mjs";
+import "../_chunks/_libs/@radix-ui/react-dismissable-layer.mjs";
+import "../_chunks/_libs/@radix-ui/react-use-callback-ref.mjs";
+import "../_chunks/_libs/@radix-ui/react-use-escape-keydown.mjs";
+import "../_chunks/_libs/@radix-ui/react-focus-guards.mjs";
+import "../_chunks/_libs/@radix-ui/react-focus-scope.mjs";
+import "../_chunks/_libs/@radix-ui/react-popper.mjs";
+import "../_chunks/_libs/@floating-ui/react-dom.mjs";
+import "../_chunks/_libs/@floating-ui/dom.mjs";
+import "../_chunks/_libs/@floating-ui/core.mjs";
+import "../_chunks/_libs/@floating-ui/utils.mjs";
+import "../_chunks/_libs/@radix-ui/react-arrow.mjs";
+import "../_chunks/_libs/@radix-ui/react-use-size.mjs";
+import "../_chunks/_libs/@radix-ui/react-portal.mjs";
+import "../_chunks/_libs/@radix-ui/react-presence.mjs";
+import "../_chunks/_libs/@radix-ui/react-roving-focus.mjs";
+import "../_chunks/_libs/@radix-ui/react-id.mjs";
+import "../_libs/aria-hidden.mjs";
+import "../_libs/react-remove-scroll.mjs";
+import "../_libs/tslib.mjs";
+import "../_libs/react-remove-scroll-bar.mjs";
+import "../_libs/react-style-singleton.mjs";
+import "../_libs/get-nonce.mjs";
+import "../_libs/use-sidecar.mjs";
+import "../_libs/use-callback-ref.mjs";
+import "../_chunks/_libs/@radix-ui/react-avatar.mjs";
+import "../_chunks/_libs/@radix-ui/react-use-is-hydrated.mjs";
+import "../_libs/class-variance-authority.mjs";
+import "../_chunks/_libs/@radix-ui/react-popover.mjs";
+import "./index.mjs";
+import "node:async_hooks";
+import "../_libs/h3-v2.mjs";
+import "../_libs/rou3.mjs";
+import "../_libs/srvx.mjs";
+import "node:http";
+import "node:https";
+import "node:http2";
+import "../_libs/zod.mjs";
+import "../_chunks/_libs/@radix-ui/react-tabs.mjs";
+import "../_chunks/_libs/@radix-ui/react-dialog.mjs";
+import "../_chunks/_libs/@radix-ui/react-checkbox.mjs";
+import "../_chunks/_libs/@radix-ui/react-use-previous.mjs";
+import "./command-fy8epIKf.mjs";
+import "../_libs/cmdk.mjs";
+import "../_chunks/_libs/@radix-ui/react-label.mjs";
+import "../_chunks/_libs/@radix-ui/react-select.mjs";
+import "../_chunks/_libs/@radix-ui/number.mjs";
+function getMediaTypeFromMimeType$1(mimeType) {
+  if (!mimeType) return "other";
+  if (mimeType.startsWith("image/")) return "image";
+  if (mimeType.startsWith("video/")) return "video";
+  if (mimeType.startsWith("audio/")) return "audio";
+  if (mimeType === "application/pdf" || mimeType.includes("document") || mimeType.includes("sheet") || mimeType.includes("presentation") || mimeType.startsWith("text/")) {
+    return "document";
+  }
+  return "other";
+}
+function formatFileSize$1(bytes) {
+  if (!bytes || bytes === 0) return "0 B";
+  const k = 1024;
+  const sizes = ["B", "KB", "MB", "GB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;
+}
+function formatDate$1(timestamp) {
+  return new Date(timestamp).toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: "numeric",
+    hour: "numeric",
+    minute: "2-digit"
+  });
+}
+function getMediaTypeIcon$1(type, className = "size-16") {
+  const iconProps = { className };
+  switch (type) {
+    case "image":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Image, { ...iconProps });
+    case "video":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Video, { ...iconProps });
+    case "audio":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Music, { ...iconProps });
+    case "document":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(FileText, { ...iconProps });
+    default:
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(File, { ...iconProps });
+  }
+}
+function MediaPreviewModal({
+  asset,
+  assets,
+  currentIndex,
+  open,
+  onOpenChange,
+  onNavigate,
+  onEdit,
+  onDelete
+}) {
+  const canNavigatePrev = currentIndex > 0;
+  const canNavigateNext = currentIndex < assets.length - 1;
+  const handlePrev = reactExports.useCallback(() => {
+    if (canNavigatePrev) {
+      onNavigate(currentIndex - 1);
+    }
+  }, [canNavigatePrev, currentIndex, onNavigate]);
+  const handleNext = reactExports.useCallback(() => {
+    if (canNavigateNext) {
+      onNavigate(currentIndex + 1);
+    }
+  }, [canNavigateNext, currentIndex, onNavigate]);
+  const handleKeyDown = reactExports.useCallback(
+    (e) => {
+      if (!open) return;
+      switch (e.key) {
+        case "ArrowLeft":
+          e.preventDefault();
+          handlePrev();
+          break;
+        case "ArrowRight":
+          e.preventDefault();
+          handleNext();
+          break;
+        case "Escape":
+          e.preventDefault();
+          onOpenChange(false);
+          break;
+      }
+    },
+    [open, handlePrev, handleNext, onOpenChange]
+  );
+  reactExports.useEffect(() => {
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [handleKeyDown]);
+  const handleDownload = reactExports.useCallback(() => {
+    if (!asset?.url) return;
+    const link = document.createElement("a");
+    link.href = asset.url;
+    link.download = asset.name;
+    link.target = "_blank";
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+  }, [asset]);
+  const handleCopyUrl = reactExports.useCallback(async () => {
+    if (!asset?.url) return;
+    await navigator.clipboard.writeText(asset.url);
+  }, [asset]);
+  if (!asset) return null;
+  const mediaType = getMediaTypeFromMimeType$1(asset.mimeType);
+  const isImage = mediaType === "image";
+  const hasUrl = Boolean(asset.url);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    DialogContent,
+    {
+      className: "flex h-[90vh] w-[95vw] max-w-[1400px] flex-col gap-0 overflow-hidden p-0 sm:max-w-[1400px]",
+      showCloseButton: false,
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(VisuallyHidden, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(DialogTitle, { children: [
+          "Preview: ",
+          asset.name
+        ] }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between border-b px-4 py-3", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "truncate text-lg font-semibold", title: asset.name, children: asset.name }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-muted-foreground", children: [
+              currentIndex + 1,
+              " of ",
+              assets.length
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              CmsButton,
+              {
+                variant: "ghost",
+                size: "icon",
+                onClick: handleCopyUrl,
+                disabled: !asset.url,
+                title: "Copy URL",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Copy, { className: "size-4" })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              CmsButton,
+              {
+                variant: "ghost",
+                size: "icon",
+                onClick: handleDownload,
+                disabled: !asset.url,
+                title: "Download",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Download, { className: "size-4" })
+              }
+            ),
+            onEdit && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              CmsButton,
+              {
+                variant: "ghost",
+                size: "icon",
+                onClick: () => onEdit(asset),
+                title: "Edit",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Pencil, { className: "size-4" })
+              }
+            ),
+            onDelete && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              CmsButton,
+              {
+                variant: "ghost",
+                size: "icon",
+                onClick: () => onDelete(asset),
+                title: "Delete",
+                className: "text-destructive hover:text-destructive",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "size-4" })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              CmsButton,
+              {
+                variant: "ghost",
+                size: "icon",
+                onClick: () => onOpenChange(false),
+                title: "Close (Esc)",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(X, { className: "size-4" })
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex min-h-0 flex-1", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative flex flex-1 items-center justify-center bg-zinc-950", children: [
+            canNavigatePrev && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "button",
+              {
+                onClick: handlePrev,
+                className: "absolute left-4 z-10 flex size-10 items-center justify-center rounded-full bg-black/50 text-white transition-colors hover:bg-black/70",
+                title: "Previous (←)",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronLeft, { className: "size-6" })
+              }
+            ),
+            canNavigateNext && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "button",
+              {
+                onClick: handleNext,
+                className: "absolute right-4 z-10 flex size-10 items-center justify-center rounded-full bg-black/50 text-white transition-colors hover:bg-black/70",
+                title: "Next (→)",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-6" })
+              }
+            ),
+            isImage && hasUrl ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "img",
+              {
+                src: asset.url,
+                alt: asset.altText || asset.title || asset.name,
+                className: "max-h-full max-w-full object-contain"
+              }
+            ) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-4 text-zinc-400", children: [
+              getMediaTypeIcon$1(mediaType),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm", children: isImage && !hasUrl ? "Image URL not available" : "Preview not available for this file type" }),
+              hasUrl && /* @__PURE__ */ jsxRuntimeExports.jsxs(CmsButton, { variant: "secondary", onClick: handleDownload, children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(Download, { className: "mr-2 size-4" }),
+                "Download to view"
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-72 shrink-0 overflow-y-auto border-l bg-background", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4 p-4", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "font-semibold", children: "File Information" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(InfoRow, { label: "Filename", value: asset.name }),
+            asset.title && /* @__PURE__ */ jsxRuntimeExports.jsx(InfoRow, { label: "Title", value: asset.title }),
+            asset.description && /* @__PURE__ */ jsxRuntimeExports.jsx(InfoRow, { label: "Description", value: asset.description }),
+            asset.altText && /* @__PURE__ */ jsxRuntimeExports.jsx(InfoRow, { label: "Alt Text", value: asset.altText }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "border-t pt-4", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(InfoRow, { label: "Type", value: mediaType, capitalize: true }),
+              asset.mimeType && /* @__PURE__ */ jsxRuntimeExports.jsx(InfoRow, { label: "MIME Type", value: asset.mimeType }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(InfoRow, { label: "Size", value: formatFileSize$1(asset.size) }),
+              asset.width && asset.height && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                InfoRow,
+                {
+                  label: "Dimensions",
+                  value: `${asset.width} × ${asset.height} px`
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "border-t pt-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx(InfoRow, { label: "Uploaded", value: formatDate$1(asset._creationTime) }) }),
+            asset.tags && asset.tags.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "border-t pt-4", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mb-2 text-xs font-medium text-muted-foreground", children: "Tags" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-wrap gap-1", children: asset.tags.map((tag) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "span",
+                {
+                  className: "rounded-full bg-muted px-2 py-0.5 text-xs",
+                  children: tag
+                },
+                tag
+              )) })
+            ] })
+          ] }) })
+        ] })
+      ]
+    }
+  ) });
+}
+function InfoRow({
+  label,
+  value,
+  capitalize
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-0.5", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs font-medium text-muted-foreground", children: label }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: cn("break-words text-sm", capitalize && "capitalize"), children: value })
+  ] });
+}
+function CmsField({
+  label,
+  description,
+  error,
+  required,
+  htmlFor,
+  className,
+  children
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("space-y-2", className), children: [
+    label && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      Label,
+      {
+        htmlFor,
+        className: cn(
+          "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+          error && "text-destructive"
+        ),
+        children: [
+          label,
+          required && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ml-1 text-destructive", children: "*" })
+        ]
+      }
+    ),
+    children,
+    description && !error && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-[13px] text-muted-foreground", children: description }),
+    error && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-[13px] font-medium text-destructive", children: error })
+  ] });
+}
+function MediaTaxonomyPicker({
+  mediaId,
+  taxonomyId,
+  taxonomyName = "Tags",
+  allowCreate = true,
+  disabled = false,
+  className = ""
+}) {
+  const [inputValue, setInputValue] = reactExports.useState("");
+  const [showSuggestions, setShowSuggestions] = reactExports.useState(false);
+  const [activeSuggestionIndex, setActiveSuggestionIndex] = reactExports.useState(0);
+  const [isCreating, setIsCreating] = reactExports.useState(false);
+  const [isSaving, setIsSaving] = reactExports.useState(false);
+  const inputRef = reactExports.useRef(null);
+  const suggestionsRef = reactExports.useRef(null);
+  const containerRef = reactExports.useRef(null);
+  const currentTerms = useQuery(api.taxonomies.getTermsByMedia, {
+    mediaId,
+    taxonomyId
+  });
+  const selectedTermIds = currentTerms?.map((t) => t._id) ?? [];
+  const suggestionsResult = useQuery(api.taxonomies.suggestTerms, {
+    taxonomyId,
+    query: inputValue,
+    limit: 10,
+    excludeIds: selectedTermIds
+  });
+  const suggestions = suggestionsResult ?? [];
+  const setMediaTermsMutation = useMutation(api.taxonomies.setMediaTerms);
+  const createTermMutation = useMutation(api.taxonomies.createTermAndAddToMedia);
+  reactExports.useEffect(() => {
+    function handleClickOutside(event) {
+      if (containerRef.current && !containerRef.current.contains(event.target)) {
+        setShowSuggestions(false);
+      }
+    }
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, []);
+  const addTag = reactExports.useCallback(
+    async (termId) => {
+      if (selectedTermIds.includes(termId)) return;
+      setIsSaving(true);
+      try {
+        await setMediaTermsMutation({
+          mediaId,
+          taxonomyId,
+          termIds: [...selectedTermIds, termId]
+        });
+      } catch (err) {
+        console.error("Failed to add tag:", err);
+      } finally {
+        setIsSaving(false);
+        setInputValue("");
+        setShowSuggestions(false);
+        setActiveSuggestionIndex(0);
+        inputRef.current?.focus();
+      }
+    },
+    [mediaId, taxonomyId, selectedTermIds, setMediaTermsMutation]
+  );
+  const removeTag = reactExports.useCallback(
+    async (termId) => {
+      setIsSaving(true);
+      try {
+        await setMediaTermsMutation({
+          mediaId,
+          taxonomyId,
+          termIds: selectedTermIds.filter((id) => id !== termId)
+        });
+      } catch (err) {
+        console.error("Failed to remove tag:", err);
+      } finally {
+        setIsSaving(false);
+      }
+    },
+    [mediaId, taxonomyId, selectedTermIds, setMediaTermsMutation]
+  );
+  const createTag = reactExports.useCallback(async () => {
+    if (!inputValue.trim() || !allowCreate) return;
+    setIsCreating(true);
+    try {
+      await createTermMutation({
+        taxonomyId,
+        name: inputValue.trim(),
+        mediaId
+      });
+      setInputValue("");
+      setShowSuggestions(false);
+      setActiveSuggestionIndex(0);
+    } catch (err) {
+      console.error("Failed to create tag:", err);
+    } finally {
+      setIsCreating(false);
+    }
+  }, [inputValue, allowCreate, taxonomyId, mediaId, createTermMutation]);
+  const handleKeyDown = (e) => {
+    if (disabled) return;
+    switch (e.key) {
+      case "ArrowDown":
+        e.preventDefault();
+        setActiveSuggestionIndex(
+          (prev) => prev < suggestions.length - 1 ? prev + 1 : prev
+        );
+        break;
+      case "ArrowUp":
+        e.preventDefault();
+        setActiveSuggestionIndex((prev) => prev > 0 ? prev - 1 : 0);
+        break;
+      case "Enter":
+        e.preventDefault();
+        if (suggestions.length > 0 && activeSuggestionIndex < suggestions.length) {
+          addTag(suggestions[activeSuggestionIndex]._id);
+        } else if (inputValue.trim() && allowCreate) {
+          createTag();
+        }
+        break;
+      case "Escape":
+        setShowSuggestions(false);
+        break;
+      case "Backspace":
+        if (inputValue === "" && selectedTermIds.length > 0) {
+          removeTag(selectedTermIds[selectedTermIds.length - 1]);
+        }
+        break;
+    }
+  };
+  reactExports.useEffect(() => {
+    if (suggestionsRef.current && showSuggestions) {
+      const activeElement = suggestionsRef.current.querySelector(
+        `[data-index="${activeSuggestionIndex}"]`
+      );
+      if (activeElement) {
+        activeElement.scrollIntoView({ block: "nearest" });
+      }
+    }
+  }, [activeSuggestionIndex, showSuggestions]);
+  const filteredSuggestions = suggestions.filter(
+    (term) => !selectedTermIds.includes(term._id)
+  );
+  const showCreateOption = allowCreate && inputValue.trim() && !filteredSuggestions.some(
+    (s) => s.name.toLowerCase() === inputValue.trim().toLowerCase()
+  );
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("space-y-2", className), children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-muted-foreground", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Tag, { className: "size-4" }),
+      taxonomyName
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "div",
+      {
+        ref: containerRef,
+        className: cn(
+          "relative rounded-md border border-input bg-background",
+          disabled && "opacity-50"
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-wrap items-center gap-1.5 p-2", children: [
+            (currentTerms ?? []).map((term) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              Badge,
+              {
+                variant: "secondary",
+                className: "gap-1 pr-1",
+                style: term.color ? { backgroundColor: term.color, color: "#fff" } : void 0,
+                children: [
+                  term.name,
+                  !disabled && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    Button,
+                    {
+                      type: "button",
+                      variant: "ghost",
+                      size: "icon",
+                      className: "size-4 hover:bg-transparent",
+                      onClick: () => removeTag(term._id),
+                      disabled: isSaving,
+                      "aria-label": `Remove ${term.name}`,
+                      children: /* @__PURE__ */ jsxRuntimeExports.jsx(X, { className: "size-3" })
+                    }
+                  )
+                ]
+              },
+              term._id
+            )),
+            !disabled && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Input,
+              {
+                ref: inputRef,
+                type: "text",
+                className: "h-7 min-w-[120px] flex-1 border-0 bg-transparent px-1 shadow-none focus-visible:ring-0",
+                value: inputValue,
+                onChange: (e) => {
+                  setInputValue(e.target.value);
+                  setShowSuggestions(true);
+                  setActiveSuggestionIndex(0);
+                },
+                onFocus: () => setShowSuggestions(true),
+                onKeyDown: handleKeyDown,
+                placeholder: selectedTermIds.length === 0 ? "Add tags..." : "",
+                disabled: disabled || isCreating || isSaving
+              }
+            )
+          ] }),
+          showSuggestions && (filteredSuggestions.length > 0 || showCreateOption) && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "div",
+            {
+              ref: suggestionsRef,
+              className: "absolute left-0 right-0 top-full z-50 mt-1 max-h-48 overflow-auto rounded-md border bg-popover shadow-lg",
+              role: "listbox",
+              children: [
+                filteredSuggestions.map((term, index) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                  "div",
+                  {
+                    "data-index": index,
+                    className: cn(
+                      "flex cursor-pointer items-center gap-2 px-3 py-2 text-sm",
+                      index === activeSuggestionIndex && "bg-accent"
+                    ),
+                    onClick: () => addTag(term._id),
+                    role: "option",
+                    "aria-selected": index === activeSuggestionIndex,
+                    children: [
+                      term.color && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                        "span",
+                        {
+                          className: "size-2.5 rounded-full",
+                          style: { backgroundColor: term.color }
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex-1", children: term.name }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-xs text-muted-foreground", children: [
+                        term.usageCount,
+                        " uses"
+                      ] })
+                    ]
+                  },
+                  term._id
+                )),
+                showCreateOption && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                  "div",
+                  {
+                    "data-index": filteredSuggestions.length,
+                    className: cn(
+                      "flex cursor-pointer items-center gap-2 px-3 py-2 text-sm",
+                      filteredSuggestions.length === activeSuggestionIndex && "bg-accent"
+                    ),
+                    onClick: createTag,
+                    role: "option",
+                    "aria-selected": filteredSuggestions.length === activeSuggestionIndex,
+                    children: [
+                      isCreating ? /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 animate-spin" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Plus, { className: "size-4" }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
+                        'Create "',
+                        inputValue.trim(),
+                        '"'
+                      ] })
+                    ]
+                  }
+                )
+              ]
+            }
+          ),
+          (isSaving || isCreating) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute inset-0 flex items-center justify-center bg-background/50", children: /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 animate-spin" }) })
+        ]
+      }
+    )
+  ] });
+}
+function MediaAssetEditDialog({
+  asset,
+  open,
+  onOpenChange,
+  onSaved
+}) {
+  const [name, setName] = reactExports.useState("");
+  const [title, setTitle] = reactExports.useState("");
+  const [description, setDescription] = reactExports.useState("");
+  const [altText, setAltText] = reactExports.useState("");
+  const [tagsInput, setTagsInput] = reactExports.useState("");
+  const [isSaving, setIsSaving] = reactExports.useState(false);
+  const [error, setError] = reactExports.useState("");
+  const updateAsset = useMutation(api.media.updateAsset);
+  const taxonomiesResult = useQuery(api.taxonomies.list, {
+    isActive: true,
+    paginationOpts: { numItems: 50, cursor: null }
+  });
+  const taxonomies = taxonomiesResult?.page ?? [];
+  reactExports.useEffect(() => {
+    if (asset) {
+      setName(asset.name);
+      setTitle(asset.title || "");
+      setDescription(asset.description || "");
+      setAltText(asset.altText || "");
+      setTagsInput(asset.tags?.join(", ") || "");
+      setError("");
+    }
+  }, [asset]);
+  const handleSave = reactExports.useCallback(async () => {
+    if (!asset) return;
+    if (!name.trim()) {
+      setError("Filename is required");
+      return;
+    }
+    setIsSaving(true);
+    setError("");
+    try {
+      const tags = tagsInput.split(",").map((t) => t.trim()).filter(Boolean);
+      await updateAsset({
+        id: asset._id,
+        name: name.trim(),
+        title: title.trim() || void 0,
+        description: description.trim() || void 0,
+        altText: altText.trim() || void 0,
+        tags: tags.length > 0 ? tags : void 0
+      });
+      onSaved?.();
+      onOpenChange(false);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Failed to update asset");
+    } finally {
+      setIsSaving(false);
+    }
+  }, [
+    asset,
+    name,
+    title,
+    description,
+    altText,
+    tagsInput,
+    updateAsset,
+    onSaved,
+    onOpenChange
+  ]);
+  if (!asset) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    CmsDialog,
+    {
+      open,
+      onOpenChange,
+      title: "Edit File",
+      size: "md",
+      footer: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          CmsButton,
+          {
+            variant: "outline",
+            onClick: () => onOpenChange(false),
+            disabled: isSaving,
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(CmsButton, { onClick: handleSave, loading: isSaving, children: "Save Changes" })
+      ] }),
+      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+        error && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md bg-destructive/10 p-3 text-sm text-destructive", children: error }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(CmsField, { label: "Filename", required: true, htmlFor: "asset-name", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Input,
+          {
+            id: "asset-name",
+            value: name,
+            onChange: (e) => setName(e.target.value),
+            placeholder: "Enter filename"
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          CmsField,
+          {
+            label: "Title",
+            description: "A human-readable title for the file",
+            htmlFor: "asset-title",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Input,
+              {
+                id: "asset-title",
+                value: title,
+                onChange: (e) => setTitle(e.target.value),
+                placeholder: "Enter title (optional)"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          CmsField,
+          {
+            label: "Description",
+            description: "A brief description of the file",
+            htmlFor: "asset-description",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Textarea,
+              {
+                id: "asset-description",
+                value: description,
+                onChange: (e) => setDescription(e.target.value),
+                placeholder: "Enter description (optional)",
+                rows: 3
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          CmsField,
+          {
+            label: "Alt Text",
+            description: "Alternative text for accessibility (important for images)",
+            htmlFor: "asset-alt",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Input,
+              {
+                id: "asset-alt",
+                value: altText,
+                onChange: (e) => setAltText(e.target.value),
+                placeholder: "Describe the image content"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          CmsField,
+          {
+            label: "Quick Tags",
+            description: "Comma-separated tags for simple organization",
+            htmlFor: "asset-tags",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Input,
+              {
+                id: "asset-tags",
+                value: tagsInput,
+                onChange: (e) => setTagsInput(e.target.value),
+                placeholder: "e.g., hero, blog, product"
+              }
+            )
+          }
+        ),
+        taxonomies.length > 0 && asset && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4 pt-2 border-t", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-muted-foreground", children: "Organize with taxonomy terms" }),
+          taxonomies.map((taxonomy) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+            MediaTaxonomyPicker,
+            {
+              mediaId: asset._id,
+              taxonomyId: taxonomy._id,
+              taxonomyName: taxonomy.displayName,
+              allowCreate: taxonomy.allowInlineCreation,
+              disabled: isSaving
+            },
+            taxonomy._id
+          ))
+        ] })
+      ] })
+    }
+  );
+}
+function MediaFolderEditDialog({
+  folder,
+  open,
+  onOpenChange,
+  onSaved
+}) {
+  const [name, setName] = reactExports.useState("");
+  const [description, setDescription] = reactExports.useState("");
+  const [isSaving, setIsSaving] = reactExports.useState(false);
+  const [error, setError] = reactExports.useState("");
+  const updateFolder = useMutation(api.media.updateFolder);
+  reactExports.useEffect(() => {
+    if (folder) {
+      setName(folder.name);
+      setDescription(folder.description || "");
+      setError("");
+    }
+  }, [folder]);
+  const handleSave = reactExports.useCallback(async () => {
+    if (!folder) return;
+    if (!name.trim()) {
+      setError("Folder name is required");
+      return;
+    }
+    setIsSaving(true);
+    setError("");
+    try {
+      await updateFolder({
+        id: folder._id,
+        name: name.trim(),
+        description: description.trim() || void 0
+      });
+      onSaved?.();
+      onOpenChange(false);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Failed to update folder");
+    } finally {
+      setIsSaving(false);
+    }
+  }, [folder, name, description, updateFolder, onSaved, onOpenChange]);
+  if (!folder) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    CmsDialog,
+    {
+      open,
+      onOpenChange,
+      title: "Edit Folder",
+      size: "sm",
+      footer: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          CmsButton,
+          {
+            variant: "outline",
+            onClick: () => onOpenChange(false),
+            disabled: isSaving,
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(CmsButton, { onClick: handleSave, loading: isSaving, children: "Save Changes" })
+      ] }),
+      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+        error && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md bg-destructive/10 p-3 text-sm text-destructive", children: error }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(CmsField, { label: "Folder Name", required: true, htmlFor: "folder-name", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Input,
+          {
+            id: "folder-name",
+            value: name,
+            onChange: (e) => setName(e.target.value),
+            placeholder: "Enter folder name"
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          CmsField,
+          {
+            label: "Description",
+            description: "A brief description of the folder contents",
+            htmlFor: "folder-description",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Textarea,
+              {
+                id: "folder-description",
+                value: description,
+                onChange: (e) => setDescription(e.target.value),
+                placeholder: "Enter description (optional)",
+                rows: 3
+              }
+            )
+          }
+        )
+      ] })
+    }
+  );
+}
+function MediaAssetActions({
+  asset,
+  onView,
+  onEdit,
+  onMove,
+  onDelete
+}) {
+  const handleDownload = () => {
+    if (!asset.url) return;
+    const link = document.createElement("a");
+    link.href = asset.url;
+    link.download = asset.name;
+    link.target = "_blank";
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+  };
+  const handleCopyUrl = async () => {
+    if (!asset.url) return;
+    await navigator.clipboard.writeText(asset.url);
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      CmsButton,
+      {
+        variant: "ghost",
+        size: "icon-sm",
+        className: "opacity-0 group-hover:opacity-100",
+        onClick: (e) => e.stopPropagation(),
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx(EllipsisVertical, { className: "size-4" })
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      DropdownMenuContent,
+      {
+        side: "bottom",
+        onClick: (e) => e.stopPropagation(),
+        children: [
+          onView && /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenuItem, { onClick: onView, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Eye, { className: "mr-2 size-4" }),
+            "View Details"
+          ] }),
+          onEdit && /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenuItem, { onClick: onEdit, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Pencil, { className: "mr-2 size-4" }),
+            "Edit"
+          ] }),
+          onMove && /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenuItem, { onClick: onMove, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(FolderInput, { className: "mr-2 size-4" }),
+            "Move to..."
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(DropdownMenuSeparator, {}),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenuItem, { onClick: handleDownload, disabled: !asset.url, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Download, { className: "mr-2 size-4" }),
+            "Download"
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenuItem, { onClick: handleCopyUrl, disabled: !asset.url, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Link2, { className: "mr-2 size-4" }),
+            "Copy URL"
+          ] }),
+          onDelete && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              DropdownMenuItem,
+              {
+                onClick: onDelete,
+                className: "text-destructive focus:text-destructive",
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "mr-2 size-4" }),
+                  "Delete"
+                ]
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function MediaFolderActions({
+  folder: _folder,
+  onEdit,
+  onMove,
+  onDelete
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      CmsButton,
+      {
+        variant: "ghost",
+        size: "icon-sm",
+        className: "opacity-0 group-hover:opacity-100",
+        onClick: (e) => e.stopPropagation(),
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx(Ellipsis, { className: "size-4" })
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenuContent, { align: "end", onClick: (e) => e.stopPropagation(), children: [
+      onEdit && /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenuItem, { onClick: onEdit, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Pencil, { className: "mr-2 size-4" }),
+        "Rename"
+      ] }),
+      onMove && /* @__PURE__ */ jsxRuntimeExports.jsxs(DropdownMenuItem, { onClick: onMove, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(FolderInput, { className: "mr-2 size-4" }),
+        "Move to..."
+      ] }),
+      onDelete && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(DropdownMenuSeparator, {}),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          DropdownMenuItem,
+          {
+            onClick: onDelete,
+            className: "text-destructive focus:text-destructive",
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "mr-2 size-4" }),
+              "Delete"
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+function MediaBulkActionBar({
+  selectedCount,
+  onClear,
+  onMove,
+  onDelete,
+  isDeleting
+}) {
+  if (selectedCount === 0) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fixed inset-x-0 bottom-0 z-50 border-t bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/80", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mx-auto flex max-w-7xl items-center justify-between px-6 py-3", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm font-medium", children: [
+        selectedCount,
+        " ",
+        selectedCount === 1 ? "file" : "files",
+        " selected"
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(CmsButton, { variant: "ghost", size: "sm", onClick: onClear, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(X, { className: "mr-1 size-4" }),
+        "Clear"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(CmsButton, { variant: "secondary", onClick: onMove, disabled: isDeleting, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(FolderInput, { className: "mr-2 size-4" }),
+        "Move to..."
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        CmsButton,
+        {
+          variant: "destructive",
+          onClick: onDelete,
+          loading: isDeleting,
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "mr-2 size-4" }),
+            "Delete"
+          ]
+        }
+      )
+    ] })
+  ] }) });
+}
+function MediaTrashBulkActionBar({
+  selectedCount,
+  onClear,
+  onRestore,
+  onPermanentDelete,
+  isRestoring,
+  isDeleting
+}) {
+  if (selectedCount === 0) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fixed inset-x-0 bottom-0 z-50 border-t bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/80", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mx-auto flex max-w-7xl items-center justify-between px-6 py-3", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm font-medium", children: [
+        selectedCount,
+        " ",
+        selectedCount === 1 ? "file" : "files",
+        " selected"
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(CmsButton, { variant: "ghost", size: "sm", onClick: onClear, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(X, { className: "mr-1 size-4" }),
+        "Clear"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        CmsButton,
+        {
+          variant: "secondary",
+          onClick: onRestore,
+          loading: isRestoring,
+          disabled: isDeleting,
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(RotateCcw, { className: "mr-2 size-4" }),
+            "Restore"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        CmsButton,
+        {
+          variant: "danger",
+          onClick: onPermanentDelete,
+          loading: isDeleting,
+          disabled: isRestoring,
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "mr-2 size-4" }),
+            "Delete Forever"
+          ]
+        }
+      )
+    ] })
+  ] }) });
+}
+function MediaMoveModal({
+  open,
+  onOpenChange,
+  assetIds,
+  currentFolderId,
+  onMoved
+}) {
+  const [selectedFolderId, setSelectedFolderId] = reactExports.useState(
+    void 0
+  );
+  const [isMoving, setIsMoving] = reactExports.useState(false);
+  const [error, setError] = reactExports.useState("");
+  const folderTree = useQuery(api.media.getFolderTree, {});
+  const moveAssets = useMutation(api.media.moveAssets);
+  const sortedFolders = reactExports.useMemo(() => {
+    if (!folderTree) return [];
+    const buildTree = (parentId, depth) => {
+      const children = folderTree.filter((f) => f.parentId === parentId);
+      return children.flatMap((folder) => [
+        { ...folder, depth },
+        ...buildTree(folder._id, depth + 1)
+      ]);
+    };
+    return buildTree(void 0, 0);
+  }, [folderTree]);
+  const handleMove = async () => {
+    if (assetIds.length === 0) return;
+    setIsMoving(true);
+    setError("");
+    try {
+      await moveAssets({
+        assetIds,
+        targetFolderId: selectedFolderId
+      });
+      onMoved?.();
+      onOpenChange(false);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Failed to move files");
+    } finally {
+      setIsMoving(false);
+    }
+  };
+  const isCurrentFolder = selectedFolderId === currentFolderId;
+  const isRootSelected = selectedFolderId === void 0;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    CmsDialog,
+    {
+      open,
+      onOpenChange,
+      title: "Move Files",
+      description: `Select a destination folder for ${assetIds.length} ${assetIds.length === 1 ? "file" : "files"}`,
+      size: "sm",
+      footer: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          CmsButton,
+          {
+            variant: "outline",
+            onClick: () => onOpenChange(false),
+            disabled: isMoving,
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          CmsButton,
+          {
+            onClick: handleMove,
+            loading: isMoving,
+            disabled: isCurrentFolder,
+            children: "Move Here"
+          }
+        )
+      ] }),
+      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
+        error && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md bg-destructive/10 p-3 text-sm text-destructive", children: error }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-h-[300px] overflow-y-auto rounded-md border", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "button",
+            {
+              type: "button",
+              className: cn(
+                "flex w-full items-center gap-2 px-3 py-2 text-left text-sm transition-colors hover:bg-muted",
+                isRootSelected && "bg-primary/10 text-primary",
+                currentFolderId === void 0 && "opacity-50"
+              ),
+              onClick: () => setSelectedFolderId(void 0),
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(House, { className: "size-4" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-medium", children: "Root (All Files)" }),
+                currentFolderId === void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ml-auto text-xs text-muted-foreground", children: "Current" })
+              ]
+            }
+          ),
+          sortedFolders.map((folder) => {
+            const isCurrent = folder._id === currentFolderId;
+            const isSelected = folder._id === selectedFolderId;
+            return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              "button",
+              {
+                type: "button",
+                className: cn(
+                  "flex w-full items-center gap-2 px-3 py-2 text-left text-sm transition-colors hover:bg-muted",
+                  isSelected && "bg-primary/10 text-primary",
+                  isCurrent && "opacity-50"
+                ),
+                style: { paddingLeft: `${12 + folder.depth * 20}px` },
+                onClick: () => setSelectedFolderId(folder._id),
+                children: [
+                  folder.depth > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-3 text-muted-foreground" }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(Folder, { className: "size-4 text-amber-500" }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate", children: folder.name }),
+                  isCurrent && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ml-auto text-xs text-muted-foreground", children: "Current" })
+                ]
+              },
+              folder._id
+            );
+          }),
+          sortedFolders.length === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-3 py-6 text-center text-sm text-muted-foreground", children: "No folders yet. Create folders to organize your files." })
+        ] }),
+        isCurrentFolder && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-muted-foreground", children: "Files are already in this folder" })
+      ] })
+    }
+  );
+}
+function formatFileSize(bytes) {
+  if (bytes === 0) return "0 B";
+  const k = 1024;
+  const sizes = ["B", "KB", "MB", "GB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;
+}
+function formatDate(timestamp) {
+  return new Date(timestamp).toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: "numeric"
+  });
+}
+function getMediaTypeIcon(type, className = "size-6") {
+  const iconProps = {
+    className
+  };
+  switch (type) {
+    case "image":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Image, { ...iconProps });
+    case "video":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Video, { ...iconProps });
+    case "audio":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Music, { ...iconProps });
+    case "document":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(FileText, { ...iconProps });
+    default:
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(File, { ...iconProps });
+  }
+}
+function getMediaTypeFromMimeType(mimeType) {
+  if (!mimeType) return "other";
+  if (mimeType.startsWith("image/")) return "image";
+  if (mimeType.startsWith("video/")) return "video";
+  if (mimeType.startsWith("audio/")) return "audio";
+  if (mimeType === "application/pdf" || mimeType.includes("document") || mimeType.includes("sheet") || mimeType.includes("presentation") || mimeType.startsWith("text/")) {
+    return "document";
+  }
+  return "other";
+}
+function MediaPage() {
+  const {
+    settings
+  } = useSettingsConfig();
+  const navigate = useNavigate();
+  reactExports.useEffect(() => {
+    if (settings && !settings.features.mediaManagement) {
+      navigate({
+        to: "/"
+      });
+    }
+  }, [settings, navigate]);
+  const [currentFolderId, setCurrentFolderId] = reactExports.useState(void 0);
+  const [searchQuery, setSearchQuery] = reactExports.useState("");
+  const [typeFilter, setTypeFilter] = reactExports.useState("");
+  const [selectedTermIds, setSelectedTermIds] = reactExports.useState([]);
+  const [selectedAssets, setSelectedAssets] = reactExports.useState(/* @__PURE__ */ new Set());
+  const [isSelectionMode, setIsSelectionMode] = reactExports.useState(false);
+  const [showNewFolderModal, setShowNewFolderModal] = reactExports.useState(false);
+  const [showUploadModal, setShowUploadModal] = reactExports.useState(false);
+  const [newFolderName, setNewFolderName] = reactExports.useState("");
+  const [isCreatingFolder, setIsCreatingFolder] = reactExports.useState(false);
+  const [folderError, setFolderError] = reactExports.useState("");
+  const [previewIndex, setPreviewIndex] = reactExports.useState(null);
+  const [editingAsset, setEditingAsset] = reactExports.useState(null);
+  const [editingFolder, setEditingFolder] = reactExports.useState(null);
+  const [deleteTarget, setDeleteTarget] = reactExports.useState(null);
+  const [isDeleting, setIsDeleting] = reactExports.useState(false);
+  const [showMoveModal, setShowMoveModal] = reactExports.useState(false);
+  const [showBulkDeleteConfirm, setShowBulkDeleteConfirm] = reactExports.useState(false);
+  const [isBulkDeleting, setIsBulkDeleting] = reactExports.useState(false);
+  const [activeView, setActiveView] = reactExports.useState("library");
+  const [isRestoring, setIsRestoring] = reactExports.useState(false);
+  const [isPermanentlyDeleting, setIsPermanentlyDeleting] = reactExports.useState(false);
+  const [showPermanentDeleteConfirm, setShowPermanentDeleteConfirm] = reactExports.useState(false);
+  const [permanentDeleteTarget, setPermanentDeleteTarget] = reactExports.useState(null);
+  const isTrashView = activeView === "trash";
+  const assetsResult = useQuery(api.media.listAssets, {
+    folderId: isTrashView ? void 0 : currentFolderId,
+    type: typeFilter || void 0,
+    search: searchQuery || void 0,
+    deletedOnly: isTrashView ? true : void 0,
+    paginationOpts: {
+      numItems: 100,
+      cursor: null
+    }
+  });
+  const trashCount = useQuery(api.media.getTrashCount, {});
+  const mediaByTermResult0 = useQuery(api.taxonomies.getMediaByTerm, selectedTermIds[0] ? {
+    termId: selectedTermIds[0]
+  } : "skip");
+  const mediaByTermResult1 = useQuery(api.taxonomies.getMediaByTerm, selectedTermIds[1] ? {
+    termId: selectedTermIds[1]
+  } : "skip");
+  const mediaByTermResult2 = useQuery(api.taxonomies.getMediaByTerm, selectedTermIds[2] ? {
+    termId: selectedTermIds[2]
+  } : "skip");
+  const termFilteredMediaIds = reactExports.useMemo(() => {
+    if (selectedTermIds.length === 0) return null;
+    const ids = /* @__PURE__ */ new Set();
+    const results = [mediaByTermResult0, mediaByTermResult1, mediaByTermResult2];
+    for (let i = 0; i < selectedTermIds.length && i < 3; i++) {
+      const result = results[i];
+      if (result?.page) {
+        for (const media of result.page) {
+          ids.add(media._id);
+        }
+      }
+    }
+    return ids;
+  }, [selectedTermIds, mediaByTermResult0, mediaByTermResult1, mediaByTermResult2]);
+  const folders = useQuery(api.media.listFolders, {
+    parentId: isTrashView ? void 0 : currentFolderId,
+    deletedOnly: isTrashView || void 0
+  });
+  const currentFolder = useQuery(api.media.getFolder, currentFolderId ? {
+    id: currentFolderId
+  } : "skip");
+  const folderTree = useQuery(api.media.getFolderTree, {});
+  const createFolder = useMutation(api.media.createFolder);
+  const deleteAsset = useMutation(api.media.deleteAsset);
+  const deleteFolder = useMutation(api.media.deleteFolder);
+  const restoreAsset = useMutation(api.media.restoreAsset);
+  const restoreFolder = useMutation(api.media.restoreFolder);
+  const permanentDeleteAsset = useMutation(api.media.permanentDeleteAsset);
+  const bulkPermanentDeleteAssets = useMutation(api.media.bulkPermanentDeleteAssets);
+  const breadcrumbPath = reactExports.useMemo(() => {
+    if (!currentFolderId || !folderTree) return [];
+    const path = [];
+    let folder = folderTree.find((f) => f._id === currentFolderId);
+    while (folder) {
+      path.unshift(folder);
+      const parentId = folder.parentId;
+      folder = parentId ? folderTree.find((f) => f._id === parentId) : void 0;
+    }
+    return path;
+  }, [currentFolderId, folderTree]);
+  const handleFolderClick = reactExports.useCallback((folderId) => {
+    setCurrentFolderId(folderId);
+    setSearchQuery("");
+  }, []);
+  const handleNavigateUp = reactExports.useCallback(() => {
+    if (currentFolder?.parentId) {
+      setCurrentFolderId(currentFolder.parentId);
+    } else {
+      setCurrentFolderId(void 0);
+    }
+  }, [currentFolder]);
+  const handleNavigateToRoot = reactExports.useCallback(() => {
+    setCurrentFolderId(void 0);
+    setSearchQuery("");
+  }, []);
+  const handleAssetSelect = reactExports.useCallback((assetId) => {
+    setSelectedAssets((prev) => {
+      const next = new Set(prev);
+      if (next.has(assetId)) {
+        next.delete(assetId);
+      } else {
+        next.add(assetId);
+      }
+      return next;
+    });
+  }, []);
+  const handleSelectAll = reactExports.useCallback(() => {
+    if (!assetsResult?.page) return;
+    setSelectedAssets(new Set(assetsResult.page.map((a) => a._id)));
+  }, [assetsResult?.page]);
+  const handleDeselectAll = reactExports.useCallback(() => {
+    setSelectedAssets(/* @__PURE__ */ new Set());
+  }, []);
+  const handleViewChange = reactExports.useCallback((view) => {
+    setActiveView(view);
+    setSelectedAssets(/* @__PURE__ */ new Set());
+    setIsSelectionMode(false);
+  }, []);
+  const handleAssetClick = reactExports.useCallback((assetId) => {
+    if (isSelectionMode) {
+      handleAssetSelect(assetId);
+    } else {
+      const index = assetsResult?.page?.findIndex((a) => a._id === assetId) ?? -1;
+      if (index !== -1) {
+        setPreviewIndex(index);
+      }
+    }
+  }, [isSelectionMode, handleAssetSelect, assetsResult?.page]);
+  const handlePreviewNavigate = reactExports.useCallback((index) => {
+    setPreviewIndex(index);
+  }, []);
+  const handleDelete = reactExports.useCallback(async () => {
+    if (!deleteTarget) return;
+    setIsDeleting(true);
+    try {
+      if (deleteTarget.type === "asset") {
+        await deleteAsset({
+          id: deleteTarget.id
+        });
+      } else {
+        await deleteFolder({
+          id: deleteTarget.id
+        });
+      }
+      setDeleteTarget(null);
+    } catch (err) {
+      console.error("Delete failed:", err);
+    } finally {
+      setIsDeleting(false);
+    }
+  }, [deleteTarget, deleteAsset, deleteFolder]);
+  const handleBulkDelete = reactExports.useCallback(async () => {
+    if (selectedAssets.size === 0) return;
+    setIsBulkDeleting(true);
+    try {
+      const deletePromises = Array.from(selectedAssets).map((id) => deleteAsset({
+        id
+      }));
+      await Promise.all(deletePromises);
+      setSelectedAssets(/* @__PURE__ */ new Set());
+      setIsSelectionMode(false);
+      setShowBulkDeleteConfirm(false);
+    } catch (err) {
+      console.error("Bulk delete failed:", err);
+    } finally {
+      setIsBulkDeleting(false);
+    }
+  }, [selectedAssets, deleteAsset]);
+  const handleBulkMoveComplete = reactExports.useCallback(() => {
+    setSelectedAssets(/* @__PURE__ */ new Set());
+    setIsSelectionMode(false);
+  }, []);
+  const handleRestore = reactExports.useCallback(async (assetId) => {
+    setIsRestoring(true);
+    try {
+      await restoreAsset({
+        id: assetId
+      });
+    } catch (err) {
+      console.error("Restore failed:", err);
+    } finally {
+      setIsRestoring(false);
+    }
+  }, [restoreAsset]);
+  const handleBulkRestore = reactExports.useCallback(async () => {
+    if (selectedAssets.size === 0) return;
+    setIsRestoring(true);
+    try {
+      const restorePromises = Array.from(selectedAssets).map((id) => restoreAsset({
+        id
+      }));
+      await Promise.all(restorePromises);
+      setSelectedAssets(/* @__PURE__ */ new Set());
+      setIsSelectionMode(false);
+    } catch (err) {
+      console.error("Bulk restore failed:", err);
+    } finally {
+      setIsRestoring(false);
+    }
+  }, [selectedAssets, restoreAsset]);
+  const handleRestoreFolder = reactExports.useCallback(async (folderId) => {
+    setIsRestoring(true);
+    try {
+      await restoreFolder({
+        id: folderId
+      });
+    } catch (err) {
+      console.error("Restore folder failed:", err);
+    } finally {
+      setIsRestoring(false);
+    }
+  }, [restoreFolder]);
+  const handlePermanentDelete = reactExports.useCallback(async () => {
+    if (!permanentDeleteTarget) return;
+    setIsPermanentlyDeleting(true);
+    try {
+      if (permanentDeleteTarget === "bulk") {
+        await bulkPermanentDeleteAssets({
+          ids: Array.from(selectedAssets)
+        });
+        setSelectedAssets(/* @__PURE__ */ new Set());
+        setIsSelectionMode(false);
+      } else {
+        await permanentDeleteAsset({
+          id: permanentDeleteTarget
+        });
+      }
+      setShowPermanentDeleteConfirm(false);
+      setPermanentDeleteTarget(null);
+    } catch (err) {
+      console.error("Permanent delete failed:", err);
+    } finally {
+      setIsPermanentlyDeleting(false);
+    }
+  }, [permanentDeleteTarget, permanentDeleteAsset, bulkPermanentDeleteAssets, selectedAssets]);
+  const handleCreateFolder = reactExports.useCallback(async () => {
+    if (!newFolderName.trim()) {
+      setFolderError("Folder name is required");
+      return;
+    }
+    setIsCreatingFolder(true);
+    setFolderError("");
+    try {
+      await createFolder({
+        name: newFolderName.trim(),
+        parentId: currentFolderId
+      });
+      setShowNewFolderModal(false);
+      setNewFolderName("");
+    } catch (error) {
+      setFolderError(error instanceof Error ? error.message : "Failed to create folder");
+    } finally {
+      setIsCreatingFolder(false);
+    }
+  }, [newFolderName, currentFolderId, createFolder]);
+  const handleUploadComplete = reactExports.useCallback((_results) => {
+    setShowUploadModal(false);
+  }, []);
+  const isLoading = assetsResult === void 0 || folders === void 0;
+  const displayedAssets = reactExports.useMemo(() => {
+    const assets = assetsResult?.page ?? [];
+    if (termFilteredMediaIds === null) {
+      return assets;
+    }
+    return assets.filter((asset) => termFilteredMediaIds.has(asset._id));
+  }, [assetsResult?.page, termFilteredMediaIds]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-6 p-6", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(CmsPageHeader, { title: "Media Library", description: "Upload, organize, and manage media assets for your content." }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(Tabs, { value: activeView, onValueChange: (v) => handleViewChange(v), children: /* @__PURE__ */ jsxRuntimeExports.jsxs(TabsList, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(TabsTrigger, { value: "library", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Image, { className: "mr-1.5 size-4" }),
+        "Library"
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(TabsTrigger, { value: "trash", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "mr-1.5 size-4" }),
+        "Trash",
+        trashCount && trashCount.total > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "secondary", className: "ml-1.5", children: trashCount.total })
+      ] })
+    ] }) }),
+    !isTrashView && /* @__PURE__ */ jsxRuntimeExports.jsxs("nav", { className: "flex items-center gap-1", "aria-label": "Folder navigation", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: cn("flex items-center gap-1.5 rounded-md px-2 py-1 text-sm transition-colors", !currentFolderId ? "bg-primary/10 font-medium text-primary" : "text-muted-foreground hover:bg-muted hover:text-foreground"), onClick: handleNavigateToRoot, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(House, { className: "size-4" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "All Files" })
+      ] }),
+      breadcrumbPath.map((folder, index) => /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "mx-1 text-muted-foreground", children: "/" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: cn("rounded-md px-2 py-1 text-sm transition-colors", index === breadcrumbPath.length - 1 ? "bg-primary/10 font-medium text-primary" : "text-muted-foreground hover:bg-muted hover:text-foreground"), onClick: () => handleFolderClick(folder._id), children: folder.name })
+      ] }, folder._id))
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(CmsToolbar, { left: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Search, { className: "absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Input, { type: "search", placeholder: "Search files...", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), className: "w-64 pl-9" }),
+        searchQuery && /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "absolute right-2 top-1/2 -translate-y-1/2 rounded p-0.5 hover:bg-muted", onClick: () => setSearchQuery(""), "aria-label": "Clear search", children: /* @__PURE__ */ jsxRuntimeExports.jsx(X, { className: "size-4 text-muted-foreground" }) })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(Select, { value: typeFilter || "all", onValueChange: (v) => setTypeFilter(v === "all" ? "" : v), children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(SelectTrigger, { className: "w-36", children: /* @__PURE__ */ jsxRuntimeExports.jsx(SelectValue, { placeholder: "All Types" }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(SelectContent, { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "all", children: "All Types" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "image", children: "Images" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "video", children: "Videos" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "audio", children: "Audio" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "document", children: "Documents" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SelectItem, { value: "other", children: "Other" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(TaxonomyFilter, { selectedTermIds, onChange: setSelectedTermIds, placeholder: "Tags" }),
+      assetsResult?.page && assetsResult.page.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "flex cursor-pointer items-center gap-2 text-sm", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Checkbox, { checked: isSelectionMode, onCheckedChange: (checked) => {
+          setIsSelectionMode(checked);
+          if (!checked) {
+            setSelectedAssets(/* @__PURE__ */ new Set());
+          }
+        } }),
+        "Selection Mode"
+      ] })
+    ] }), right: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
+      isSelectionMode && selectedAssets.size > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm text-muted-foreground", children: [
+        selectedAssets.size,
+        " selected"
+      ] }),
+      isSelectionMode && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(CmsButton, { variant: "secondary", size: "sm", onClick: handleSelectAll, children: "Select All" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(CmsButton, { variant: "secondary", size: "sm", onClick: handleDeselectAll, children: "Clear" })
+      ] }),
+      currentFolderId && !isTrashView && /* @__PURE__ */ jsxRuntimeExports.jsxs(CmsButton, { variant: "secondary", onClick: handleNavigateUp, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronLeft, { className: "size-4" }),
+        "Up"
+      ] }),
+      !isTrashView && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(CmsButton, { variant: "secondary", onClick: () => setShowNewFolderModal(true), children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(FolderPlus, { className: "size-4" }),
+          "New Folder"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(CmsButton, { onClick: () => setShowUploadModal(true), children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Upload, { className: "size-4" }),
+          "Upload Files"
+        ] })
+      ] })
+    ] }) }),
+    isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "size-8 animate-spin rounded-full border-2 border-muted border-t-primary" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-4 text-sm text-muted-foreground", children: "Loading media library..." })
+    ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+      !isTrashView && folders && folders.length > 0 && !searchQuery && /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "mb-3 text-sm font-medium text-muted-foreground", children: "Folders" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid grid-cols-2 gap-3 sm:grid-cols-4 md:grid-cols-6", children: folders.map((folder) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "group relative flex flex-col items-center gap-2 rounded-lg border bg-card p-4 text-center transition-colors hover:border-primary/50 hover:bg-muted/50 cursor-pointer", onClick: () => handleFolderClick(folder._id), children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute right-2 top-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(MediaFolderActions, { folder: {
+            _id: folder._id,
+            name: folder.name
+          }, onEdit: () => setEditingFolder({
+            _id: folder._id,
+            name: folder.name,
+            description: folder.description
+          }), onDelete: () => setDeleteTarget({
+            type: "folder",
+            id: folder._id,
+            name: folder.name
+          }) }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Folder, { className: "size-10 text-amber-500" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate text-sm font-medium", children: folder.name })
+        ] }, folder._id)) })
+      ] }),
+      isTrashView && folders && folders.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("h3", { className: "mb-3 text-sm font-medium text-muted-foreground", children: [
+          "Deleted Folders (",
+          folders.length,
+          ")"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid grid-cols-2 gap-3 sm:grid-cols-4 md:grid-cols-6", children: folders.map((folder) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "group relative flex flex-col items-center gap-2 rounded-lg border border-destructive/20 bg-card p-4 text-center opacity-60", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Folder, { className: "size-10 text-amber-500/50" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate text-sm font-medium", children: folder.name }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(CmsButton, { variant: "secondary", size: "sm", onClick: () => handleRestoreFolder(folder._id), disabled: isRestoring, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(RotateCcw, { className: "mr-1 size-3" }),
+            "Restore"
+          ] })
+        ] }, folder._id)) })
+      ] }),
+      displayedAssets.length > 0 ? /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { children: [
+        !isTrashView && folders && folders.length > 0 && !searchQuery && /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "mb-3 text-sm font-medium text-muted-foreground", children: "Files" }),
+        isTrashView && /* @__PURE__ */ jsxRuntimeExports.jsxs("h3", { className: "mb-3 text-sm font-medium text-muted-foreground", children: [
+          "Deleted Files (",
+          displayedAssets.length,
+          ")"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid grid-cols-2 gap-3 sm:grid-cols-4 md:grid-cols-6", children: displayedAssets.map((asset) => {
+          const assetId = asset._id;
+          const isSelected = selectedAssets.has(assetId);
+          const mediaType = getMediaTypeFromMimeType(asset.mimeType);
+          return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("group relative flex flex-col overflow-hidden rounded-lg border bg-card transition-all cursor-pointer hover:border-primary/50", isSelected && "border-primary ring-2 ring-primary/20"), onClick: () => handleAssetClick(assetId), children: [
+            isSelectionMode && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute left-2 top-2 z-10", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Checkbox, { checked: isSelected, onCheckedChange: () => handleAssetSelect(assetId), onClick: (e) => e.stopPropagation(), className: "bg-white/80" }) }),
+            !isSelectionMode && !isTrashView && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute right-2 top-2 z-10", children: /* @__PURE__ */ jsxRuntimeExports.jsx(MediaAssetActions, { asset: {
+              _id: asset._id,
+              name: asset.name,
+              url: asset.url
+            }, onView: () => {
+              const index = displayedAssets.findIndex((a) => a._id === asset._id);
+              if (index !== -1) setPreviewIndex(index);
+            }, onEdit: () => setEditingAsset({
+              _id: asset._id,
+              name: asset.name,
+              title: asset.title,
+              description: asset.description,
+              altText: asset.altText,
+              tags: asset.tags
+            }), onDelete: () => setDeleteTarget({
+              type: "asset",
+              id: asset._id,
+              name: asset.name
+            }) }) }),
+            !isSelectionMode && isTrashView && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "absolute right-2 top-2 z-10 flex gap-1 opacity-0 group-hover:opacity-100", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(CmsButton, { variant: "secondary", size: "icon-sm", onClick: (e) => {
+                e.stopPropagation();
+                handleRestore(asset._id);
+              }, title: "Restore", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RotateCcw, { className: "size-4" }) }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(CmsButton, { variant: "danger", size: "icon-sm", onClick: (e) => {
+                e.stopPropagation();
+                setPermanentDeleteTarget(asset._id);
+                setShowPermanentDeleteConfirm(true);
+              }, title: "Delete Forever", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "size-4" }) })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "aspect-square overflow-hidden bg-muted", children: mediaType === "image" && asset.url ? /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: asset.url, alt: asset.title || asset.name, className: "h-full w-full object-cover" }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex size-full items-center justify-center text-muted-foreground", children: getMediaTypeIcon(mediaType, "size-10") }) }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-2", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "truncate text-sm font-medium", title: asset.name, children: asset.name }),
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-0.5 flex items-center gap-1 text-xs text-muted-foreground", children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "capitalize", children: mediaType }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "•" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: formatFileSize(asset.size ?? 0) })
+              ] }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-0.5 text-xs text-muted-foreground", children: formatDate(asset._creationTime) })
+            ] })
+          ] }, asset._id);
+        }) }),
+        !assetsResult.isDone && /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mt-4 text-center text-sm text-muted-foreground", children: [
+          "Showing ",
+          assetsResult.page.length,
+          " files. More files available."
+        ] })
+      ] }) : isTrashView ? /* @__PURE__ */ jsxRuntimeExports.jsx(CmsEmptyState, { icon: /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "size-8" }), title: "Trash is empty", description: "Deleted files will appear here. You can restore them or permanently delete them." }) : !folders?.length && /* @__PURE__ */ jsxRuntimeExports.jsx(CmsEmptyState, { icon: /* @__PURE__ */ jsxRuntimeExports.jsx(Image, { className: "size-8" }), title: "No media assets yet", description: "Upload images, videos, documents, and other files to use in your content.", action: {
+        label: "Upload Files",
+        onClick: () => setShowUploadModal(true)
+      } }),
+      searchQuery && displayedAssets.length === 0 && !isTrashView && /* @__PURE__ */ jsxRuntimeExports.jsx(CmsEmptyState, { icon: /* @__PURE__ */ jsxRuntimeExports.jsx(Search, { className: "size-8" }), title: "No results found", description: `No files match "${searchQuery}". Try a different search term.`, action: {
+        label: "Clear Search",
+        onClick: () => setSearchQuery(""),
+        variant: "secondary"
+      } })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(Dialog, { open: showNewFolderModal, onOpenChange: setShowNewFolderModal, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(DialogContent, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(DialogHeader, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(DialogTitle, { children: "Create New Folder" }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "space-y-4 py-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Label, { htmlFor: "folder-name", children: "Folder Name" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Input, { id: "folder-name", value: newFolderName, onChange: (e) => {
+          setNewFolderName(e.target.value);
+          setFolderError("");
+        }, placeholder: "Enter folder name", autoFocus: true, onKeyDown: (e) => {
+          if (e.key === "Enter" && !isCreatingFolder) {
+            handleCreateFolder();
+          }
+        } }),
+        folderError && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-destructive", children: folderError })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(DialogFooter, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(CmsButton, { variant: "secondary", onClick: () => setShowNewFolderModal(false), disabled: isCreatingFolder, children: "Cancel" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(CmsButton, { onClick: handleCreateFolder, disabled: isCreatingFolder || !newFolderName.trim(), loading: isCreatingFolder, children: "Create Folder" })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(Dialog, { open: showUploadModal, onOpenChange: setShowUploadModal, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(DialogContent, { className: "max-w-lg", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(DialogHeader, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(DialogTitle, { children: "Upload Files" }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "py-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx(UploadDropzone, { currentFolderId, generateUploadUrl: api.media.generateUploadUrl, createAsset: api.media.createAsset, onUploadComplete: handleUploadComplete, maxFileSize: 50 * 1024 * 1024, maxConcurrentUploads: 3 }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(DialogFooter, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(CmsButton, { variant: "secondary", onClick: () => setShowUploadModal(false), children: "Close" }) })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(MediaPreviewModal, { asset: previewIndex !== null && displayedAssets[previewIndex] ? displayedAssets[previewIndex] : null, assets: displayedAssets, currentIndex: previewIndex ?? 0, open: previewIndex !== null, onOpenChange: (open) => {
+      if (!open) setPreviewIndex(null);
+    }, onNavigate: handlePreviewNavigate, onEdit: isTrashView ? void 0 : (asset) => setEditingAsset({
+      _id: asset._id,
+      name: asset.name,
+      title: asset.title,
+      description: asset.description,
+      altText: asset.altText,
+      tags: asset.tags
+    }), onDelete: isTrashView ? void 0 : (asset) => setDeleteTarget({
+      type: "asset",
+      id: asset._id,
+      name: asset.name
+    }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(MediaAssetEditDialog, { asset: editingAsset, open: editingAsset !== null, onOpenChange: (open) => {
+      if (!open) setEditingAsset(null);
+    } }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(MediaFolderEditDialog, { folder: editingFolder, open: editingFolder !== null, onOpenChange: (open) => {
+      if (!open) setEditingFolder(null);
+    } }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(CmsConfirmDialog, { open: deleteTarget !== null, onOpenChange: (open) => {
+      if (!open) setDeleteTarget(null);
+    }, title: `Delete ${deleteTarget?.type === "folder" ? "Folder" : "File"}?`, description: `Are you sure you want to delete "${deleteTarget?.name}"? ${deleteTarget?.type === "folder" ? "This will also delete all files inside the folder." : "This action can be undone from the trash."}`, confirmLabel: "Delete", onConfirm: handleDelete, variant: "danger", loading: isDeleting }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(CmsConfirmDialog, { open: showBulkDeleteConfirm, onOpenChange: setShowBulkDeleteConfirm, title: "Delete Selected Files?", description: `Are you sure you want to delete ${selectedAssets.size} ${selectedAssets.size === 1 ? "file" : "files"}? This action can be undone from the trash.`, confirmLabel: "Delete All", onConfirm: handleBulkDelete, variant: "danger", loading: isBulkDeleting }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(CmsConfirmDialog, { open: showPermanentDeleteConfirm, onOpenChange: (open) => {
+      setShowPermanentDeleteConfirm(open);
+      if (!open) setPermanentDeleteTarget(null);
+    }, title: permanentDeleteTarget === "bulk" ? `Delete ${selectedAssets.size} ${selectedAssets.size === 1 ? "File" : "Files"} Forever?` : "Delete Forever?", description: permanentDeleteTarget === "bulk" ? `This will permanently delete ${selectedAssets.size} ${selectedAssets.size === 1 ? "file" : "files"}. This action cannot be undone.` : "This will permanently delete this file. This action cannot be undone.", confirmLabel: "Delete Forever", onConfirm: handlePermanentDelete, variant: "danger", loading: isPermanentlyDeleting }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(MediaMoveModal, { open: showMoveModal, onOpenChange: setShowMoveModal, assetIds: Array.from(selectedAssets), currentFolderId, onMoved: handleBulkMoveComplete }),
+    isSelectionMode && !isTrashView && /* @__PURE__ */ jsxRuntimeExports.jsx(MediaBulkActionBar, { selectedCount: selectedAssets.size, onClear: handleDeselectAll, onMove: () => setShowMoveModal(true), onDelete: () => setShowBulkDeleteConfirm(true), isDeleting: isBulkDeleting }),
+    isSelectionMode && isTrashView && /* @__PURE__ */ jsxRuntimeExports.jsx(MediaTrashBulkActionBar, { selectedCount: selectedAssets.size, onClear: handleDeselectAll, onRestore: handleBulkRestore, onPermanentDelete: () => {
+      setPermanentDeleteTarget("bulk");
+      setShowPermanentDeleteConfirm(true);
+    }, isRestoring, isDeleting: isPermanentlyDeleting })
+  ] });
+}
+export {
+  MediaPage as component
+};