tinacms 3.13.0 → 3.14.1

package/dist/index.js

@@ -32,7 +32,7 @@ import { useHTMLInputCursorState, useComboboxInput } from "@udecode/plate-combob
 import { useComboboxContext, Combobox as Combobox$1, useComboboxStore, ComboboxProvider, Portal, ComboboxPopover, ComboboxItem } from "@ariakit/react";
 import { filterWords } from "@udecode/plate-combobox";
 import { toggleList, unwrapList, getListItemEntry } from "@udecode/plate-list";
-import { normalizeHeadingLevels, ALL_HEADING_LEVELS, MEDIA_MIME_TYPES, extensionOf, resolveMediaAccept, ASYNC_POLLER_ERROR, MEDIA_CATEGORIES, canonicalPath, ERR_BRANCH_EXISTS, ERR_BRANCH_CONFLICT, isHeadingLevel, TinaSchema, addNamespaceToSchema, parseURL, ERR_HAS_REFERENCES, ERR_ALREADY_EXISTS, isValidRelativePath, RELATIVE_PATH_ALLOWED_CHARS_MESSAGE, resolveForm, RELATIVE_PATH_REGEX, normalizePath, ERR_NOT_INDEXED, validateSchema } from "@tinacms/schema-tools";
+import { normalizeHeadingLevels, ALL_HEADING_LEVELS, MEDIA_MIME_TYPES, extensionOf, resolveMediaAccept, ASYNC_POLLER_ERROR, ERR_BRANCH_EXISTS, ERR_BRANCH_CONFLICT, MEDIA_CATEGORIES, canonicalPath, isHeadingLevel, TinaSchema, addNamespaceToSchema, parseURL, ERR_HAS_REFERENCES, ERR_ALREADY_EXISTS, isValidRelativePath, RELATIVE_PATH_ALLOWED_CHARS_MESSAGE, resolveForm, RELATIVE_PATH_REGEX, normalizePath, ERR_NOT_INDEXED, validateSchema } from "@tinacms/schema-tools";
 import { NAMER, resolveField } from "@tinacms/schema-tools";
 import { useBlockSelected, BlockSelectionPlugin } from "@udecode/plate-selection/react";
 import "@udecode/plate-dnd";
@@ -5361,6 +5361,7 @@ const Toggle = ({
   disabled = false
 }) => {
   const checked = !!(input.value || input.checked);
+  const inputId = name2 ?? input.name;
   let labels = null;
   if (field.toggleLabels) {
     const fieldLabels = typeof field.toggleLabels === "object" && "true" in field.toggleLabels && "false" in field.toggleLabels && field.toggleLabels;
@@ -5375,7 +5376,7 @@ const Toggle = ({
       className: `text-sm ${!checked ? "text-blue-500 font-bold" : "text-gray-300"}`
     },
     labels.false
-  ), /* @__PURE__ */ React.createElement("div", { className: "relative w-12 h-7" }, /* @__PURE__ */ React.createElement(ToggleInput, { id: name2, type: "checkbox", ...input }), /* @__PURE__ */ React.createElement(
+  ), /* @__PURE__ */ React.createElement("div", { className: "relative w-12 h-7" }, /* @__PURE__ */ React.createElement(ToggleInput, { type: "checkbox", ...input, id: inputId }), /* @__PURE__ */ React.createElement(
     "label",
     {
       className: "bg-none p-0 outline-none w-12 h-7",
@@ -5383,7 +5384,7 @@ const Toggle = ({
         opacity: disabled ? 0.4 : 1,
         pointerEvents: disabled ? "none" : "inherit"
       },
-      htmlFor: name2,
+      htmlFor: inputId,
       role: "switch"
     },
     /* @__PURE__ */ React.createElement("div", { className: "relative w-[48px] h-7 rounded-3xl bg-white shadow-inner border border-gray-200 pointer-events-none -ml-0.5" }, /* @__PURE__ */ React.createElement(
@@ -8912,6 +8913,20 @@ function useLocalStorage(key, initialValue) {
   };
   return [storedValue, setValue];
 }
+const EditorialWorkflowErrorBox = ({
+  error
+}) => /* @__PURE__ */ React__default.createElement("div", { className: "flex items-start gap-1 text-red-700 py-2 px-3 mb-4 bg-red-50 border border-red-200 rounded" }, /* @__PURE__ */ React__default.createElement(CircleAlert, { className: "w-5 h-auto text-red-400 flex-shrink-0" }), /* @__PURE__ */ React__default.createElement("span", { className: "text-sm whitespace-pre-line" }, /* @__PURE__ */ React__default.createElement("b", null, "Error:"), " ", error.messageParts.map(
+  (part, index) => part.emphasis ? /* @__PURE__ */ React__default.createElement("b", { key: index }, part.text) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, { key: index }, part.text)
+), error.link && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, " ", /* @__PURE__ */ React__default.createElement(
+  "a",
+  {
+    className: "underline text-tina-orange-dark font-medium",
+    href: error.link.url,
+    target: "_blank",
+    rel: "noreferrer"
+  },
+  error.link.label
+))));
 const Badge = ({
   children,
   calloutStyle = "warning",
@@ -10244,8 +10259,10 @@ const EDITORIAL_WORKFLOW_STATUS = {
 const EDITORIAL_WORKFLOW_ERROR = {
   BRANCH_EXISTS: "BRANCH_EXISTS",
   BRANCH_HIERARCHY_CONFLICT: "BRANCH_HIERARCHY_CONFLICT",
-  VALIDATION_FAILED: "VALIDATION_FAILED"
+  VALIDATION_FAILED: "VALIDATION_FAILED",
+  INDEXING_FAILED: "INDEXING_FAILED"
 };
+const EDITORIAL_WORKFLOW_EVENT_LOG_DOCS_URL = "https://tina.io/docs/tinacloud/dashboard/event-log#common-causes";
 const getEditorialWorkflowPrTitle = (branchName) => `${branchName.replace("tina/", "").replaceAll("-", " ")} (PR from TinaCMS)`;
 const TARGET_BRANCH_EXISTS_ERROR = "A branch with this name already exists";
 const checkBranchExists = async (tinaApi, branchName, debugLabel, branchType, fallback, signal) => {
@@ -10301,6 +10318,71 @@ const checkBranchGuard = async (tinaApi, baseBranch, targetBranch, debugLabel, s
     return { baseBranchExists: true, targetBranchExists: false };
   }
 };
+const plainMessage = (text) => [
+  { text }
+];
+const messageText = (parts) => parts.map((part) => part.text).join("");
+const pageNameFrom = (file) => {
+  var _a;
+  return ((_a = file.split("/").pop()) == null ? void 0 : _a.replace(/\.[^.]+$/, "")) || file;
+};
+const indexingFailureCopy = (file, collectionLabel) => {
+  const subject = file ? `“${pageNameFrom(file)}”` : "your content";
+  const messageParts = [
+    { text: "We couldn't save your changes, because there's a problem with " },
+    { text: subject, emphasis: true },
+    ...collectionLabel ? [{ text: " in " }, { text: collectionLabel, emphasis: true }] : [],
+    { text: ".\n\nFix that page, then save again." }
+  ];
+  return {
+    messageParts,
+    link: {
+      url: EDITORIAL_WORKFLOW_EVENT_LOG_DOCS_URL,
+      label: "How to resolve this"
+    }
+  };
+};
+const collectionLabelResolver = (schema) => (file) => {
+  var _a;
+  try {
+    const collection = (_a = schema == null ? void 0 : schema.getCollectionByFullPath) == null ? void 0 : _a.call(schema, file);
+    return (collection == null ? void 0 : collection.label) || (collection == null ? void 0 : collection.name);
+  } catch {
+    return void 0;
+  }
+};
+const getEditorialWorkflowError = (e, resolveCollectionLabel) => {
+  let errMessage = "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 = e;
+  if (err.errorCode) {
+    switch (err.errorCode) {
+      case EDITORIAL_WORKFLOW_ERROR.BRANCH_EXISTS:
+        errMessage = "A branch with this name already exists";
+        break;
+      case EDITORIAL_WORKFLOW_ERROR.BRANCH_HIERARCHY_CONFLICT:
+        errMessage = err.message || "Branch name conflicts with an existing branch";
+        break;
+      case EDITORIAL_WORKFLOW_ERROR.VALIDATION_FAILED:
+        errMessage = err.message || "Invalid branch name";
+        break;
+      case EDITORIAL_WORKFLOW_ERROR.INDEXING_FAILED:
+        return indexingFailureCopy(
+          err.file,
+          err.file ? resolveCollectionLabel == null ? void 0 : resolveCollectionLabel(err.file) : void 0
+        );
+      default:
+        errMessage = err.message || errMessage;
+        break;
+    }
+  } else if (err.message) {
+    if (err.message.toLowerCase().includes(ERR_BRANCH_EXISTS)) {
+      errMessage = "A branch with this name already exists";
+    } else if (err.message.toLowerCase().includes(ERR_BRANCH_CONFLICT)) {
+      errMessage = err.message;
+    }
+  }
+  return { messageParts: plainMessage(errMessage) };
+};
 const MEDIA_WORKFLOW_STEP = {
   BRANCH: 1,
   CONTENT: 2,
@@ -10604,7 +10686,8 @@ class TinaMediaStore {
   dispatchMediaWorkflowError(err) {
     this.cms.events.dispatch({
       type: "media:workflow:error",
-      message: err instanceof Error ? err.message : String(err)
+      message: err instanceof Error ? err.message : String(err),
+      error: err
     });
   }
   async runMediaOpWithWorkflow(decision, op) {
@@ -11115,7 +11198,7 @@ class TinaMediaStore {
     if (!this.isLocal) {
       const encodedBranch = this.encodedBranchParam();
       res = await this.api.authProvider.fetchWithToken(
-        `${this.listUrl}/list/${options.directory || ""}?limit=${options.limit || 20}${options.offset ? `&cursor=${options.offset}` : ""}${encodedBranch ? `&branch=${encodedBranch}` : ""}${options.search ? `&search=${encodeURIComponent(options.search)}` : ""}${((_a = options.ext) == null ? void 0 : _a.length) ? `&ext=${encodeURIComponent(options.ext.join(","))}` : ""}`
+        `${this.listUrl}/list/${options.directory || ""}?limit=${options.limit || 20}${options.offset ? `&cursor=${encodeURIComponent(options.offset)}` : ""}${encodedBranch ? `&branch=${encodedBranch}` : ""}${options.search ? `&search=${encodeURIComponent(options.search)}` : ""}${((_a = options.ext) == null ? void 0 : _a.length) ? `&ext=${encodeURIComponent(options.ext.join(","))}` : ""}`
       );
       if (res.status == 401) {
         throw E_UNAUTHORIZED;
@@ -11125,7 +11208,7 @@ class TinaMediaStore {
       }
     } else {
       res = await this.fetchFunction(
-        `${this.url}/list/${options.directory || ""}?limit=${options.limit || 20}${options.offset ? `&cursor=${options.offset}` : ""}${options.search ? `&search=${encodeURIComponent(options.search)}` : ""}${((_b = options.ext) == null ? void 0 : _b.length) ? `&ext=${encodeURIComponent(options.ext.join(","))}` : ""}`
+        `${this.url}/list/${options.directory || ""}?limit=${options.limit || 20}${options.offset ? `&cursor=${encodeURIComponent(options.offset)}` : ""}${options.search ? `&search=${encodeURIComponent(options.search)}` : ""}${((_b = options.ext) == null ? void 0 : _b.length) ? `&ext=${encodeURIComponent(options.ext.join(","))}` : ""}`
       );
       if (res.status == 404) {
         throw E_BAD_ROUTE;
@@ -14005,6 +14088,70 @@ function createCloudConfig({
     ...options
   };
 }
+const LOADING_MESSAGES = [
+  "Hang tight, TinaCMS is looking for llamas 🦙 🦙 🦙",
+  "Reticulating llama splines 🦙",
+  "Herding llamas into collections 🦙",
+  "Brushing llama fur 🦙 🦙",
+  "Teaching a llama to write frontmatter 🦙",
+  "Feeding the GraphQL llama 🦙",
+  "Counting llamas in your content folder 🦙",
+  "Asking a llama what changed in git 🦙",
+  "Llamas are proofreading your schema 🦙",
+  "Untangling markdown with llama teeth 🦙",
+  "Waking the llamas in the media library 🦙",
+  "Alphabetising llamas by collection 🦙",
+  "Convincing a llama that MDX is fine 🦙",
+  "Saddling up the content layer 🦙",
+  "Polishing the sidebar, llama style 🦙",
+  "One more llama, almost there 🦙"
+];
+const CYCLE_MS = 2e3;
+const FADE_MS = 200;
+const prefersReducedMotion = () => typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+const pickOther = (current, length) => {
+  if (length < 2) return 0;
+  const offset2 = 1 + Math.floor(Math.random() * (length - 1));
+  return (current + offset2) % length;
+};
+const LoadingMessage = ({
+  className,
+  style,
+  messages = LOADING_MESSAGES
+}) => {
+  const [index, setIndex] = React__default.useState(0);
+  const [visible, setVisible] = React__default.useState(false);
+  const [reducedMotion] = React__default.useState(prefersReducedMotion);
+  React__default.useEffect(() => {
+    setIndex((current) => pickOther(current, messages.length));
+    setVisible(true);
+  }, [messages.length]);
+  React__default.useEffect(() => {
+    const fadeOut = setTimeout(() => setVisible(false), CYCLE_MS - FADE_MS);
+    const next = setTimeout(() => {
+      setIndex((current) => pickOther(current, messages.length));
+      setVisible(true);
+    }, CYCLE_MS);
+    return () => {
+      clearTimeout(fadeOut);
+      clearTimeout(next);
+    };
+  }, [index, messages.length]);
+  return /* @__PURE__ */ React__default.createElement(
+    "p",
+    {
+      className,
+      "aria-live": "polite",
+      style: {
+        ...style,
+        opacity: reducedMotion || visible ? 1 : 0,
+        transform: reducedMotion || visible ? "none" : "translateY(4px)",
+        transition: reducedMotion ? void 0 : `opacity ${FADE_MS}ms ease-out, transform ${FADE_MS}ms ease-out`
+      }
+    },
+    messages[index]
+  );
+};
 const SidebarLoadingPlaceholder = () => /* @__PURE__ */ React.createElement(
   "div",
   {
@@ -14018,7 +14165,7 @@ const SidebarLoadingPlaceholder = () => /* @__PURE__ */ React.createElement(
       animationDuration: "150ms"
     }
   },
-  /* @__PURE__ */ React.createElement("p", { className: "block pb-5" }, "Please wait while TinaCMS", /* @__PURE__ */ React.createElement("br", null), "loads your content"),
+  /* @__PURE__ */ React.createElement(LoadingMessage, { className: "block pb-5" }),
   /* @__PURE__ */ React.createElement(LoadingDots, { color: "var(--tina-color-primary)" })
 );
 class SidebarState {
@@ -14158,12 +14305,12 @@ const FormModal = ({ plugin, close: close2 }) => {
 const name = "tinacms";
 const type = "module";
 const typings = "dist/index.d.ts";
-const version = "3.13.0";
+const version = "3.14.1";
 const main = "dist/index.js";
 const module$1 = "./dist/index.js";
-const exports$1 = { ".": "./dist/index.js", "./dist/client": "./dist/client.js", "./react": "./dist/react.js", "./dist/react": "./dist/react.js", "./tina-field": "./dist/tina-field.js", "./dist/tina-field": "./dist/tina-field.js", "./dist/rich-text": "./dist/rich-text/index.js", "./dist/rich-text/static": "./dist/rich-text/static.js", "./dist/rich-text/prism": "./dist/rich-text/prism.js" };
+const exports$1 = { ".": "./dist/index.js", "./dist/client": { "types": "./dist/client.d.ts", "browser": "./dist/client.browser.js", "default": "./dist/client.js" }, "./react": "./dist/react.js", "./dist/react": "./dist/react.js", "./tina-field": "./dist/tina-field.js", "./dist/tina-field": "./dist/tina-field.js", "./dist/rich-text": "./dist/rich-text/index.js", "./dist/rich-text/static": "./dist/rich-text/static.js", "./dist/rich-text/prism": "./dist/rich-text/prism.js" };
 const files = ["dist"];
-const buildConfig = { "entryPoints": ["src/index.ts", "src/rich-text/index.tsx", "src/rich-text/static.tsx", "src/rich-text/prism.tsx", "src/react.tsx", "src/tina-field.ts", { "name": "src/client.ts", "target": "node" }] };
+const buildConfig = { "entryPoints": ["src/index.ts", "src/rich-text/index.tsx", "src/rich-text/static.tsx", "src/rich-text/prism.tsx", "src/react.tsx", "src/tina-field.ts", { "name": "src/client.ts", "target": "node" }, "src/client.browser.ts"] };
 const license = "Apache-2.0";
 const scripts = { "types": "pnpm tsc && pnpm tsc-alias", "build": "tinacms-scripts build", "test": "vitest run", "test-watch": "vitest" };
 const dependencies = { "@ariakit/react": "catalog:", "@dnd-kit/core": "catalog:", "@dnd-kit/sortable": "catalog:", "@dnd-kit/utilities": "catalog:", "@floating-ui/dom": "catalog:", "@floating-ui/react-dom": "catalog:", "@graphql-inspector/core": "^6.2.1", "@radix-ui/react-dialog": "catalog:", "@radix-ui/react-dropdown-menu": "catalog:", "@radix-ui/react-popover": "catalog:", "@radix-ui/react-select": "catalog:", "@radix-ui/react-separator": "catalog:", "@radix-ui/react-slot": "catalog:", "@radix-ui/react-toolbar": "catalog:", "@radix-ui/react-tooltip": "catalog:", "@react-hook/window-size": "catalog:", "@tanstack/react-table": "^8.21.3", "@tinacms/bridge": "workspace:^", "@tinacms/mdx": "workspace:^", "@tinacms/schema-tools": "workspace:^", "@tinacms/search": "workspace:^", "@udecode/cmdk": "catalog:", "@udecode/cn": "catalog:", "@udecode/plate": "catalog:", "@udecode/plate-autoformat": "catalog:", "@udecode/plate-basic-marks": "catalog:", "@udecode/plate-block-quote": "catalog:", "@udecode/plate-break": "catalog:", "@udecode/plate-code-block": "catalog:", "@udecode/plate-combobox": "catalog:", "@udecode/plate-dnd": "catalog:", "@udecode/plate-floating": "catalog:", "@udecode/plate-heading": "catalog:", "@udecode/plate-highlight": "catalog:", "@udecode/plate-horizontal-rule": "catalog:", "@udecode/plate-indent-list": "catalog:", "@udecode/plate-link": "catalog:", "@udecode/plate-list": "catalog:", "@udecode/plate-node-id": "catalog:", "@udecode/plate-reset-node": "catalog:", "@udecode/plate-resizable": "catalog:", "@udecode/plate-selection": "catalog:", "@udecode/plate-slash-command": "catalog:", "@udecode/plate-table": "catalog:", "@udecode/plate-trailing-block": "catalog:", "class-variance-authority": "catalog:", "clsx": "catalog:", "cmdk": "catalog:", "color-string": "catalog:", "date-fns": "4.1.0", "es-toolkit": "^1.42.0", "final-form": "catalog:", "final-form-arrays": "catalog:", "final-form-set-field-data": "catalog:", "graphql": "15.8.0", "graphql-tag": "catalog:", "is-hotkey": "catalog:", "lucide-react": "catalog:", "mermaid": "catalog:", "posthog-js": "^1.347.1", "prism-react-renderer": "catalog:", "prop-types": "catalog:", "react-colorful": "catalog:", "react-day-picker": "^9.13.0", "react-dnd": "catalog:", "react-dnd-html5-backend": "catalog:", "react-dropzone": "catalog:", "react-final-form": "catalog:", "react-router-dom": "catalog:", "react-use": "catalog:", "tailwind-merge": "^2.6.0", "webfontloader": "catalog:", "yup": "^1.6.1", "zod": "catalog:" };
@@ -16553,6 +16700,9 @@ const useFieldReference = (fieldName) => {
     } else {
       doc = document;
     }
+    if (!doc) {
+      return;
+    }
     const fieldEle = doc.querySelector(
       `[data-tinafield="${fieldName}"]`
     );
@@ -17210,39 +17360,12 @@ const formatTime = (seconds) => {
   const secs = seconds % 60;
   return `${mins}:${secs.toString().padStart(2, "0")}`;
 };
-const getEditorialWorkflowErrorMessage = (e) => {
-  let errMessage = "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 = e;
-  if (err.errorCode) {
-    switch (err.errorCode) {
-      case EDITORIAL_WORKFLOW_ERROR.BRANCH_EXISTS:
-        errMessage = "A branch with this name already exists";
-        break;
-      case EDITORIAL_WORKFLOW_ERROR.BRANCH_HIERARCHY_CONFLICT:
-        errMessage = err.message || "Branch name conflicts with an existing branch";
-        break;
-      case EDITORIAL_WORKFLOW_ERROR.VALIDATION_FAILED:
-        errMessage = err.message || "Invalid branch name";
-        break;
-      default:
-        errMessage = err.message || errMessage;
-        break;
-    }
-  } else if (err.message) {
-    if (err.message.toLowerCase().includes(ERR_BRANCH_EXISTS)) {
-      errMessage = "A branch with this name already exists";
-    } else if (err.message.toLowerCase().includes(ERR_BRANCH_CONFLICT)) {
-      errMessage = err.message;
-    }
-  }
-  return errMessage;
-};
 function useEditorialWorkflow() {
   const cms = useCMS$1();
   const tinaApi = cms.api.tina;
   const { setCurrentBranch } = useBranchData();
   const [isExecuting, setIsExecuting] = React.useState(false);
-  const [errorMessage, setErrorMessage] = React.useState("");
+  const [error, setError] = React.useState(void 0);
   const [currentStep, setCurrentStep] = React.useState(0);
   const [elapsedTime, setElapsedTime] = React.useState(0);
   React.useEffect(() => {
@@ -17259,7 +17382,7 @@ function useEditorialWorkflow() {
     };
   }, [isExecuting, currentStep]);
   const reset = () => {
-    setErrorMessage("");
+    setError(void 0);
     setIsExecuting(false);
     setCurrentStep(0);
   };
@@ -17285,7 +17408,7 @@ function useEditorialWorkflow() {
       );
       if (signal == null ? void 0 : signal.aborted) return { success: false };
       if (targetBranchExists) {
-        setErrorMessage(TARGET_BRANCH_EXISTS_ERROR);
+        setError({ messageParts: plainMessage(TARGET_BRANCH_EXISTS_ERROR) });
         setIsExecuting(false);
         setCurrentStep(0);
         return { success: false, error: TARGET_BRANCH_EXISTS_ERROR };
@@ -17363,16 +17486,19 @@ function useEditorialWorkflow() {
       return { success: true };
     } catch (e) {
       console.error(e);
-      const errMessage = getEditorialWorkflowErrorMessage(e);
-      setErrorMessage(errMessage);
+      const copy = getEditorialWorkflowError(
+        e,
+        collectionLabelResolver(cms.api.tina.schema)
+      );
+      setError(copy);
       setIsExecuting(false);
       setCurrentStep(0);
-      return { success: false, error: errMessage };
+      return { success: false, error: messageText(copy.messageParts) };
     }
   };
   return {
     isExecuting,
-    errorMessage,
+    error,
     currentStep,
     elapsedTime,
     executeWorkflow,
@@ -17489,7 +17615,7 @@ const CreateBranchModal = ({
   const branchGuardAbortRef = React.useRef(null);
   const {
     isExecuting,
-    errorMessage,
+    error,
     currentStep,
     elapsedTime,
     executeWorkflow,
@@ -17531,7 +17657,7 @@ const CreateBranchModal = ({
       return;
     }
     setIsBranchGuardChecking(false);
-    const { success, error } = await executeWorkflow({
+    const { success, error: error2 } = await executeWorkflow({
       branchName: targetBranch,
       baseBranch,
       path,
@@ -17549,7 +17675,7 @@ const CreateBranchModal = ({
     captureEvent(EditorialWorkflowSaveEvent, {
       choice: isDraft ? "draft" : "review",
       success,
-      error
+      error: error2
     });
     if (success) {
       close2();
@@ -17573,7 +17699,7 @@ const CreateBranchModal = ({
         abortBranchGuard();
         close2();
       },
-      errorMessage,
+      error,
       disabled: normalizedBranchName === "" || isBranchGuardChecking,
       onBranchNameChange: (value) => {
         abortBranchGuard();
@@ -17624,7 +17750,7 @@ const CreateBranchPromptModal = ({
   branchName,
   close: close2,
   disabled,
-  errorMessage,
+  error,
   onBranchNameChange,
   onCreateBranch,
   onSaveToProtectedBranch,
@@ -17658,7 +17784,7 @@ const CreateBranchPromptModal = ({
   };
   const mainChoice = choices[main2] ?? choices.draft;
   const MainIcon = mainChoice.Icon;
-  return /* @__PURE__ */ React.createElement(Modal, { className: "flex" }, /* @__PURE__ */ React.createElement(PopupModal, { className: "w-auto" }, /* @__PURE__ */ React.createElement(ModalHeader, { close: close2 }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-between w-full" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center" }, "Save changes to new branch"))), /* @__PURE__ */ React.createElement(ModalBody, { padded: true }, /* @__PURE__ */ React.createElement("div", { className: "max-w-sm" }, errorMessage && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-1 text-red-700 py-2 px-3 mb-4 bg-red-50 border border-red-200 rounded" }, /* @__PURE__ */ React.createElement(CircleAlert, { className: "w-5 h-auto text-red-400 flex-shrink-0" }), /* @__PURE__ */ React.createElement("span", { className: "text-sm" }, /* @__PURE__ */ React.createElement("b", null, "Error:"), " ", errorMessage)), /* @__PURE__ */ React.createElement("p", { className: "text-lg text-gray-700 font-bold mb-2" }, "First, let's create a copy"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-700 mb-4 max-w-sm" }, "To make changes, you need to create a copy then get it approved and merged for it to go live.", /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("span", { className: "text-gray-500" }, "Learn more about "), /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(Modal, { className: "flex" }, /* @__PURE__ */ React.createElement(PopupModal, { className: "w-auto" }, /* @__PURE__ */ React.createElement(ModalHeader, { close: close2 }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-between w-full" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center" }, "Save changes to new branch"))), /* @__PURE__ */ React.createElement(ModalBody, { padded: true }, /* @__PURE__ */ React.createElement("div", { className: "max-w-sm" }, error && /* @__PURE__ */ React.createElement(EditorialWorkflowErrorBox, { error }), /* @__PURE__ */ React.createElement("p", { className: "text-lg text-gray-700 font-bold mb-2" }, "First, let's create a copy"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-700 mb-4 max-w-sm" }, "To make changes, you need to create a copy then get it approved and merged for it to go live.", /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("span", { className: "text-gray-500" }, "Learn more about "), /* @__PURE__ */ React.createElement(
     "a",
     {
       className: "underline text-tina-orange-dark font-medium",
@@ -17785,7 +17911,7 @@ const BranchDeletedModal = ({
   const baseBranch = tinaApi.protectedBranches[0] || cms.api.tina.schema.config.config.repoProvider.defaultBranchName || "main";
   const {
     isExecuting,
-    errorMessage,
+    error,
     currentStep,
     elapsedTime,
     executeWorkflow,
@@ -17815,7 +17941,7 @@ const BranchDeletedModal = ({
       className: "w-4 h-4 mt-0.5 flex-shrink-0 text-yellow-600",
       style: { fill: "none" }
     }
-  ), /* @__PURE__ */ React.createElement("span", null, "The branch", " ", /* @__PURE__ */ React.createElement("span", { className: "font-mono font-semibold" }, branchName), " ", "no longer exists. It may have been merged or deleted. Your changes cannot be pushed to it.")), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-700 mb-4" }, "Create a new branch from", " ", /* @__PURE__ */ React.createElement("span", { className: "font-mono font-semibold" }, baseBranch), " to continue editing, or cancel and switch to an existing branch from the branch menu."), errorMessage && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-1 text-red-700 py-2 px-3 mb-4 bg-red-50 border border-red-200 rounded" }, /* @__PURE__ */ React.createElement(CircleAlert, { className: "w-5 h-auto text-red-400 flex-shrink-0" }), /* @__PURE__ */ React.createElement("span", { className: "text-sm" }, /* @__PURE__ */ React.createElement("b", null, "Error:"), " ", errorMessage)), /* @__PURE__ */ React.createElement(
+  ), /* @__PURE__ */ React.createElement("span", null, "The branch", " ", /* @__PURE__ */ React.createElement("span", { className: "font-mono font-semibold" }, branchName), " ", "no longer exists. It may have been merged or deleted. Your changes cannot be pushed to it.")), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-700 mb-4" }, "Create a new branch from", " ", /* @__PURE__ */ React.createElement("span", { className: "font-mono font-semibold" }, baseBranch), " to continue editing, or cancel and switch to an existing branch from the branch menu."), error && /* @__PURE__ */ React.createElement(EditorialWorkflowErrorBox, { error }), /* @__PURE__ */ React.createElement(
     PrefixedTextField,
     {
       name: "new-branch-name",
@@ -71598,12 +71724,15 @@ const MediaWorkflowOverlay = () => {
     const offComplete = cms.events.subscribe("media:workflow:complete", (event) => {
       setCurrentBranch(event.branchName);
     });
-    const offError = cms.events.subscribe(
-      "media:workflow:error",
-      (event) => {
-        setState({ phase: "error", message: event.message });
-      }
-    );
+    const offError = cms.events.subscribe("media:workflow:error", (event) => {
+      setState({
+        phase: "error",
+        error: event.error === void 0 ? { messageParts: plainMessage(event.message) } : getEditorialWorkflowError(
+          event.error,
+          collectionLabelResolver(cms.api.tina.schema)
+        )
+      });
+    });
     const offFinish = cms.events.subscribe("media:workflow:finish", () => {
       setState({ phase: "idle" });
     });
@@ -71637,7 +71766,7 @@ const MediaWorkflowOverlay = () => {
     setState({
       ...confirmState,
       isChecking: true,
-      errorMessage: ""
+      error: void 0
     });
     const { baseBranchExists, targetBranchExists } = await checkBranchGuard(
       cms.api.tina,
@@ -71655,7 +71784,11 @@ const MediaWorkflowOverlay = () => {
         ...confirmState,
         branchName,
         isChecking: false,
-        errorMessage: `The branch ${confirmState.baseBranch} no longer exists. It may have been merged or deleted. Your changes cannot be pushed to it.`
+        error: {
+          messageParts: plainMessage(
+            `The branch ${confirmState.baseBranch} no longer exists. It may have been merged or deleted. Your changes cannot be pushed to it.`
+          )
+        }
       });
       return;
     }
@@ -71667,7 +71800,7 @@ const MediaWorkflowOverlay = () => {
         ...confirmState,
         branchName,
         isChecking: false,
-        errorMessage: TARGET_BRANCH_EXISTS_ERROR
+        error: { messageParts: plainMessage(TARGET_BRANCH_EXISTS_ERROR) }
       });
       return;
     }
@@ -71683,7 +71816,10 @@ const MediaWorkflowOverlay = () => {
         ...confirmState,
         branchName,
         isChecking: false,
-        errorMessage: getEditorialWorkflowErrorMessage(e)
+        error: getEditorialWorkflowError(
+          e,
+          collectionLabelResolver(cms.api.tina.schema)
+        )
       });
     }
   };
@@ -71699,14 +71835,14 @@ const MediaWorkflowOverlay = () => {
           setState({ phase: "idle" });
         },
         disabled: normalizeBranchName(state.branchName) === "" || state.isChecking,
-        errorMessage: state.errorMessage,
+        error: state.error,
         onBranchNameChange: (branchName) => {
           abortPreflight();
           setState(
             (prev) => prev.phase === "confirming" ? {
               ...prev,
               branchName,
-              errorMessage: void 0,
+              error: void 0,
               isChecking: false
             } : prev
           );
@@ -71732,7 +71868,7 @@ const MediaWorkflowOverlay = () => {
     );
   }
   const dismissError = () => setState({ phase: "idle" });
-  return /* @__PURE__ */ React.createElement(Modal, { className: "flex" }, /* @__PURE__ */ React.createElement(PopupModal, { className: "w-auto" }, /* @__PURE__ */ React.createElement(ModalHeader, { close: dismissError }, "Branch creation failed"), /* @__PURE__ */ React.createElement(ModalBody, { padded: true }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-1 text-red-700 py-2 px-3 bg-red-50 border border-red-200 rounded max-w-sm" }, /* @__PURE__ */ React.createElement(CircleAlert, { className: "w-5 h-auto text-red-400 flex-shrink-0" }), /* @__PURE__ */ React.createElement("span", { className: "text-sm" }, /* @__PURE__ */ React.createElement("b", null, "Error:"), " ", state.message)))));
+  return /* @__PURE__ */ React.createElement(Modal, { className: "flex" }, /* @__PURE__ */ React.createElement(PopupModal, { className: "w-auto" }, /* @__PURE__ */ React.createElement(ModalHeader, { close: dismissError }, "Branch creation failed"), /* @__PURE__ */ React.createElement(ModalBody, { padded: true }, /* @__PURE__ */ React.createElement("div", { className: "max-w-sm" }, /* @__PURE__ */ React.createElement(EditorialWorkflowErrorBox, { error: state.error })))));
 };
 function asyncPoll(fn, pollInterval = 5 * 1e3, pollTimeout = 30 * 1e3) {
   const endTime = (/* @__PURE__ */ new Date()).getTime() + pollTimeout;
@@ -71901,6 +72037,7 @@ async function authenticate(clientId, identityApiUrl, frontendUrl) {
 const DefaultSessionProvider = ({
   children
 }) => /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children);
+const bearerToken = (token) => (token == null ? void 0 : token.id_token) ?? (token == null ? void 0 : token.access_token) ?? null;
 class AbstractAuthProvider {
   constructor() {
     /**
@@ -71936,8 +72073,7 @@ class AbstractAuthProvider {
     return res;
   }
   async getAccessToken() {
-    const token = await this.getToken();
-    return (token == null ? void 0 : token.access_token) ?? (token == null ? void 0 : token.id_token) ?? null;
+    return bearerToken(await this.getToken());
   }
   async authorize(context) {
     return this.getToken();
@@ -72342,7 +72478,7 @@ mutation addPendingDocumentMutation(
     const headers = {
       "Content-Type": "application/json"
     };
-    const accessToken = (token == null ? void 0 : token.id_token) ?? (token == null ? void 0 : token.access_token);
+    const accessToken = bearerToken(token);
     if (accessToken) {
       headers["Authorization"] = "Bearer " + accessToken;
     }
@@ -72688,6 +72824,9 @@ mutation addPendingDocumentMutation(
             statusResponseBody.message || "Editorial workflow failed"
           );
           error.errorCode = statusResponseBody.errorCode || "WORKFLOW_FAILED";
+          if (statusResponseBody.file) {
+            error.file = statusResponseBody.file;
+          }
           throw error;
         }
         if (statusResponse.status === 200) {
@@ -72728,6 +72867,9 @@ mutation addPendingDocumentMutation(
     if (responseBody == null ? void 0 : responseBody.conflictingBranch) {
       error.conflictingBranch = responseBody.conflictingBranch;
     }
+    if (responseBody == null ? void 0 : responseBody.file) {
+      error.file = responseBody.file;
+    }
     return error;
   }
   async postEditorialWorkflow(url, body, errorFallback) {
@@ -73902,7 +74044,7 @@ const Loader = (props) => {
         ))
       ),
       /* @__PURE__ */ React__default.createElement(
-        "p",
+        LoadingMessage,
         {
           style: {
             fontSize: "18px",
@@ -73912,8 +74054,7 @@ const Loader = (props) => {
             fontFamily: "'Inter', sans-serif",
             fontWeight: "normal"
           }
-        },
-        "Please wait, Tina is loading data..."
+        }
       )
     )
   ), props.children);
@@ -74214,7 +74355,7 @@ const LoadingPage = () => /* @__PURE__ */ React__default.createElement(React__de
       ))
     ),
     /* @__PURE__ */ React__default.createElement(
-      "p",
+      LoadingMessage,
       {
         style: {
           fontSize: "16px",
@@ -74224,8 +74365,7 @@ const LoadingPage = () => /* @__PURE__ */ React__default.createElement(React__de
           fontFamily: "'Inter', sans-serif",
           fontWeight: "normal"
         }
-      },
-      "Please wait, Tina is loading data..."
+      }
     )
   )
 ));
@@ -76172,6 +76312,24 @@ const ScreenPage = () => {
     } })));
   });
 };
+function resolvePreviewPath(splat, baseOrigin = typeof window !== "undefined" ? window.location.origin : "") {
+  if (!baseOrigin || !splat) {
+    return { path: "/", offOrigin: false };
+  }
+  try {
+    const resolved = new URL(`/${splat}`, baseOrigin);
+    if (resolved.origin !== baseOrigin) {
+      return { path: "/", offOrigin: true };
+    }
+    const path = `${resolved.pathname}${resolved.search}${resolved.hash}`;
+    if (new URL(path, baseOrigin).origin !== baseOrigin) {
+      return { path: "/", offOrigin: true };
+    }
+    return { path, offOrigin: false };
+  } catch {
+    return { path: "/", offOrigin: true };
+  }
+}
 const TROUBLESHOOTING_URL = "https://tina.io/docs/tinacloud/troubleshooting";
 const ErrorModalContent = (props) => {
   const { title, message } = props;
@@ -76251,12 +76409,23 @@ const SetPreviewFlag = ({
   return null;
 };
 const PreviewInner = ({ preview, config }) => {
+  const cms = useCMS$1();
   const params = useParams();
   const navigate = useNavigate();
-  const [url, setURL] = React__default.useState(`/${params["*"]}`);
+  const splat = params["*"];
+  const { path: paramURL, offOrigin } = resolvePreviewPath(splat);
+  const [url, setURL] = React__default.useState(paramURL);
   const [reportedURL, setReportedURL] = useState(null);
   const ref = React__default.useRef(null);
-  const paramURL = `/${params["*"]}`;
+  React__default.useEffect(() => {
+    if (!offOrigin) {
+      return;
+    }
+    cms.alerts.warn(
+      "This preview link points to a different site, so it was not opened."
+    );
+    navigate(`/~${paramURL}`, { replace: true });
+  }, [splat, offOrigin]);
   React__default.useEffect(() => {
     if (reportedURL !== paramURL && paramURL) {
       setURL(paramURL);

package/dist/internalClient/bearerToken.d.ts

@@ -0,0 +1,2 @@
+import type { TokenObject } from '@tinacms/schema-tools';
+export declare const bearerToken: (token: TokenObject | null | undefined) => string;