tinacms 0.0.0-eb519f2-20241015053224 → 0.0.0-ebe1b69-20250211022853

package/dist/index.mjs

@@ -6,8 +6,8 @@ var __publicField = (obj, key, value) => {
 };
 import { z } from "zod";
 import * as React from "react";
-import React__default, { useState, useCallback, useEffect, useRef, createContext, forwardRef, useContext, useMemo, startTransition, createElement, Component } from "react";
-import { createPortal, findDOMNode } from "react-dom";
+import React__default, { useState, useCallback, useEffect, useRef, createContext, forwardRef, useContext, useMemo, startTransition } from "react";
+import { createPortal } from "react-dom";
 import { withRef, cn as cn$1, withVariants, withProps, withCn, createPrimitiveElement } from "@udecode/cn";
 import { toggleList, ELEMENT_UL, ELEMENT_OL, ELEMENT_H1 as ELEMENT_H1$1, ELEMENT_H2 as ELEMENT_H2$1, ELEMENT_H3 as ELEMENT_H3$1, ELEMENT_H4, ELEMENT_H5, ELEMENT_H6, ELEMENT_PARAGRAPH, ELEMENT_BLOCKQUOTE, ELEMENT_CODE_BLOCK, ELEMENT_CODE_LINE, ELEMENT_CODE_SYNTAX, ELEMENT_LI, ELEMENT_LINK, MARK_CODE, MARK_UNDERLINE, MARK_STRIKETHROUGH, MARK_ITALIC, MARK_BOLD, ELEMENT_HR, ELEMENT_TABLE, ELEMENT_TR, ELEMENT_TD, ELEMENT_TH, unwrapList, ELEMENT_TODO_LI, createTrailingBlockPlugin, createAutoformatPlugin, createExitBreakPlugin, KEYS_HEADING, createResetNodePlugin, createHeadingPlugin, createParagraphPlugin, createBlockquotePlugin, createBoldPlugin, createItalicPlugin, createUnderlinePlugin, createCodePlugin, createListPlugin, createIndentListPlugin, createHorizontalRulePlugin, createNodeIdPlugin, createTablePlugin, getListItemEntry, useListToolbarButtonState, useListToolbarButton } from "@udecode/plate";
 import { PlateElement, isCollapsed, findNodePath, getPointAfter, insertNodes, ELEMENT_DEFAULT, focusEditor, getPointBefore, setNodes, isElement, PlateLeaf, createPluginFactory, useComposedRef, useEditorRef, createPointRef, insertText, moveSelection, toggleNodeType, useElement, useRemoveNodeButton, useEditorSelector, isSelectionExpanded, withHOC, normalizeEditor, getBlockAbove, queryNode, getParentNode, isType, someNode, isSelectionAtBlockStart, setElements, insertNode, getPluginType, isBlock, isBlockAboveEmpty, findNode, PlateContent, getNodeEntries, useEditorState, collapseSelection, useMarkToolbarButtonState, useMarkToolbarButton, insertEmptyElement, usePlateSelectors, useEventEditorSelectors, PortalBody, useFormInputProps, createPlugins, Plate } from "@udecode/plate-common";
@@ -15,12 +15,12 @@ import { ELEMENT_SLASH_INPUT, createSlashPlugin } from "@udecode/plate-slash-com
 import { useSelected, useReadOnly, ReactEditor } from "slate-react";
 import { useCodeBlockElementState, useCodeSyntaxLeaf, ELEMENT_CODE_BLOCK as ELEMENT_CODE_BLOCK$1 } from "@udecode/plate-code-block";
 import MonacoEditor, { loader, useMonaco } from "@monaco-editor/react";
-import { Combobox, ComboboxInput, ComboboxButton, Transition, ComboboxOptions, ComboboxOption, Popover as Popover$3, PopoverButton, PopoverPanel, TransitionChild, Disclosure, DisclosureButton, DisclosurePanel, Menu, MenuButton, MenuItems, MenuItem } from "@headlessui/react";
+import { Combobox as Combobox$1, ComboboxInput, ComboboxButton, Transition, ComboboxOptions, ComboboxOption, Popover as Popover$3, PopoverButton, PopoverPanel, TransitionChild, Disclosure, DisclosureButton, DisclosurePanel, Menu, MenuButton, MenuItems, MenuItem } from "@headlessui/react";
 import { cva } from "class-variance-authority";
 import { Eye, SquarePen, Plus, AlignCenter as AlignCenter$1, AlignJustify, AlignLeft as AlignLeft$1, AlignRight as AlignRight$1, ChevronDown, PaintBucket, Quote, Check, ChevronRight, ChevronsUpDown, X, FileCode, Baseline, RectangleVertical, Combine, Ungroup, MessageSquare, MessageSquarePlus, Trash, GripVertical, Edit2, Smile, ExternalLink, Heading1, Heading2, Heading3, Heading4, Heading5, Heading6, Indent, Keyboard, WrapText, Minus, MoreHorizontal, Outdent, Pilcrow, RotateCcw, RectangleHorizontal, Search, Settings, Strikethrough, Subscript, Superscript, Table, Text, Underline, Link2Off, Moon, SunMedium, Twitter } from "lucide-react";
 import mermaid from "mermaid";
 import { ELEMENT_H1, ELEMENT_H2, ELEMENT_H3, ELEMENT_H4 as ELEMENT_H4$1, ELEMENT_H5 as ELEMENT_H5$1, ELEMENT_H6 as ELEMENT_H6$1 } from "@udecode/plate-heading";
-import { useComboboxContext, Combobox as Combobox$1, useComboboxStore, ComboboxProvider, Portal, ComboboxPopover, ComboboxItem } from "@ariakit/react";
+import { useComboboxContext, Combobox as Combobox$2, useComboboxStore, ComboboxProvider, Portal, ComboboxPopover, ComboboxItem } from "@ariakit/react";
 import { useHTMLInputCursorState, useComboboxInput, filterWords } from "@udecode/plate-combobox";
 import { useTableCellElementState, useTableCellElement, useTableCellElementResizableState, useTableCellElementResizable, useTableBordersDropdownMenuContentState, useTableMergeState, TableProvider, useTableElementState, useTableElement, mergeTableCells, unmergeTableCells, ELEMENT_TABLE as ELEMENT_TABLE$1, getTableColumnCount, insertTable, deleteTable, insertTableColumn, deleteColumn, insertTableRow, deleteRow } from "@udecode/plate-table";
 import { ResizeHandle as ResizeHandle$1 } from "@udecode/plate-resizable";
@@ -801,6 +801,22 @@ function wrapFieldsWithMeta(Field2) {
     );
   };
 }
+function wrapFieldWithNoHeader(Field2) {
+  return (props) => {
+    return /* @__PURE__ */ React.createElement(
+      FieldMeta,
+      {
+        name: props.input.name,
+        label: false,
+        description: "",
+        error: props.meta.error,
+        index: props.index,
+        tinaForm: props.tinaForm
+      },
+      /* @__PURE__ */ React.createElement(Field2, { ...props })
+    );
+  };
+}
 function wrapFieldWithError(Field2) {
   return (props) => {
     return /* @__PURE__ */ React.createElement(
@@ -873,6 +889,16 @@ const FieldDescription = ({
   className,
   ...props
 }) => {
+  if (typeof children === "string") {
+    return /* @__PURE__ */ React.createElement(
+      "span",
+      {
+        className: `block font-sans text-xs italic font-light text-gray-400 pt-0.5 whitespace-normal m-0 ${className}`,
+        ...props,
+        dangerouslySetInnerHTML: { __html: children }
+      }
+    );
+  }
   return /* @__PURE__ */ React.createElement(
     "span",
     {
@@ -966,7 +992,7 @@ const Autocomplete = ({
     }
   }, [items2, query]);
   return /* @__PURE__ */ React__default.createElement(
-    Combobox,
+    Combobox$1,
     {
       value,
       onChange,
@@ -1332,8 +1358,8 @@ const ListElementVariants = withVariants(PlateElement, listVariants, [
 ]);
 const ListElement = withRef(
   ({ children, variant = "ul", ...props }, ref) => {
-    const Component2 = variant;
-    return /* @__PURE__ */ React__default.createElement(ListElementVariants, { asChild: true, ref, variant, ...props }, /* @__PURE__ */ React__default.createElement(Component2, null, children));
+    const Component = variant;
+    return /* @__PURE__ */ React__default.createElement(ListElementVariants, { asChild: true, ref, variant, ...props }, /* @__PURE__ */ React__default.createElement(Component, null, children));
   }
 );
 const ELEMENT_MERMAID = "mermaid";
@@ -1348,7 +1374,7 @@ const MermaidElementWithRef = ({ config }) => {
   useEffect(() => {
     if (mermaidRef.current) {
       mermaid.initialize({ startOnLoad: true });
-      mermaid.run();
+      mermaid.init();
     }
   }, [config]);
   return /* @__PURE__ */ React__default.createElement("div", { contentEditable: false, className: "border-border border-b" }, /* @__PURE__ */ React__default.createElement("div", { ref: mermaidRef }, /* @__PURE__ */ React__default.createElement("pre", { className: "mermaid not-tina-prose" }, config)));
@@ -1375,7 +1401,7 @@ flowchart TD
     --> id2(modify me to see changes!)
     id2 
     --> id3(Click the top button to preview the changes)
-    --> id4(Learn about mermaid diagrams @ mermaid.js.org)`;
+    --> id4(Learn about mermaid diagrams - mermaid.js.org)`;
 const MermaidElement = withRef(
   ({ children, nodeProps, element, ...props }, ref) => {
     const [mermaidConfig, setMermaidConfig] = useState(
@@ -1391,7 +1417,7 @@ const MermaidElement = withRef(
       children: [{ type: "text", text: "" }]
     };
     useEffect(() => {
-      if (mermaid.parse(mermaidConfig, { suppressErrors: false })) {
+      if (mermaid.parse(mermaidConfig)) {
         setMermaidError(null);
       }
     }, [mermaidConfig]);
@@ -2147,7 +2173,7 @@ const InlineComboboxInput = forwardRef(({ className, ...props }, propRef) => {
     },
     value || "​"
   ), /* @__PURE__ */ React__default.createElement(
-    Combobox$1,
+    Combobox$2,
     {
       autoSelect: true,
       className: cn$1(
@@ -3653,7 +3679,7 @@ function TinaForm({ form, children }) {
   }));
 }
 function TinaField({
-  Component: Component2,
+  Component,
   children,
   ...fieldProps
 }) {
@@ -3661,7 +3687,7 @@ function TinaField({
   if (!isEditing)
     return children || null;
   return /* @__PURE__ */ React.createElement(Field, { ...fieldProps }, ({ input, meta }) => {
-    return /* @__PURE__ */ React.createElement(Component2, { input, meta, ...fieldProps });
+    return /* @__PURE__ */ React.createElement(Component, { input, meta, ...fieldProps });
   });
 }
 TinaField.propTypes = {
@@ -3703,7 +3729,7 @@ const Button$1 = ({
   };
   const sizeClasses = {
     small: `text-xs h-8 px-3`,
-    medium: `text-sm h-10 px-4`,
+    medium: `text-sm h-10 px-8`,
     custom: ``
   };
   return /* @__PURE__ */ React.createElement(
@@ -3831,7 +3857,7 @@ var _excluded = ["attr", "size", "title"];
 function _objectWithoutProperties(source, excluded) {
   if (source == null)
     return {};
-  var target = _objectWithoutPropertiesLoose$1(source, excluded);
+  var target = _objectWithoutPropertiesLoose(source, excluded);
   var key, i;
   if (Object.getOwnPropertySymbols) {
     var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
@@ -3846,7 +3872,7 @@ function _objectWithoutProperties(source, excluded) {
   }
   return target;
 }
-function _objectWithoutPropertiesLoose$1(source, excluded) {
+function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null)
     return {};
   var target = {};
@@ -4936,7 +4962,28 @@ const NumberInput = ({
   onChange,
   value,
   step
-}) => /* @__PURE__ */ React.createElement(Input, { type: "number", step, value, onChange });
+}) => /* @__PURE__ */ React.createElement(
+  Input,
+  {
+    type: "number",
+    step,
+    value,
+    onChange: (event) => {
+      const inputValue = event.target.value;
+      const newValue = inputValue === "" ? void 0 : inputValue;
+      if (onChange) {
+        const syntheticEvent = {
+          ...event,
+          target: {
+            ...event.target,
+            value: newValue
+          }
+        };
+        onChange(syntheticEvent);
+      }
+    }
+  }
+);
 function useCMS() {
   return useCMS$1();
 }
@@ -5177,7 +5224,7 @@ const PopoverContent = React.forwardRef(({ className, align = "center", sideOffs
     side: "bottom",
     className: cn(
       "rounded-md border bg-white p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      "max-h-[30vh] max-w-[30vh] overflow-y-auto",
+      "max-h-[30vh] max-w-[30vw] overflow-y-auto",
       className
     ),
     ...props
@@ -5269,11 +5316,7 @@ const getFilename = (optionSets, value) => {
   const node = nodes.find((node2) => node2.id === value);
   return node ? node._internalSys.filename : null;
 };
-const ComboboxDemo = ({
-  cms,
-  input,
-  field
-}) => {
+const Combobox = ({ cms, input, field }) => {
   const [open2, setOpen] = React.useState(false);
   const [value, setValue] = React.useState(input.value);
   const [displayText, setDisplayText] = React.useState(null);
@@ -5297,17 +5340,17 @@ const ComboboxDemo = ({
   if (loading === true) {
     return /* @__PURE__ */ React.createElement(LoadingDots, { color: "var(--tina-color-primary)" });
   }
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Popover, { open: open2, onOpenChange: setOpen }, /* @__PURE__ */ React.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(Popover, { open: open2, onOpenChange: setOpen }, /* @__PURE__ */ React.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React.createElement(
     Button,
     {
       variant: "outline",
       role: "combobox",
       "aria-expanded": open2,
-      className: "w-52 justify-between"
+      className: "w-full justify-between"
     },
     /* @__PURE__ */ React.createElement("p", { className: "truncate" }, displayText ?? "Choose an option..."),
     open2 ? /* @__PURE__ */ React.createElement(IoMdArrowDropup, { size: 20 }) : /* @__PURE__ */ React.createElement(IoMdArrowDropdown, { size: 20 })
-  )), /* @__PURE__ */ React.createElement(PopoverContent, { className: "p-0 relative" }, /* @__PURE__ */ React.createElement(
+  )), /* @__PURE__ */ React.createElement(PopoverContent, { className: "p-0 relative min-w-[var(--radix-popover-trigger-width)]" }, /* @__PURE__ */ React.createElement(
     Command,
     {
       shouldFilter: !field.experimental___filter,
@@ -5331,32 +5374,25 @@ const ComboboxDemo = ({
       }
     ),
     /* @__PURE__ */ React.createElement(CommandEmpty, null, "No reference found"),
-    /* @__PURE__ */ React.createElement(CommandList, null, filteredOptionsList.length > 0 && (filteredOptionsList == null ? void 0 : filteredOptionsList.map(({ collection, edges }) => /* @__PURE__ */ React.createElement(
-      CommandGroup,
-      {
-        key: `${collection}-group`,
-        heading: collection
-      },
-      /* @__PURE__ */ React.createElement(CommandList, null, edges == null ? void 0 : edges.map(({ node }) => {
-        const { id, _values } = node;
-        return /* @__PURE__ */ React.createElement(
-          OptionComponent,
-          {
-            id,
-            key: id,
-            value,
-            field,
-            _values,
-            node,
-            onSelect: (currentValue) => {
-              setValue(currentValue);
-              setOpen(false);
-            }
+    /* @__PURE__ */ React.createElement(CommandList, null, filteredOptionsList.length > 0 && (filteredOptionsList == null ? void 0 : filteredOptionsList.map(({ collection, edges }) => /* @__PURE__ */ React.createElement(CommandGroup, { key: `${collection}-group`, heading: collection }, /* @__PURE__ */ React.createElement(CommandList, null, edges == null ? void 0 : edges.map(({ node }) => {
+      const { id, _values } = node;
+      return /* @__PURE__ */ React.createElement(
+        OptionComponent,
+        {
+          id,
+          key: id,
+          value,
+          field,
+          _values,
+          node,
+          onSelect: (currentValue) => {
+            setValue(currentValue);
+            setOpen(false);
           }
-        );
-      }))
-    ))))
-  ))));
+        }
+      );
+    }))))))
+  )));
 };
 const useGetNode = (cms, id) => {
   const [document2, setDocument] = React.useState(
@@ -5429,7 +5465,7 @@ const ReferenceLink = ({ cms, input }) => {
 };
 const Reference = ({ input, field }) => {
   const cms = useCMS();
-  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "relative group" }, /* @__PURE__ */ React.createElement(ComboboxDemo, { cms, input, field })), /* @__PURE__ */ React.createElement(ReferenceLink, { cms, input }));
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: "relative group" }, /* @__PURE__ */ React.createElement(Combobox, { cms, input, field })), /* @__PURE__ */ React.createElement(ReferenceLink, { cms, input }));
 };
 const ButtonToggle = ({
   input,
@@ -5737,10 +5773,11 @@ const ItemDeleteButton = ({ onClick, disabled = false }) => {
   return /* @__PURE__ */ React__default.createElement(
     "button",
     {
-      className: `w-8 px-1 py-2.5 flex items-center justify-center hover:bg-gray-50 text-gray-200 hover:text-red-500 ${disabled && "pointer-events-none opacity-30 cursor-not-allowed"}`,
+      type: "button",
+      className: `w-8 px-1 py-2.5 flex items-center justify-center text-gray-200 hover:opacity-100 opacity-30 hover:bg-gray-50 ${disabled && "pointer-events-none opacity-30 cursor-not-allowed"}`,
       onClick
     },
-    /* @__PURE__ */ React__default.createElement(TrashIcon, { className: "fill-current transition-colors ease-out duration-100" })
+    /* @__PURE__ */ React__default.createElement(TrashIcon, { className: "h-5 w-auto fill-current text-red-500 transition-colors duration-150 ease-out" })
   );
 };
 const DragHandle = ({ isDragging }) => {
@@ -5818,27 +5855,35 @@ const BlockSelector = ({
     ))))
   ))));
 };
-const Group = wrapFieldWithError(({ tinaForm, field }) => {
-  const cms = useCMS$1();
-  React.useState(false);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    Header,
-    {
-      onClick: () => {
-        const state = tinaForm.finalForm.getState();
-        if (state.invalid === true) {
-          cms.alerts.error("Cannot navigate away from an invalid form.");
-          return;
+const Group = wrapFieldWithNoHeader(
+  ({ tinaForm, field }) => {
+    const cms = useCMS$1();
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+      Header,
+      {
+        onClick: () => {
+          const state = tinaForm.finalForm.getState();
+          if (state.invalid === true) {
+            cms.alerts.error("Cannot navigate away from an invalid form.");
+            return;
+          }
+          cms.dispatch({
+            type: "forms:set-active-field-name",
+            value: { formId: tinaForm.id, fieldName: field.name }
+          });
         }
-        cms.dispatch({
-          type: "forms:set-active-field-name",
-          value: { formId: tinaForm.id, fieldName: field.name }
-        });
-      }
-    },
-    field.label || field.name
-  ));
-});
+      },
+      field.label || field.name,
+      field.description && /* @__PURE__ */ React.createElement(
+        "span",
+        {
+          className: `block font-sans text-xs italic font-light text-gray-400 pt-0.5 whitespace-normal m-0`,
+          dangerouslySetInnerHTML: { __html: field.description }
+        }
+      )
+    ));
+  }
+);
 const Header = ({ onClick, children }) => {
   return /* @__PURE__ */ React.createElement("div", { className: "pt-1 mb-5" }, /* @__PURE__ */ React.createElement(
     "button",
@@ -7180,244 +7225,65 @@ function pad(type, value) {
     str = "0" + str;
   return str;
 }
-function _inheritsLoose(subClass, superClass) {
-  subClass.prototype = Object.create(superClass.prototype);
-  subClass.prototype.constructor = subClass;
-  _setPrototypeOf(subClass, superClass);
-}
-function _setPrototypeOf(o, p) {
-  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf2(o2, p2) {
-    o2.__proto__ = p2;
-    return o2;
-  };
-  return _setPrototypeOf(o, p);
-}
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null)
-    return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0)
-      continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-function _assertThisInitialized(self) {
-  if (self === void 0) {
-    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-  }
-  return self;
-}
-function isNodeFound(current, componentNode, ignoreClass) {
-  if (current === componentNode) {
-    return true;
-  }
-  if (current.correspondingElement) {
-    return current.correspondingElement.classList.contains(ignoreClass);
-  }
-  return current.classList.contains(ignoreClass);
-}
-function findHighest(current, componentNode, ignoreClass) {
-  if (current === componentNode) {
-    return true;
+var useClickAway$1 = {};
+var util = {};
+Object.defineProperty(util, "__esModule", { value: true });
+util.isNavigator = util.isBrowser = util.off = util.on = util.noop = void 0;
+var noop = function() {
+};
+util.noop = noop;
+function on(obj) {
+  var args = [];
+  for (var _i = 1; _i < arguments.length; _i++) {
+    args[_i - 1] = arguments[_i];
   }
-  while (current.parentNode || current.host) {
-    if (current.parentNode && isNodeFound(current, componentNode, ignoreClass)) {
-      return true;
-    }
-    current = current.parentNode || current.host;
+  if (obj && obj.addEventListener) {
+    obj.addEventListener.apply(obj, args);
   }
-  return current;
 }
-function clickedScrollbar(evt) {
-  return document.documentElement.clientWidth <= evt.clientX || document.documentElement.clientHeight <= evt.clientY;
-}
-var testPassiveEventSupport = function testPassiveEventSupport2() {
-  if (typeof window === "undefined" || typeof window.addEventListener !== "function") {
-    return;
+util.on = on;
+function off(obj) {
+  var args = [];
+  for (var _i = 1; _i < arguments.length; _i++) {
+    args[_i - 1] = arguments[_i];
   }
-  var passive = false;
-  var options = Object.defineProperty({}, "passive", {
-    get: function get2() {
-      passive = true;
-    }
-  });
-  var noop = function noop2() {
-  };
-  window.addEventListener("testPassiveEventSupport", noop, options);
-  window.removeEventListener("testPassiveEventSupport", noop, options);
-  return passive;
-};
-function autoInc(seed) {
-  if (seed === void 0) {
-    seed = 0;
+  if (obj && obj.removeEventListener) {
+    obj.removeEventListener.apply(obj, args);
   }
-  return function() {
-    return ++seed;
-  };
 }
-var uid = autoInc();
-var passiveEventSupport;
-var handlersMap = {};
-var enabledInstances = {};
-var touchEvents = ["touchstart", "touchmove"];
-var IGNORE_CLASS_NAME = "ignore-react-onclickoutside";
-function getEventHandlerOptions(instance, eventName) {
-  var handlerOptions = {};
-  var isTouchEvent = touchEvents.indexOf(eventName) !== -1;
-  if (isTouchEvent && passiveEventSupport) {
-    handlerOptions.passive = !instance.props.preventDefault;
-  }
-  return handlerOptions;
-}
-function onClickOutsideHOC(WrappedComponent, config) {
-  var _class, _temp;
-  var componentName = WrappedComponent.displayName || WrappedComponent.name || "Component";
-  return _temp = _class = /* @__PURE__ */ function(_Component) {
-    _inheritsLoose(onClickOutside, _Component);
-    function onClickOutside(props) {
-      var _this;
-      _this = _Component.call(this, props) || this;
-      _this.__outsideClickHandler = function(event) {
-        if (typeof _this.__clickOutsideHandlerProp === "function") {
-          _this.__clickOutsideHandlerProp(event);
-          return;
-        }
-        var instance = _this.getInstance();
-        if (typeof instance.props.handleClickOutside === "function") {
-          instance.props.handleClickOutside(event);
-          return;
-        }
-        if (typeof instance.handleClickOutside === "function") {
-          instance.handleClickOutside(event);
-          return;
-        }
-        throw new Error("WrappedComponent: " + componentName + " lacks a handleClickOutside(event) function for processing outside click events.");
-      };
-      _this.__getComponentNode = function() {
-        var instance = _this.getInstance();
-        if (config && typeof config.setClickOutsideRef === "function") {
-          return config.setClickOutsideRef()(instance);
-        }
-        if (typeof instance.setClickOutsideRef === "function") {
-          return instance.setClickOutsideRef();
-        }
-        return findDOMNode(instance);
-      };
-      _this.enableOnClickOutside = function() {
-        if (typeof document === "undefined" || enabledInstances[_this._uid]) {
-          return;
-        }
-        if (typeof passiveEventSupport === "undefined") {
-          passiveEventSupport = testPassiveEventSupport();
-        }
-        enabledInstances[_this._uid] = true;
-        var events = _this.props.eventTypes;
-        if (!events.forEach) {
-          events = [events];
-        }
-        handlersMap[_this._uid] = function(event) {
-          if (_this.componentNode === null)
-            return;
-          if (_this.initTimeStamp > event.timeStamp)
-            return;
-          if (_this.props.preventDefault) {
-            event.preventDefault();
-          }
-          if (_this.props.stopPropagation) {
-            event.stopPropagation();
-          }
-          if (_this.props.excludeScrollbar && clickedScrollbar(event))
-            return;
-          var current = event.composed && event.composedPath && event.composedPath().shift() || event.target;
-          if (findHighest(current, _this.componentNode, _this.props.outsideClickIgnoreClass) !== document) {
-            return;
-          }
-          _this.__outsideClickHandler(event);
-        };
-        events.forEach(function(eventName) {
-          document.addEventListener(eventName, handlersMap[_this._uid], getEventHandlerOptions(_assertThisInitialized(_this), eventName));
-        });
-      };
-      _this.disableOnClickOutside = function() {
-        delete enabledInstances[_this._uid];
-        var fn = handlersMap[_this._uid];
-        if (fn && typeof document !== "undefined") {
-          var events = _this.props.eventTypes;
-          if (!events.forEach) {
-            events = [events];
-          }
-          events.forEach(function(eventName) {
-            return document.removeEventListener(eventName, fn, getEventHandlerOptions(_assertThisInitialized(_this), eventName));
-          });
-          delete handlersMap[_this._uid];
-        }
-      };
-      _this.getRef = function(ref) {
-        return _this.instanceRef = ref;
-      };
-      _this._uid = uid();
-      _this.initTimeStamp = performance.now();
-      return _this;
-    }
-    var _proto = onClickOutside.prototype;
-    _proto.getInstance = function getInstance() {
-      if (WrappedComponent.prototype && !WrappedComponent.prototype.isReactComponent) {
-        return this;
-      }
-      var ref = this.instanceRef;
-      return ref.getInstance ? ref.getInstance() : ref;
+util.off = off;
+util.isBrowser = typeof window !== "undefined";
+util.isNavigator = typeof navigator !== "undefined";
+Object.defineProperty(useClickAway$1, "__esModule", { value: true });
+var react_1 = React__default;
+var util_1 = util;
+var defaultEvents = ["mousedown", "touchstart"];
+var useClickAway = function(ref, onClickAway, events) {
+  if (events === void 0) {
+    events = defaultEvents;
+  }
+  var savedCallback = react_1.useRef(onClickAway);
+  react_1.useEffect(function() {
+    savedCallback.current = onClickAway;
+  }, [onClickAway]);
+  react_1.useEffect(function() {
+    var handler = function(event) {
+      var el = ref.current;
+      el && !el.contains(event.target) && savedCallback.current(event);
     };
-    _proto.componentDidMount = function componentDidMount() {
-      if (typeof document === "undefined" || !document.createElement) {
-        return;
-      }
-      var instance = this.getInstance();
-      if (config && typeof config.handleClickOutside === "function") {
-        this.__clickOutsideHandlerProp = config.handleClickOutside(instance);
-        if (typeof this.__clickOutsideHandlerProp !== "function") {
-          throw new Error("WrappedComponent: " + componentName + " lacks a function for processing outside click events specified by the handleClickOutside config option.");
-        }
-      }
-      this.componentNode = this.__getComponentNode();
-      if (this.props.disableOnClickOutside)
-        return;
-      this.enableOnClickOutside();
-    };
-    _proto.componentDidUpdate = function componentDidUpdate() {
-      this.componentNode = this.__getComponentNode();
-    };
-    _proto.componentWillUnmount = function componentWillUnmount() {
-      this.disableOnClickOutside();
-    };
-    _proto.render = function render() {
-      var _this$props = this.props;
-      _this$props.excludeScrollbar;
-      var props = _objectWithoutPropertiesLoose(_this$props, ["excludeScrollbar"]);
-      if (WrappedComponent.prototype && WrappedComponent.prototype.isReactComponent) {
-        props.ref = this.getRef;
-      } else {
-        props.wrappedRef = this.getRef;
+    for (var _i = 0, events_1 = events; _i < events_1.length; _i++) {
+      var eventName = events_1[_i];
+      util_1.on(document, eventName, handler);
+    }
+    return function() {
+      for (var _i2 = 0, events_2 = events; _i2 < events_2.length; _i2++) {
+        var eventName2 = events_2[_i2];
+        util_1.off(document, eventName2, handler);
       }
-      props.disableOnClickOutside = this.disableOnClickOutside;
-      props.enableOnClickOutside = this.enableOnClickOutside;
-      return createElement(WrappedComponent, props);
     };
-    return onClickOutside;
-  }(Component), _class.displayName = "OnClickOutside(" + componentName + ")", _class.defaultProps = {
-    eventTypes: ["mousedown", "touchstart"],
-    excludeScrollbar: config && config.excludeScrollbar || false,
-    outsideClickIgnoreClass: IGNORE_CLASS_NAME,
-    preventDefault: false,
-    stopPropagation: false
-  }, _class.getClass = function() {
-    return WrappedComponent.getClass ? WrappedComponent.getClass() : WrappedComponent;
-  }, _temp;
-}
+  }, [events, ref]);
+};
+var _default = useClickAway$1.default = useClickAway;
 const viewModes = {
   YEARS: "years",
   MONTHS: "months",
@@ -7946,22 +7812,13 @@ function log(message, method) {
   }
   con[method]("***react-datetime:" + message);
 }
-class ClickOutBase extends React__default.Component {
-  constructor() {
-    super(...arguments);
-    __publicField(this, "container", React__default.createRef());
-  }
-  render() {
-    return /* @__PURE__ */ React__default.createElement("div", { className: this.props.className, ref: this.container }, this.props.children);
-  }
-  handleClickOutside(e) {
-    this.props.onClickOut(e);
-  }
-  setClickOutsideRef() {
-    return this.container.current;
-  }
+function ClickableWrapper({ className, onClickOut, children }) {
+  const containerRef = useRef(null);
+  _default(containerRef, (event) => {
+    onClickOut(event);
+  });
+  return /* @__PURE__ */ React__default.createElement("div", { className, ref: containerRef }, children);
 }
-const ClickableWrapper = onClickOutsideHOC(ClickOutBase);
 const DEFAULT_DATE_DISPLAY_FORMAT = "MMM DD, YYYY";
 const DEFAULT_TIME_DISPLAY_FORMAT = "h:mm A";
 const format$1 = (val, _name, field) => {
@@ -8004,7 +7861,10 @@ const DateField = wrapFieldsWithMeta(
       ReactDateTimeWithStyles,
       {
         value: input.value,
-        onChange: input.onChange,
+        onChange: (value) => {
+          const newValue = value === "" ? void 0 : value;
+          input.onChange(newValue);
+        },
         dateFormat: dateFormat || DEFAULT_DATE_DISPLAY_FORMAT,
         timeFormat: timeFormat || false,
         inputProps: { className: textFieldClasses },
@@ -9456,6 +9316,19 @@ class TinaMediaStore {
     }
   }
 }
+const encodeUrlIfNeeded = (url) => {
+  if (url) {
+    try {
+      const parsed = new URL(url);
+      parsed.pathname = parsed.pathname.split("/").filter((part) => part !== "").map(encodeURIComponent).join("/");
+      return parsed.toString();
+    } catch (e) {
+      return url;
+    }
+  } else {
+    return url;
+  }
+};
 let MediaManager$1 = class MediaManager {
   constructor(store, events) {
     this.store = store;
@@ -9528,6 +9401,20 @@ let MediaManager$1 = class MediaManager {
     try {
       this.events.dispatch({ type: "media:list:start", ...options });
       const media = await this.store.list(options);
+      media.items = media.items.map((item) => {
+        if (item.type === "dir") {
+          return item;
+        }
+        if (item.thumbnails) {
+          for (const [size, src] of Object.entries(item.thumbnails)) {
+            item.thumbnails[size] = encodeUrlIfNeeded(src);
+          }
+        }
+        return {
+          ...item,
+          src: encodeUrlIfNeeded(item.src)
+        };
+      });
       this.events.dispatch({ type: "media:list:success", ...options, media });
       return media;
     } catch (error) {
@@ -9815,7 +9702,7 @@ class SidebarState {
   }
 }
 function createScreen({
-  Component: Component2,
+  Component,
   props,
   ...options
 }) {
@@ -9824,7 +9711,7 @@ function createScreen({
     layout: "popup",
     ...options,
     Component(screenProps) {
-      return /* @__PURE__ */ React__default.createElement(Component2, { ...screenProps, ...props });
+      return /* @__PURE__ */ React__default.createElement(Component, { ...screenProps, ...props });
     }
   };
 }
@@ -10335,7 +10222,7 @@ const SyncStatus = ({ cms, setEventsOpen }) => {
     "Event Log"
   ));
 };
-const version = "2.2.9";
+const version = "2.6.3";
 const Nav = ({
   isLocalMode,
   className = "",
@@ -12866,15 +12753,14 @@ const FormBuilder = ({
             fields: fieldGroup.fields
           }
         ) : /* @__PURE__ */ React.createElement(NoFieldsPlaceholder, null)
-      )), !hideFooter && /* @__PURE__ */ React.createElement("div", { className: "relative flex-none w-full h-16 px-6 bg-white border-t border-gray-100	flex items-center justify-center" }, /* @__PURE__ */ React.createElement("div", { className: "flex-1 w-full flex justify-between gap-4 items-center max-w-form" }, tinaForm.reset && /* @__PURE__ */ React.createElement(
+      )), !hideFooter && /* @__PURE__ */ React.createElement("div", { className: "relative flex-none w-full h-16 px-12 bg-white border-t border-gray-100 flex items-center justify-end" }, /* @__PURE__ */ React.createElement("div", { className: "flex-1 w-full justify-end gap-2	flex items-center max-w-form" }, tinaForm.reset && /* @__PURE__ */ React.createElement(
         ResetForm,
         {
           pristine,
           reset: async () => {
             finalForm.reset();
             await tinaForm.reset();
-          },
-          style: { flexGrow: 1 }
+          }
         },
         tinaForm.buttons.reset
       ), /* @__PURE__ */ React.createElement(
@@ -12883,8 +12769,7 @@ const FormBuilder = ({
           onClick: safeHandleSubmit,
           disabled: !canSubmit,
           busy: submitting,
-          variant: "primary",
-          style: { flexGrow: 3 }
+          variant: "primary"
         },
         submitting && /* @__PURE__ */ React.createElement(LoadingDots, null),
         !submitting && tinaForm.buttons.save
@@ -13266,9 +13151,9 @@ const EllipsisIcon = ({ title }) => {
   ));
 };
 const Wrapper$1 = ({ inline, children }) => {
-  const Component2 = inline ? "span" : "div";
+  const Component = inline ? "span" : "div";
   return /* @__PURE__ */ React__default.createElement(
-    Component2,
+    Component,
     {
       contentEditable: false,
       style: { userSelect: "none" },
@@ -14056,13 +13941,13 @@ const TooltipContent = withCn(
   }),
   "z-[9999] overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md"
 );
-function withTooltip(Component2) {
+function withTooltip(Component) {
   return React__default.forwardRef(function ExtendComponent({ tooltip, tooltipContentProps, tooltipProps, ...props }, ref) {
     const [mounted, setMounted] = React__default.useState(false);
     React__default.useEffect(() => {
       setMounted(true);
     }, []);
-    const component = /* @__PURE__ */ React__default.createElement(Component2, { ref, ...props });
+    const component = /* @__PURE__ */ React__default.createElement(Component, { ref, ...props });
     if (tooltip && mounted) {
       return /* @__PURE__ */ React__default.createElement(Tooltip, { ...tooltipProps }, /* @__PURE__ */ React__default.createElement(TooltipTrigger, { asChild: true }, component), /* @__PURE__ */ React__default.createElement(TooltipPortal, null, /* @__PURE__ */ React__default.createElement(TooltipContent, { ...tooltipContentProps }, tooltip)));
     }
@@ -14454,6 +14339,7 @@ function OverflowMenu({
     ToolbarButton,
     {
       showArrow: false,
+      "data-testid": "rich-text-editor-overflow-menu-button",
       className: "lg:min-w-[130px]",
       isDropdown: true,
       pressed: openState.open,
@@ -14507,7 +14393,17 @@ const useRawMarkdownToolbarButton = () => {
 };
 const RawMarkdownToolbarButton = withRef(({ clear, ...rest }, ref) => {
   const { props } = useRawMarkdownToolbarButton();
-  return /* @__PURE__ */ React__default.createElement(ToolbarButton, { ref, tooltip: "Link", ...rest, ...props }, /* @__PURE__ */ React__default.createElement(Icons.raw, null));
+  return /* @__PURE__ */ React__default.createElement(
+    ToolbarButton,
+    {
+      ref,
+      tooltip: "Link",
+      ...rest,
+      ...props,
+      "data-testid": "markdown-button"
+    },
+    /* @__PURE__ */ React__default.createElement(Icons.raw, null)
+  );
 });
 function TableDropdownMenu(props) {
   const tableSelected = useEditorSelector(
@@ -14646,7 +14542,7 @@ const EmbedButton = ({ editor, templates }) => {
       key: template.name,
       onMouseDown: (e) => {
         e.preventDefault();
-        close();
+        setOpen(false);
         insertMDX(editor, template);
       },
       className: ""
@@ -14732,7 +14628,12 @@ function FixedToolbarButtons() {
   const [itemsShown, setItemsShown] = React__default.useState(11);
   const { overrides, templates } = useToolbarContext();
   const showEmbedButton = templates.length > 0;
-  let items2 = overrides === void 0 ? Object.values(toolbarItems) : overrides.map((item) => toolbarItems[item]).filter((item) => item !== void 0);
+  let items2 = [];
+  if (Array.isArray(overrides)) {
+    items2 = overrides === void 0 ? Object.values(toolbarItems) : overrides.map((item) => toolbarItems[item]).filter((item) => item !== void 0);
+  } else {
+    items2 = (overrides == null ? void 0 : overrides.toolbar) === void 0 ? Object.values(toolbarItems) : overrides.toolbar.map((item) => toolbarItems[item]).filter((item) => item !== void 0);
+  }
   if (!showEmbedButton) {
     items2 = items2.filter((item) => item.label !== toolbarItems.embed.label);
   }
@@ -15060,6 +14961,9 @@ const isUrl = (string) => {
   if (typeof string !== "string") {
     return false;
   }
+  if (string.startsWith("#")) {
+    return true;
+  }
   const generalMatch = string.match(protocolAndDomainRE);
   const emailLinkMatch = string.match(emailLintRE);
   const localUrlMatch = string.match(localUrlRE);
@@ -15081,12 +14985,12 @@ const isUrl = (string) => {
   }
   return localhostDomainRE.test(everythingAfterProtocol) || nonLocalhostDomainRE.test(everythingAfterProtocol);
 };
-const RichEditor = (props) => {
+const RichEditor = ({ input, tinaForm, field }) => {
   var _a;
   const initialValue = React__default.useMemo(
     () => {
       var _a2, _b;
-      return ((_b = (_a2 = props.input.value) == null ? void 0 : _a2.children) == null ? void 0 : _b.length) ? props.input.value.children.map(helpers.normalize) : [{ type: "p", children: [{ type: "text", text: "" }] }];
+      return ((_b = (_a2 = input.value) == null ? void 0 : _a2.children) == null ? void 0 : _b.length) ? input.value.children.map(helpers.normalize) : [{ type: "p", children: [{ type: "text", text: "" }] }];
     },
     []
   );
@@ -15114,7 +15018,7 @@ const RichEditor = (props) => {
     ),
     []
   );
-  const tempId = [props.tinaForm.id, props.input.name].join(".");
+  const tempId = [tinaForm.id, input.name].join(".");
   const id = React__default.useMemo(() => uuid() + tempId, [tempId]);
   const ref = React__default.useRef(null);
   React__default.useEffect(() => {
@@ -15124,13 +15028,13 @@ const RichEditor = (props) => {
         const plateElement = (_a2 = ref.current) == null ? void 0 : _a2.querySelector(
           '[role="textbox"]'
         );
-        if (props.field.experimental_focusIntent && plateElement) {
+        if (field.experimental_focusIntent && plateElement) {
           if (plateElement)
             plateElement.focus();
         }
       }, 100);
     }
-  }, [props.field.experimental_focusIntent, ref]);
+  }, [field.experimental_focusIntent, ref]);
   return /* @__PURE__ */ React__default.createElement("div", { ref }, /* @__PURE__ */ React__default.createElement(
     Plate,
     {
@@ -15138,7 +15042,7 @@ const RichEditor = (props) => {
       initialValue,
       plugins: plugins$2,
       onChange: (value) => {
-        props.input.onChange({
+        input.onChange({
           type: "root",
           children: value
         });
@@ -15147,12 +15051,12 @@ const RichEditor = (props) => {
     /* @__PURE__ */ React__default.createElement(TooltipProvider, null, /* @__PURE__ */ React__default.createElement(
       ToolbarProvider,
       {
-        tinaForm: props.tinaForm,
-        templates: props.field.templates,
-        overrides: (_a = props.field) == null ? void 0 : _a.toolbarOverride
+        tinaForm,
+        templates: field.templates,
+        overrides: (field == null ? void 0 : field.toolbarOverride) ? field.toolbarOverride : field.overrides
       },
       /* @__PURE__ */ React__default.createElement(FixedToolbar, null, /* @__PURE__ */ React__default.createElement(FixedToolbarButtons, null)),
-      /* @__PURE__ */ React__default.createElement(FloatingToolbar, null, /* @__PURE__ */ React__default.createElement(FloatingToolbarButtons, null))
+      ((_a = field == null ? void 0 : field.overrides) == null ? void 0 : _a.showFloatingToolbar) !== false ? /* @__PURE__ */ React__default.createElement(FloatingToolbar, null, /* @__PURE__ */ React__default.createElement(FloatingToolbarButtons, null)) : null
     ), /* @__PURE__ */ React__default.createElement(Editor, null))
   ));
 };
@@ -30106,6 +30010,7 @@ class TinaAdminApi {
                     relativePath
                     filename
                     extension
+                    hasReferences
                   }
                 }
               }
@@ -30197,6 +30102,9 @@ class TinaAdminApi {
           document(collection:$collection, relativePath:$relativePath) {
             ... on Document {
               _values
+              _sys {
+                hasReferences
+              }
             }
           }
         }`;
@@ -31923,6 +31831,23 @@ const CollectionListPage = () => {
           DeleteModal,
           {
             filename: vars.relativePath,
+            checkRefsFunc: async () => {
+              var _a2, _b2;
+              try {
+                const doc = await admin.fetchDocument(
+                  collection.name,
+                  vars.relativePath,
+                  true
+                );
+                return (_b2 = (_a2 = doc == null ? void 0 : doc.document) == null ? void 0 : _a2._sys) == null ? void 0 : _b2.hasReferences;
+              } catch (error) {
+                cms.alerts.error(
+                  "Document was not found, ask a developer for help or check the console for an error message"
+                );
+                console.error(error);
+                throw error;
+              }
+            },
             deleteFunc: async () => {
               try {
                 await admin.deleteDocument(vars);
@@ -31931,6 +31856,12 @@ const CollectionListPage = () => {
                 );
                 reFetchCollection();
               } catch (error) {
+                if (error.message.indexOf("has references")) {
+                  cms.alerts.error(
+                    error.message.split("\n	").filter(Boolean)[1]
+                  );
+                  return;
+                }
                 cms.alerts.warn(
                   "Document was not deleted, ask a developer for help or check the console for an error message"
                 );
@@ -31982,6 +31913,12 @@ const CollectionListPage = () => {
                 cms.alerts.info("Document was successfully renamed");
                 reFetchCollection();
               } catch (error) {
+                if (error.message.indexOf("has references")) {
+                  cms.alerts.error(
+                    error.message.split("\n	").filter(Boolean)[1]
+                  );
+                  return;
+                }
                 cms.alerts.warn(
                   "Document was not renamed, ask a developer for help or check the console for an error message"
                 );
@@ -32455,8 +32392,19 @@ const Breadcrumb = ({ folder, navigate, collectionName }) => {
 const NoDocumentsPlaceholder = () => {
   return /* @__PURE__ */ React__default.createElement("div", { className: "text-center px-5 py-3 flex flex-col items-center justify-center shadow border border-gray-100 bg-gray-50 border-b border-gray-200 w-full max-w-full rounded-lg" }, /* @__PURE__ */ React__default.createElement("p", { className: "text-base italic font-medium text-gray-300" }, "No documents found."));
 };
-const DeleteModal = ({ close: close2, deleteFunc, filename }) => {
-  return /* @__PURE__ */ React__default.createElement(Modal, null, /* @__PURE__ */ React__default.createElement(PopupModal, null, /* @__PURE__ */ React__default.createElement(ModalHeader, { close: close2 }, "Delete ", filename), /* @__PURE__ */ React__default.createElement(ModalBody, { padded: true }, /* @__PURE__ */ React__default.createElement("p", null, `Are you sure you want to delete ${filename}?`)), /* @__PURE__ */ React__default.createElement(ModalActions, null, /* @__PURE__ */ React__default.createElement(Button$1, { style: { flexGrow: 2 }, onClick: close2 }, "Cancel"), /* @__PURE__ */ React__default.createElement(
+const DeleteModal = ({
+  close: close2,
+  deleteFunc,
+  checkRefsFunc,
+  filename
+}) => {
+  const [hasRefs, setHasRefs] = React__default.useState();
+  useEffect(() => {
+    checkRefsFunc().then((result) => {
+      setHasRefs(result);
+    });
+  }, [filename, checkRefsFunc]);
+  return /* @__PURE__ */ React__default.createElement(Modal, null, /* @__PURE__ */ React__default.createElement(PopupModal, null, /* @__PURE__ */ React__default.createElement(ModalHeader, { close: close2 }, "Delete ", filename), /* @__PURE__ */ React__default.createElement(ModalBody, { padded: true }, /* @__PURE__ */ React__default.createElement("p", null, `Are you sure you want to delete ${filename}?${hasRefs ? " References to this document will also be deleted." : ""}`)), /* @__PURE__ */ React__default.createElement(ModalActions, null, /* @__PURE__ */ React__default.createElement(Button$1, { style: { flexGrow: 2 }, onClick: close2 }, "Cancel"), /* @__PURE__ */ React__default.createElement(
     Button$1,
     {
       style: { flexGrow: 3 },
@@ -33188,15 +33136,24 @@ const IndexingPage = () => {
         }
       }
       if (state === "creatingPR") {
-        const foo = await tinaApi.createPullRequest({
-          baseBranch,
-          branch,
-          title: `${branch.replace("tina/", "").replace("-", " ")} (PR from TinaCMS)`
-        });
-        console.log("PR created", foo);
-        cms.alerts.success("Pull request created.");
-        localStorage.setItem("tina.createBranchState", "done");
-        setState("done");
+        try {
+          const foo = await tinaApi.createPullRequest({
+            baseBranch,
+            branch,
+            title: `${branch.replace("tina/", "").replace("-", " ")} (PR from TinaCMS)`
+          });
+          console.log("PR created", foo);
+          cms.alerts.success("Pull request created.");
+          localStorage.setItem("tina.createBranchState", "done");
+          setState("done");
+        } catch (e) {
+          console.error(e);
+          cms.alerts.error("Failed to create PR");
+          setErrorMessage(
+            "Failed to create PR, please try again. If the problem persists please contact support."
+          );
+          setState("error");
+        }
       }
       if (state === "done") {
         window.location.href = back;
@@ -33818,5 +33775,6 @@ export {
   useScreenPlugin,
   useTinaAuthRedirect,
   wrapFieldWithError,
+  wrapFieldWithNoHeader,
   wrapFieldsWithMeta
 };