sanity-plugin-smart-asset-manager 1.0.0

package/dist/index.js

@@ -0,0 +1,1356 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  smartAssetManager: () => smartAssetManager
+});
+module.exports = __toCommonJS(index_exports);
+var import_sanity2 = require("sanity");
+
+// src/components/SmartAssetManagerTool.tsx
+var import_react6 = require("react");
+var import_ui6 = require("@sanity/ui");
+var import_sanity = require("sanity");
+
+// src/hooks/useAssets.ts
+var import_react = require("react");
+function useAssets(sanityClient, searchQuery, sortBy, type, offset, limit) {
+  const [assets, setAssets] = (0, import_react.useState)([]);
+  const [loading, setLoading] = (0, import_react.useState)(true);
+  const [total, setTotal] = (0, import_react.useState)(0);
+  const [refreshSeed, setRefreshSeed] = (0, import_react.useState)(0);
+  const refreshAssets = () => setRefreshSeed((s) => s + 1);
+  (0, import_react.useEffect)(() => {
+    async function fetchAssets() {
+      setLoading(true);
+      try {
+        let filterParts = ['_type in ["sanity.imageAsset", "sanity.fileAsset"]'];
+        if (type === "image") {
+          filterParts.push('_type == "sanity.imageAsset"');
+        } else if (type === "file") {
+          filterParts.push(
+            '_type == "sanity.fileAsset" && !(mimeType match "video/*") && !(mimeType match "audio/*")'
+          );
+        } else if (type === "video") {
+          filterParts.push('_type == "sanity.fileAsset" && mimeType match "video/*"');
+        } else if (type === "audio") {
+          filterParts.push('_type == "sanity.fileAsset" && mimeType match "audio/*"');
+        }
+        if (searchQuery) {
+          filterParts.push("(originalFilename match $searchQuery || _id match $searchQuery)");
+        }
+        const filter = filterParts.join(" && ");
+        const countQuery = `count(*[${filter}])`;
+        const query = `*[${filter}] | order(${sortBy} desc) [${offset}...${offset + limit}] {
+                                 _id,
+                                 _type,
+                                 url,
+                                 extension,
+                                 size,
+                                 mimeType,
+                                 originalFilename,
+                                 metadata {
+                                     dimensions
+                                 }
+                                 }`;
+        const [totalCount, results] = await Promise.all([
+          sanityClient.fetch(countQuery, { searchQuery: `*${searchQuery}*` }),
+          sanityClient.fetch(query, { searchQuery: `*${searchQuery}*` })
+        ]);
+        setTotal(totalCount);
+        setAssets(results);
+      } catch (error) {
+        console.error("Error fetching assets:", error);
+      } finally {
+        setLoading(false);
+      }
+    }
+    fetchAssets();
+  }, [sanityClient, searchQuery, sortBy, type, refreshSeed, offset, limit]);
+  return { assets, loading, total, refreshAssets };
+}
+
+// src/utils/assetQueries.ts
+async function getAssetUsage(sanityClient, assetId) {
+  const query = `*[references($assetId)] {
+    _id,
+    _type,
+    "title": coalesce(title, name, label, _id)
+  }`;
+  return await sanityClient.fetch(query, { assetId });
+}
+async function findUnusedAssets(sanityClient) {
+  const query = `*[
+    _type in ["sanity.imageAsset", "sanity.fileAsset"] &&
+    count(*[references(^._id)]) == 0
+  ] {
+    _id,
+    _type,
+    url,
+    size,
+    extension,
+    mimeType,
+    originalFilename,
+    metadata { dimensions }
+  }`;
+  return await sanityClient.fetch(query);
+}
+async function deleteAssets(sanityClient, assetIds) {
+  const transaction = sanityClient.transaction();
+  assetIds.forEach((id) => transaction.delete(id));
+  return await transaction.commit();
+}
+async function updateAssetFilename(sanityClient, assetId, filename) {
+  return await sanityClient.patch(assetId).set({ originalFilename: filename }).commit();
+}
+
+// src/components/AssetCard.tsx
+var import_ui = require("@sanity/ui");
+
+// src/utils/formatBytes.ts
+var formatBytes = (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(2)) + " " + sizes[i];
+};
+
+// src/components/common/Icons.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var SearchIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "11", cy: "11", r: "8" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
+    ]
+  }
+);
+var TrashIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("polyline", { points: "3 6 5 6 21 6" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "10", y1: "11", x2: "10", y2: "17" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "14", y1: "11", x2: "14", y2: "17" })
+    ]
+  }
+);
+var ResetIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M1 4v6h6" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M3.51 15a9 9 0 1 0 2.13-9.36L1 10" })
+    ]
+  }
+);
+var DocumentsIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("polyline", { points: "14 2 14 8 20 8" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "16", y1: "13", x2: "8", y2: "13" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "16", y1: "17", x2: "8", y2: "17" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("polyline", { points: "10 9 9 9 8 9" })
+    ]
+  }
+);
+var DownloadIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("polyline", { points: "7 10 12 15 17 10" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "12", y1: "15", x2: "12", y2: "3" })
+    ]
+  }
+);
+var FolderIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" })
+  }
+);
+var UploadIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("polyline", { points: "17 8 12 3 7 8" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "12", y1: "3", x2: "12", y2: "15" })
+    ]
+  }
+);
+var PdfIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("polyline", { points: "14 2 14 8 20 8" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M9 15h3a2 2 0 0 0 2-2V13a2 2 0 0 0-2-2H9v4z" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "9", y1: "11", x2: "9", y2: "17" })
+    ]
+  }
+);
+var AudioIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M9 18V5l12-2v13" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "6", cy: "18", r: "3" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "18", cy: "16", r: "3" })
+    ]
+  }
+);
+var SortIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "11", y1: "5", x2: "21", y2: "5" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "11", y1: "9", x2: "18", y2: "9" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "11", y1: "13", x2: "15", y2: "13" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "3", y1: "17", x2: "21", y2: "17" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("polyline", { points: "7 5 3 9 7 13" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "3", y1: "9", x2: "3", y2: "1" })
+    ]
+  }
+);
+
+// src/components/AssetCard.tsx
+var import_styled_components = __toESM(require("styled-components"));
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var StyledCard = (0, import_styled_components.default)(import_ui.Card)`
+  overflow: hidden;
+  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+  cursor: pointer;
+  position: relative;
+  border: 1px solid
+    ${(props) => props.selected ? "var(--card-focus-ring-color)" : "var(--card-border-color)"};
+  background-color: ${(props) => props.selected ? "var(--card-accent-bg-color)" : "inherit"};
+
+  &:hover {
+    transform: translateY(-4px);
+    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
+    border-color: var(--card-focus-ring-color);
+  }
+`;
+var ImageContainer = (0, import_styled_components.default)(import_ui.Box)`
+  width: 100%;
+  aspect-ratio: 1.25;
+  background-color: transparent;
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-bottom: 1px solid var(--card-border-color);
+  overflow: hidden;
+`;
+var SelectOverlay = (0, import_styled_components.default)(import_ui.Box)`
+  position: absolute;
+  top: 8px;
+  left: 8px;
+  z-index: 5;
+`;
+var AssetPreview = import_styled_components.default.img`
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  transition: transform 0.3s ease;
+
+  ${StyledCard}:hover & {
+    transform: scale(1.05);
+  }
+`;
+var VideoPreview = import_styled_components.default.video`
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  background: #000;
+`;
+var ActionBar = (0, import_styled_components.default)(import_ui.Flex)`
+  position: absolute;
+  bottom: 8px;
+  right: 8px;
+  background: var(--card-bg-color);
+  opacity: 0.95;
+  backdrop-filter: blur(4px);
+  border-radius: 8px;
+  padding: 2px;
+  opacity: 0;
+  border: 1px solid var(--card-border-color);
+  transition: opacity 0.2s ease;
+
+  ${StyledCard}:hover & {
+    opacity: 1;
+  }
+`;
+var AssetCard = ({ asset, onClick, isSelected, onSelect }) => {
+  const isImage = asset._type === "sanity.imageAsset";
+  const isVideo = asset?.mimeType?.startsWith("video/");
+  const isAudio = asset?.mimeType?.startsWith("audio/");
+  const isPdf = asset?.extension === "pdf" || asset?.mimeType === "application/pdf";
+  const handleCardClick = (e) => {
+    if (e.target.closest("button")) return;
+    onClick(asset);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(StyledCard, { radius: 3, onClick: handleCardClick, selected: isSelected, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(ImageContainer, { children: [
+      onSelect && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(SelectOverlay, { onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        import_ui.Checkbox,
+        {
+          checked: isSelected,
+          onChange: (e) => onSelect(asset._id, e.target.checked)
+        }
+      ) }),
+      isImage ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        AssetPreview,
+        {
+          src: `${asset.url}?w=400&h=320&fit=crop`,
+          alt: asset.originalFilename || ""
+        }
+      ) : isVideo ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(VideoPreview, { src: asset.url, muted: true, playsInline: true }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+        import_ui.Flex,
+        {
+          direction: "column",
+          align: "center",
+          justify: "center",
+          gap: 3,
+          style: { height: "100%", width: "100%" },
+          children: [
+            isPdf ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              PdfIcon,
+              {
+                style: {
+                  fontSize: "48px",
+                  color: "#ef4444"
+                }
+              }
+            ) : isAudio ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              AudioIcon,
+              {
+                style: {
+                  fontSize: "48px",
+                  color: "#ef4444"
+                }
+              }
+            ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              DocumentsIcon,
+              {
+                style: {
+                  fontSize: "48px",
+                  color: "#9ca3af"
+                }
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_ui.Text, { size: 1, weight: "bold", muted: true, children: (asset.extension || asset.mimeType?.split("/")[1])?.toUpperCase() || "OTHER" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ActionBar, { gap: 1, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        import_ui.Button,
+        {
+          icon: DownloadIcon,
+          mode: "bleed",
+          fontSize: 1,
+          padding: 2,
+          onClick: (e) => {
+            e.stopPropagation();
+            window.open(asset.url);
+          }
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_ui.Box, { padding: 3, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_ui.Stack, { space: 3, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_ui.Flex, { align: "center", direction: "column", gap: 2, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_ui.Text, { size: 1, weight: "semibold", textOverflow: "ellipsis", style: { flex: 1 }, children: asset.originalFilename || asset._id.substring(0, 10) }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_ui.Badge, { tone: asset.size > 1048576 ? "caution" : "default", fontSize: 0, children: formatBytes(asset.size) })
+    ] }) }) })
+  ] });
+};
+
+// src/components/AssetDetailsDialog.tsx
+var import_react2 = require("react");
+var import_ui2 = require("@sanity/ui");
+var import_router = require("sanity/router");
+var import_styled_components2 = __toESM(require("styled-components"));
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var PreviewContainer = (0, import_styled_components2.default)(import_ui2.Box)`
+  width: 100%;
+  border-radius: 8px;
+  overflow: hidden;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 200px;
+  margin-bottom: 16px;
+  border: 1px solid var(--card-border-color);
+`;
+var PreviewImage = import_styled_components2.default.img`
+  max-width: 100%;
+  max-height: 400px;
+  object-fit: contain;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+`;
+var VideoPreview2 = import_styled_components2.default.video`
+  max-width: 100%;
+  max-height: 400px;
+  object-fit: contain;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  background: #000;
+`;
+var PdfPreview = import_styled_components2.default.iframe`
+  width: 100%;
+  height: 400px;
+  border: none;
+  border-radius: 4px;
+`;
+var AudioPreview = import_styled_components2.default.audio`
+  width: 100%;
+  margin-top: 16px;
+`;
+var UsageCard = (0, import_styled_components2.default)(import_ui2.Card)`
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  cursor: pointer;
+  border: 1px solid var(--card-border-color);
+  &:hover {
+    background: var(--card-bg-color);
+    border-color: var(--card-focus-ring-color);
+    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
+  }
+`;
+var ViewText = (0, import_styled_components2.default)(import_ui2.Text)`
+  transition: all 0.2s ease;
+  color: var(--card-focus-ring-color);
+`;
+var AssetDetailsDialog = ({
+  asset,
+  onClose,
+  sanityClient,
+  onUpdate,
+  onDelete
+}) => {
+  const [newName, setNewName] = (0, import_react2.useState)(asset.originalFilename || "");
+  const [isUpdating, setIsUpdating] = (0, import_react2.useState)(false);
+  const [isDeleting, setIsDeleting] = (0, import_react2.useState)(false);
+  const [confirmDelete, setConfirmDelete] = (0, import_react2.useState)(false);
+  const [usage, setUsage] = (0, import_react2.useState)([]);
+  const [loadingUsage, setLoadingUsage] = (0, import_react2.useState)(true);
+  const toast = (0, import_ui2.useToast)();
+  const router = (0, import_router.useRouter)();
+  (0, import_react2.useEffect)(() => {
+    async function fetchUsage() {
+      setLoadingUsage(true);
+      try {
+        const results = await getAssetUsage(sanityClient, asset._id);
+        setUsage(results);
+      } catch (err) {
+        console.error(err);
+      } finally {
+        setLoadingUsage(false);
+      }
+    }
+    fetchUsage();
+  }, [asset._id, sanityClient]);
+  const handleUpdate = async () => {
+    if (!newName.trim()) return;
+    setIsUpdating(true);
+    try {
+      await updateAssetFilename(sanityClient, asset._id, newName);
+      onUpdate(asset._id, newName);
+      toast.push({
+        status: "success",
+        title: "Filename updated"
+      });
+    } catch (err) {
+      toast.push({
+        status: "error",
+        title: "Failed to update filename"
+      });
+    } finally {
+      setIsUpdating(false);
+    }
+  };
+  const handleDelete = async () => {
+    setIsDeleting(true);
+    try {
+      onDelete(asset._id);
+      onClose();
+      toast.push({
+        status: "success",
+        title: "Asset deleted"
+      });
+    } catch (err) {
+      toast.push({
+        status: "error",
+        title: "Failed to delete asset"
+      });
+    } finally {
+      setIsDeleting(false);
+      setConfirmDelete(false);
+    }
+  };
+  const handleDocClick = (docId, docType) => {
+    if (router && typeof router.navigateIntent === "function") {
+      router.navigateIntent("edit", { id: docId, type: docType });
+      onClose();
+    } else {
+      window.location.hash = `intent/edit/id=${docId};type=${docType}`;
+      onClose();
+    }
+  };
+  const isImage = asset._type === "sanity.imageAsset";
+  const isVideo = asset?.mimeType?.startsWith("video/");
+  const isAudio = asset?.mimeType?.startsWith("audio/");
+  const isPdf = asset?.extension === "pdf" || asset?.mimeType === "application/pdf";
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_ui2.Dialog,
+    {
+      id: "asset-details-dialog",
+      header: "Asset Details",
+      onClose,
+      width: 2,
+      footer: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { padding: 3, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { justify: "space-between", align: "center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          import_ui2.Tooltip,
+          {
+            content: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { padding: 2, style: { maxWidth: "350px" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { size: 1, children: usage.length > 0 ? "This asset is being used by documents and cannot be deleted. Remove all references first." : "Delete this asset permanently" }) }),
+            placement: "top",
+            portal: true,
+            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              import_ui2.Button,
+              {
+                icon: TrashIcon,
+                text: "Delete Asset",
+                tone: "critical",
+                mode: "ghost",
+                onClick: () => setConfirmDelete(true),
+                disabled: usage.length > 0 || loadingUsage
+              }
+            ) })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Flex, { gap: 2, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Button, { text: "Close", mode: "ghost", onClick: onClose }) })
+      ] }) }),
+      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Box, { padding: 4, children: [
+        confirmDelete && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          import_ui2.Dialog,
+          {
+            id: "confirm-asset-delete",
+            header: "Delete Asset?",
+            onClose: () => setConfirmDelete(false),
+            footer: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { padding: 3, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { gap: 2, justify: "flex-end", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Button, { text: "Cancel", mode: "ghost", onClick: () => setConfirmDelete(false) }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                import_ui2.Button,
+                {
+                  text: "Delete Permanently",
+                  tone: "critical",
+                  onClick: handleDelete,
+                  loading: isDeleting
+                }
+              )
+            ] }) }),
+            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { padding: 4, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Text, { children: [
+              "Are you sure you want to delete",
+              " ",
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("strong", { children: asset.originalFilename || "this asset" }),
+              "? This action cannot be undone."
+            ] }) })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Grid, { columns: [1, 1, 2], gap: 4, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Stack, { space: 4, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(PreviewContainer, { children: isImage ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(PreviewImage, { src: `${asset.url}?w=800`, alt: "" }) : isVideo ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(VideoPreview2, { src: asset.url, controls: true, muted: true, playsInline: true }) : isPdf ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(PdfPreview, { src: asset.url, title: "PDF Preview" }) : isAudio ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { direction: "column", align: "center", gap: 4, style: { width: "100%" }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AudioIcon, { style: { fontSize: "64px", color: "#ef4444" } }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AudioPreview, { src: asset.url, controls: true })
+            ] }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              import_ui2.Flex,
+              {
+                direction: "column",
+                align: "center",
+                justify: "center",
+                gap: 3,
+                style: { height: "300px", width: "100%" },
+                children: isPdf ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(PdfIcon, { style: { fontSize: "80px", color: "#ef4444" } }) : isAudio ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AudioIcon, { style: { fontSize: "80px", color: "#ef4444" } }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                  DocumentsIcon,
+                  {
+                    style: {
+                      fontSize: "80px",
+                      color: "#9ca3af"
+                    }
+                  }
+                )
+              }
+            ) }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Stack, { space: 3, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Box, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Label, { size: 1, children: "Original Filename" }),
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { gap: 2, marginTop: 2, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { style: { flex: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                    import_ui2.TextInput,
+                    {
+                      value: newName,
+                      onChange: (e) => setNewName(e.currentTarget.value),
+                      placeholder: "Enter filename..."
+                    }
+                  ) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                    import_ui2.Button,
+                    {
+                      text: "Save",
+                      tone: "primary",
+                      onClick: handleUpdate,
+                      loading: isUpdating,
+                      disabled: newName === asset.originalFilename
+                    }
+                  )
+                ] })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Card, { padding: 3, border: true, radius: 2, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Stack, { space: 3, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { weight: "bold", size: 1, children: "File Information" }),
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Stack, { space: 3, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { align: "flex-start", gap: 3, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { style: { minWidth: "85px" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { size: 1, muted: true, children: "ID:" }) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { flex: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { size: 1, style: { wordBreak: "break-all" }, children: asset._id }) })
+                  ] }),
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { align: "center", gap: 3, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { style: { minWidth: "85px" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { size: 1, muted: true, children: "Type:" }) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { flex: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Badge, { tone: "primary", mode: "outline", fontSize: 0, children: (asset.extension || asset.mimeType?.split("/")[1])?.toUpperCase() || "OTHER" }) })
+                  ] }),
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { align: "center", gap: 3, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { style: { minWidth: "85px" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { size: 1, muted: true, children: "Size:" }) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { flex: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { size: 1, children: formatBytes(asset.size) }) })
+                  ] }),
+                  asset.metadata?.dimensions && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { align: "center", gap: 3, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { style: { minWidth: "85px" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { size: 1, muted: true, children: "Dimensions:" }) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Box, { flex: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Text, { size: 1, children: [
+                      asset.metadata.dimensions.width,
+                      " \xD7 ",
+                      asset.metadata.dimensions.height,
+                      " ",
+                      "px"
+                    ] }) })
+                  ] })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                  import_ui2.Button,
+                  {
+                    icon: DownloadIcon,
+                    text: "Download File",
+                    mode: "ghost",
+                    onClick: () => window.open(asset.url)
+                  }
+                )
+              ] }) })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Stack, { space: 4, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { weight: "bold", size: 1, children: "Usage in Documents" }),
+            loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Flex, { align: "center", justify: "center", style: { padding: "40px" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Spinner, {}) }) : usage?.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Stack, { space: 2, style: { maxHeight: "500px", overflowY: "auto" }, children: usage?.map((doc) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              UsageCard,
+              {
+                padding: 3,
+                border: true,
+                radius: 2,
+                onClick: () => handleDocClick(doc._id, doc._type),
+                children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { align: "center", justify: "space-between", gap: 3, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { direction: "column", align: "flex-start", gap: 2, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { size: 1, weight: "semibold", children: doc.title }),
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Badge, { tone: "caution", fontSize: 0, children: doc._type })
+                  ] }),
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Flex, { align: "center", gap: 3, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ViewText, { size: 0, weight: "bold", className: "view-text", children: "VIEW \u2192" }) })
+                ] })
+              },
+              doc._id
+            )) }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Card, { padding: 4, border: true, radius: 2, tone: "transparent", style: { textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Text, { size: 1, muted: true, children: "No references found for this asset." }) })
+          ] })
+        ] })
+      ] })
+    }
+  );
+};
+
+// src/components/TopToolbar.tsx
+var import_react3 = __toESM(require("react"));
+var import_ui3 = require("@sanity/ui");
+var import_styled_components3 = __toESM(require("styled-components"));
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var StickyCard = (0, import_styled_components3.default)(import_ui3.Card)`
+  position: sticky;
+  top: 0;
+  z-index: 10;
+`;
+var SearchBox = (0, import_styled_components3.default)(import_ui3.Box)`
+  flex: 1;
+`;
+var FilterBox = (0, import_styled_components3.default)(import_ui3.Box)`
+  width: 140px;
+`;
+var TopToolbar = ({
+  searchQuery,
+  setSearchQuery,
+  sortBy,
+  setSortBy,
+  assetType,
+  setAssetType,
+  sizeFilter,
+  setSizeFilter,
+  onReset,
+  onUpload,
+  isUploading
+}) => {
+  const fileInputRef = import_react3.default.useRef(null);
+  const handleUploadClick = () => {
+    fileInputRef.current?.click();
+  };
+  const handleFileChange = (e) => {
+    if (e.target.files && e.target.files.length > 0) {
+      onUpload(e.target.files);
+      e.target.value = "";
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(StickyCard, { padding: 3, borderBottom: true, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_ui3.Flex, { align: "center", gap: 3, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      "input",
+      {
+        type: "file",
+        ref: fileInputRef,
+        style: { display: "none" },
+        onChange: handleFileChange,
+        multiple: true,
+        accept: "image/*,video/*,audio/*,application/*,text/*"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SearchBox, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      import_ui3.TextInput,
+      {
+        icon: SearchIcon,
+        placeholder: "Search name, extension, ID...",
+        value: searchQuery,
+        onChange: (e) => setSearchQuery(e.currentTarget.value),
+        fontSize: 1
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_ui3.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+      import_ui3.Select,
+      {
+        fontSize: 1,
+        value: sortBy,
+        onChange: (e) => setSortBy(e.currentTarget.value),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "_createdAt", children: "Upload Date" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "size", children: "File Size" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "originalFilename", children: "Name A-Z" })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterBox, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+      import_ui3.Select,
+      {
+        fontSize: 1,
+        value: assetType,
+        onChange: (e) => setAssetType(e.currentTarget.value),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "all", children: "All Types" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "image", children: "Images" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "video", children: "Videos" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "audio", children: "Audio" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "file", children: "Other Files" })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterBox, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+      import_ui3.Select,
+      {
+        fontSize: 1,
+        value: sizeFilter,
+        onChange: (e) => setSizeFilter(e.currentTarget.value),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "all", children: "All Sizes" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "small", children: "< 100 KB" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "medium", children: "100KB - 1MB" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "large", children: "> 1MB" })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_ui3.Button, { icon: ResetIcon, mode: "ghost", onClick: onReset, title: "Reset filters" }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      import_ui3.Button,
+      {
+        icon: UploadIcon,
+        text: isUploading ? "Uploading..." : "Upload",
+        tone: "primary",
+        onClick: handleUploadClick,
+        loading: isUploading
+      }
+    )
+  ] }) });
+};
+
+// src/components/tabs/SizeAnalyzer.tsx
+var import_react4 = __toESM(require("react"));
+var import_ui4 = require("@sanity/ui");
+var import_styled_components4 = __toESM(require("styled-components"));
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var TableCard = (0, import_styled_components4.default)(import_ui4.Card)`
+  border: 1px solid var(--card-border-color);
+`;
+var TableHeader = (0, import_styled_components4.default)(import_ui4.Box)`
+  border-bottom: 1px solid var(--card-border-color);
+`;
+var TableRow = (0, import_styled_components4.default)(import_ui4.Flex)`
+  border-bottom: ${(props) => props.$isLast ? "none" : "1px solid var(--card-border-color)"};
+  transition: background 0.2s ease;
+  &:hover {
+    background: var(--card-bg-color);
+    filter: brightness(0.95);
+  }
+`;
+var Thumbnail = import_styled_components4.default.img`
+  width: 40px;
+  height: 40px;
+  object-fit: cover;
+  border-radius: 4px;
+  background-color: var(--card-border-color);
+`;
+var SizeAnalyzer = ({ assets }) => {
+  const [sortOrder, setSortOrder] = import_react4.default.useState("desc");
+  const sortedAssets = import_react4.default.useMemo(() => {
+    return [...assets].sort((a, b) => {
+      return sortOrder === "desc" ? b.size - a.size : a.size - b.size;
+    });
+  }, [assets, sortOrder]);
+  const toggleSort = () => {
+    setSortOrder((prev) => prev === "desc" ? "asc" : "desc");
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_ui4.Stack, { space: 4, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Heading, { size: 1, children: "Image Size Analysis" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(TableCard, { border: true, radius: 2, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(TableHeader, { padding: 2, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_ui4.Flex, { align: "center", gap: 3, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Box, { style: { flex: 1 }, paddingLeft: 3, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Text, { size: 1, weight: "bold", children: "File" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Box, { style: { width: "120px" }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Text, { size: 1, weight: "bold", children: "Dimensions" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Box, { style: { width: "140px" }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_ui4.Flex, { align: "center", gap: 1, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Text, { size: 1, weight: "bold", children: "Weight" }),
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+            import_ui4.Button,
+            {
+              icon: SortIcon,
+              mode: "bleed",
+              padding: 2,
+              onClick: toggleSort,
+              fontSize: 1,
+              title: `Sort by weight ${sortOrder === "desc" ? "Ascending" : "Descending"}`,
+              style: { transform: sortOrder === "asc" ? "rotate(180deg)" : "none" }
+            }
+          )
+        ] }) })
+      ] }) }),
+      sortedAssets.slice(0, 50).map((asset, i) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+        TableRow,
+        {
+          padding: 3,
+          align: "center",
+          gap: 3,
+          $isLast: i === (sortedAssets.length < 50 ? sortedAssets.length - 1 : 49),
+          children: [
+            asset._type === "sanity.imageAsset" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Thumbnail, { src: `${asset.url}?w=40&h=40&fit=crop`, alt: "" }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+              import_ui4.Box,
+              {
+                style: {
+                  width: "40px",
+                  height: "40px",
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  background: "var(--card-border-color)",
+                  borderRadius: "4px"
+                },
+                children: asset.mimeType?.startsWith("video/") ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DocumentsIcon, { style: { fontSize: "20px", color: "#3b82f6" } }) : asset.mimeType?.startsWith("audio/") ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(AudioIcon, { style: { fontSize: "20px", color: "#ef4444" } }) : asset.extension === "pdf" || asset.mimeType === "application/pdf" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(PdfIcon, { style: { fontSize: "20px", color: "#ef4444" } }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DocumentsIcon, { style: { fontSize: "20px", color: "#9ca3af" } })
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Box, { style: { flex: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Text, { size: 1, weight: "semibold", children: asset.originalFilename || asset._id }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Box, { style: { width: "120px" }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_ui4.Text, { size: 1, children: [
+              asset.metadata?.dimensions?.width || "\u2014",
+              " x",
+              " ",
+              asset.metadata?.dimensions?.height || "\u2014"
+            ] }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ui4.Box, { style: { width: "140px" }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+              import_ui4.Badge,
+              {
+                tone: asset.size > 1048576 ? "critical" : asset.size > 5e5 ? "caution" : "positive",
+                children: formatBytes(asset.size)
+              }
+            ) })
+          ]
+        },
+        asset._id
+      ))
+    ] })
+  ] });
+};
+
+// src/components/tabs/UnusedAssets.tsx
+var import_react5 = require("react");
+var import_ui5 = require("@sanity/ui");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var UnusedAssets = ({
+  unusedAssets,
+  onBulkDelete,
+  onAssetClick
+}) => {
+  const [selectedIds, setSelectedIds] = (0, import_react5.useState)([]);
+  const [confirmDelete, setConfirmDelete] = (0, import_react5.useState)({
+    show: false,
+    ids: []
+  });
+  const handleSelect = (id, selected) => {
+    setSelectedIds((prev) => selected ? [...prev, id] : prev.filter((i) => i !== id));
+  };
+  const handleSelectAll = (checked) => {
+    setSelectedIds(checked ? unusedAssets.map((a) => a._id) : []);
+  };
+  const triggerBulkDelete = (ids) => {
+    setConfirmDelete({ show: true, ids });
+  };
+  const handleConfirmDelete = () => {
+    onBulkDelete(confirmDelete.ids);
+    setSelectedIds((prev) => prev.filter((id) => !confirmDelete.ids.includes(id)));
+    setConfirmDelete({ show: false, ids: [] });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_ui5.Stack, { space: 4, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_ui5.Flex, { align: "center", justify: "space-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_ui5.Stack, { space: 3, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ui5.Heading, { size: 1, children: "Bulk Deletion of Unused Assets" }),
+        unusedAssets.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_ui5.Flex, { align: "center", gap: 3, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            import_ui5.Checkbox,
+            {
+              id: "select-all-unused",
+              checked: selectedIds.length === unusedAssets.length && unusedAssets.length > 0,
+              indeterminate: selectedIds.length > 0 && selectedIds.length < unusedAssets.length,
+              onChange: (e) => handleSelectAll(e.currentTarget.checked)
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ui5.Text, { size: 1, weight: "semibold", muted: true, children: selectedIds.length > 0 ? `${selectedIds.length} Selected` : "Select All" })
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_ui5.Flex, { gap: 2, children: [
+        selectedIds.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          import_ui5.Button,
+          {
+            icon: TrashIcon,
+            tone: "critical",
+            text: `Delete Selected (${selectedIds.length})`,
+            onClick: () => triggerBulkDelete(selectedIds)
+          }
+        ),
+        unusedAssets.length > 0 && selectedIds.length !== unusedAssets.length && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          import_ui5.Button,
+          {
+            mode: "ghost",
+            icon: TrashIcon,
+            tone: "critical",
+            text: `Delete All Unused (${unusedAssets.length})`,
+            onClick: () => triggerBulkDelete(unusedAssets.map((a) => a._id))
+          }
+        )
+      ] })
+    ] }),
+    unusedAssets.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ui5.Card, { padding: 5, border: true, radius: 3, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ui5.Text, { align: "center", children: "No unused assets found." }) }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ui5.Grid, { columns: [2, 3, 4, 5, 6], gap: 3, children: unusedAssets.map((asset) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      AssetCard,
+      {
+        asset,
+        onClick: onAssetClick,
+        isSelected: selectedIds.includes(asset._id),
+        onSelect: handleSelect
+      },
+      asset._id
+    )) }),
+    confirmDelete.show && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      import_ui5.Dialog,
+      {
+        id: "confirm-bulk-delete",
+        header: `Delete ${confirmDelete.ids.length} Asset(s)?`,
+        onClose: () => setConfirmDelete({ show: false, ids: [] }),
+        footer: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ui5.Box, { padding: 3, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_ui5.Flex, { gap: 2, justify: "flex-end", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            import_ui5.Button,
+            {
+              text: "Cancel",
+              mode: "ghost",
+              onClick: () => setConfirmDelete({ show: false, ids: [] })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ui5.Button, { text: "Delete Permanently", tone: "critical", onClick: handleConfirmDelete })
+        ] }) }),
+        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ui5.Box, { padding: 4, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_ui5.Text, { children: [
+          "Are you sure you want to delete ",
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("strong", { children: confirmDelete.ids.length }),
+          " asset(s)? This action cannot be undone and will permanently remove them from your project."
+        ] }) })
+      }
+    )
+  ] });
+};
+
+// src/components/SmartAssetManagerTool.tsx
+var import_styled_components5 = __toESM(require("styled-components"));
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var AppContainer = (0, import_styled_components5.default)(import_ui6.Card)`
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+`;
+var ScrollableContent = (0, import_styled_components5.default)(import_ui6.Box)`
+  flex: 1;
+  overflow-y: auto;
+`;
+var TabNav = (0, import_styled_components5.default)(import_ui6.Card)`
+  z-index: 10;
+`;
+function SmartAssetManagerTool() {
+  const sanityClient = (0, import_sanity.useClient)({ apiVersion: "2025-02-07" });
+  const [activeTab, setActiveTab] = (0, import_react6.useState)("all");
+  const [searchQuery, setSearchQuery] = (0, import_react6.useState)("");
+  const [sortBy, setSortBy] = (0, import_react6.useState)("_createdAt");
+  const [assetType, setAssetType] = (0, import_react6.useState)("all");
+  const [sizeFilter, setSizeFilter] = (0, import_react6.useState)("all");
+  const limit = 20;
+  const [currentPage, setCurrentPage] = (0, import_react6.useState)(1);
+  const { assets, loading, total, refreshAssets } = useAssets(
+    sanityClient,
+    searchQuery,
+    sortBy,
+    assetType,
+    (currentPage - 1) * limit,
+    limit
+  );
+  const [scanning, setScanning] = (0, import_react6.useState)(false);
+  const [isUploading, setIsUploading] = (0, import_react6.useState)(false);
+  const toast = (0, import_ui6.useToast)();
+  const [unusedAssets, setUnusedAssets] = (0, import_react6.useState)([]);
+  const [selectedAsset, setSelectedAsset] = (0, import_react6.useState)(null);
+  const filteredAssets = (0, import_react6.useMemo)(() => {
+    return assets.filter((asset) => {
+      if (sizeFilter === "small") return asset.size < 102400;
+      if (sizeFilter === "medium") return asset.size >= 102400 && asset.size < 1048576;
+      if (sizeFilter === "large") return asset.size >= 1048576;
+      return true;
+    });
+  }, [assets, sizeFilter]);
+  (0, import_react6.useEffect)(() => {
+    setCurrentPage(1);
+  }, [searchQuery, assetType, sizeFilter, activeTab]);
+  const handleFindUnused = async () => {
+    setScanning(true);
+    const unused = await findUnusedAssets(sanityClient);
+    setUnusedAssets(unused);
+    setScanning(false);
+    setActiveTab("unused");
+  };
+  const handleDeleteAsset = async (id) => {
+    const ids = Array.isArray(id) ? id : [id];
+    await deleteAssets(sanityClient, ids);
+    refreshAssets();
+    setUnusedAssets((prev) => prev.filter((a) => !ids.includes(a._id)));
+    if (activeTab === "unused") handleFindUnused();
+  };
+  const handleResetFilters = () => {
+    setSearchQuery("");
+    setAssetType("all");
+    setSizeFilter("all");
+    setCurrentPage(1);
+  };
+  const handleUpload = async (files) => {
+    if (files.length > 5) {
+      toast.push({
+        status: "error",
+        title: "Upload limit exceeded",
+        description: "You can only upload up to 5 files at a time."
+      });
+      return;
+    }
+    setIsUploading(true);
+    const fileArray = Array.from(files);
+    const filenames = fileArray.map((f) => f.name);
+    try {
+      const existingAssetNames = await sanityClient.fetch(
+        `*[_type in ["sanity.imageAsset", "sanity.fileAsset"] && originalFilename in $filenames].originalFilename`,
+        { filenames }
+      );
+      const filesToUpload = fileArray.filter((f) => !existingAssetNames.includes(f.name));
+      const skippedCount = fileArray.length - filesToUpload.length;
+      if (filesToUpload.length === 0) {
+        setIsUploading(false);
+        if (skippedCount > 0) {
+          toast.push({
+            status: "info",
+            title: "No new files were added",
+            description: `All ${skippedCount} file(s) already exist in your library.`
+          });
+        }
+        return;
+      }
+      const uploadPromises = filesToUpload.map(async (file) => {
+        const type = file.type.startsWith("image/") ? "image" : "file";
+        return sanityClient.assets.upload(type, file, {
+          filename: file.name
+        });
+      });
+      await Promise.all(uploadPromises);
+      await new Promise((resolve) => setTimeout(resolve, 1e3));
+      refreshAssets();
+      setIsUploading(false);
+      toast.push({
+        status: "success",
+        title: "Upload successful",
+        description: `Uploaded ${filesToUpload.length} new file(s). ${skippedCount > 0 ? `Skipped ${skippedCount} existing files.` : ""}`
+      });
+    } catch (err) {
+      console.error("Upload failed:", err);
+      setIsUploading(false);
+      toast.push({
+        status: "error",
+        title: "Upload failed",
+        description: "An error occurred while uploading your files."
+      });
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(AppContainer, { height: "fill", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TabNav, { borderBottom: true, padding: 2, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Flex, { gap: 1, children: [
+      { id: "all", label: "All Assets" },
+      { id: "analysis", label: "Size Analyzer" },
+      { id: "unused", label: "Unused Assets", onClick: handleFindUnused }
+    ].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      import_ui6.Button,
+      {
+        mode: activeTab === tab.id ? "default" : "bleed",
+        padding: 3,
+        text: tab.label,
+        onClick: () => {
+          setActiveTab(tab.id);
+          if (tab.onClick) tab.onClick();
+        },
+        selected: activeTab === tab.id
+      },
+      tab.id
+    )) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(ScrollableContent, { children: [
+      activeTab === "all" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        TopToolbar,
+        {
+          searchQuery,
+          setSearchQuery,
+          sortBy,
+          setSortBy,
+          assetType,
+          setAssetType,
+          sizeFilter,
+          setSizeFilter,
+          onReset: handleResetFilters,
+          onUpload: handleUpload,
+          isUploading
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Box, { padding: 4, children: loading || scanning ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Flex, { align: "center", justify: "center", style: { minHeight: "400px" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ui6.Stack, { space: 4, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Flex, { align: "center", justify: "center", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Spinner, { muted: true }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Text, { size: 1, muted: true, children: "Syncing with media library..." })
+      ] }) }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ui6.Box, { children: [
+        activeTab === "all" && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ui6.Box, { children: [
+          filteredAssets.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Card, { padding: 5, border: true, radius: 3, style: { textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Text, { muted: true, children: "No assets found matching your filters." }) }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Grid, { columns: [2, 3, 4, 5, 6], gap: 3, children: filteredAssets.map((asset) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(AssetCard, { asset, onClick: setSelectedAsset }, asset._id)) }),
+          total > limit && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ui6.Flex, { justify: "center", align: "center", gap: 3, marginTop: 5, marginBottom: 2, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+              import_ui6.Button,
+              {
+                padding: 3,
+                mode: "ghost",
+                text: "Previous",
+                disabled: currentPage === 1 || loading,
+                onClick: () => setCurrentPage((p) => Math.max(1, p - 1))
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ui6.Card, { padding: 3, radius: 2, border: true, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ui6.Text, { size: 1, weight: "semibold", children: [
+              "Page ",
+              currentPage,
+              " of ",
+              Math.ceil(total / limit)
+            ] }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+              import_ui6.Button,
+              {
+                padding: 3,
+                mode: "ghost",
+                text: "Next",
+                disabled: currentPage >= Math.ceil(total / limit) || loading,
+                onClick: () => setCurrentPage((p) => p + 1)
+              }
+            )
+          ] })
+        ] }),
+        activeTab === "analysis" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SizeAnalyzer, { assets }),
+        activeTab === "unused" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          UnusedAssets,
+          {
+            unusedAssets,
+            onBulkDelete: handleDeleteAsset,
+            onAssetClick: setSelectedAsset
+          }
+        )
+      ] }) })
+    ] }),
+    selectedAsset && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      AssetDetailsDialog,
+      {
+        asset: selectedAsset,
+        sanityClient,
+        onClose: () => setSelectedAsset(null),
+        onUpdate: (_id, newName) => {
+          refreshAssets();
+          setSelectedAsset((prev) => prev ? { ...prev, originalFilename: newName } : null);
+        },
+        onDelete: handleDeleteAsset
+      }
+    )
+  ] });
+}
+
+// src/index.ts
+var smartAssetManager = (0, import_sanity2.definePlugin)(() => {
+  return {
+    name: "sanity-plugin-smart-asset-manager",
+    tools: [
+      {
+        name: "smart-asset-manager",
+        title: "Smart Asset Manager",
+        component: SmartAssetManagerTool,
+        icon: FolderIcon
+      }
+    ]
+  };
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  smartAssetManager
+});