tinacms 3.7.0 → 3.7.2

package/dist/index.js

@@ -23,6 +23,7 @@ import { Command as Command$2 } from "cmdk";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
 import { PopoverAnchor } from "@radix-ui/react-popover";
+import posthog from "posthog-js";
 import { createSlatePlugin as createSlatePlugin$1, someHtmlElement, findHtmlParentElement, createTSlatePlugin as createTSlatePlugin$1, RangeApi as RangeApi$1, TextApi as TextApi$1, HtmlPlugin as HtmlPlugin$1, NodeApi as NodeApi$1, ElementApi as ElementApi$1, Hotkeys, isHotkey as isHotkey$1, isUrl as isUrl$1, getEditorPlugin as getEditorPlugin$1, bindFirst as bindFirst$1, sanitizeUrl, PathApi as PathApi$1, isDefined as isDefined$1, PointApi as PointApi$1, BaseParagraphPlugin as BaseParagraphPlugin$1, match as match$2, deleteMerge, getPluginTypes, queryNode as queryNode$1, isType, getInjectMatch as getInjectMatch$1, traverseHtmlElements, isHtmlBlockElement as isHtmlBlockElement$1, postCleanHtml, mergeProps } from "@udecode/plate";
 import { useComboboxContext, Combobox as Combobox$1, useComboboxStore, ComboboxProvider, Portal, ComboboxPopover, ComboboxItem } from "@ariakit/react";
 import { withTriggerCombobox, filterWords } from "@udecode/plate-combobox";
@@ -46,7 +47,6 @@ import { sortableKeyboardCoordinates, useSortable, SortableContext, verticalList
 import { CSS } from "@dnd-kit/utilities";
 import { buildSchema, print, getIntrospectionQuery, buildClientSchema, parse as parse$4 } from "graphql";
 import { diff as diff$1 } from "@graphql-inspector/core";
-import posthog from "posthog-js";
 import { HexColorPicker } from "react-colorful";
 import * as dropzone from "react-dropzone";
 import { Command as Command$3 } from "@udecode/cmdk";
@@ -34754,6 +34754,108 @@ function ItalicIcon(props) {
     ))
   );
 }
+const BranchSwitchedEvent = "branch-switched";
+const BranchSwitcherOpenedEvent = "branch-switcher-opened";
+const BranchSwitcherSearchEvent = "branch-switcher-search";
+const BranchSwitcherDropDownEvent = "branch-switcher-dropdown";
+const BranchSwitcherPRClickedEvent = "branch-switcher-pr-clicked";
+const SavedContentEvent = "saved-content";
+const SaveContentErrorEvent = "save-content-error";
+const FormResetEvent = "form-reset";
+const MediaManagerContentUploadedEvent = "media-manager-content-uploaded";
+const MediaManagerContentDeletedEvent = "media-manager-content-deleted";
+const RichTextEditorSwitchedEvent = "rich-text-editor-switched";
+const EventLogPageViewedEvent = "event-log-page-viewed";
+const TinaCMSStartedEvent = "tina-cms-started";
+const CollectionListPageItemClickedEvent = "collection-list-page-item-clicked";
+const CollectionListPageSortEvent = "collection-list-page-sort";
+const CollectionListPageSearchEvent = "collection-list-page-search";
+const CloudConfigNavComponentClickedEvent = "cloud-config-nav-component-clicked";
+const SlashCommandOpenedEvent = "slash-command-opened";
+const SlashCommandUsedEvent = "slash-command-used";
+const MediaUsageDashboardOpenedEvent = "media-dashboard-opened";
+const MediaUsageDashboardRefreshedEvent = "media-dashboard-refreshed";
+const MediaUsageDashboardTypeFilterEvent = "media-dashboard-type-filter-changed";
+const MediaUsageDashboardUsageFilterChangedEvent = "media-dashboard-usage-filter-changed";
+const MediaUsageDashboardRowExpandedEvent = "media-dashboard-row-expanded";
+const MediaUsageDashboardPreviewOpenedEvent = "media-dashboard-preview-opened";
+const MediaUsageDashboardDocumentLinkClickedEvent = "media-dashboard-document-link-clicked";
+let posthogClient = null;
+let isInitialized = false;
+let initializationPromise = null;
+const POSTHOG_CONFIG_ENDPOINT = "https://identity-v2.tinajs.io/v2/posthog-token";
+async function fetchPostHogConfig() {
+  try {
+    const response = await fetch(POSTHOG_CONFIG_ENDPOINT, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      console.warn(`Failed to fetch PostHog config: ${response.statusText}`);
+      return {};
+    }
+    return await response.json();
+  } catch (error2) {
+    console.warn(
+      "Failed to fetch PostHog config:",
+      error2 instanceof Error ? error2.message : "Unknown error"
+    );
+    return {};
+  }
+}
+async function initializePostHog(mode = "anonymous") {
+  if (isInitialized) {
+    return posthogClient;
+  }
+  if (initializationPromise) {
+    return initializationPromise;
+  }
+  if (mode === "disabled") {
+    isInitialized = true;
+    return null;
+  }
+  if (process.env.TINA_DEV === "true") {
+    isInitialized = true;
+    return null;
+  }
+  initializationPromise = (async () => {
+    const config = await fetchPostHogConfig();
+    if (!config.api_key) {
+      console.warn(
+        "PostHog API key not found. PostHog tracking will be disabled."
+      );
+      isInitialized = true;
+      return null;
+    }
+    posthog.init(config.api_key, {
+      api_host: config.host || "https://us.i.posthog.com",
+      persistence: "localStorage",
+      autocapture: false,
+      capture_pageview: false,
+      disable_session_recording: true,
+      disable_compression: true
+    });
+    posthogClient = posthog;
+    isInitialized = true;
+    return posthogClient;
+  })();
+  return initializationPromise;
+}
+function captureEvent(event, properties2) {
+  if (!posthogClient) {
+    return;
+  }
+  try {
+    posthogClient.capture(event, {
+      ...properties2,
+      system: "tinacms/tinacms"
+    });
+  } catch (error2) {
+    console.error("Error capturing PostHog event:", error2);
+  }
+}
 var useComboboxInput = ({
   autoFocus = true,
   cancelInputOnArrowLeftRight = true,
@@ -34903,7 +35005,7 @@ const InlineCombobox = ({
     },
     [setValueProp, hasValueProp]
   );
-  const [insertPoint, setInsertPoint] = useState(null);
+  const insertPoint = React__default.useRef(null);
   useEffect(() => {
     const path3 = editor.api.findPath(element);
     if (!path3)
@@ -34912,7 +35014,7 @@ const InlineCombobox = ({
     if (!point3)
       return;
     const pointRef3 = editor.api.pointRef(point3);
-    setInsertPoint(pointRef3);
+    insertPoint.current = pointRef3.current;
     return () => {
       pointRef3.unref();
     };
@@ -34926,12 +35028,6 @@ const InlineCombobox = ({
           at: (insertPoint == null ? void 0 : insertPoint.current) ?? void 0
         });
       }
-      if (cause === "arrowLeft" || cause === "arrowRight") {
-        editor.tf.move({
-          distance: 1,
-          reverse: cause === "arrowLeft"
-        });
-      }
     },
     ref: inputRef
   });
@@ -35129,6 +35225,9 @@ const rules = [
 const SlashInputElement = withRef$1(
   ({ className, ...props }, ref) => {
     const { children, editor, element } = props;
+    useEffect(() => {
+      captureEvent(SlashCommandOpenedEvent);
+    }, []);
     return /* @__PURE__ */ React__default.createElement(
       PlateElement,
       {
@@ -35142,7 +35241,12 @@ const SlashInputElement = withRef$1(
         {
           key: value,
           keywords: keywords2,
-          onClick: () => onSelect(editor),
+          onClick: () => {
+            onSelect(editor);
+            captureEvent(SlashCommandUsedEvent, {
+              command: value
+            });
+          },
           value
         },
         /* @__PURE__ */ React__default.createElement(Icon, { "aria-hidden": true, className: "mr-2 size-4" }),
@@ -41516,7 +41620,15 @@ const Blocks = ({
   meta,
   index
 }) => {
-  const addItem = React.useCallback(
+  const [newObjects, setNewObjects] = useState(/* @__PURE__ */ new Set());
+  const prevPristine = useRef(meta.pristine);
+  useEffect(() => {
+    if (!prevPristine.current && meta.pristine) {
+      setNewObjects(/* @__PURE__ */ new Set());
+    }
+    prevPristine.current = meta.pristine;
+  }, [meta.pristine]);
+  const addItem = useCallback(
     (name2, template) => {
       let obj = {};
       if (typeof template.defaultItem === "function") {
@@ -41525,6 +41637,7 @@ const Blocks = ({
         obj = template.defaultItem || {};
       }
       obj._template = name2;
+      setNewObjects((prev) => new Set(prev).add(obj));
       form.mutators.push(field.name, obj);
     },
     [field.name, form.mutators]
@@ -41587,6 +41700,7 @@ const Blocks = ({
             tinaForm,
             isMin,
             fixedLength,
+            isNew: newObjects.has(block2),
             ...itemProps(block2)
           }
         );
@@ -41601,7 +41715,8 @@ const BlockListItem = ({
   index,
   template,
   isMin,
-  fixedLength
+  fixedLength,
+  isNew
 }) => {
   const cms = useCMS$1();
   const removeItem = React.useCallback(() => {
@@ -41645,6 +41760,7 @@ const BlockListItem = ({
       onMouseOut: () => setHoveredField({ id: null, fieldName: null })
     },
     /* @__PURE__ */ React.createElement(GroupLabel, null, label || template.label),
+    isNew && /* @__PURE__ */ React.createElement("span", { className: "mr-1.5 inline-flex items-center px-1.5 py-0.5 rounded text-[10px] border-[0.5px] border-tina-orange/50 font-semibold bg-tina-orange/10 text-tina-orange leading-none" }, "NEW"),
     /* @__PURE__ */ React.createElement(BiPencil, { className: "h-5 w-auto fill-current text-gray-200 group-hover:text-inherit transition-colors duration-150 ease-out" })
   ), (!fixedLength || fixedLength && !isMin) && /* @__PURE__ */ React.createElement(ItemDeleteButton, { disabled: isMin, onClick: removeItem }))));
 };
@@ -44016,99 +44132,6 @@ const TableCaption = React.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 TableCaption.displayName = "TableCaption";
-let posthogClient = null;
-let isInitialized = false;
-let initializationPromise = null;
-const POSTHOG_CONFIG_ENDPOINT = "https://identity-v2.tinajs.io/v2/posthog-token";
-async function fetchPostHogConfig() {
-  try {
-    const response = await fetch(POSTHOG_CONFIG_ENDPOINT, {
-      method: "GET",
-      headers: {
-        "Content-Type": "application/json"
-      }
-    });
-    if (!response.ok) {
-      console.warn(`Failed to fetch PostHog config: ${response.statusText}`);
-      return {};
-    }
-    return await response.json();
-  } catch (error2) {
-    console.warn(
-      "Failed to fetch PostHog config:",
-      error2 instanceof Error ? error2.message : "Unknown error"
-    );
-    return {};
-  }
-}
-async function initializePostHog(mode = "anonymous") {
-  if (isInitialized) {
-    return posthogClient;
-  }
-  if (initializationPromise) {
-    return initializationPromise;
-  }
-  if (mode === "disabled") {
-    isInitialized = true;
-    return null;
-  }
-  if (process.env.TINA_DEV === "true") {
-    isInitialized = true;
-    return null;
-  }
-  initializationPromise = (async () => {
-    const config = await fetchPostHogConfig();
-    if (!config.api_key) {
-      console.warn(
-        "PostHog API key not found. PostHog tracking will be disabled."
-      );
-      isInitialized = true;
-      return null;
-    }
-    posthog.init(config.api_key, {
-      api_host: config.host || "https://us.i.posthog.com",
-      persistence: "localStorage",
-      autocapture: false,
-      capture_pageview: false,
-      disable_session_recording: true,
-      disable_compression: true
-    });
-    posthogClient = posthog;
-    isInitialized = true;
-    return posthogClient;
-  })();
-  return initializationPromise;
-}
-function captureEvent(event, properties2) {
-  if (!posthogClient) {
-    return;
-  }
-  try {
-    posthogClient.capture(event, {
-      ...properties2,
-      system: "tinacms/tinacms"
-    });
-  } catch (error2) {
-    console.error("Error capturing PostHog event:", error2);
-  }
-}
-const BranchSwitchedEvent = "branch-switched";
-const BranchSwitcherOpenedEvent = "branch-switcher-opened";
-const BranchSwitcherSearchEvent = "branch-switcher-search";
-const BranchSwitcherDropDownEvent = "branch-switcher-dropdown";
-const BranchSwitcherPRClickedEvent = "branch-switcher-pr-clicked";
-const SavedContentEvent = "saved-content";
-const SaveContentErrorEvent = "save-content-error";
-const FormResetEvent = "form-reset";
-const MediaManagerContentUploadedEvent = "media-manager-content-uploaded";
-const MediaManagerContentDeletedEvent = "media-manager-content-deleted";
-const RichTextEditorSwitchedEvent = "rich-text-editor-switched";
-const EventLogPageViewedEvent = "event-log-page-viewed";
-const TinaCMSStartedEvent = "tina-cms-started";
-const CollectionListPageItemClickedEvent = "collection-list-page-item-clicked";
-const CollectionListPageSortEvent = "collection-list-page-sort";
-const CollectionListPageSearchEvent = "collection-list-page-search";
-const CloudConfigNavComponentClickedEvent = "cloud-config-nav-component-clicked";
 const IndexStatus$1 = ({ indexingStatus }) => {
   const styles = {
     complete: {
@@ -46031,7 +46054,7 @@ function ListMediaItem({ item, onClick, active }) {
   return /* @__PURE__ */ React__default.createElement(
     "li",
     {
-      className: `group relative flex shrink-0 items-center transition duration-150 ease-out cursor-pointer border-b border-gray-150 ${active ? "bg-gradient-to-r from-white to-gray-50/50 text-blue-500 hover:bg-gray-50" : "bg-white hover:bg-gray-50/50 hover:text-blue-500"}`,
+      className: `group relative flex shrink-0 items-center transition duration-150 ease-out cursor-pointer border-b border-gray-150 ${active ? "bg-gradient-to-r from-white to-gray-50/50 text-tina-orange hover:bg-gray-50" : "bg-white hover:bg-gray-50/50 hover:text-tina-orange"}`,
       onClick: () => {
         if (!active) {
           onClick(item);
@@ -46049,7 +46072,12 @@ function ListMediaItem({ item, onClick, active }) {
         src: thumbnail,
         alt: item.filename
       }
-    ) : /* @__PURE__ */ React__default.createElement(FileIcon, { className: "w-1/2 h-full fill-gray-300" })),
+    ) : /* @__PURE__ */ React__default.createElement(
+      FileIcon,
+      {
+        className: `w-1/2 h-full ${item.type === "dir" ? "fill-tina-orange" : "fill-gray-300"}`
+      }
+    )),
     /* @__PURE__ */ React__default.createElement(
       "span",
       {
@@ -46072,9 +46100,10 @@ function GridMediaItem({ item, active, onClick }) {
     "button",
     {
       className: cn(
-        "relative flex flex-col items-center justify-center w-full",
+        "relative flex flex-col items-center justify-center w-full outline-none",
         {
           "shadow hover:shadow-md hover:scale-103 hover:border-gray-150": !active,
+          "ring-2 ring-tina-orange": active,
           "cursor-pointer": item.type === "dir"
         }
       ),
@@ -46091,7 +46120,7 @@ function GridMediaItem({ item, active, onClick }) {
       {
         className: cn(
           "absolute bottom-0 left-0 w-full text-xs text-white px-2 py-1 truncate z-10",
-          active ? "bg-blue-500/60" : "bg-black/60"
+          active ? "bg-tina-orange/60" : "bg-black/60"
         ),
         style: { pointerEvents: "none" }
       },
@@ -46102,14 +46131,19 @@ function GridMediaItem({ item, active, onClick }) {
       "img",
       {
         className: cn(
-          "block overflow-hidden object-center object-contain max-w-full max-h-[16rem] m-auto shadow",
-          { "border border-blue-500": active }
+          "block overflow-hidden object-center object-contain max-w-full max-h-[16rem] m-auto shadow"
         ),
         style: checkerboardStyle,
         src: thumbnail,
         alt: item.filename
       }
-    )) : /* @__PURE__ */ React__default.createElement("div", { className: "p-4 w-full flex flex-col gap-4 items-center justify-center" }, /* @__PURE__ */ React__default.createElement(FileIcon, { className: "w-[40%] h-auto fill-gray-300", size: 40 })))
+    )) : /* @__PURE__ */ React__default.createElement("div", { className: "p-4 w-full flex flex-col gap-4 items-center justify-center" }, /* @__PURE__ */ React__default.createElement(
+      FileIcon,
+      {
+        className: `w-[40%] h-auto ${item.type === "dir" ? "fill-tina-orange" : "fill-gray-300"}`,
+        size: 40
+      }
+    )))
   ));
 }
 const DeleteModal$1 = ({
@@ -46514,7 +46548,7 @@ function MediaPicker({
       className: "whitespace-nowrap"
     },
     "New Folder",
-    /* @__PURE__ */ React__default.createElement(BiFolder, { className: "w-6 h-full ml-2 opacity-70 text-blue-500" })
+    /* @__PURE__ */ React__default.createElement(BiFolder, { className: "w-6 h-full ml-2 opacity-70 text-tina-orange" })
   ), /* @__PURE__ */ React__default.createElement(UploadButton, { onClick, uploading }))), /* @__PURE__ */ React__default.createElement("div", { className: "flex h-full overflow-hidden bg-white" }, /* @__PURE__ */ React__default.createElement("div", { className: "flex w-full flex-col h-full @container" }, /* @__PURE__ */ React__default.createElement(
     "ul",
     {
@@ -46908,7 +46942,7 @@ const getDocumentEditUrl = async (cms, document2) => {
   return editUrl;
 };
 const scanDocumentForMedia = (documentContent, mediaUsages) => {
-  const matchedIds = /* @__PURE__ */ new Set();
+  const matchedSrcs = /* @__PURE__ */ new Set();
   for (const mediaUsage of mediaUsages) {
     const src = JSON.stringify(mediaUsage.media.src).slice(1, -1);
     let index = documentContent.indexOf(src);
@@ -46918,18 +46952,18 @@ const scanDocumentForMedia = (documentContent, mediaUsages) => {
       const isPrevValid = !prevChar || !/[a-zA-Z0-9_.%~+-]/.test(prevChar);
       const isNextValid = !nextChar || !/[a-zA-Z0-9_.%~+-]/.test(nextChar);
       if (isPrevValid && isNextValid) {
-        matchedIds.add(mediaUsage.media.id);
+        matchedSrcs.add(mediaUsage.media.src);
         break;
       }
       index = documentContent.indexOf(src, index + 1);
     }
   }
-  return matchedIds;
+  return matchedSrcs;
 };
 const THUMBNAIL_SIZES = [MEDIA_USAGE_THUMBNAIL_SIZE];
 const BATCH_SIZE = 100;
 const UI_YIELD_INTERVAL = 50;
-const collectAllMedia = async (cms, mediaIdToUsageMap, currentDirectory) => {
+const collectAllMedia = async (cms, mediaSrcToUsageMap, currentDirectory) => {
   const subDirectories = [];
   let currentOffset = void 0;
   let moreOffsetsAvailable = true;
@@ -46945,7 +46979,7 @@ const collectAllMedia = async (cms, mediaIdToUsageMap, currentDirectory) => {
           const isImg = isImage(item.filename);
           const isVid = isVideo(item.filename);
           const type2 = isImg ? "image" : isVid ? "video" : "other";
-          mediaIdToUsageMap[item.id] = {
+          mediaSrcToUsageMap[item.src] = {
             media: item,
             type: type2,
             usedIn: []
@@ -46965,15 +46999,15 @@ const collectAllMedia = async (cms, mediaIdToUsageMap, currentDirectory) => {
   }
   if (subDirectories.length > 0) {
     await Promise.all(
-      subDirectories.map((dir) => collectAllMedia(cms, mediaIdToUsageMap, dir))
+      subDirectories.map((dir) => collectAllMedia(cms, mediaSrcToUsageMap, dir))
     );
   }
 };
-const scanCollectionForMediaUsage = async (cms, collectionMeta, mediaIdToUsageMap) => {
+const scanCollectionForMediaUsage = async (cms, collectionMeta, mediaSrcToUsageMap) => {
   var _a2, _b;
   let hasNextPage = true;
   let after3 = void 0;
-  const mediaUsages = Object.values(mediaIdToUsageMap);
+  const mediaUsages = Object.values(mediaSrcToUsageMap);
   const listQuery = `
     query($after: String, $first: Float) {
       collectionConnection: ${collectionMeta.name}Connection(first: $first, after: $after) {
@@ -47019,15 +47053,15 @@ const scanCollectionForMediaUsage = async (cms, collectionMeta, mediaIdToUsageMa
           await new Promise((resolve) => setTimeout(resolve, 0));
         }
         const edge = edges2[i2];
-        const matchedIds = scanDocumentForMedia(
+        const matchedSrcs = scanDocumentForMedia(
           JSON.stringify(edge.node._values),
           mediaUsages
         );
-        if (matchedIds.size === 0)
+        if (matchedSrcs.size === 0)
           continue;
         const editUrl = await getDocumentEditUrl(cms, edge.node);
-        matchedIds.forEach((mediaId) => {
-          const usage = mediaIdToUsageMap[mediaId];
+        matchedSrcs.forEach((mediaSrc) => {
+          const usage = mediaSrcToUsageMap[mediaSrc];
           if (usage) {
             usage.usedIn.push({
               collectionName: collectionMeta.name,
@@ -47046,18 +47080,18 @@ const scanCollectionForMediaUsage = async (cms, collectionMeta, mediaIdToUsageMa
   }
 };
 const scanAllMedia = async (cms, onProgress) => {
-  const mediaIdToUsageMap = {};
-  await collectAllMedia(cms, mediaIdToUsageMap, "");
+  const mediaSrcToUsageMap = {};
+  await collectAllMedia(cms, mediaSrcToUsageMap, "");
   const collectionMetas = cms.api.tina.schema.getCollections();
   for (let i2 = 0; i2 < collectionMetas.length; i2++) {
     await scanCollectionForMediaUsage(
       cms,
       collectionMetas[i2],
-      mediaIdToUsageMap
+      mediaSrcToUsageMap
     );
     onProgress == null ? void 0 : onProgress((i2 + 1) / collectionMetas.length * 100);
   }
-  return Object.values(mediaIdToUsageMap);
+  return Object.values(mediaSrcToUsageMap);
 };
 const useMediaUsageScanner = () => {
   const cms = useCMS$1();
@@ -47191,6 +47225,9 @@ const MediaLightbox = ({
   const usageCount = item.usedIn.length;
   const mediaSrc = item.media.src;
   const directory = item.media.directory || "/";
+  useEffect(() => {
+    captureEvent(MediaUsageDashboardPreviewOpenedEvent);
+  }, []);
   return /* @__PURE__ */ React__default.createElement(Dialog, { open: true, onOpenChange: (isOpen) => !isOpen && onClose() }, /* @__PURE__ */ React__default.createElement(DialogContent, { className: "w-auto max-w-[95vw] border border-gray-200 bg-white px-4 pt-12 pb-4 shadow-xl sm:max-w-fit" }, /* @__PURE__ */ React__default.createElement(DialogTitle, { className: "sr-only" }, "Preview: ", item.media.filename), /* @__PURE__ */ React__default.createElement(DialogDescription, { className: "sr-only" }, usageCount > 0 ? `Used in ${usageCount} ${usageCount === 1 ? "document" : "documents"}` : "Unused media file"), /* @__PURE__ */ React__default.createElement("div", { className: "mx-auto w-fit max-w-full rounded-lg border border-gray-200 bg-gray-50 p-2 sm:p-3" }, item.type === "video" ? /* @__PURE__ */ React__default.createElement(
     VideoLightboxContent,
     {
@@ -47432,7 +47469,7 @@ const MediaUsageTable = ({
   const table = useReactTable({
     data: mediaItems,
     columns,
-    getRowId: (row) => row.media.id,
+    getRowId: (row) => row.media.src,
     initialState: { columnVisibility: { type: false } },
     state: { sorting, columnFilters, expanded },
     onColumnFiltersChange: setColumnFilters,
@@ -47521,7 +47558,13 @@ const MediaUsageTable = ({
       TableRow,
       {
         style: { contentVisibility: "auto" },
-        onClick: getUsageCount(row.original) > 0 ? row.getToggleExpandedHandler() : void 0,
+        onClick: () => {
+          getUsageCount(row.original) > 0;
+          {
+            row.toggleExpanded();
+            captureEvent(MediaUsageDashboardRowExpandedEvent);
+          }
+        },
         className: getUsageCount(row.original) > 0 ? row.getIsExpanded() ? "cursor-pointer bg-[#FFF8F6] hover:bg-[#FFF8F6]" : "cursor-pointer" : ""
       },
       row.getVisibleCells().map((cell) => /* @__PURE__ */ React__default.createElement(
@@ -47562,7 +47605,12 @@ const MediaFilters = ({
   Select,
   {
     value: typeFilter,
-    onValueChange: (value) => setTypeFilter(value)
+    onValueChange: (value) => {
+      setTypeFilter(value);
+      captureEvent(MediaUsageDashboardTypeFilterEvent, {
+        type: value
+      });
+    }
   },
   /* @__PURE__ */ React__default.createElement(
     SelectTrigger,
@@ -47577,7 +47625,12 @@ const MediaFilters = ({
   Select,
   {
     value: usageFilter,
-    onValueChange: (value) => setUsageFilter(value)
+    onValueChange: (value) => {
+      setUsageFilter(value);
+      captureEvent(MediaUsageDashboardUsageFilterChangedEvent, {
+        usage: value
+      });
+    }
   },
   /* @__PURE__ */ React__default.createElement(
     SelectTrigger,
@@ -47609,7 +47662,10 @@ const ExpandedRowContent = ({
         "a",
         {
           href: `#/collections/${doc.collectionName}/~`,
-          onClick: () => onClose == null ? void 0 : onClose(),
+          onClick: () => {
+            onClose == null ? void 0 : onClose();
+            captureEvent(MediaUsageDashboardDocumentLinkClickedEvent);
+          },
           className: "underline hover:text-tina-orange-dark transition-colors"
         },
         doc.collectionLabel
@@ -47618,7 +47674,12 @@ const ExpandedRowContent = ({
         "a",
         {
           href: doc.editUrl,
-          onClick: () => onClose == null ? void 0 : onClose(),
+          onClick: () => {
+            onClose == null ? void 0 : onClose();
+            captureEvent(
+              MediaUsageDashboardDocumentLinkClickedEvent
+            );
+          },
           className: "underline hover:text-tina-orange-dark transition-colors break-all"
         },
         breadcrumb
@@ -47629,6 +47690,10 @@ const ExpandedRowContent = ({
 const MediaUsageDashboard = ({
   close: onClose
 }) => {
+  useEffect(() => {
+    console.log("MediaUsageDashboard");
+    captureEvent(MediaUsageDashboardOpenedEvent);
+  }, []);
   const { mediaItems, isLoading, errorOccurred, progress, refresh } = useMediaUsageScanner();
   const [lightboxImage, setLightboxImage] = useState(null);
   const stats = useMemo(() => {
@@ -47663,7 +47728,13 @@ const MediaUsageDashboard = ({
         Button,
         {
           variant: "outline",
-          onClick: refresh,
+          onClick: async () => {
+            await refresh();
+            const payload = {
+              errorOccured: errorOccurred
+            };
+            captureEvent(MediaUsageDashboardRefreshedEvent, payload);
+          },
           disabled: isLoading,
           className: "flex items-center gap-2 shadow-sm font-medium transition-colors"
         },
@@ -47933,7 +48004,7 @@ const NavProvider = ({
 const name = "tinacms";
 const type = "module";
 const typings = "dist/index.d.ts";
-const version$1 = "3.7.0";
+const version$1 = "3.7.2";
 const main = "dist/index.js";
 const module = "./dist/index.js";
 const exports = {
@@ -48043,6 +48114,8 @@ const dependencies = {
   "react-colorful": "catalog:",
   "react-datetime": "catalog:",
   "react-day-picker": "^9.13.0",
+  "react-dnd": "catalog:",
+  "react-dnd-html5-backend": "catalog:",
   "react-dropzone": "catalog:",
   "react-final-form": "catalog:",
   "react-icons": "^5.4.0",
@@ -48980,11 +49053,11 @@ const FormLists = (props) => {
     "input",
     {
       type: "checkbox",
-      checked: !showReferences,
-      onChange: (e3) => setShowReferences(!e3.target.checked),
+      checked: showReferences,
+      onChange: (e3) => setShowReferences(e3.target.checked),
       className: "w-4 h-4 text-orange-500 border-gray-300 rounded focus:ring-orange-500"
     }
-  ), /* @__PURE__ */ React.createElement("span", null, "Direct references only"))), /* @__PURE__ */ React.createElement("div", { className: "flex-1 overflow-x-auto overflow-y-auto min-h-0" }, cms.state.formLists.map((formList, index) => /* @__PURE__ */ React.createElement("div", { key: `${formList.id}-${index}` }, /* @__PURE__ */ React.createElement(
+  ), /* @__PURE__ */ React.createElement("span", null, "Show all references"))), /* @__PURE__ */ React.createElement("div", { className: "flex-1 overflow-x-auto overflow-y-auto min-h-0" }, cms.state.formLists.map((formList, index) => /* @__PURE__ */ React.createElement("div", { key: `${formList.id}-${index}` }, /* @__PURE__ */ React.createElement(
     FormList,
     {
       setActiveFormId: (id2) => {
@@ -66099,6 +66172,12 @@ const CreateBranchModal = ({
         throw new Error("Branch creation failed.");
       }
       setCurrentBranch(result.branchName);
+      if (result.warning) {
+        cms.alerts.warn(
+          `${result.warning} Please reconnect GitHub authoring here: ${tinaApi.gitSettingsLink}`,
+          0
+        );
+      }
       cms.alerts.success(
         `Branch created successfully - Pull Request at ${result.pullRequestUrl}`,
         0
@@ -66110,7 +66189,7 @@ const CreateBranchModal = ({
       close2();
     } catch (e3) {
       console.error(e3);
-      let errorMessage2 = "Branch operation failed, please try again. If the problem persists please contact support.";
+      let errorMessage2 = "Branch operation failed. Talking to GitHub was unsuccessful, please try again. If the problem persists please contact support at https://tina.io/support 🦙";
       const err = e3;
       if (err.errorCode) {
         switch (err.errorCode) {
@@ -66123,6 +66202,9 @@ const CreateBranchModal = ({
           case EDITORIAL_WORKFLOW_ERROR.VALIDATION_FAILED:
             errorMessage2 = err.message || "Invalid branch name";
             break;
+          default:
+            errorMessage2 = err.message || errorMessage2;
+            break;
         }
       } else if (err.message) {
         if (err.message.toLowerCase().includes("already exists")) {
@@ -121575,6 +121657,9 @@ mutation addPendingDocumentMutation(
   get appDashboardLink() {
     return `${this.frontendUrl}/projects/${this.clientId}`;
   }
+  get gitSettingsLink() {
+    return `${this.frontendUrl}/account/git`;
+  }
   async checkSyncStatus({
     assetsSyncing
   }) {
@@ -121854,29 +121939,50 @@ mutation addPendingDocumentMutation(
       while (attempts < maxAttempts) {
         await new Promise((resolve) => setTimeout(resolve, pollInterval));
         attempts++;
-        const statusUrl = `${this.contentApiBase}/editorial-workflow/${this.clientId}/status/${requestId}`;
-        const statusResponse = await this.authProvider.fetchWithToken(statusUrl);
-        if (!statusResponse.ok) {
-          throw new Error(
-            `Failed to check workflow status: ${statusResponse.statusText}`
-          );
-        }
-        const statusResponseBody = await statusResponse.json();
-        if (options.onStatusUpdate) {
-          options.onStatusUpdate({
-            status: statusResponseBody.status,
-            message: statusResponseBody.message || `Status: ${statusResponseBody.status}`
-          });
-        }
-        if (statusResponse.status === 200) {
-          return {
-            branchName: statusResponseBody.branchName,
-            pullRequestUrl: statusResponseBody.pullRequestUrl
-          };
-        }
-        if (!statusResponse.ok) {
-          throw new Error(
-            statusResponseBody.message || "Editorial workflow failed"
+        try {
+          const statusUrl = `${this.contentApiBase}/editorial-workflow/${this.clientId}/status/${requestId}`;
+          const statusResponse = await this.authProvider.fetchWithToken(statusUrl);
+          const statusResponseBody = await statusResponse.json();
+          if (options.onStatusUpdate) {
+            options.onStatusUpdate({
+              status: statusResponseBody.status,
+              message: statusResponseBody.message || `Status: ${statusResponseBody.status}`
+            });
+          }
+          if (statusResponseBody.status === EDITORIAL_WORKFLOW_STATUS.ERROR || statusResponse.status === 500) {
+            if (statusResponseBody.pullRequestUrl) {
+              return {
+                branchName: statusResponseBody.branchName,
+                pullRequestUrl: statusResponseBody.pullRequestUrl,
+                warning: statusResponseBody.message
+              };
+            }
+            const error2 = new Error(
+              statusResponseBody.message || "Editorial workflow failed"
+            );
+            error2.errorCode = statusResponseBody.errorCode || "WORKFLOW_FAILED";
+            throw error2;
+          }
+          if (statusResponse.status === 200) {
+            return {
+              branchName: statusResponseBody.branchName,
+              pullRequestUrl: statusResponseBody.pullRequestUrl
+            };
+          }
+          if (statusResponse.status !== 202) {
+            const error2 = new Error(
+              statusResponseBody.message || `Failed to check workflow status: ${statusResponse.statusText}`
+            );
+            error2.errorCode = "WORKFLOW_STATUS_FAILED";
+            throw error2;
+          }
+        } catch (error2) {
+          if (error2.errorCode) {
+            throw error2;
+          }
+          console.warn(
+            `Editorial workflow status poll failed (attempt ${attempts}/${maxAttempts}), retrying...`,
+            error2
           );
         }
       }
@@ -122103,7 +122209,7 @@ const AuthWallInner = ({
   const loginScreen = client.authProvider.getLoginScreen();
   if (loginStrategy === "LoginScreen" && !loginScreen) {
     throw new Error(
-      "LoginScreen is set as the login strategy but no login screen component was provided"
+      "LoginScreen is set as the login strategy but no login screen component was provided."
     );
   }
   const [activeModal, setActiveModal] = useState(null);
@@ -122130,7 +122236,7 @@ const AuthWallInner = ({
           } else {
             setErrorMessage({
               title: "Access Denied:",
-              message: "Not Authorized To Edit"
+              message: "Not authorized to edit."
             });
             setActiveModal("error");
           }
@@ -122189,16 +122295,16 @@ const AuthWallInner = ({
       });
     }
   };
-  let modalTitle = "Let’s get you editing with TinaCMS...";
+  let modalTitle = "Let’s get you editing with TinaCMS!";
   if (activeModal === "authenticate" && loginStrategy === "Redirect" && !isTinaCloud) {
     modalTitle = "Enter into edit mode";
   } else if (activeModal === "authenticate" && loginStrategy === "UsernamePassword") {
-    modalTitle = "Let’s get you editing with TinaCMS...";
+    modalTitle = "Let’s get you editing with TinaCMS!";
   } else if (activeModal === "error") {
     if (loginStrategy === "Redirect" && !isTinaCloud) {
       modalTitle = "Enter into edit mode";
     } else if (loginStrategy === "UsernamePassword") {
-      modalTitle = "Let’s get you editing with TinaCMS...";
+      modalTitle = "Let’s get you editing with TinaCMS!";
     }
   }
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, activeModal === "authenticate" && loginStrategy === "Redirect" && /* @__PURE__ */ React__default.createElement(
@@ -122212,7 +122318,7 @@ const AuthWallInner = ({
           alt: "Tina the Llama playing a large orange key like a guitar.",
           width: 816,
           height: 816,
-          style: { maxWidth: "100%", margin: "0 auto", display: "block" }
+          style: { width: "16rem", margin: "0 auto", display: "block" }
         }
       ) : "When you save, changes will be saved to the local filesystem.",
       close,

package/dist/internalClient/index.d.ts

@@ -9,6 +9,7 @@ interface TinaSearchConfig {
     fuzzyOptions?: FuzzySearchOptions;
 }
 import gql from 'graphql-tag';
+import { EditorialWorkflowResult } from '../toolkit/form-builder/editorial-workflow-constants';
 import { TinaCloudProject } from './types';
 export * from './authProvider';
 export type OnLoginFunc = (args: {
@@ -86,6 +87,7 @@ export declare class Client {
         variables: object;
     }): Promise<ReturnType>;
     get appDashboardLink(): string;
+    get gitSettingsLink(): string;
     checkSyncStatus({ assetsSyncing, }: {
         assetsSyncing: string[];
     }): Promise<{
@@ -165,7 +167,7 @@ export declare class Client {
             status: string;
             message?: string;
         }) => void;
-    }): Promise<any>;
+    }): Promise<EditorialWorkflowResult>;
 }
 export declare const DEFAULT_LOCAL_TINA_GQL_SERVER_URL = "http://localhost:4001/graphql";
 export declare class LocalClient extends Client {

package/dist/lib/posthog/posthog.d.ts

@@ -66,3 +66,29 @@ export declare const CloudConfigNavComponentClickedEvent: string;
 export type CloudConfigNavComponentClickedPayload = {
     itemType: 'Project Config' | 'User Management' | 'Support';
 };
+export declare const SlashCommandOpenedEvent: string;
+export type SlashInputElementOpenedPayload = Record<string, never>;
+export declare const SlashCommandUsedEvent: string;
+export type SlashCommandUsedPayload = {
+    command: string;
+};
+export declare const MediaUsageDashboardOpenedEvent: string;
+export type MediaUsageDashboardOpenedPayload = Record<string, never>;
+export declare const MediaUsageDashboardRefreshedEvent: string;
+export type MediaUsageDashboardRefreshedPayload = {
+    errorOccured?: boolean;
+};
+export declare const MediaUsageDashboardTypeFilterEvent: string;
+export type MediaUsageDashboardTypeFilterPayload = {
+    type: 'all' | 'image' | 'video' | 'other';
+};
+export declare const MediaUsageDashboardUsageFilterChangedEvent: string;
+export type MediaUsageDashboardUsageFilterChangedPayload = {
+    usage: 'all' | 'used' | 'unused';
+};
+export declare const MediaUsageDashboardRowExpandedEvent: string;
+export type MediaUsageDashboardRowExpandedEvent = Record<string, never>;
+export declare const MediaUsageDashboardPreviewOpenedEvent: string;
+export type MediaUsageDashboardPreviewOpenedPayload = Record<string, never>;
+export declare const MediaUsageDashboardDocumentLinkClickedEvent: string;
+export type MediaUsageDashboardDocumentLinkClickedEvent = Record<string, never>;

package/dist/toolkit/fields/plugins/mdx-field-plugin/plate/toolbar/toolbar-overrides.d.ts

@@ -1,4 +1,5 @@
-export type ToolbarOverrideType = 'heading' | 'link' | 'image' | 'quote' | 'ul' | 'ol' | 'code' | 'codeBlock' | 'bold' | 'italic' | 'strikethrough' | 'highlight' | 'mermaid' | 'raw' | 'embed' | 'table' | 'hr';
+import type { ToolbarOverrideType } from '@tinacms/schema-tools';
+export type { ToolbarOverrideType };
 export declare const STANDARD_ICON_WIDTH = 32;
 export declare const HEADING_ICON_WITH_TEXT = 127;
 export declare const HEADING_ICON_ONLY = 58;

package/dist/toolkit/form-builder/editorial-workflow-constants.d.ts

@@ -32,3 +32,11 @@ export type EditorialWorkflowErrorDetails = Error & {
     errorCode?: string;
     conflictingBranch?: string;
 };
+/**
+ * Result from a completed editorial workflow operation
+ */
+export interface EditorialWorkflowResult {
+    branchName: string;
+    pullRequestUrl: string;
+    warning?: string;
+}

package/package.json

@@ -2,7 +2,7 @@
   "name": "tinacms",
   "type": "module",
   "typings": "dist/index.d.ts",
-  "version": "3.7.0",
+  "version": "3.7.2",
   "main": "dist/index.js",
   "module": "./dist/index.js",
   "exports": {
@@ -103,6 +103,8 @@
     "react-colorful": "^5.6.1",
     "react-datetime": "^3.3.1",
     "react-day-picker": "^9.13.0",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
     "react-dropzone": "14.2.3",
     "react-final-form": "^6.5.9",
     "react-icons": "^5.4.0",
@@ -112,9 +114,9 @@
     "webfontloader": "1.6.28",
     "yup": "^1.6.1",
     "zod": "^3.24.2",
-    "@tinacms/mdx": "2.1.0",
-    "@tinacms/schema-tools": "2.7.0",
-    "@tinacms/search": "1.2.7"
+    "@tinacms/mdx": "2.1.1",
+    "@tinacms/schema-tools": "2.7.1",
+    "@tinacms/search": "1.2.9"
   },
   "devDependencies": {
     "@graphql-tools/utils": "^10.8.1",