tinacms 0.68.9 → 0.68.12

package/dist/index.es.js

@@ -1,46 +1,14 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-import { useCMS, Form, GlobalFormPlugin, EventBus, Modal, ModalPopup, ModalHeader, ModalBody, ModalActions, Button as Button$1, LoadingDots, useLocalStorage, TinaCMS, BranchSwitcherPlugin, BranchDataProvider, TinaProvider, Nav, LocalWarning, OverflowMenu, FormStatus, FormBuilder } from "@tinacms/toolkit";
+import { useCMS, Form, GlobalFormPlugin, EventBus, Modal, ModalPopup, ModalHeader, ModalBody, ModalActions, Button, LoadingDots, useLocalStorage, TinaCMS, BranchSwitcherPlugin, BranchDataProvider, TinaProvider, TinaMediaStore, DummyMediaStore, Nav, LocalWarning, OverflowMenu, CursorPaginator, PopupModal, FormStatus, FormBuilder } from "@tinacms/toolkit";
 export * from "@tinacms/toolkit";
 import * as G from "graphql";
 import { TypeInfo, visit, visitWithTypeInfo, getNamedType, GraphQLObjectType, isLeafType, GraphQLUnionType, isScalarType as isScalarType$1, getIntrospectionQuery, buildClientSchema, print, parse } from "graphql";
 import set from "lodash.set";
-import * as React from "react";
-import React__default, { useState, useCallback, useEffect, Fragment, useMemo } from "react";
+import React, { useState, useCallback, useEffect, Fragment, useMemo } from "react";
 import { getIn, setIn } from "final-form";
 import { resolveForm, TinaSchema, addNamespaceToSchema, validateSchema } from "@tinacms/schema-tools";
 import gql$1 from "graphql-tag";
 import * as yup from "yup";
-import styled, { css, createGlobalStyle } from "styled-components";
+import styled from "styled-components";
 import { setEditing, TinaDataContext, useEditState } from "@tinacms/sharedctx";
 import UrlPattern from "url-pattern";
 import { NavLink, useNavigate, useParams, useLocation, Link, HashRouter, Routes, Route } from "react-router-dom";
@@ -433,7 +401,7 @@ function useGraphqlForms({
   return [state.data, state.status !== "done"];
 }
 const transformDocumentIntoMutationRequestPayload = (document, instructions) => {
-  const _a = document, { _collection, __typename, _template } = _a, rest = __objRest(_a, ["_collection", "__typename", "_template"]);
+  const { _collection, __typename, _template, ...rest } = document;
   const params = transformParams(rest);
   const paramsWithTemplate = instructions.includeTemplate ? { [_template]: params } : params;
   return instructions.includeCollection ? { [_collection]: paramsWithTemplate } : paramsWithTemplate;
@@ -447,7 +415,7 @@ const transformParams = (data) => {
   }
   try {
     assertShape(data, (yup2) => yup2.object({ _template: yup2.string().required() }));
-    const _a = data, { _template, __typename } = _a, rest = __objRest(_a, ["_template", "__typename"]);
+    const { _template, __typename, ...rest } = data;
     const nested = transformParams(rest);
     return { [_template]: nested };
   } catch (e) {
@@ -626,10 +594,11 @@ const buildForm = (doc, cms, formify2, showInSidebar = false, onSubmit) => {
     schema: enrichedSchema,
     template
   });
-  formConfig = __spreadValues({
+  formConfig = {
     label: formInfo.label,
-    fields: formInfo.fields
-  }, formCommon);
+    fields: formInfo.fields,
+    ...formCommon
+  };
   if (formify2) {
     form = formify2({
       formConfig,
@@ -1064,12 +1033,13 @@ const formify = async ({
   const visitor = {
     OperationDefinition: (node2) => {
       if (!node2.name) {
-        return __spreadProps(__spreadValues({}, node2), {
+        return {
+          ...node2,
           name: {
             kind: "Name",
             value: `QueryOperation`
           }
-        });
+        };
       }
       return node2;
     }
@@ -1082,7 +1052,8 @@ const formify = async ({
     selectionNode,
     path
   }) => {
-    return __spreadProps(__spreadValues({}, selectionNode), {
+    return {
+      ...selectionNode,
       selectionSet: {
         kind: "SelectionSet",
         selections: selectionNode.selectionSet.selections.map((selectionNode2) => {
@@ -1095,7 +1066,8 @@ const formify = async ({
                   type: edgeField.type,
                   path
                 });
-                return __spreadProps(__spreadValues({}, selectionNode2), {
+                return {
+                  ...selectionNode2,
                   selectionSet: {
                     kind: "SelectionSet",
                     selections: selectionNode2.selectionSet.selections.map((subSelectionNode) => {
@@ -1121,7 +1093,7 @@ const formify = async ({
                       }
                     })
                   }
-                });
+                };
               }
               return selectionNode2;
             default:
@@ -1129,7 +1101,7 @@ const formify = async ({
           }
         })
       }
-    });
+    };
   };
   function formifyInlineFragmentDocument({
     inlineFragmentNode,
@@ -1182,7 +1154,8 @@ const formify = async ({
       });
       extraFields = metaFields;
     }
-    return __spreadProps(__spreadValues({}, selection), {
+    return {
+      ...selection,
       selectionSet: {
         kind: "SelectionSet",
         selections: [
@@ -1219,7 +1192,7 @@ const formify = async ({
           ...extraFields
         ]
       }
-    });
+    };
   }
   const formifyFieldNode = ({
     fieldNode,
@@ -1254,7 +1227,8 @@ const formify = async ({
     if (isScalarType(field.type)) {
       return fieldNode;
     }
-    return __spreadProps(__spreadValues({}, fieldNode), {
+    return {
+      ...fieldNode,
       selectionSet: {
         kind: "SelectionSet",
         selections: [
@@ -1280,7 +1254,7 @@ const formify = async ({
           })
         ]
       }
-    });
+    };
   };
   const formifyInlineFragmentNode = ({
     inlineFragmentNode,
@@ -1299,7 +1273,8 @@ const formify = async ({
         showInSidebar: false
       });
     }
-    return __spreadProps(__spreadValues({}, inlineFragmentNode), {
+    return {
+      ...inlineFragmentNode,
       selectionSet: {
         kind: "SelectionSet",
         selections: inlineFragmentNode.selectionSet.selections.map((selectionNode) => {
@@ -1315,7 +1290,7 @@ const formify = async ({
           }
         })
       }
-    });
+    };
   };
   const formifiedQuery = {
     kind: "Document",
@@ -1323,7 +1298,8 @@ const formify = async ({
       typeInfo.enter(definition);
       ensureOperationDefinition(definition);
       const parentType = typeInfo.getType();
-      return __spreadProps(__spreadValues({}, definition), {
+      return {
+        ...definition,
         selectionSet: {
           kind: "SelectionSet",
           selections: definition.selectionSet.selections.map((selectionNode) => {
@@ -1353,7 +1329,8 @@ const formify = async ({
                     fieldNode: selectionNode,
                     type: field.type
                   });
-                  return __spreadProps(__spreadValues({}, selectionNode), {
+                  return {
+                    ...selectionNode,
                     selectionSet: {
                       kind: "SelectionSet",
                       selections: selectionNode.selectionSet.selections.map((subSelectionNode) => {
@@ -1377,7 +1354,7 @@ const formify = async ({
                         }
                       })
                     }
-                  });
+                  };
                 }
                 throw new FormifyError("NOOP");
               default:
@@ -1385,7 +1362,7 @@ const formify = async ({
             }
           })
         }
-      });
+      };
     })
   };
   return { formifiedQuery, blueprints };
@@ -1424,17 +1401,20 @@ function reducer(state, action) {
   var _a, _b, _c, _d;
   switch (action.type) {
     case "start":
-      return __spreadProps(__spreadValues(__spreadValues({}, state), defaultState), {
+      return {
+        ...state,
+        ...defaultState,
         query: action.value.query ? G.parse(action.value.query) : null,
         queryString: action.value.query,
         status: "initialized"
-      });
+      };
     case "addDocumentBlueprints":
-      return __spreadProps(__spreadValues({}, state), {
+      return {
+        ...state,
         status: "formified",
         blueprints: action.value.blueprints,
         query: action.value.formifiedQuery
-      });
+      };
     case "addOrReplaceDocumentFormNode": {
       const existingDocumentForms = state.documentForms.filter((documentForm) => {
         var _a2, _b2;
@@ -1447,10 +1427,11 @@ function reducer(state, action) {
       if ((_a = action.value) == null ? void 0 : _a.documentForm) {
         newDocumentForms.push((_b = action.value) == null ? void 0 : _b.documentForm);
       }
-      return __spreadProps(__spreadValues({}, state), {
+      return {
+        ...state,
         formNodes: [...existingDocumentFormNodes, action.value.formNode],
         documentForms: [...existingDocumentForms, ...newDocumentForms]
-      });
+      };
     }
     case "onFieldChange": {
       const event = action.value.event;
@@ -1462,32 +1443,33 @@ function reducer(state, action) {
       getFormNodesFromEvent(state, event).forEach((formNode) => {
         const blueprint = getFormNodeBlueprint(formNode, state);
         if (blueprint.hasValuesField) {
-          changeSets.push(__spreadProps(__spreadValues({
-            path: [formNodePath(formNode), "values"].join(".")
-          }, buildChangeSet(event, formNode)), {
+          changeSets.push({
+            path: [formNodePath(formNode), "values"].join("."),
+            ...buildChangeSet(event, formNode),
             value: form.values,
             mutationType: {
               type: "global"
             }
-          }));
+          });
         }
         if (blueprint.hasDataJSONField) {
-          changeSets.push(__spreadProps(__spreadValues({
-            path: [formNodePath(formNode), "dataJSON"].join(".")
-          }, buildChangeSet(event, formNode)), {
+          changeSets.push({
+            path: [formNodePath(formNode), "dataJSON"].join("."),
+            ...buildChangeSet(event, formNode),
             value: form.values,
             mutationType: {
               type: "global"
             }
-          }));
+          });
         }
         if (event.mutationType.type === "change") {
           if (!action.value.form) {
             getBlueprintFieldsForEvent(blueprint, event).forEach((fieldBlueprint) => {
               const { pathToChange } = getFormNodesForField(fieldBlueprint, formNode, event, state);
-              changeSets.push(__spreadValues({
-                path: pathToChange
-              }, buildChangeSet(event, formNode)));
+              changeSets.push({
+                path: pathToChange,
+                ...buildChangeSet(event, formNode)
+              });
             });
           }
         } else if (event.mutationType.type === "referenceChange") {
@@ -1504,18 +1486,19 @@ function reducer(state, action) {
                 location: eventLocation
               };
               newFormNodes.push(newFormNode);
-              changeSets.push(__spreadValues({
-                path: pathToChange
-              }, buildChangeSet(event, newFormNode)));
+              changeSets.push({
+                path: pathToChange,
+                ...buildChangeSet(event, newFormNode)
+              });
             }
             subFormNodes.forEach((subFormNode) => {
               if (matchLocation(eventLocation, subFormNode)) {
                 if (!action.value.form) {
-                  changeSets.push(__spreadProps(__spreadValues({
-                    path: pathToChange
-                  }, buildChangeSet(event, subFormNode)), {
+                  changeSets.push({
+                    path: pathToChange,
+                    ...buildChangeSet(event, subFormNode),
                     value: null
-                  }));
+                  });
                 }
                 formNodesToReplace.push(subFormNode);
               }
@@ -1527,15 +1510,17 @@ function reducer(state, action) {
             if (event.mutationType.type === "insert") {
               formNodes.forEach((subFormNode) => {
                 if (matchLocation(eventLocation, subFormNode)) {
-                  newFormNodes.push(__spreadProps(__spreadValues({}, subFormNode), {
+                  newFormNodes.push({
+                    ...subFormNode,
                     location: bumpLocation(subFormNode.location)
-                  }));
+                  });
                   formNodesToReplace.push(subFormNode);
                 }
               });
-              changeSets.push(__spreadValues({
-                path: pathToChange
-              }, buildChangeSet(event, formNode)));
+              changeSets.push({
+                path: pathToChange,
+                ...buildChangeSet(event, formNode)
+              });
             }
             if (event.mutationType.type === "remove") {
               const { at } = event.mutationType;
@@ -1544,19 +1529,20 @@ function reducer(state, action) {
                   if (matchesAt(subFormNode.location, at)) {
                     formNodesToRemove.push(subFormNode);
                   } else {
-                    newFormNodes.push(__spreadProps(__spreadValues({}, subFormNode), {
+                    newFormNodes.push({
+                      ...subFormNode,
                       location: maybeLowerLocation(subFormNode.location, at)
-                    }));
+                    });
                     formNodesToReplace.push(subFormNode);
                   }
                 }
               });
               const next = existing.filter((_, index) => index !== at);
-              changeSets.push(__spreadProps(__spreadValues({
-                path: pathToChange
-              }, buildChangeSet(event, formNode)), {
+              changeSets.push({
+                path: pathToChange,
+                ...buildChangeSet(event, formNode),
                 value: next
-              }));
+              });
             }
             if (event.mutationType.type === "move") {
               const next = [];
@@ -1564,20 +1550,21 @@ function reducer(state, action) {
               const newOrderObject = getMoveMapping(existing, from, to);
               formNodes.forEach((subFormNode) => {
                 if (matchLocation(eventLocation, subFormNode)) {
-                  newFormNodes.push(__spreadProps(__spreadValues({}, subFormNode), {
+                  newFormNodes.push({
+                    ...subFormNode,
                     location: swapLocation(subFormNode.location, newOrderObject)
-                  }));
+                  });
                   formNodesToReplace.push(subFormNode);
                 }
               });
               Object.values(newOrderObject).forEach((orderIndex, index) => {
                 next[orderIndex] = existing[index];
               });
-              changeSets.push(__spreadProps(__spreadValues({
-                path: pathToChange
-              }, buildChangeSet(event, formNode)), {
+              changeSets.push({
+                path: pathToChange,
+                ...buildChangeSet(event, formNode),
                 value: next
-              }));
+              });
             }
           });
         }
@@ -1590,14 +1577,15 @@ function reducer(state, action) {
       if ((_c = action.value) == null ? void 0 : _c.form) {
         newDocumentForms.push((_d = action.value) == null ? void 0 : _d.form);
       }
-      return __spreadProps(__spreadValues({}, state), {
+      return {
+        ...state,
         changeSets,
         formNodes: [
           ...state.formNodes.filter((formNode) => formNodeNotIn(formNode, formNodesToReplace)).filter((formNode) => formNodeNotIn(formNode, formNodesToRemove)),
           ...newFormNodes
         ],
         documentForms: [...existingDocumentForms, ...newDocumentForms]
-      });
+      };
     }
     case "formOnReset": {
       const { event } = action.value;
@@ -1606,22 +1594,24 @@ function reducer(state, action) {
       state.formNodes.filter((fn) => fn.documentFormId === (form == null ? void 0 : form.id)).forEach((formNode) => {
         const blueprint = getFormNodeBlueprint(formNode, state);
         if (blueprint.hasValuesField) {
-          changeSets.push(__spreadValues({
-            path: [formNodePath(formNode), "_values"].join(".")
-          }, buildChangeSet(event, formNode)));
+          changeSets.push({
+            path: [formNodePath(formNode), "_values"].join("."),
+            ...buildChangeSet(event, formNode)
+          });
         }
-        changeSets.push(__spreadValues({
-          path: [formNodePath(formNode)].join(".")
-        }, buildChangeSet(event, formNode)));
+        changeSets.push({
+          path: [formNodePath(formNode)].join("."),
+          ...buildChangeSet(event, formNode)
+        });
       });
-      return __spreadProps(__spreadValues({}, state), { changeSets });
+      return { ...state, changeSets };
     }
     case "ready":
-      return __spreadProps(__spreadValues({}, state), { status: "ready" });
+      return { ...state, status: "ready" };
     case "done":
-      return __spreadProps(__spreadValues({}, state), { status: "done" });
+      return { ...state, status: "done" };
     case "setData":
-      return __spreadProps(__spreadValues({}, state), { data: action.value });
+      return { ...state, data: action.value };
     case "setIn": {
       let newData;
       if (action.value.displaceIndex) {
@@ -1634,10 +1624,11 @@ function reducer(state, action) {
         newData = setIn(state.data, action.value.path, action.value.value);
       }
       const changeSets = state.changeSets.filter((cs) => cs.path !== action.value.path);
-      return __spreadProps(__spreadValues({}, state), {
+      return {
+        ...state,
         data: newData,
         changeSets
-      });
+      };
     }
     default:
       return state;
@@ -1662,8 +1653,8 @@ const useFormify = ({
   formify: formifyFunc,
   eventList
 }) => {
-  const formIds = React__default.useRef([]);
-  const [state, dispatch] = React__default.useReducer(reducer, {
+  const formIds = React.useRef([]);
+  const [state, dispatch] = React.useReducer(reducer, {
     status: "idle",
     schema: void 0,
     query: query ? G.parse(query) : null,
@@ -1675,7 +1666,7 @@ const useFormify = ({
     formNodes: [],
     documentForms: []
   });
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     if (query) {
       dispatch({ type: "start", value: { query } });
       formIds.current.forEach((formId) => {
@@ -1686,7 +1677,7 @@ const useFormify = ({
       });
     }
   }, [query, JSON.stringify(variables)]);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     if (state.status === "initialized") {
       cms.api.tina.request(query, { variables }).then((res) => {
         delete res.paths;
@@ -1694,7 +1685,7 @@ const useFormify = ({
       });
     }
   }, [state.status]);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     const run = async () => {
       const schema = await cms.api.tina.getSchema();
       const result = await formify({
@@ -1711,7 +1702,7 @@ const useFormify = ({
       run();
     }
   }, [state.status]);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     const run = async () => {
       const result = await cms.api.tina.request(G.print(state.query), {
         variables
@@ -1763,7 +1754,7 @@ const useFormify = ({
       run();
     }
   }, [state.status]);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     if (state.status === "ready") {
       cms.events.subscribe(`forms:reset`, (event) => {
         if (eventList) {
@@ -1804,9 +1795,10 @@ const useFormify = ({
           dispatch({
             type: "onFieldChange",
             value: {
-              event: __spreadProps(__spreadValues({}, event), {
+              event: {
+                ...event,
                 mutationType: { type: "referenceChange" }
-              }),
+              },
               form
             }
           });
@@ -1817,7 +1809,7 @@ const useFormify = ({
       dispatch({ type: "done" });
     }
   }, [state.status]);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     state.changeSets.forEach((changeSet) => {
       if (changeSet.mutationType.type === "reset") {
         const form = cms.forms.find(changeSet.formId);
@@ -1854,21 +1846,24 @@ const useFormify = ({
             }
             dispatch({
               type: "setIn",
-              value: __spreadProps(__spreadValues({
-                displaceIndex: true
-              }, changeSet), {
-                value: __spreadValues(__spreadValues({}, res), extra)
-              })
+              value: {
+                displaceIndex: true,
+                ...changeSet,
+                value: {
+                  ...res,
+                  ...extra
+                }
+              }
             });
           });
         } else {
           dispatch({
             type: "setIn",
-            value: __spreadProps(__spreadValues({
-              displaceIndex: true
-            }, changeSet), {
+            value: {
+              displaceIndex: true,
+              ...changeSet,
               value: changeSet.value[0]
-            })
+            }
           });
         }
       } else {
@@ -1878,9 +1873,10 @@ const useFormify = ({
           if (!changeSet.value) {
             dispatch({
               type: "setIn",
-              value: __spreadProps(__spreadValues({}, changeSet), {
+              value: {
+                ...changeSet,
                 value: null
-              })
+              }
             });
           } else {
             cms.api.tina.request(`
@@ -1898,9 +1894,13 @@ const useFormify = ({
               });
               dispatch({
                 type: "setIn",
-                value: __spreadProps(__spreadValues({}, changeSet), {
-                  value: __spreadValues(__spreadValues({}, res.node), data)
-                })
+                value: {
+                  ...changeSet,
+                  value: {
+                    ...res.node,
+                    ...data
+                  }
+                }
               });
             }).catch((e) => {
               cms.alerts.error(`Unexpected error fetching reference`);
@@ -1912,11 +1912,11 @@ const useFormify = ({
         }
       }
     });
-  }, [state.changeSets.length]);
-  React__default.useEffect(() => {
+  }, [JSON.stringify(state.changeSets)]);
+  React.useEffect(() => {
     formIds.current = state.documentForms.map((df) => df.id);
   }, [state.documentForms.length]);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     return () => {
       formIds.current.forEach((formId) => {
         const form = cms.forms.find(formId);
@@ -1926,7 +1926,7 @@ const useFormify = ({
       });
     };
   }, []);
-  const resolveSubFields = React__default.useCallback(async (args) => {
+  const resolveSubFields = React.useCallback(async (args) => {
     const { form, formNode, prefix, loc } = args;
     const data = {};
     await sequential(form.fields, async (field) => {
@@ -1955,14 +1955,15 @@ const useFormify = ({
                 }
                 data[keyName] = await sequential(value, async (item, index) => {
                   const template = field.templates[item._template];
-                  return __spreadProps(__spreadValues({}, await resolveSubFields({
-                    formNode,
-                    form: { fields: template.fields, values: item },
-                    prefix: prefix ? [prefix, fieldName].join(".") : fieldName,
-                    loc: [...loc, index]
-                  })), {
+                  return {
+                    ...await resolveSubFields({
+                      formNode,
+                      form: { fields: template.fields, values: item },
+                      prefix: prefix ? [prefix, fieldName].join(".") : fieldName,
+                      loc: [...loc, index]
+                    }),
                     __typename: field.typeMap[item._template]
-                  });
+                  };
                 });
               });
             } else {
@@ -2059,11 +2060,14 @@ const useFormify = ({
                       }
                     }
                   `, { variables: { id: value } });
-            data[keyName] = __spreadValues(__spreadValues({}, res.node), await resolveSubFields({
-              formNode: subDocumentFormNode,
-              form: form2,
-              loc: location
-            }));
+            data[keyName] = {
+              ...res.node,
+              ...await resolveSubFields({
+                formNode: subDocumentFormNode,
+                form: form2,
+                loc: location
+              })
+            };
           });
           break;
         default:
@@ -2081,9 +2085,10 @@ const useFormify = ({
     });
     return data;
   }, [cms, JSON.stringify(state), dispatch]);
-  return __spreadProps(__spreadValues({}, state), {
+  return {
+    ...state,
     queryString: G.print(state.query)
-  });
+  };
 };
 const buildFormNode = (documentBlueprint, form, location) => {
   return {
@@ -2098,8 +2103,7 @@ const parseRefForBranchName = (ref) => {
   return matches[1];
 };
 class Client {
-  constructor(_a) {
-    var _b = _a, { tokenStorage = "MEMORY" } = _b, options = __objRest(_b, ["tokenStorage"]);
+  constructor({ tokenStorage = "MEMORY", ...options }) {
     this.events = new EventBus();
     this.addPendingContent = async (props) => {
       const mutation = `#graphql
@@ -2148,10 +2152,11 @@ mutation addPendingDocumentMutation(
       return parse(data.getOptimizedQuery);
     };
     if (options.schema) {
-      const enrichedSchema = new TinaSchema(__spreadValues({
+      const enrichedSchema = new TinaSchema({
         version: { fullVersion: "", major: "", minor: "", patch: "" },
-        meta: { flags: [] }
-      }, addNamespaceToSchema(options.schema, [])));
+        meta: { flags: [] },
+        ...addNamespaceToSchema(options.schema, [])
+      });
       this.schema = enrichedSchema;
     }
     this.options = options;
@@ -2206,11 +2211,13 @@ mutation addPendingDocumentMutation(
     return this.contentApiUrl.includes("localhost");
   }
   setBranch(branchName) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const encodedBranch = encodeURIComponent(branchName);
-    this.frontendUrl = ((_a = this.options.tinaioConfig) == null ? void 0 : _a.frontendUrlOverride) || "https://app.tina.io";
-    this.identityApiUrl = ((_b = this.options.tinaioConfig) == null ? void 0 : _b.identityApiUrlOverride) || "https://identity.tinajs.io";
-    this.contentApiBase = ((_c = this.options.tinaioConfig) == null ? void 0 : _c.contentApiUrlOverride) || `https://content.tinajs.io`;
+    this.branch = encodedBranch;
+    this.assetsApiUrl = ((_a = this.options.tinaioConfig) == null ? void 0 : _a.assetsApiUrlOverride) || "https://assets.tinajs.io";
+    this.frontendUrl = ((_b = this.options.tinaioConfig) == null ? void 0 : _b.frontendUrlOverride) || "https://app.tina.io";
+    this.identityApiUrl = ((_c = this.options.tinaioConfig) == null ? void 0 : _c.identityApiUrlOverride) || "https://identity.tinajs.io";
+    this.contentApiBase = ((_d = this.options.tinaioConfig) == null ? void 0 : _d.contentApiUrlOverride) || `https://content.tinajs.io`;
     this.contentApiUrl = this.options.customContentApiUrl || `${this.contentApiBase}/content/${this.options.clientId}/github/${encodedBranch}`;
   }
   async requestWithForm(query, {
@@ -2244,7 +2251,12 @@ mutation addPendingDocumentMutation(
       })
     });
     if (res.status !== 200) {
-      throw new Error(`Unable to complete request, ${res.statusText}`);
+      let errorMessage = `Unable to complete request, ${res.statusText}`;
+      const resBody = await res.json();
+      if (resBody.message) {
+        errorMessage = `${errorMessage}, Response: ${resBody.message}`;
+      }
+      throw new Error(errorMessage);
     }
     const json = await res.json();
     if (json.errors) {
@@ -2253,6 +2265,24 @@ mutation addPendingDocumentMutation(
     }
     return json.data;
   }
+  async syncTinaMedia() {
+    const res = await this.fetchWithToken(`${this.contentApiBase}/assets/${this.clientId}/sync/${this.branch}`, { method: "POST" });
+    const jsonRes = await res.json();
+    return jsonRes;
+  }
+  async checkSyncStatus({
+    assetsSyncing
+  }) {
+    const res = await this.fetchWithToken(`${this.assetsApiUrl}/v1/${this.clientId}/syncStatus`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify({ assetsSyncing })
+    });
+    const jsonRes = await res.json();
+    return jsonRes;
+  }
   parseJwt(token) {
     const base64Url = token.split(".")[1];
     const base64 = base64Url.replace(/-/g, "+").replace(/_/g, "/");
@@ -2307,11 +2337,13 @@ mutation addPendingDocumentMutation(
   }
   async fetchWithToken(input, init) {
     const headers = (init == null ? void 0 : init.headers) || {};
-    return await fetch(input, __spreadProps(__spreadValues({}, init), {
-      headers: new Headers(__spreadValues({
-        Authorization: "Bearer " + (await this.getToken()).id_token
-      }, headers))
-    }));
+    return await fetch(input, {
+      ...init,
+      headers: new Headers({
+        Authorization: "Bearer " + (await this.getToken()).id_token,
+        ...headers
+      })
+    });
   }
   async getUser() {
     if (!this.clientId) {
@@ -2363,11 +2395,12 @@ mutation addPendingDocumentMutation(
 const DEFAULT_LOCAL_TINA_GQL_SERVER_URL = "http://localhost:4001/graphql";
 class LocalClient extends Client {
   constructor(props) {
-    const clientProps = __spreadProps(__spreadValues({}, props), {
+    const clientProps = {
+      ...props,
       clientId: "",
       branch: "",
       customContentApiUrl: props && props.customContentApiUrl ? props.customContentApiUrl : DEFAULT_LOCAL_TINA_GQL_SERVER_URL
-    });
+    };
     super(clientProps);
   }
   async isAuthorized() {
@@ -2378,11 +2411,12 @@ class LocalClient extends Client {
   }
 }
 function ModalBuilder(modalProps) {
-  return /* @__PURE__ */ React__default.createElement(Modal, null, /* @__PURE__ */ React__default.createElement(ModalPopup, null, /* @__PURE__ */ React__default.createElement(ModalHeader, null, modalProps.title), /* @__PURE__ */ React__default.createElement(ModalBody, {
+  return /* @__PURE__ */ React.createElement(Modal, null, /* @__PURE__ */ React.createElement(ModalPopup, null, /* @__PURE__ */ React.createElement(ModalHeader, null, modalProps.title), /* @__PURE__ */ React.createElement(ModalBody, {
     padded: true
-  }, /* @__PURE__ */ React__default.createElement("p", null, modalProps.message), modalProps.error && /* @__PURE__ */ React__default.createElement(ErrorLabel, null, modalProps.error)), /* @__PURE__ */ React__default.createElement(ModalActions, null, modalProps.actions.map((action) => /* @__PURE__ */ React__default.createElement(AsyncButton, __spreadValues({
-    key: action.name
-  }, action))))));
+  }, /* @__PURE__ */ React.createElement("p", null, modalProps.message), modalProps.error && /* @__PURE__ */ React.createElement(ErrorLabel, null, modalProps.error)), /* @__PURE__ */ React.createElement(ModalActions, null, modalProps.actions.map((action) => /* @__PURE__ */ React.createElement(AsyncButton, {
+    key: action.name,
+    ...action
+  })))));
 }
 const ErrorLabel = styled.p`
   color: var(--tina-color-error) !important;
@@ -2399,12 +2433,12 @@ const AsyncButton = ({ name, primary, action }) => {
       throw e;
     }
   }, [action, setSubmitting]);
-  return /* @__PURE__ */ React__default.createElement(Button$1, {
+  return /* @__PURE__ */ React.createElement(Button, {
     variant: primary ? "primary" : "secondary",
     onClick,
     busy: submitting,
     disabled: submitting
-  }, submitting && /* @__PURE__ */ React__default.createElement(LoadingDots, null), !submitting && name);
+  }, submitting && /* @__PURE__ */ React.createElement(LoadingDots, null), !submitting && name);
 };
 const TINA_AUTH_CONFIG = "tina_auth_config";
 const useTinaAuthRedirect = () => {
@@ -2595,7 +2629,7 @@ const AuthWallInner = ({
   const client = cms.api.tina;
   const [activeModal, setActiveModal] = useState(null);
   const [showChildren, setShowChildren] = useState(false);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     client.isAuthenticated().then((isAuthenticated) => {
       if (isAuthenticated) {
         setShowChildren(true);
@@ -2620,7 +2654,7 @@ const AuthWallInner = ({
       setActiveModal(null);
     }
   }) : [];
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, activeModal === "authenticate" && /* @__PURE__ */ React__default.createElement(ModalBuilder, {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, activeModal === "authenticate" && /* @__PURE__ */ React.createElement(ModalBuilder, {
     title: "Tina Cloud Authorization",
     message: "To save edits, Tina Cloud authorization is required. On save, changes will get commited using your account.",
     close,
@@ -2649,12 +2683,12 @@ const TinaCloudProvider = (props) => {
   const baseBranch = props.branch || "main";
   const [currentBranch, setCurrentBranch] = useLocalStorage("tinacms-current-branch", baseBranch);
   useTinaAuthRedirect();
-  const cms = React__default.useMemo(() => props.cms || new TinaCMS({
+  const cms = React.useMemo(() => props.cms || new TinaCMS({
     enabled: true,
     sidebar: true
   }), [props.cms]);
   if (!cms.api.tina) {
-    cms.registerApi("tina", createClient(__spreadProps(__spreadValues({}, props), { branch: currentBranch })));
+    cms.registerApi("tina", createClient({ ...props, branch: currentBranch }));
   } else {
     cms.api.tina.setBranch(currentBranch);
   }
@@ -2662,14 +2696,20 @@ const TinaCloudProvider = (props) => {
     cms.registerApi("admin", new TinaAdminApi(cms));
   }
   const setupMedia = async () => {
-    var _a;
-    if (props.mediaStore) {
-      if ((_a = props.mediaStore.prototype) == null ? void 0 : _a.persist) {
-        cms.media.store = new props.mediaStore(cms.api.tina);
+    var _a, _b, _c, _d, _e, _f, _g;
+    const hasTinaMedia = Boolean((_b = (_a = props.schema.config) == null ? void 0 : _a.media) == null ? void 0 : _b.tina);
+    if (hasTinaMedia) {
+      cms.media.store = new TinaMediaStore(cms);
+    } else if (((_d = (_c = props.schema.config) == null ? void 0 : _c.media) == null ? void 0 : _d.loadCustomStore) || props.mediaStore) {
+      const mediaStoreFromProps = ((_f = (_e = props.schema.config) == null ? void 0 : _e.media) == null ? void 0 : _f.loadCustomStore) || props.mediaStore;
+      if ((_g = mediaStoreFromProps.prototype) == null ? void 0 : _g.persist) {
+        cms.media.store = new mediaStoreFromProps(cms.api.tina);
       } else {
-        const MediaClass = await props.mediaStore();
+        const MediaClass = await mediaStoreFromProps();
         cms.media.store = new MediaClass(cms.api.tina);
       }
+    } else {
+      cms.media.store = new DummyMediaStore();
     }
   };
   const handleListBranches = async () => {
@@ -2685,15 +2725,15 @@ const TinaCloudProvider = (props) => {
     return newBranch;
   };
   setupMedia();
-  const [branchingEnabled, setBranchingEnabled] = React__default.useState(() => cms.flags.get("branch-switcher"));
-  React__default.useEffect(() => {
+  const [branchingEnabled, setBranchingEnabled] = React.useState(() => cms.flags.get("branch-switcher"));
+  React.useEffect(() => {
     cms.events.subscribe("flag:set", ({ key, value }) => {
       if (key === "branch-switcher") {
         setBranchingEnabled(value);
       }
     });
   }, [cms.events]);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     let branchSwitcher;
     if (branchingEnabled) {
       branchSwitcher = new BranchSwitcherPlugin({
@@ -2708,24 +2748,25 @@ const TinaCloudProvider = (props) => {
       }
     };
   }, [branchingEnabled, props.branch]);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     if (props.cmsCallback) {
       props.cmsCallback(cms);
     }
   }, []);
-  return /* @__PURE__ */ React__default.createElement(BranchDataProvider, {
+  return /* @__PURE__ */ React.createElement(BranchDataProvider, {
     currentBranch,
     setCurrentBranch: (b) => {
       setCurrentBranch(b);
     }
-  }, /* @__PURE__ */ React__default.createElement(TinaProvider, {
+  }, /* @__PURE__ */ React.createElement(TinaProvider, {
     cms
-  }, /* @__PURE__ */ React__default.createElement(AuthWallInner, __spreadProps(__spreadValues({}, props), {
+  }, /* @__PURE__ */ React.createElement(AuthWallInner, {
+    ...props,
     cms
-  }))));
+  })));
 };
 const TinaCloudAuthWall = TinaCloudProvider;
-var styles = `.tina-tailwind {
+var styles = /* @__PURE__ */ (() => `.tina-tailwind {
   line-height: 1.5;
   -webkit-text-size-adjust: 100%;
   -moz-tab-size: 4;
@@ -2950,6 +2991,54 @@ var styles = `.tina-tailwind {
     display: none;
   }
 *, ::before, ::after {
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(0 132 255 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}
+::backdrop {
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
   --tw-translate-x: 0;
   --tw-translate-y: 0;
   --tw-rotate: 0;
@@ -3294,14 +3383,17 @@ var styles = `.tina-tailwind {
 }
 .tina-tailwind .from-blue-900 {
   --tw-gradient-from: #1D2C6C;
-  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(29 44 108 / 0));
+  --tw-gradient-to: rgb(29 44 108 / 0);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
 }
 .tina-tailwind .from-gray-800 {
   --tw-gradient-from: #363145;
-  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(54 49 69 / 0));
+  --tw-gradient-to: rgb(54 49 69 / 0);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
 }
 .tina-tailwind .via-gray-900 {
-  --tw-gradient-stops: var(--tw-gradient-from), #252336, var(--tw-gradient-to, rgb(37 35 54 / 0));
+  --tw-gradient-to: rgb(37 35 54 / 0);
+  --tw-gradient-stops: var(--tw-gradient-from), #252336, var(--tw-gradient-to);
 }
 .tina-tailwind .to-gray-900 {
   --tw-gradient-to: #252336;
@@ -3603,7 +3695,7 @@ var styles = `.tina-tailwind {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(0 132 255 / var(--tw-ring-opacity));
 }
-`;
+`)();
 class ContentCreatorPlugin {
   constructor(options) {
     this.__type = "content-creator";
@@ -3652,9 +3744,9 @@ class ContentCreatorPlugin {
 }
 const useDocumentCreatorPlugin = (args) => {
   const cms = useCMS();
-  const [values, setValues] = React__default.useState({});
-  const [plugin, setPlugin] = React__default.useState(null);
-  React__default.useEffect(() => {
+  const [values, setValues] = React.useState({});
+  const [plugin, setPlugin] = React.useState(null);
+  React.useEffect(() => {
     const run = async () => {
       var _a;
       const res = await cms.api.tina.request((gql2) => gql2`
@@ -3755,7 +3847,7 @@ const useDocumentCreatorPlugin = (args) => {
     };
     run();
   }, [cms]);
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     if (plugin) {
       cms.plugins.add(plugin);
     }
@@ -3776,10 +3868,10 @@ function useTina({
     state,
     isDummyContainer,
     isLoading: contextLoading
-  } = React__default.useContext(TinaDataContext);
+  } = React.useContext(TinaDataContext);
   const [waitForContextRerender, setWaitForContextRerender] = useState(!isDummyContainer);
   const isLoading = contextLoading || waitForContextRerender;
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     setRequest({ query, variables });
   }, [JSON.stringify(variables), query]);
   useEffect(() => {
@@ -3831,7 +3923,7 @@ const errorButtonStyles = {
   color: "white",
   margin: "1rem 0"
 };
-class ErrorBoundary extends React__default.Component {
+class ErrorBoundary extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
@@ -3847,7 +3939,7 @@ class ErrorBoundary extends React__default.Component {
     const branchData = window.localStorage && window.localStorage.getItem("tinacms-current-branch");
     const hasBranchData = branchData && branchData.length > 0;
     if (this.state.hasError && !this.state.pageRefresh) {
-      return /* @__PURE__ */ React__default.createElement("div", {
+      return /* @__PURE__ */ React.createElement("div", {
         style: {
           background: "#efefef",
           height: "100vh",
@@ -3855,7 +3947,7 @@ class ErrorBoundary extends React__default.Component {
           alignItems: "center",
           justifyContent: "center"
         }
-      }, /* @__PURE__ */ React__default.createElement("style", null, "            body {              margin: 0;            }          "), /* @__PURE__ */ React__default.createElement("div", {
+      }, /* @__PURE__ */ React.createElement("style", null, "            body {              margin: 0;            }          "), /* @__PURE__ */ React.createElement("div", {
         style: {
           background: "#fff",
           maxWidth: "400px",
@@ -3864,27 +3956,27 @@ class ErrorBoundary extends React__default.Component {
           borderRadius: "5px",
           boxShadow: "0 6px 24px rgb(0 37 91 / 5%), 0 2px 4px rgb(0 37 91 / 3%)"
         }
-      }, /* @__PURE__ */ React__default.createElement("h3", {
+      }, /* @__PURE__ */ React.createElement("h3", {
         style: { color: "#eb6337" }
-      }, "TinaCMS Render Error"), /* @__PURE__ */ React__default.createElement("p", null, "Tina caught an error while updating the page:"), /* @__PURE__ */ React__default.createElement("pre", {
+      }, "TinaCMS Render Error"), /* @__PURE__ */ React.createElement("p", null, "Tina caught an error while updating the page:"), /* @__PURE__ */ React.createElement("pre", {
         style: { marginTop: "1rem", overflowX: "auto" }
-      }, this.state.message), /* @__PURE__ */ React__default.createElement("br", null), /* @__PURE__ */ React__default.createElement("p", null, `If you've just updated the form, undo your most recent changes and click "refresh". If after a few refreshes, you're still encountering this error. There is a bigger issue with the site. Please reach out to your site admin.`), /* @__PURE__ */ React__default.createElement("p", null, "See our", " ", /* @__PURE__ */ React__default.createElement("a", {
+      }, this.state.message), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("p", null, `If you've just updated the form, undo your most recent changes and click "refresh". If after a few refreshes, you're still encountering this error. There is a bigger issue with the site. Please reach out to your site admin.`), /* @__PURE__ */ React.createElement("p", null, "See our", " ", /* @__PURE__ */ React.createElement("a", {
         className: "text-gray-600",
         style: { textDecoration: "underline" },
         href: "https://tina.io/docs/errors/faq/",
         target: "_blank"
-      }, " ", "Error FAQ", " "), " ", "for more information."), /* @__PURE__ */ React__default.createElement("button", {
+      }, " ", "Error FAQ", " "), " ", "for more information."), /* @__PURE__ */ React.createElement("button", {
         style: errorButtonStyles,
         onClick: () => {
           this.setState({ pageRefresh: true });
           setTimeout(() => this.setState({ hasError: false, pageRefresh: false }), 3e3);
         }
-      }, "Refresh"), hasBranchData && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("p", null, `If you're using the branch switcher, you may currently be on a "stale" branch that has been deleted or whose content is not compatible with the latest version of the site's layout. Click the button below to switch back to the default branch for this deployment.`), /* @__PURE__ */ React__default.createElement("p", null, "See our", " ", /* @__PURE__ */ React__default.createElement("a", {
+      }, "Refresh"), hasBranchData && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("p", null, `If you're using the branch switcher, you may currently be on a "stale" branch that has been deleted or whose content is not compatible with the latest version of the site's layout. Click the button below to switch back to the default branch for this deployment.`), /* @__PURE__ */ React.createElement("p", null, "See our", " ", /* @__PURE__ */ React.createElement("a", {
         className: "text-gray-600",
         style: { textDecoration: "underline" },
         href: "https://tina.io/docs/errors/faq/",
         target: "_blank"
-      }, " ", "Error FAQ", " "), " ", "for more information."), /* @__PURE__ */ React__default.createElement("button", {
+      }, " ", "Error FAQ", " "), " ", "for more information."), /* @__PURE__ */ React.createElement("button", {
         style: errorButtonStyles,
         onClick: () => {
           window.localStorage.removeItem("tinacms-current-branch");
@@ -3893,23 +3985,18 @@ class ErrorBoundary extends React__default.Component {
       }, "Switch to default branch"))));
     }
     if (this.state.pageRefresh) {
-      return /* @__PURE__ */ React__default.createElement(Loader, null, "Let's try that again.");
+      return /* @__PURE__ */ React.createElement(Loader, null, "Let's try that again.");
     }
     return this.props.children;
   }
 }
-const TinaCMSProvider2 = (_c) => {
-  var _d = _c, {
-    query,
-    documentCreatorCallback,
-    formifyCallback,
-    schema
-  } = _d, props = __objRest(_d, [
-    "query",
-    "documentCreatorCallback",
-    "formifyCallback",
-    "schema"
-  ]);
+const TinaCMSProvider2 = ({
+  query,
+  documentCreatorCallback,
+  formifyCallback,
+  schema,
+  ...props
+}) => {
   var _a;
   const validOldSetup = new Boolean(props == null ? void 0 : props.isLocalClient) || new Boolean(props == null ? void 0 : props.clientId) && new Boolean(props == null ? void 0 : props.branch);
   const apiURL = ((_a = props == null ? void 0 : props.client) == null ? void 0 : _a.apiUrl) || (props == null ? void 0 : props.apiURL);
@@ -3924,7 +4011,7 @@ const TinaCMSProvider2 = (_c) => {
   if (!schema) {
     throw new Error("`schema` is required to be passed as a property to `TinaProvider`.  You can learn more about this change here: https://github.com/tinacms/tinacms/pull/2823");
   }
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(TinaCloudProvider, {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TinaCloudProvider, {
     branch,
     clientId,
     tinaioConfig: props.tinaioConfig,
@@ -3932,17 +4019,18 @@ const TinaCMSProvider2 = (_c) => {
     cmsCallback: props.cmsCallback,
     mediaStore: props.mediaStore,
     schema
-  }, /* @__PURE__ */ React__default.createElement("style", null, styles), /* @__PURE__ */ React__default.createElement(ErrorBoundary, null, /* @__PURE__ */ React__default.createElement(DocumentCreator, {
+  }, /* @__PURE__ */ React.createElement("style", null, styles), /* @__PURE__ */ React.createElement(ErrorBoundary, null, /* @__PURE__ */ React.createElement(DocumentCreator, {
     documentCreatorCallback
-  }), /* @__PURE__ */ React__default.createElement(TinaDataProvider, {
+  }), /* @__PURE__ */ React.createElement(TinaDataProvider, {
     formifyCallback
-  }, typeof props.children == "function" ? /* @__PURE__ */ React__default.createElement(TinaQuery, __spreadProps(__spreadValues({}, props), {
+  }, typeof props.children == "function" ? /* @__PURE__ */ React.createElement(TinaQuery, {
+    ...props,
     variables: props.variables,
     data: props.data,
     query,
     formifyCallback,
     children: props.children
-  })) : props.children))));
+  }) : props.children))));
 };
 const DocumentCreator = ({
   documentCreatorCallback
@@ -3951,35 +4039,35 @@ const DocumentCreator = ({
   return null;
 };
 const TinaQuery = (props) => {
-  return /* @__PURE__ */ React__default.createElement(TinaQueryInner, __spreadValues({
-    key: `rootQuery-${props.query}`
-  }, props));
+  return /* @__PURE__ */ React.createElement(TinaQueryInner, {
+    key: `rootQuery-${props.query}`,
+    ...props
+  });
 };
-const TinaQueryInner = (_e) => {
-  var _f = _e, { children } = _f, props = __objRest(_f, ["children"]);
+const TinaQueryInner = ({ children, ...props }) => {
   const { data: liveData, isLoading } = useTina({
     query: props.query,
     variables: props.variables,
     data: props.data
   });
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children(isLoading || !props.query ? props : __spreadProps(__spreadValues({}, props), { data: liveData })));
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, children(isLoading || !props.query ? props : { ...props, data: liveData }));
 };
 const TinaDataProvider = ({
   children,
   formifyCallback
 }) => {
   const [request, setRequest] = useState();
-  const [state, setState] = React__default.useState({
+  const [state, setState] = React.useState({
     payload: void 0,
     isLoading: true
   });
-  return /* @__PURE__ */ React__default.createElement(TinaDataContext.Provider, {
+  return /* @__PURE__ */ React.createElement(TinaDataContext.Provider, {
     value: {
       setRequest,
       isLoading: state.isLoading,
       state: { payload: state.payload }
     }
-  }, /* @__PURE__ */ React__default.createElement(FormRegistrar, {
+  }, /* @__PURE__ */ React.createElement(FormRegistrar, {
     key: request == null ? void 0 : request.query,
     request,
     formifyCallback,
@@ -4003,13 +4091,13 @@ const FormRegistrar = ({
       }
     }
   });
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     onPayloadStateChange({ payload, isLoading });
   }, [JSON.stringify(payload), isLoading]);
-  return isLoading ? /* @__PURE__ */ React__default.createElement(Loader, null, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null)) : null;
+  return isLoading ? /* @__PURE__ */ React.createElement(Loader, null, /* @__PURE__ */ React.createElement(React.Fragment, null)) : null;
 };
 const Loader = (props) => {
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", {
     style: {
       position: "fixed",
       background: "rgba(0, 0, 0, 0.5)",
@@ -4021,7 +4109,7 @@ const Loader = (props) => {
       justifyContent: "center",
       padding: "40px"
     }
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     style: {
       background: "#f6f6f9",
       boxShadow: "0px 2px 3px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.1)",
@@ -4034,7 +4122,7 @@ const Loader = (props) => {
       justifyContent: "center",
       flexDirection: "column"
     }
-  }, /* @__PURE__ */ React__default.createElement("svg", {
+  }, /* @__PURE__ */ React.createElement("svg", {
     style: {
       width: "64px",
       color: "#2296fe",
@@ -4050,13 +4138,13 @@ const Loader = (props) => {
     viewBox: "0 0 100 64",
     enableBackground: "new 0 0 0 0",
     xmlSpace: "preserve"
-  }, /* @__PURE__ */ React__default.createElement("circle", {
+  }, /* @__PURE__ */ React.createElement("circle", {
     fill: "currentColor",
     stroke: "none",
     cx: 6,
     cy: 32,
     r: 6
-  }, /* @__PURE__ */ React__default.createElement("animateTransform", {
+  }, /* @__PURE__ */ React.createElement("animateTransform", {
     attributeName: "transform",
     dur: "1s",
     type: "translate",
@@ -4065,13 +4153,13 @@ const Loader = (props) => {
     keySplines: "0.8 0 0.4 1; 0.4 0 0.2 1",
     repeatCount: "indefinite",
     begin: "0.1"
-  })), /* @__PURE__ */ React__default.createElement("circle", {
+  })), /* @__PURE__ */ React.createElement("circle", {
     fill: "currentColor",
     stroke: "none",
     cx: 30,
     cy: 32,
     r: 6
-  }, /* @__PURE__ */ React__default.createElement("animateTransform", {
+  }, /* @__PURE__ */ React.createElement("animateTransform", {
     attributeName: "transform",
     dur: "1s",
     type: "translate",
@@ -4080,13 +4168,13 @@ const Loader = (props) => {
     keySplines: "0.8 0 0.4 1; 0.4 0 0.2 1",
     repeatCount: "indefinite",
     begin: "0.2"
-  })), /* @__PURE__ */ React__default.createElement("circle", {
+  })), /* @__PURE__ */ React.createElement("circle", {
     fill: "currentColor",
     stroke: "none",
     cx: 54,
     cy: 32,
     r: 6
-  }, /* @__PURE__ */ React__default.createElement("animateTransform", {
+  }, /* @__PURE__ */ React.createElement("animateTransform", {
     attributeName: "transform",
     dur: "1s",
     type: "translate",
@@ -4095,7 +4183,7 @@ const Loader = (props) => {
     keySplines: "0.8 0 0.4 1; 0.4 0 0.2 1",
     repeatCount: "indefinite",
     begin: "0.3"
-  }))), /* @__PURE__ */ React__default.createElement("p", {
+  }))), /* @__PURE__ */ React.createElement("p", {
     style: {
       fontSize: "18px",
       color: "#252336",
@@ -4152,7 +4240,7 @@ function gql(strings, ...args) {
   return str;
 }
 const Layout = ({ children }) => {
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("style", null, styles), /* @__PURE__ */ React__default.createElement("div", {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("style", null, styles), /* @__PURE__ */ React.createElement("div", {
     className: "tina-tailwind",
     style: {
       position: "fixed",
@@ -4174,8 +4262,8 @@ var DefaultContext = {
   style: void 0,
   attr: void 0
 };
-var IconContext = React__default.createContext && React__default.createContext(DefaultContext);
-var __assign = function() {
+var IconContext = React.createContext && React.createContext(DefaultContext);
+var __assign = globalThis && globalThis.__assign || function() {
   __assign = Object.assign || function(t) {
     for (var s, i = 1, n = arguments.length; i < n; i++) {
       s = arguments[i];
@@ -4187,7 +4275,7 @@ var __assign = function() {
   };
   return __assign.apply(this, arguments);
 };
-var __rest = function(s, e) {
+var __rest = globalThis && globalThis.__rest || function(s, e) {
   var t = {};
   for (var p in s)
     if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -4201,14 +4289,14 @@ var __rest = function(s, e) {
 };
 function Tree2Element(tree) {
   return tree && tree.map(function(node2, i) {
-    return React__default.createElement(node2.tag, __assign({
+    return React.createElement(node2.tag, __assign({
       key: i
     }, node2.attr), Tree2Element(node2.child));
   });
 }
 function GenIcon(data) {
   return function(props) {
-    return React__default.createElement(IconBase, __assign({
+    return React.createElement(IconBase, __assign({
       attr: __assign({}, data.attr)
     }, props), Tree2Element(data.child));
   };
@@ -4222,7 +4310,7 @@ function IconBase(props) {
       className = conf.className;
     if (props.className)
       className = (className ? className + " " : "") + props.className;
-    return React__default.createElement("svg", __assign({
+    return React.createElement("svg", __assign({
       stroke: "currentColor",
       fill: "currentColor",
       strokeWidth: "0"
@@ -4234,9 +4322,9 @@ function IconBase(props) {
       height: computedSize,
       width: computedSize,
       xmlns: "http://www.w3.org/2000/svg"
-    }), title && React__default.createElement("title", null, title), props.children);
+    }), title && React.createElement("title", null, title), props.children);
   };
-  return IconContext !== void 0 ? React__default.createElement(IconContext.Consumer, null, function(conf) {
+  return IconContext !== void 0 ? React.createElement(IconContext.Consumer, null, function(conf) {
     return elem(conf);
   }) : elem(DefaultContext);
 }
@@ -4274,9 +4362,6 @@ function IoMdClose(props) {
 function BiEdit(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "m7 17.013 4.413-.015 9.632-9.54c.378-.378.586-.88.586-1.414s-.208-1.036-.586-1.414l-1.586-1.586c-.756-.756-2.075-.752-2.825-.003L7 12.583v4.43zM18.045 4.458l1.589 1.583-1.597 1.582-1.586-1.585 1.594-1.58zM9 13.417l6.03-5.973 1.586 1.586-6.029 5.971L9 15.006v-1.589z" } }, { "tag": "path", "attr": { "d": "M5 21h14c1.103 0 2-.897 2-2v-8.668l-2 2V19H8.158c-.026 0-.053.01-.079.01-.033 0-.066-.009-.1-.01H5V5h6.847l2-2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2z" } }] })(props);
 }
-function BiLeftArrowAlt(props) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M12.707 17.293 8.414 13H18v-2H8.414l4.293-4.293-1.414-1.414L4.586 12l6.707 6.707z" } }] })(props);
-}
 function BiLogIn(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "m13 16 5-4-5-4v3H4v2h9z" } }, { "tag": "path", "attr": { "d": "M20 3h-9c-1.103 0-2 .897-2 2v4h2V5h9v14h-9v-4H9v4c0 1.103.897 2 2 2h9c1.103 0 2-.897 2-2V5c0-1.103-.897-2-2-2z" } }] })(props);
 }
@@ -4289,9 +4374,6 @@ function BiMenu(props) {
 function BiPlus(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M19 11h-6V5h-2v6H5v2h6v6h2v-6h6z" } }] })(props);
 }
-function BiRightArrowAlt(props) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "m11.293 17.293 1.414 1.414L19.414 12l-6.707-6.707-1.414 1.414L15.586 11H6v2h9.586z" } }] })(props);
-}
 function BiTrash(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M5 20a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8h2V6h-4V4a2 2 0 0 0-2-2H9a2 2 0 0 0-2 2v2H3v2h2zM9 4h6v2H9zM8 8h9v12H7V8z" } }, { "tag": "path", "attr": { "d": "M9 10h2v8H9zm4 0h2v8h-2z" } }] })(props);
 }
@@ -4302,47 +4384,47 @@ const Sidebar = ({ cms }) => {
   var _a, _b;
   const collectionsInfo = useGetCollections(cms);
   const screens = cms.plugins.getType("screen").all();
-  const [menuIsOpen, setMenuIsOpen] = React__default.useState(false);
+  const [menuIsOpen, setMenuIsOpen] = React.useState(false);
   const isLocalMode = (_b = (_a = cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode;
   const navBreakpoint = 1e3;
   const windowWidth = useWindowWidth();
   const renderDesktopNav = windowWidth > navBreakpoint;
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, renderDesktopNav && /* @__PURE__ */ React__default.createElement(Nav, {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, renderDesktopNav && /* @__PURE__ */ React.createElement(Nav, {
     sidebarWidth: 360,
     showCollections: true,
     collectionsInfo,
     screens,
     contentCreators: [],
-    RenderNavSite: ({ view }) => /* @__PURE__ */ React__default.createElement(SidebarLink, {
+    RenderNavSite: ({ view }) => /* @__PURE__ */ React.createElement(SidebarLink, {
       label: view.name,
       to: `screens/${slugify(view.name)}`,
       Icon: view.Icon ? view.Icon : ImFilesEmpty
     }),
-    RenderNavCollection: ({ collection }) => /* @__PURE__ */ React__default.createElement(SidebarLink, {
+    RenderNavCollection: ({ collection }) => /* @__PURE__ */ React.createElement(SidebarLink, {
       label: collection.label ? collection.label : collection.name,
       to: `collections/${collection.name}`,
       Icon: ImFilesEmpty
     })
-  }), !renderDesktopNav && /* @__PURE__ */ React__default.createElement(Transition, {
+  }), !renderDesktopNav && /* @__PURE__ */ React.createElement(Transition, {
     show: menuIsOpen
-  }, /* @__PURE__ */ React__default.createElement(Transition.Child, {
-    as: React__default.Fragment,
+  }, /* @__PURE__ */ React.createElement(Transition.Child, {
+    as: React.Fragment,
     enter: "transform transition-all ease-out duration-300",
     enterFrom: "opacity-0 -translate-x-full",
     enterTo: "opacity-100 translate-x-0",
     leave: "transform transition-all ease-in duration-200",
     leaveFrom: "opacity-100 translate-x-0",
     leaveTo: "opacity-0 -translate-x-full"
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     className: "fixed left-0 top-0 z-overlay h-full transform"
-  }, /* @__PURE__ */ React__default.createElement(Nav, {
+  }, /* @__PURE__ */ React.createElement(Nav, {
     className: "rounded-r-md",
     sidebarWidth: 360,
     showCollections: true,
     collectionsInfo,
     screens,
     contentCreators: [],
-    RenderNavSite: ({ view }) => /* @__PURE__ */ React__default.createElement(SidebarLink, {
+    RenderNavSite: ({ view }) => /* @__PURE__ */ React.createElement(SidebarLink, {
       label: view.name,
       to: `screens/${slugify(view.name)}`,
       Icon: view.Icon ? view.Icon : ImFilesEmpty,
@@ -4350,7 +4432,7 @@ const Sidebar = ({ cms }) => {
         setMenuIsOpen(false);
       }
     }),
-    RenderNavCollection: ({ collection }) => /* @__PURE__ */ React__default.createElement(SidebarLink, {
+    RenderNavCollection: ({ collection }) => /* @__PURE__ */ React.createElement(SidebarLink, {
       label: collection.label ? collection.label : collection.name,
       to: `collections/${collection.name}`,
       Icon: ImFilesEmpty,
@@ -4358,19 +4440,19 @@ const Sidebar = ({ cms }) => {
         setMenuIsOpen(false);
       }
     })
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     className: "absolute top-8 right-0 transform translate-x-full overflow-hidden"
-  }, /* @__PURE__ */ React__default.createElement(Button$1, {
+  }, /* @__PURE__ */ React.createElement(Button, {
     rounded: "right",
     variant: "secondary",
     onClick: () => {
       setMenuIsOpen(false);
     },
     className: `transition-opacity duration-150 ease-out`
-  }, /* @__PURE__ */ React__default.createElement(IoMdClose, {
+  }, /* @__PURE__ */ React.createElement(IoMdClose, {
     className: "h-6 w-auto"
-  })))))), /* @__PURE__ */ React__default.createElement(Transition.Child, {
-    as: React__default.Fragment,
+  })))))), /* @__PURE__ */ React.createElement(Transition.Child, {
+    as: React.Fragment,
     enter: "ease-out duration-300",
     enterFrom: "opacity-0",
     enterTo: "opacity-80",
@@ -4378,39 +4460,39 @@ const Sidebar = ({ cms }) => {
     leave: "ease-in duration-200",
     leaveFrom: "opacity-80",
     leaveTo: "opacity-0"
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     onClick: () => {
       setMenuIsOpen(false);
     },
     className: "fixed z-menu inset-0 bg-gradient-to-br from-gray-800 via-gray-900 to-black"
-  }))), !renderDesktopNav && /* @__PURE__ */ React__default.createElement(Button$1, {
+  }))), !renderDesktopNav && /* @__PURE__ */ React.createElement(Button, {
     rounded: "right",
     variant: "secondary",
     onClick: () => {
       setMenuIsOpen(true);
     },
     className: `pointer-events-auto -ml-px absolute left-0 z-50 ${isLocalMode ? `top-10` : `top-4`}`
-  }, /* @__PURE__ */ React__default.createElement(BiMenu, {
+  }, /* @__PURE__ */ React.createElement(BiMenu, {
     className: "h-7 w-auto"
   })));
 };
 const SidebarLink = (props) => {
   const { to, label, Icon } = props;
-  return /* @__PURE__ */ React__default.createElement(NavLink, {
+  return /* @__PURE__ */ React.createElement(NavLink, {
     className: ({ isActive }) => {
       return `text-base tracking-wide ${isActive ? "text-blue-600" : "text-gray-500"} hover:text-blue-600 flex items-center opacity-90 hover:opacity-100`;
     },
     onClick: props.onClick ? props.onClick : () => {
     },
     to
-  }, /* @__PURE__ */ React__default.createElement(Icon, {
+  }, /* @__PURE__ */ React.createElement(Icon, {
     className: "mr-2 h-6 opacity-80 w-auto"
   }), " ", label);
 };
 const GetCMS = ({ children }) => {
   try {
     const cms = useCMS();
-    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children(cms));
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, children(cms));
   } catch (e) {
     return null;
   }
@@ -4422,52 +4504,52 @@ const AuthTemplate = ({
   message,
   children
 }) => {
-  return /* @__PURE__ */ React__default.createElement("div", {
+  return /* @__PURE__ */ React.createElement("div", {
     className: "h-screen w-full bg-gradient-to-b from-blue-900 to-gray-900 flex items-center justify-center px-4 py-6"
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     className: "bg-white rounded-lg overflow-hidden shadow-lg w-full max-w-lg"
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     className: "px-5 py-4 border-b border-gray-150"
-  }, /* @__PURE__ */ React__default.createElement("h2", {
+  }, /* @__PURE__ */ React.createElement("h2", {
     className: "text-2xl font-sans tracking-wide text-gray-700 flex items-center gap-0.5"
-  }, /* @__PURE__ */ React__default.createElement("svg", {
+  }, /* @__PURE__ */ React.createElement("svg", {
     viewBox: "0 0 32 32",
     fill: "#EC4815",
     xmlns: "http://www.w3.org/2000/svg",
     className: "w-10 h-auto"
-  }, /* @__PURE__ */ React__default.createElement("path", {
+  }, /* @__PURE__ */ React.createElement("path", {
     d: "M18.6466 14.5553C19.9018 13.5141 20.458 7.36086 21.0014 5.14903C21.5447 2.9372 23.7919 3.04938 23.7919 3.04938C23.7919 3.04938 23.2085 4.06764 23.4464 4.82751C23.6844 5.58738 25.3145 6.26662 25.3145 6.26662L24.9629 7.19622C24.9629 7.19622 24.2288 7.10204 23.7919 7.9785C23.355 8.85496 24.3392 17.4442 24.3392 17.4442C24.3392 17.4442 21.4469 22.7275 21.4469 24.9206C21.4469 27.1136 22.4819 28.9515 22.4819 28.9515H21.0296C21.0296 28.9515 18.899 26.4086 18.462 25.1378C18.0251 23.8669 18.1998 22.596 18.1998 22.596C18.1998 22.596 15.8839 22.4646 13.8303 22.596C11.7767 22.7275 10.4072 24.498 10.16 25.4884C9.91287 26.4787 9.81048 28.9515 9.81048 28.9515H8.66211C7.96315 26.7882 7.40803 26.0129 7.70918 24.9206C8.54334 21.8949 8.37949 20.1788 8.18635 19.4145C7.99321 18.6501 6.68552 17.983 6.68552 17.983C7.32609 16.6741 7.97996 16.0452 10.7926 15.9796C13.6052 15.914 17.3915 15.5965 18.6466 14.5553Z"
-  }), /* @__PURE__ */ React__default.createElement("path", {
+  }), /* @__PURE__ */ React.createElement("path", {
     d: "M11.1268 24.7939C11.1268 24.7939 11.4236 27.5481 13.0001 28.9516H14.3511C13.0001 27.4166 12.8527 23.4155 12.8527 23.4155C12.1656 23.6399 11.3045 24.3846 11.1268 24.7939Z"
-  })), /* @__PURE__ */ React__default.createElement("span", null, "Tina"))), message && /* @__PURE__ */ React__default.createElement("div", {
+  })), /* @__PURE__ */ React.createElement("span", null, "Tina"))), message && /* @__PURE__ */ React.createElement("div", {
     className: "px-5 pt-4"
-  }, /* @__PURE__ */ React__default.createElement("p", {
+  }, /* @__PURE__ */ React.createElement("p", {
     className: "text-base font-sans leading-normal"
-  }, message)), /* @__PURE__ */ React__default.createElement("div", {
+  }, message)), /* @__PURE__ */ React.createElement("div", {
     className: "px-5 py-4 flex gap-4 w-full justify-between"
   }, children)));
 };
 const LoginPage = () => {
   const { setEdit } = useEditState();
   const login = () => setEdit(true);
-  return /* @__PURE__ */ React__default.createElement(AuthTemplate, null, /* @__PURE__ */ React__default.createElement("div", {
+  return /* @__PURE__ */ React.createElement(AuthTemplate, null, /* @__PURE__ */ React.createElement("div", {
     className: "flex w-full flex-1 gap-4 items-center justify-end"
-  }, /* @__PURE__ */ React__default.createElement(Button$1, {
+  }, /* @__PURE__ */ React.createElement(Button, {
     onClick: () => {
       window.location.href = "/";
     },
     variant: "white",
     size: "custom",
     className: "text-base h-12 px-6 flex-shrink-0 flex-grow-0"
-  }, /* @__PURE__ */ React__default.createElement(MdOutlineArrowBack, {
+  }, /* @__PURE__ */ React.createElement(MdOutlineArrowBack, {
     className: "w-6 h-auto mr-1.5 opacity-80"
-  }), " Back To Site"), /* @__PURE__ */ React__default.createElement(Button$1, {
+  }), " Back To Site"), /* @__PURE__ */ React.createElement(Button, {
     onClick: () => login(),
     variant: "primary",
     size: "custom",
     className: "text-base h-12 px-6 flex-1",
     type: "submit"
-  }, /* @__PURE__ */ React__default.createElement(BiLogIn, {
+  }, /* @__PURE__ */ React.createElement(BiLogIn, {
     className: "w-6 h-auto mr-2 opacity-80"
   }), " Edit With Tina")));
 };
@@ -4476,67 +4558,67 @@ const logout = () => {
   window.location.href = "/";
 };
 const LogoutPage = () => {
-  return /* @__PURE__ */ React__default.createElement(AuthTemplate, null, /* @__PURE__ */ React__default.createElement("div", {
+  return /* @__PURE__ */ React.createElement(AuthTemplate, null, /* @__PURE__ */ React.createElement("div", {
     className: "flex w-full flex-1 gap-4 items-center justify-end"
-  }, /* @__PURE__ */ React__default.createElement(Button$1, {
+  }, /* @__PURE__ */ React.createElement(Button, {
     onClick: () => {
       window.location.href = "/";
     },
     variant: "white",
     size: "custom",
     className: "text-base h-12 px-6 flex-shrink-0 flex-grow-0"
-  }, /* @__PURE__ */ React__default.createElement(MdOutlineArrowBack, {
+  }, /* @__PURE__ */ React.createElement(MdOutlineArrowBack, {
     className: "w-6 h-auto mr-1.5 opacity-80"
-  }), " Back To Site"), /* @__PURE__ */ React__default.createElement(Button$1, {
+  }), " Back To Site"), /* @__PURE__ */ React.createElement(Button, {
     onClick: () => logout(),
     type: "submit",
     variant: "primary",
     size: "custom",
     className: "text-base h-12 px-6 flex-1"
-  }, /* @__PURE__ */ React__default.createElement(BiLogOut, {
+  }, /* @__PURE__ */ React.createElement(BiLogOut, {
     className: "w-6 h-auto mr-1.5 opacity-80"
   }), " Log Out of Tina")));
 };
 const PageWrapper = ({
   children
 }) => {
-  return /* @__PURE__ */ React__default.createElement("div", {
+  return /* @__PURE__ */ React.createElement("div", {
     className: "relative left-0 w-full h-full bg-gray-50 shadow-2xl overflow-y-auto transition-opacity duration-300 ease-out flex flex-col opacity-100"
   }, children);
 };
 const PageHeader = ({
   isLocalMode,
   children
-}) => /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, isLocalMode && /* @__PURE__ */ React__default.createElement(LocalWarning, null), /* @__PURE__ */ React__default.createElement("div", {
+}) => /* @__PURE__ */ React.createElement(React.Fragment, null, isLocalMode && /* @__PURE__ */ React.createElement(LocalWarning, null), /* @__PURE__ */ React.createElement("div", {
   className: "bg-white pb-4 pt-18 border-b border-gray-200 px-12"
-}, /* @__PURE__ */ React__default.createElement("div", {
+}, /* @__PURE__ */ React.createElement("div", {
   className: "w-full mx-auto max-w-screen-xl"
-}, /* @__PURE__ */ React__default.createElement("div", {
+}, /* @__PURE__ */ React.createElement("div", {
   className: "w-full flex justify-between items-end"
 }, children))));
 const PageBody = ({
   children
-}) => /* @__PURE__ */ React__default.createElement("div", {
+}) => /* @__PURE__ */ React.createElement("div", {
   className: "py-10 px-12"
 }, children);
 const PageBodyNarrow = ({
   children
-}) => /* @__PURE__ */ React__default.createElement("div", {
+}) => /* @__PURE__ */ React.createElement("div", {
   className: "py-10 px-12"
-}, /* @__PURE__ */ React__default.createElement("div", {
+}, /* @__PURE__ */ React.createElement("div", {
   className: "w-full mx-auto max-w-screen-xl"
 }, children));
 const DashboardPage = () => {
-  return /* @__PURE__ */ React__default.createElement(GetCMS, null, (cms) => {
+  return /* @__PURE__ */ React.createElement(GetCMS, null, (cms) => {
     var _a, _b;
-    return /* @__PURE__ */ React__default.createElement(PageWrapper, null, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(PageHeader, {
+    return /* @__PURE__ */ React.createElement(PageWrapper, null, /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(PageHeader, {
       isLocalMode: (_b = (_a = cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode
-    }, /* @__PURE__ */ React__default.createElement("h3", {
+    }, /* @__PURE__ */ React.createElement("h3", {
       className: "text-2xl font-sans text-gray-700"
-    }, "Welcome to Tina!")), /* @__PURE__ */ React__default.createElement(PageBodyNarrow, null, "This is your dashboard for editing or creating content. Select a collection on the left to begin.")));
+    }, "Welcome to Tina!")), /* @__PURE__ */ React.createElement(PageBodyNarrow, null, "This is your dashboard for editing or creating content. Select a collection on the left to begin.")));
   });
 };
-const LoadingPage = () => /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", {
+const LoadingPage = () => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", {
   style: {
     position: "absolute",
     top: 0,
@@ -4550,7 +4632,7 @@ const LoadingPage = () => /* @__PURE__ */ React__default.createElement(React__de
     justifyContent: "center",
     padding: "120px 40px 40px 40px"
   }
-}, /* @__PURE__ */ React__default.createElement("div", {
+}, /* @__PURE__ */ React.createElement("div", {
   style: {
     background: "#FFF",
     border: "1px solid #EDECF3",
@@ -4564,7 +4646,7 @@ const LoadingPage = () => /* @__PURE__ */ React__default.createElement(React__de
     justifyContent: "center",
     flexDirection: "column"
   }
-}, /* @__PURE__ */ React__default.createElement("svg", {
+}, /* @__PURE__ */ React.createElement("svg", {
   style: {
     width: "64px",
     color: "#2296fe",
@@ -4580,13 +4662,13 @@ const LoadingPage = () => /* @__PURE__ */ React__default.createElement(React__de
   viewBox: "0 0 100 64",
   enableBackground: "new 0 0 0 0",
   xmlSpace: "preserve"
-}, /* @__PURE__ */ React__default.createElement("circle", {
+}, /* @__PURE__ */ React.createElement("circle", {
   fill: "currentColor",
   stroke: "none",
   cx: 6,
   cy: 32,
   r: 6
-}, /* @__PURE__ */ React__default.createElement("animateTransform", {
+}, /* @__PURE__ */ React.createElement("animateTransform", {
   attributeName: "transform",
   dur: "1s",
   type: "translate",
@@ -4595,13 +4677,13 @@ const LoadingPage = () => /* @__PURE__ */ React__default.createElement(React__de
   keySplines: "0.8 0 0.4 1; 0.4 0 0.2 1",
   repeatCount: "indefinite",
   begin: "0.1"
-})), /* @__PURE__ */ React__default.createElement("circle", {
+})), /* @__PURE__ */ React.createElement("circle", {
   fill: "currentColor",
   stroke: "none",
   cx: 30,
   cy: 32,
   r: 6
-}, /* @__PURE__ */ React__default.createElement("animateTransform", {
+}, /* @__PURE__ */ React.createElement("animateTransform", {
   attributeName: "transform",
   dur: "1s",
   type: "translate",
@@ -4610,13 +4692,13 @@ const LoadingPage = () => /* @__PURE__ */ React__default.createElement(React__de
   keySplines: "0.8 0 0.4 1; 0.4 0 0.2 1",
   repeatCount: "indefinite",
   begin: "0.2"
-})), /* @__PURE__ */ React__default.createElement("circle", {
+})), /* @__PURE__ */ React.createElement("circle", {
   fill: "currentColor",
   stroke: "none",
   cx: 54,
   cy: 32,
   r: 6
-}, /* @__PURE__ */ React__default.createElement("animateTransform", {
+}, /* @__PURE__ */ React.createElement("animateTransform", {
   attributeName: "transform",
   dur: "1s",
   type: "translate",
@@ -4625,7 +4707,7 @@ const LoadingPage = () => /* @__PURE__ */ React__default.createElement(React__de
   keySplines: "0.8 0 0.4 1; 0.4 0 0.2 1",
   repeatCount: "indefinite",
   begin: "0.3"
-}))), /* @__PURE__ */ React__default.createElement("p", {
+}))), /* @__PURE__ */ React.createElement("p", {
   style: {
     fontSize: "16px",
     color: "#716c7f",
@@ -4674,161 +4756,19 @@ const GetCollection = ({
     return null;
   }
   if (loading) {
-    return /* @__PURE__ */ React__default.createElement(LoadingPage, null);
+    return /* @__PURE__ */ React.createElement(LoadingPage, null);
   }
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children(collection, loading, reFetchCollection));
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, children(collection, loading, reFetchCollection));
 };
-const theme = css`
-  :root {
-    --tina-color-primary-light: #2296fe;
-    --tina-color-primary: #0084ff;
-    --tina-color-primary-dark: #0574e4;
-    --tina-color-error-light: #eb6337;
-    --tina-color-error: #ec4815;
-    --tina-color-error-dark: #dc4419;
-    --tina-color-warning-light: #f5e06e;
-    --tina-color-warning: #e9d050;
-    --tina-color-warning-dark: #d3ba38;
-    --tina-color-success-light: #57c355;
-    --tina-color-success: #3cad3a;
-    --tina-color-success-dark: #249a21;
-    --tina-color-grey-0: #ffffff;
-    --tina-color-grey-1: #f6f6f9;
-    --tina-color-grey-2: #edecf3;
-    --tina-color-grey-3: #e1ddec;
-    --tina-color-grey-4: #b2adbe;
-    --tina-color-grey-5: #918c9e;
-    --tina-color-grey-6: #716c7f;
-    --tina-color-grey-7: #565165;
-    --tina-color-grey-8: #433e52;
-    --tina-color-grey-9: #363145;
-    --tina-color-grey-10: #252336;
-    --tina-color-indicator: var(--tina-color-primary);
-
-    --tina-radius-small: 5px;
-    --tina-radius-big: 24px;
-
-    --tina-padding-small: 12px;
-    --tina-padding-big: 20px;
-
-    --tina-font-size-0: 12px;
-    --tina-font-size-1: 13px;
-    --tina-font-size-2: 15px;
-    --tina-font-size-3: 16px;
-    --tina-font-size-4: 18px;
-    --tina-font-size-5: 20px;
-    --tina-font-size-6: 22px;
-    --tina-font-size-7: 26px;
-    --tina-font-size-8: 32px;
-
-    --tina-font-family: 'Inter', sans-serif;
-
-    --tina-font-weight-regular: 400;
-    --tina-font-weight-bold: 600;
-
-    --tina-shadow-big: 0px 2px 3px rgba(0, 0, 0, 0.05),
-      0 4px 12px rgba(0, 0, 0, 0.1);
-    --tina-shadow-small: 0px 2px 3px rgba(0, 0, 0, 0.12);
-
-    --tina-timing-short: 85ms;
-    --tina-timing-medium: 150ms;
-    --tina-timing-long: 250ms;
-
-    --tina-z-index-0: 0;
-    --tina-z-index-1: 10;
-    --tina-z-index-2: 20;
-    --tina-z-index-3: 30;
-    --tina-z-index-4: 40;
-    --tina-z-index-5: 50;
-
-    --tina-sidebar-width: 340px;
-    --tina-sidebar-header-height: 60px;
-    --tina-toolbar-height: 62px;
-  }
-`;
-createGlobalStyle`
-  ${theme};
-`;
-const Button = (_g) => {
-  var _h = _g, {
-    variant = "secondary",
-    as: Tag = "button",
-    size = "medium",
-    busy,
-    disabled,
-    rounded = "full",
-    children,
-    className
-  } = _h, props = __objRest(_h, [
-    "variant",
-    "as",
-    "size",
-    "busy",
-    "disabled",
-    "rounded",
-    "children",
-    "className"
-  ]);
-  const baseClasses = "icon-parent border-0 inline-flex items-center font-medium focus:outline-none focus:ring-2 focus:shadow-outline text-center inline-flex justify-center transition-all duration-150 ease-out ";
-  const variantClasses = {
-    primary: `shadow text-white bg-blue-500 hover:bg-blue-600 focus:ring-blue-500`,
-    secondary: `shadow text-gray-500 hover:text-blue-500 bg-gray-50 hover:bg-white border border-gray-200`,
-    white: `shadow text-gray-500 hover:text-blue-500 bg-white hover:bg-gray-50 border border-gray-200`,
-    ghost: `text-gray-500 hover:text-blue-500 hover:shadow border border-transparent hover:border-gray-200 bg-transparent`,
-    danger: `shadow text-white bg-red-500 hover:bg-red-600 focus:ring-red-500`
-  };
-  const state = busy ? `busy` : disabled ? `disabled` : `default`;
-  const stateClasses = {
-    disabled: `pointer-events-none	opacity-30 cursor-not-allowed`,
-    busy: `pointer-events-none opacity-70 cursor-wait`,
-    default: ``
-  };
-  const roundedClasses = {
-    full: `rounded-full`,
-    left: `rounded-l-full`,
-    right: `rounded-r-full`
-  };
-  const sizeClasses = {
-    small: `text-xs h-8 px-3`,
-    medium: `text-sm h-10 px-4`,
-    custom: ``
-  };
-  return /* @__PURE__ */ React.createElement(Tag, __spreadValues({
-    className: `${baseClasses} ${variantClasses[variant]} ${sizeClasses[size]} ${stateClasses[state]} ${roundedClasses[rounded]} ${className}`
-  }, props), children);
-};
-function CursorPaginator({
-  navigateNext,
-  navigatePrev,
-  hasNext,
-  hasPrev,
-  variant = "secondary"
-}) {
-  return /* @__PURE__ */ React__default.createElement("div", {
-    className: "w-full flex flex-shrink-0 justify-end gap-2 items-center"
-  }, /* @__PURE__ */ React__default.createElement(Button, {
-    variant,
-    disabled: !hasPrev,
-    onClick: navigatePrev
-  }, /* @__PURE__ */ React__default.createElement(BiLeftArrowAlt, {
-    className: "w-6 h-full mr-2 opacity-70"
-  }), " Previous"), /* @__PURE__ */ React__default.createElement(Button, {
-    variant,
-    disabled: !hasNext,
-    onClick: navigateNext
-  }, "Next ", /* @__PURE__ */ React__default.createElement(BiRightArrowAlt, {
-    className: "w-6 h-full ml-2 opacity-70"
-  })));
-}
 const TemplateMenu = ({ templates }) => {
-  return /* @__PURE__ */ React__default.createElement(Menu, {
+  return /* @__PURE__ */ React.createElement(Menu, {
     as: "div",
     className: "relative inline-block text-left"
-  }, () => /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement(Menu.Button, {
+  }, () => /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Menu.Button, {
     className: "icon-parent inline-flex items-center font-medium focus:outline-none focus:ring-2 focus:shadow-outline text-center rounded-full justify-center transition-all duration-150 ease-out  shadow text-white bg-blue-500 hover:bg-blue-600 focus:ring-blue-500 text-sm h-10 px-6"
-  }, "Create New ", /* @__PURE__ */ React__default.createElement(BiPlus, {
+  }, "Create New ", /* @__PURE__ */ React.createElement(BiPlus, {
     className: "w-5 h-full ml-1 opacity-70"
-  }))), /* @__PURE__ */ React__default.createElement(Transition, {
+  }))), /* @__PURE__ */ React.createElement(Transition, {
     as: Fragment,
     enter: "transition ease-out duration-100",
     enterFrom: "transform opacity-0 scale-95",
@@ -4836,13 +4776,13 @@ const TemplateMenu = ({ templates }) => {
     leave: "transition ease-in duration-75",
     leaveFrom: "transform opacity-100 scale-100",
     leaveTo: "transform opacity-0 scale-95"
-  }, /* @__PURE__ */ React__default.createElement(Menu.Items, {
+  }, /* @__PURE__ */ React.createElement(Menu.Items, {
     className: "origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none"
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     className: "py-1"
-  }, templates.map((template) => /* @__PURE__ */ React__default.createElement(Menu.Item, {
+  }, templates.map((template) => /* @__PURE__ */ React.createElement(Menu.Item, {
     key: `${template.label}-${template.name}`
-  }, ({ active }) => /* @__PURE__ */ React__default.createElement(Link, {
+  }, ({ active }) => /* @__PURE__ */ React.createElement(Link, {
     to: `${template.name}/new`,
     className: `w-full text-md px-4 py-2 tracking-wide flex items-center opacity-80 text-gray-600 ${active && "text-gray-800 opacity-100"}`
   }, template.label))))))));
@@ -4861,8 +4801,8 @@ const handleNavigate = (navigate, cms, collection, document) => {
 const CollectionListPage = () => {
   const navigate = useNavigate();
   const { collectionName } = useParams();
-  const [open, setOpen] = React__default.useState(false);
-  const [vars, setVars] = React__default.useState({
+  const [open, setOpen] = React.useState(false);
+  const [vars, setVars] = React.useState({
     collection: collectionName,
     relativePath: ""
   });
@@ -4873,8 +4813,8 @@ const CollectionListPage = () => {
     setEndCursor("");
     setPrevCursors([]);
   }, [loc]);
-  return /* @__PURE__ */ React__default.createElement(GetCMS, null, (cms) => {
-    return /* @__PURE__ */ React__default.createElement(GetCollection, {
+  return /* @__PURE__ */ React.createElement(GetCMS, null, (cms) => {
+    return /* @__PURE__ */ React.createElement(GetCollection, {
       cms,
       collectionName,
       includeDocuments: true,
@@ -4886,7 +4826,7 @@ const CollectionListPage = () => {
       const admin = cms.api.admin;
       const pageInfo = collection.documents.pageInfo;
       const useDataFlag = cms.flags.get("experimentalData");
-      return /* @__PURE__ */ React__default.createElement(PageWrapper, null, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, open && /* @__PURE__ */ React__default.createElement(DeleteModal, {
+      return /* @__PURE__ */ React.createElement(PageWrapper, null, /* @__PURE__ */ React.createElement(React.Fragment, null, open && /* @__PURE__ */ React.createElement(DeleteModal, {
         filename: vars.relativePath,
         deleteFunc: async () => {
           try {
@@ -4900,71 +4840,71 @@ const CollectionListPage = () => {
           }
         },
         close: () => setOpen(false)
-      }), /* @__PURE__ */ React__default.createElement(PageHeader, {
+      }), /* @__PURE__ */ React.createElement(PageHeader, {
         isLocalMode: (_b = (_a = cms == null ? void 0 : cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode
-      }, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("h3", {
+      }, /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("h3", {
         className: "font-sans text-2xl text-gray-700"
-      }, collection.label ? collection.label : collection.name), !collection.templates && /* @__PURE__ */ React__default.createElement(Link, {
+      }, collection.label ? collection.label : collection.name), !collection.templates && /* @__PURE__ */ React.createElement(Link, {
         to: `new`,
         className: "icon-parent inline-flex items-center font-medium focus:outline-none focus:ring-2 focus:shadow-outline text-center rounded-full justify-center transition-all duration-150 ease-out  shadow text-white bg-blue-500 hover:bg-blue-600 focus:ring-blue-500 text-sm h-10 px-6"
-      }, "Create New", " ", /* @__PURE__ */ React__default.createElement(BiPlus, {
+      }, "Create New", " ", /* @__PURE__ */ React.createElement(BiPlus, {
         className: "w-5 h-full ml-1 opacity-70"
-      })), collection.templates && /* @__PURE__ */ React__default.createElement(TemplateMenu, {
+      })), collection.templates && /* @__PURE__ */ React.createElement(TemplateMenu, {
         templates: collection.templates
-      }))), /* @__PURE__ */ React__default.createElement(PageBody, null, /* @__PURE__ */ React__default.createElement("div", {
+      }))), /* @__PURE__ */ React.createElement(PageBody, null, /* @__PURE__ */ React.createElement("div", {
         className: "w-full mx-auto max-w-screen-xl"
-      }, totalCount > 0 && /* @__PURE__ */ React__default.createElement("table", {
+      }, totalCount > 0 && /* @__PURE__ */ React.createElement("table", {
         className: "table-auto shadow bg-white border-b border-gray-200 w-full max-w-full rounded-lg"
-      }, /* @__PURE__ */ React__default.createElement("tbody", {
+      }, /* @__PURE__ */ React.createElement("tbody", {
         className: "divide-y divide-gray-150"
       }, documents.map((document) => {
         var _a2;
         const hasTitle = Boolean(document.node._sys.title);
         const subfolders = document.node._sys.breadcrumbs.slice(0, -1).join("/");
-        return /* @__PURE__ */ React__default.createElement("tr", {
+        return /* @__PURE__ */ React.createElement("tr", {
           key: `document-${document.node._sys.relativePath}`,
           className: ""
-        }, /* @__PURE__ */ React__default.createElement("td", {
+        }, /* @__PURE__ */ React.createElement("td", {
           className: "px-6 py-2 whitespace-nowrap"
-        }, /* @__PURE__ */ React__default.createElement("a", {
+        }, /* @__PURE__ */ React.createElement("a", {
           className: "text-blue-600 hover:text-blue-400 flex items-center gap-3 cursor-pointer",
           onClick: () => {
             handleNavigate(navigate, cms, collection, document.node);
           }
-        }, /* @__PURE__ */ React__default.createElement(BiEdit, {
+        }, /* @__PURE__ */ React.createElement(BiEdit, {
           className: "inline-block h-6 w-auto opacity-70"
-        }), /* @__PURE__ */ React__default.createElement("span", null, /* @__PURE__ */ React__default.createElement("span", {
+        }), /* @__PURE__ */ React.createElement("span", null, /* @__PURE__ */ React.createElement("span", {
           className: "block text-xs text-gray-400 mb-1 uppercase"
-        }, hasTitle ? "Title" : "Filename"), /* @__PURE__ */ React__default.createElement("span", {
+        }, hasTitle ? "Title" : "Filename"), /* @__PURE__ */ React.createElement("span", {
           className: "h-5 leading-5 block whitespace-nowrap"
-        }, subfolders && /* @__PURE__ */ React__default.createElement("span", {
+        }, subfolders && /* @__PURE__ */ React.createElement("span", {
           className: "text-xs text-gray-400"
-        }, `${subfolders}/`), /* @__PURE__ */ React__default.createElement("span", null, hasTitle ? (_a2 = document.node._sys) == null ? void 0 : _a2.title : document.node._sys.filename))))), hasTitle && /* @__PURE__ */ React__default.createElement("td", {
+        }, `${subfolders}/`), /* @__PURE__ */ React.createElement("span", null, hasTitle ? (_a2 = document.node._sys) == null ? void 0 : _a2.title : document.node._sys.filename))))), hasTitle && /* @__PURE__ */ React.createElement("td", {
           className: "px-6 py-4 whitespace-nowrap"
-        }, /* @__PURE__ */ React__default.createElement("span", {
+        }, /* @__PURE__ */ React.createElement("span", {
           className: "block text-xs text-gray-400 mb-1 uppercase"
-        }, "Filename"), /* @__PURE__ */ React__default.createElement("span", {
+        }, "Filename"), /* @__PURE__ */ React.createElement("span", {
           className: "h-5 leading-5 block text-sm font-medium text-gray-900"
-        }, document.node._sys.filename)), /* @__PURE__ */ React__default.createElement("td", {
+        }, document.node._sys.filename)), /* @__PURE__ */ React.createElement("td", {
           className: "px-6 py-4 whitespace-nowrap"
-        }, /* @__PURE__ */ React__default.createElement("span", {
+        }, /* @__PURE__ */ React.createElement("span", {
           className: "block text-xs text-gray-400 mb-1 uppercase"
-        }, "Extension"), /* @__PURE__ */ React__default.createElement("span", {
+        }, "Extension"), /* @__PURE__ */ React.createElement("span", {
           className: "h-5 leading-5 block text-sm font-medium text-gray-900"
-        }, document.node._sys.extension)), /* @__PURE__ */ React__default.createElement("td", {
+        }, document.node._sys.extension)), /* @__PURE__ */ React.createElement("td", {
           className: "px-6 py-4 whitespace-nowrap"
-        }, /* @__PURE__ */ React__default.createElement("span", {
+        }, /* @__PURE__ */ React.createElement("span", {
           className: "block text-xs text-gray-400 mb-1 uppercase"
-        }, "Template"), /* @__PURE__ */ React__default.createElement("span", {
+        }, "Template"), /* @__PURE__ */ React.createElement("span", {
           className: "h-5 leading-5 block text-sm font-medium text-gray-900"
-        }, document.node._sys.template)), /* @__PURE__ */ React__default.createElement("td", {
+        }, document.node._sys.template)), /* @__PURE__ */ React.createElement("td", {
           className: "w-0"
-        }, /* @__PURE__ */ React__default.createElement(OverflowMenu, {
+        }, /* @__PURE__ */ React.createElement(OverflowMenu, {
           toolbarItems: [
             {
               name: "edit",
               label: "Edit in Admin",
-              Icon: /* @__PURE__ */ React__default.createElement(BiEdit, {
+              Icon: /* @__PURE__ */ React.createElement(BiEdit, {
                 size: "1.3rem"
               }),
               onMouseDown: () => {
@@ -4974,7 +4914,7 @@ const CollectionListPage = () => {
             {
               name: "delete",
               label: "Delete",
-              Icon: /* @__PURE__ */ React__default.createElement(BiTrash, {
+              Icon: /* @__PURE__ */ React.createElement(BiTrash, {
                 size: "1.3rem",
                 className: "text-red-500"
               }),
@@ -4988,9 +4928,9 @@ const CollectionListPage = () => {
             }
           ]
         })));
-      }))), useDataFlag && /* @__PURE__ */ React__default.createElement("div", {
+      }))), useDataFlag && /* @__PURE__ */ React.createElement("div", {
         className: "pt-3"
-      }, /* @__PURE__ */ React__default.createElement(CursorPaginator, {
+      }, /* @__PURE__ */ React.createElement(CursorPaginator, {
         variant: "white",
         hasNext: pageInfo == null ? void 0 : pageInfo.hasNextPage,
         navigateNext: () => {
@@ -5012,33 +4952,35 @@ const CollectionListPage = () => {
   });
 };
 const DeleteModal = ({ close: close2, deleteFunc, filename }) => {
-  return /* @__PURE__ */ React__default.createElement(Modal, null, /* @__PURE__ */ React__default.createElement(ModalHeader, {
+  return /* @__PURE__ */ React.createElement(Modal, null, /* @__PURE__ */ React.createElement(PopupModal, null, /* @__PURE__ */ React.createElement(ModalHeader, {
     close: close2
-  }, "Delete ", filename), /* @__PURE__ */ React__default.createElement(ModalBody, {
+  }, "Delete ", filename), /* @__PURE__ */ React.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, {
+  }, /* @__PURE__ */ React.createElement("p", null, `Are you sure you want to delete ${filename}?`)), /* @__PURE__ */ React.createElement(ModalActions, null, /* @__PURE__ */ React.createElement(Button, {
     style: { flexGrow: 2 },
     onClick: close2
-  }, "Cancel"), /* @__PURE__ */ React__default.createElement(Button$1, {
+  }, "Cancel"), /* @__PURE__ */ React.createElement(Button, {
     style: { flexGrow: 3 },
     variant: "danger",
     onClick: async () => {
       await deleteFunc();
       close2();
     }
-  }, "Delete")));
+  }, "Delete"))));
 };
 function HiChevronRight(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 20 20", "fill": "currentColor" }, "child": [{ "tag": "path", "attr": { "fillRule": "evenodd", "d": "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z", "clipRule": "evenodd" } }] })(props);
 }
 const createDocument = async (cms, collection, template, mutationInfo, values) => {
   const api = new TinaAdminApi(cms);
-  const _a = values, { filename } = _a, leftover = __objRest(_a, ["filename"]);
+  const { filename, ...leftover } = values;
   const { includeCollection, includeTemplate } = mutationInfo;
   const relativePath = `${filename}.${collection.format}`;
-  const params = transformDocumentIntoMutationRequestPayload(__spreadValues(__spreadValues({
-    _collection: collection.name
-  }, template && { _template: template.name }), leftover), {
+  const params = transformDocumentIntoMutationRequestPayload({
+    _collection: collection.name,
+    ...template && { _template: template.name },
+    ...leftover
+  }, {
     includeCollection,
     includeTemplate
   });
@@ -5053,7 +4995,7 @@ const createDocument = async (cms, collection, template, mutationInfo, values) =
 };
 const CollectionCreatePage = () => {
   const { collectionName, templateName } = useParams();
-  return /* @__PURE__ */ React__default.createElement(GetCMS, null, (cms) => /* @__PURE__ */ React__default.createElement(GetCollection, {
+  return /* @__PURE__ */ React.createElement(GetCMS, null, (cms) => /* @__PURE__ */ React.createElement(GetCollection, {
     cms,
     collectionName,
     includeDocuments: false
@@ -5062,7 +5004,7 @@ const CollectionCreatePage = () => {
       includeCollection: true,
       includeTemplate: !!collection.templates
     };
-    return /* @__PURE__ */ React__default.createElement(RenderForm$1, {
+    return /* @__PURE__ */ React.createElement(RenderForm$1, {
       cms,
       collection,
       templateName,
@@ -5095,7 +5037,7 @@ const RenderForm$1 = ({ cms, collection, templateName, mutationInfo }) => {
           name: "filename",
           label: "Filename",
           component: "text",
-          description: /* @__PURE__ */ React__default.createElement("span", null, "A unique filename for the content.", /* @__PURE__ */ React__default.createElement("br", null), "Examples: ", /* @__PURE__ */ React__default.createElement("code", null, "My_Document"), ", ", /* @__PURE__ */ React__default.createElement("code", null, "My_Document.en"), ",", " ", /* @__PURE__ */ React__default.createElement("code", null, "sub-folder/My_Document")),
+          description: /* @__PURE__ */ React.createElement("span", null, "A unique filename for the content.", /* @__PURE__ */ React.createElement("br", null), "Examples: ", /* @__PURE__ */ React.createElement("code", null, "My_Document"), ", ", /* @__PURE__ */ React.createElement("code", null, "My_Document.en"), ",", " ", /* @__PURE__ */ React.createElement("code", null, "sub-folder/My_Document")),
           placeholder: `My_Document`,
           validate: (value, allValues, meta) => {
             if (!value) {
@@ -5128,24 +5070,24 @@ const RenderForm$1 = ({ cms, collection, templateName, mutationInfo }) => {
   const windowWidth = useWindowWidth();
   const renderNavToggle = windowWidth < navBreakpoint + 1;
   const headerPadding = renderNavToggle ? "px-20" : "px-6";
-  return /* @__PURE__ */ React__default.createElement(PageWrapper, null, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, ((_b = (_a = cms == null ? void 0 : cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode) && /* @__PURE__ */ React__default.createElement(LocalWarning, null), /* @__PURE__ */ React__default.createElement("div", {
+  return /* @__PURE__ */ React.createElement(PageWrapper, null, /* @__PURE__ */ React.createElement(React.Fragment, null, ((_b = (_a = cms == null ? void 0 : cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode) && /* @__PURE__ */ React.createElement(LocalWarning, null), /* @__PURE__ */ React.createElement("div", {
     className: `py-4 border-b border-gray-200 bg-white ${headerPadding}`
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     className: "max-w-form mx-auto"
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     className: "mb-2"
-  }, /* @__PURE__ */ React__default.createElement("span", {
+  }, /* @__PURE__ */ React.createElement("span", {
     className: "block text-sm leading-tight uppercase text-gray-400 mb-1"
-  }, /* @__PURE__ */ React__default.createElement(Link, {
+  }, /* @__PURE__ */ React.createElement(Link, {
     to: `/collections/${collection.name}`,
     className: "inline-block text-current hover:text-blue-400 focus:underline focus:outline-none focus:text-blue-400 font-medium transition-colors duration-150 ease-out"
-  }, collection.label ? collection.label : collection.name), /* @__PURE__ */ React__default.createElement(HiChevronRight, {
+  }, collection.label ? collection.label : collection.name), /* @__PURE__ */ React.createElement(HiChevronRight, {
     className: "inline-block -mt-0.5 opacity-50"
-  })), /* @__PURE__ */ React__default.createElement("span", {
+  })), /* @__PURE__ */ React.createElement("span", {
     className: "text-xl text-gray-700 font-medium leading-tight"
-  }, "Create New")), /* @__PURE__ */ React__default.createElement(FormStatus, {
+  }, "Create New")), /* @__PURE__ */ React.createElement(FormStatus, {
     pristine: formIsPristine
-  }))), /* @__PURE__ */ React__default.createElement(FormBuilder, {
+  }))), /* @__PURE__ */ React.createElement(FormBuilder, {
     form,
     onPristineChange: setFormIsPristine
   })));
@@ -5186,9 +5128,9 @@ const GetDocument = ({
     return null;
   }
   if (loading) {
-    return /* @__PURE__ */ React__default.createElement(LoadingPage, null);
+    return /* @__PURE__ */ React.createElement(LoadingPage, null);
   }
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children(document, loading));
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, children(document, loading));
 };
 const updateDocument = async (cms, relativePath, collection, mutationInfo, values) => {
   const api = new TinaAdminApi(cms);
@@ -5207,9 +5149,9 @@ const updateDocument = async (cms, relativePath, collection, mutationInfo, value
   }
 };
 const CollectionUpdatePage = () => {
-  const _a = useParams(), { collectionName } = _a, rest = __objRest(_a, ["collectionName"]);
+  const { collectionName, ...rest } = useParams();
   const { "*": filename } = rest;
-  return /* @__PURE__ */ React__default.createElement(GetCMS, null, (cms) => /* @__PURE__ */ React__default.createElement(GetCollection, {
+  return /* @__PURE__ */ React.createElement(GetCMS, null, (cms) => /* @__PURE__ */ React.createElement(GetCollection, {
     cms,
     collectionName,
     includeDocuments: false
@@ -5219,11 +5161,11 @@ const CollectionUpdatePage = () => {
       includeCollection: true,
       includeTemplate: !!collection.templates
     };
-    return /* @__PURE__ */ React__default.createElement(GetDocument, {
+    return /* @__PURE__ */ React.createElement(GetDocument, {
       cms,
       collectionName: collection.name,
       relativePath
-    }, (document) => /* @__PURE__ */ React__default.createElement(RenderForm, {
+    }, (document) => /* @__PURE__ */ React.createElement(RenderForm, {
       cms,
       document,
       filename,
@@ -5276,24 +5218,24 @@ const RenderForm = ({
   const windowWidth = useWindowWidth();
   const renderNavToggle = windowWidth < navBreakpoint + 1;
   const headerPadding = renderNavToggle ? "px-20" : "px-6";
-  return /* @__PURE__ */ React__default.createElement(PageWrapper, null, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, ((_b = (_a = cms == null ? void 0 : cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode) && /* @__PURE__ */ React__default.createElement(LocalWarning, null), /* @__PURE__ */ React__default.createElement("div", {
+  return /* @__PURE__ */ React.createElement(PageWrapper, null, /* @__PURE__ */ React.createElement(React.Fragment, null, ((_b = (_a = cms == null ? void 0 : cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode) && /* @__PURE__ */ React.createElement(LocalWarning, null), /* @__PURE__ */ React.createElement("div", {
     className: `py-4 border-b border-gray-200 bg-white ${headerPadding}`
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     className: "max-w-form mx-auto"
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React.createElement("div", {
     className: "mb-2"
-  }, /* @__PURE__ */ React__default.createElement("span", {
+  }, /* @__PURE__ */ React.createElement("span", {
     className: "block text-sm leading-tight uppercase text-gray-400 mb-1"
-  }, /* @__PURE__ */ React__default.createElement(Link, {
+  }, /* @__PURE__ */ React.createElement(Link, {
     to: `/collections/${collection.name}`,
     className: "inline-block text-current hover:text-blue-400 focus:underline focus:outline-none focus:text-blue-400 font-medium transition-colors duration-150 ease-out"
-  }, collection.label ? collection.label : collection.name), /* @__PURE__ */ React__default.createElement(HiChevronRight, {
+  }, collection.label ? collection.label : collection.name), /* @__PURE__ */ React.createElement(HiChevronRight, {
     className: "inline-block -mt-0.5 opacity-50"
-  })), /* @__PURE__ */ React__default.createElement("span", {
+  })), /* @__PURE__ */ React.createElement("span", {
     className: "text-xl text-gray-700 font-medium leading-tight"
-  }, "Edit ", `${filename}.${collection.format}`)), /* @__PURE__ */ React__default.createElement(FormStatus, {
+  }, "Edit ", `${filename}.${collection.format}`)), /* @__PURE__ */ React.createElement(FormStatus, {
     pristine: formIsPristine
-  }))), /* @__PURE__ */ React__default.createElement(FormBuilder, {
+  }))), /* @__PURE__ */ React.createElement(FormBuilder, {
     form,
     onPristineChange: setFormIsPristine
   })));
@@ -5303,24 +5245,24 @@ const ScreenPage = () => {
   const navBreakpoint = 1e3;
   const windowWidth = useWindowWidth();
   const renderNavToggle = windowWidth < navBreakpoint + 1;
-  return /* @__PURE__ */ React__default.createElement(GetCMS, null, (cms) => {
+  return /* @__PURE__ */ React.createElement(GetCMS, null, (cms) => {
     var _a, _b;
     const screens = cms.plugins.getType("screen").all();
     const selectedScreen = screens.find(({ name }) => slugify(name) === screenName);
-    return /* @__PURE__ */ React__default.createElement("div", {
+    return /* @__PURE__ */ React.createElement("div", {
       className: "relative w-full h-full flex flex-col items-stretch justify-between"
-    }, ((_b = (_a = cms == null ? void 0 : cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode) && /* @__PURE__ */ React__default.createElement(LocalWarning, null), renderNavToggle && /* @__PURE__ */ React__default.createElement("div", {
+    }, ((_b = (_a = cms == null ? void 0 : cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode) && /* @__PURE__ */ React.createElement(LocalWarning, null), renderNavToggle && /* @__PURE__ */ React.createElement("div", {
       className: `py-5 border-b border-gray-200 bg-white pl-18`
-    }, selectedScreen.name), /* @__PURE__ */ React__default.createElement("div", {
+    }, selectedScreen.name), /* @__PURE__ */ React.createElement("div", {
       className: "flex-1 overflow-y-auto relative flex flex-col items-stretch justify-between"
-    }, /* @__PURE__ */ React__default.createElement(selectedScreen.Component, {
+    }, /* @__PURE__ */ React.createElement(selectedScreen.Component, {
       close: () => {
       }
     })));
   });
 };
 const Redirect = () => {
-  React__default.useEffect(() => {
+  React.useEffect(() => {
     if (window) {
       window.location.assign("/");
     }
@@ -5334,43 +5276,43 @@ const TinaAdmin = () => {
     return null;
   }
   if (!edit) {
-    return /* @__PURE__ */ React__default.createElement(Layout, null, /* @__PURE__ */ React__default.createElement(LoginPage, null));
+    return /* @__PURE__ */ React.createElement(Layout, null, /* @__PURE__ */ React.createElement(LoginPage, null));
   }
-  return /* @__PURE__ */ React__default.createElement(GetCMS, null, (cms) => {
+  return /* @__PURE__ */ React.createElement(GetCMS, null, (cms) => {
     const isTinaAdminEnabled = cms.flags.get("tina-admin") === false ? false : true;
     if (isTinaAdminEnabled) {
-      return /* @__PURE__ */ React__default.createElement(Layout, null, /* @__PURE__ */ React__default.createElement(HashRouter, null, /* @__PURE__ */ React__default.createElement("div", {
+      return /* @__PURE__ */ React.createElement(Layout, null, /* @__PURE__ */ React.createElement(HashRouter, null, /* @__PURE__ */ React.createElement("div", {
         className: "flex items-stretch h-screen overflow-hidden"
-      }, /* @__PURE__ */ React__default.createElement(Sidebar, {
+      }, /* @__PURE__ */ React.createElement(Sidebar, {
         cms
-      }), /* @__PURE__ */ React__default.createElement("div", {
+      }), /* @__PURE__ */ React.createElement("div", {
         className: "flex-1 relative"
-      }, /* @__PURE__ */ React__default.createElement(Routes, null, /* @__PURE__ */ React__default.createElement(Route, {
+      }, /* @__PURE__ */ React.createElement(Routes, null, /* @__PURE__ */ React.createElement(Route, {
         path: "collections/:collectionName/new",
-        element: /* @__PURE__ */ React__default.createElement(CollectionCreatePage, null)
-      }), /* @__PURE__ */ React__default.createElement(Route, {
+        element: /* @__PURE__ */ React.createElement(CollectionCreatePage, null)
+      }), /* @__PURE__ */ React.createElement(Route, {
         path: "collections/:collectionName/:templateName/new",
-        element: /* @__PURE__ */ React__default.createElement(CollectionCreatePage, null)
-      }), /* @__PURE__ */ React__default.createElement(Route, {
+        element: /* @__PURE__ */ React.createElement(CollectionCreatePage, null)
+      }), /* @__PURE__ */ React.createElement(Route, {
         path: "collections/:collectionName/*",
-        element: /* @__PURE__ */ React__default.createElement(CollectionUpdatePage, null)
-      }), /* @__PURE__ */ React__default.createElement(Route, {
+        element: /* @__PURE__ */ React.createElement(CollectionUpdatePage, null)
+      }), /* @__PURE__ */ React.createElement(Route, {
         path: "collections/:collectionName",
-        element: /* @__PURE__ */ React__default.createElement(CollectionListPage, null)
-      }), /* @__PURE__ */ React__default.createElement(Route, {
+        element: /* @__PURE__ */ React.createElement(CollectionListPage, null)
+      }), /* @__PURE__ */ React.createElement(Route, {
         path: "screens/:screenName",
-        element: /* @__PURE__ */ React__default.createElement(ScreenPage, null)
-      }), /* @__PURE__ */ React__default.createElement(Route, {
+        element: /* @__PURE__ */ React.createElement(ScreenPage, null)
+      }), /* @__PURE__ */ React.createElement(Route, {
         path: "/",
-        element: /* @__PURE__ */ React__default.createElement(DashboardPage, null)
+        element: /* @__PURE__ */ React.createElement(DashboardPage, null)
       }))))));
     } else {
-      return /* @__PURE__ */ React__default.createElement(Layout, null, /* @__PURE__ */ React__default.createElement(HashRouter, null, /* @__PURE__ */ React__default.createElement(Routes, null, /* @__PURE__ */ React__default.createElement(Route, {
+      return /* @__PURE__ */ React.createElement(Layout, null, /* @__PURE__ */ React.createElement(HashRouter, null, /* @__PURE__ */ React.createElement(Routes, null, /* @__PURE__ */ React.createElement(Route, {
         path: "logout",
-        element: /* @__PURE__ */ React__default.createElement(LogoutPage, null)
-      }), /* @__PURE__ */ React__default.createElement(Route, {
+        element: /* @__PURE__ */ React.createElement(LogoutPage, null)
+      }), /* @__PURE__ */ React.createElement(Route, {
         path: "/",
-        element: /* @__PURE__ */ React__default.createElement(Redirect, null)
+        element: /* @__PURE__ */ React.createElement(Redirect, null)
       }))));
     }
   });