tinacms 0.0.0-bf22bf8-20241004045704 → 0.0.0-c0f1b7d-20250702023438

package/dist/internalClient/index.d.ts

@@ -1,10 +1,10 @@
-import { TokenObject } from '../auth/authenticate';
 import { BranchData, EventBus } from '@tinacms/toolkit';
 import { DocumentNode, GraphQLSchema } from 'graphql';
+import { TokenObject } from '../auth/authenticate';
+import { AuthProvider, Schema, TinaSchema } from '@tinacms/schema-tools';
+import { SearchClient } from '@tinacms/search/dist/index-client';
 import gql from 'graphql-tag';
-import { TinaSchema, Schema, AuthProvider } from '@tinacms/schema-tools';
 import { TinaCloudProject } from './types';
-import { SearchClient } from '@tinacms/search/dist/index-client';
 export * from './authProvider';
 export type OnLoginFunc = (args: {
     token?: TokenObject;
@@ -141,6 +141,7 @@ export declare class Client {
     }[]>;
     usingProtectedBranch(): boolean;
     createBranch({ baseBranch, branchName }: BranchData): Promise<string>;
+    getLatestVersion(): Promise<LatestVersionResponse>;
 }
 export declare const DEFAULT_LOCAL_TINA_GQL_SERVER_URL = "http://localhost:4001/graphql";
 export declare class LocalClient extends Client {
@@ -185,3 +186,8 @@ export declare class LocalSearchClient implements SearchClient {
     put(docs: any[]): Promise<any>;
     supportsClientSideIndexing(): boolean;
 }
+export type PackageVersionInfo = {
+    version: string;
+    publishedAt: string;
+};
+export type LatestVersionResponse = Record<string, PackageVersionInfo>;

package/dist/node-cache-5e8db9f0.mjs

@@ -0,0 +1,63 @@
+const makeCacheDir = async (dir, fs, path, os) => {
+  const pathParts = dir.split(path.sep).filter(Boolean);
+  const cacheHash = pathParts[pathParts.length - 1];
+  const rootUser = pathParts[0];
+  let cacheDir = dir;
+  if (!fs.existsSync(path.join(path.sep, rootUser))) {
+    cacheDir = path.join(os.tmpdir(), cacheHash);
+  }
+  try {
+    fs.mkdirSync(cacheDir, { recursive: true });
+  } catch (error) {
+    throw new Error(`Failed to create cache directory: ${error.message}`);
+  }
+  return cacheDir;
+};
+const NodeCache = async (dir) => {
+  const fs = require("node:fs");
+  const path = require("node:path");
+  const os = require("node:os");
+  const { createHash } = require("node:crypto");
+  const cacheDir = await makeCacheDir(dir, fs, path, os);
+  return {
+    makeKey: (key) => {
+      const input = key && key instanceof Object ? JSON.stringify(key) : key || "";
+      return createHash("sha256").update(input).digest("hex");
+    },
+    get: async (key) => {
+      let readValue;
+      const cacheFilename = `${cacheDir}/${key}`;
+      try {
+        const data = await fs.promises.readFile(cacheFilename, "utf-8");
+        readValue = JSON.parse(data);
+      } catch (e) {
+        if (e.code !== "ENOENT") {
+          console.error(
+            `Failed to read cache file to ${cacheFilename}: ${e.message}`
+          );
+        }
+      }
+      return readValue;
+    },
+    set: async (key, value) => {
+      const cacheFilename = `${cacheDir}/${key}`;
+      try {
+        await fs.promises.writeFile(cacheFilename, JSON.stringify(value), {
+          encoding: "utf-8",
+          flag: "wx"
+          // Don't overwrite existing caches
+        });
+      } catch (e) {
+        if (e.code !== "EEXIST") {
+          console.error(
+            `Failed to write cache file to ${cacheFilename}: ${e.message}`
+          );
+        }
+      }
+    }
+  };
+};
+export {
+  NodeCache,
+  makeCacheDir
+};

package/dist/react.d.ts

@@ -2,6 +2,7 @@ export declare function useTina<T extends object>(props: {
     query: string;
     variables: object;
     data: T;
+    experimental___selectFormByFormId?: () => string | false | undefined;
 }): {
     data: T;
     isClient: boolean;
@@ -14,16 +15,23 @@ export declare function useEditState(): {
  * to signal to Tina which DOM element the field
  * is working with.
  */
-export declare const tinaField: <T extends (object & {
+/**
+ * Generate a field identifier for Tina to associate DOM elements with form fields.
+ * Format: "queryId---path.to.field" or "queryId---path.to.array.index"
+ */
+export declare const tinaField: <T extends {
     _content_source?: {
         queryId: string;
         path: (number | string)[];
     };
-}) | undefined | null>(object: T, property?: keyof Omit<NonNullable<T>, "__typename" | "_sys">, index?: number) => string;
-export declare const addMetadata: <T extends object>(id: string, object: T & {
-    type?: string;
-    _content_source?: unknown;
-}, path: (string | number)[]) => T;
+} | Record<string, unknown> | null | undefined>(object: T, property?: keyof Omit<NonNullable<T>, "__typename" | "_sys">, index?: number) => string;
+/**
+ * FIX: This function is updated to be more robust. It explicitly checks for
+ * `null` and `String` objects to prevent them from being processed as
+ * iterable objects, which is the root cause of the "Objects are not valid
+ * as a React child" error.
+ */
+export declare const addMetadata: <T extends object>(id: string, obj: T, path?: (string | number)[]) => T;
 /**
  * This is a pretty rudimentary approach to hashing the query and variables to
  * ensure we treat multiple queries on the page uniquely. It's possible

package/dist/react.js

@@ -11,14 +11,21 @@
       () => hashFromQuery(stringifiedQuery),
       [stringifiedQuery]
     );
-    const [data, setData] = React.useState(props.data);
+    const processedData = React.useMemo(() => {
+      const dataCopy = JSON.parse(JSON.stringify(props.data));
+      return addMetadata(id, dataCopy, []);
+    }, [props.data, id]);
+    const [data, setData] = React.useState(processedData);
     const [isClient, setIsClient] = React.useState(false);
     const [quickEditEnabled, setQuickEditEnabled] = React.useState(false);
     const [isInTinaIframe, setIsInTinaIframe] = React.useState(false);
     React.useEffect(() => {
       setIsClient(true);
-      setData(props.data);
-    }, [id]);
+      setData(processedData);
+      parent.postMessage({
+        type: "url-changed"
+      });
+    }, [id, processedData]);
     React.useEffect(() => {
       if (quickEditEnabled) {
         let mouseDownHandler = function(e) {
@@ -100,13 +107,28 @@
       }
     }, [quickEditEnabled, isInTinaIframe]);
     React.useEffect(() => {
-      parent.postMessage({ type: "open", ...props, id }, window.location.origin);
-      window.addEventListener("message", (event) => {
+      if (props == null ? void 0 : props.experimental___selectFormByFormId) {
+        parent.postMessage({
+          type: "user-select-form",
+          formId: props.experimental___selectFormByFormId()
+        });
+      }
+    }, [id]);
+    React.useEffect(() => {
+      const { experimental___selectFormByFormId, ...rest } = props;
+      parent.postMessage({ type: "open", ...rest, id }, window.location.origin);
+      const handleMessage = (event) => {
         if (event.data.type === "quickEditEnabled") {
           setQuickEditEnabled(event.data.value);
         }
         if (event.data.id === id && event.data.type === "updateData") {
-          setData(event.data.data);
+          const rawData = event.data.data;
+          const newlyProcessedData = addMetadata(
+            id,
+            JSON.parse(JSON.stringify(rawData)),
+            []
+          );
+          setData(newlyProcessedData);
           setIsInTinaIframe(true);
           const anyTinaField = document.querySelector("[data-tina-field]");
           if (anyTinaField) {
@@ -121,8 +143,10 @@
             );
           }
         }
-      });
+      };
+      window.addEventListener("message", handleMessage);
       return () => {
+        window.removeEventListener("message", handleMessage);
         parent.postMessage({ type: "close", id }, window.location.origin);
       };
     }, [id, setQuickEditEnabled]);
@@ -144,59 +168,53 @@
     return { edit };
   }
   const tinaField = (object, property, index) => {
-    var _a, _b, _c;
-    if (!object) {
+    const contentSource = object == null ? void 0 : object._content_source;
+    if (!contentSource) {
       return "";
     }
-    if (object._content_source) {
-      if (!property) {
-        return [
-          (_a = object._content_source) == null ? void 0 : _a.queryId,
-          object._content_source.path.join(".")
-        ].join("---");
-      }
-      if (typeof index === "number") {
-        return [
-          (_b = object._content_source) == null ? void 0 : _b.queryId,
-          [...object._content_source.path, property, index].join(".")
-        ].join("---");
-      }
-      return [
-        (_c = object._content_source) == null ? void 0 : _c.queryId,
-        [...object._content_source.path, property].join(".")
-      ].join("---");
+    const { queryId, path } = contentSource;
+    if (!property) {
+      return `${queryId}---${path.join(".")}`;
     }
-    return "";
+    const fullPath = typeof index === "number" ? [...path, property, index] : [...path, property];
+    return `${queryId}---${fullPath.join(".")}`;
   };
-  const addMetadata = (id, object, path) => {
-    Object.entries(object).forEach(([key, value]) => {
-      if (Array.isArray(value)) {
-        value.forEach((item, index) => {
-          if (isScalarOrUndefined(item)) {
-            return;
-          }
-          if (Array.isArray(item)) {
-            return;
-          }
-          const itemObject = item;
-          addMetadata(id, itemObject, [...path, key, index]);
-        });
+  const addMetadata = (id, obj, path = []) => {
+    if (obj === null) {
+      return obj;
+    }
+    if (isScalarOrUndefined(obj)) {
+      return obj;
+    }
+    if (obj instanceof String) {
+      return obj.valueOf();
+    }
+    if (Array.isArray(obj)) {
+      return obj.map(
+        (item, index) => addMetadata(id, item, [...path, index])
+      );
+    }
+    const transformedObj = {};
+    for (const [key, value] of Object.entries(obj)) {
+      const currentPath = [...path, key];
+      if ([
+        "__typename",
+        "_sys",
+        "_internalSys",
+        "_values",
+        "_internalValues",
+        "_content_source",
+        "_tina_metadata"
+      ].includes(key)) {
+        transformedObj[key] = value;
       } else {
-        if (isScalarOrUndefined(value)) {
-          return;
-        }
-        const itemObject = value;
-        addMetadata(id, itemObject, [...path, key]);
+        transformedObj[key] = addMetadata(id, value, currentPath);
       }
-    });
-    if ((object == null ? void 0 : object.type) === "root") {
-      return;
     }
-    object._content_source = {
-      queryId: id,
-      path
-    };
-    return object;
+    if (transformedObj && typeof transformedObj === "object" && "type" in transformedObj && transformedObj.type === "root") {
+      return transformedObj;
+    }
+    return { ...transformedObj, _content_source: { queryId: id, path } };
   };
   function isScalarOrUndefined(value) {
     const type = typeof value;

package/dist/react.mjs

@@ -8,14 +8,21 @@ function useTina(props) {
     () => hashFromQuery(stringifiedQuery),
     [stringifiedQuery]
   );
-  const [data, setData] = React.useState(props.data);
+  const processedData = React.useMemo(() => {
+    const dataCopy = JSON.parse(JSON.stringify(props.data));
+    return addMetadata(id, dataCopy, []);
+  }, [props.data, id]);
+  const [data, setData] = React.useState(processedData);
   const [isClient, setIsClient] = React.useState(false);
   const [quickEditEnabled, setQuickEditEnabled] = React.useState(false);
   const [isInTinaIframe, setIsInTinaIframe] = React.useState(false);
   React.useEffect(() => {
     setIsClient(true);
-    setData(props.data);
-  }, [id]);
+    setData(processedData);
+    parent.postMessage({
+      type: "url-changed"
+    });
+  }, [id, processedData]);
   React.useEffect(() => {
     if (quickEditEnabled) {
       let mouseDownHandler = function(e) {
@@ -97,13 +104,28 @@ function useTina(props) {
     }
   }, [quickEditEnabled, isInTinaIframe]);
   React.useEffect(() => {
-    parent.postMessage({ type: "open", ...props, id }, window.location.origin);
-    window.addEventListener("message", (event) => {
+    if (props == null ? void 0 : props.experimental___selectFormByFormId) {
+      parent.postMessage({
+        type: "user-select-form",
+        formId: props.experimental___selectFormByFormId()
+      });
+    }
+  }, [id]);
+  React.useEffect(() => {
+    const { experimental___selectFormByFormId, ...rest } = props;
+    parent.postMessage({ type: "open", ...rest, id }, window.location.origin);
+    const handleMessage = (event) => {
       if (event.data.type === "quickEditEnabled") {
         setQuickEditEnabled(event.data.value);
       }
       if (event.data.id === id && event.data.type === "updateData") {
-        setData(event.data.data);
+        const rawData = event.data.data;
+        const newlyProcessedData = addMetadata(
+          id,
+          JSON.parse(JSON.stringify(rawData)),
+          []
+        );
+        setData(newlyProcessedData);
         setIsInTinaIframe(true);
         const anyTinaField = document.querySelector("[data-tina-field]");
         if (anyTinaField) {
@@ -118,8 +140,10 @@ function useTina(props) {
           );
         }
       }
-    });
+    };
+    window.addEventListener("message", handleMessage);
     return () => {
+      window.removeEventListener("message", handleMessage);
       parent.postMessage({ type: "close", id }, window.location.origin);
     };
   }, [id, setQuickEditEnabled]);
@@ -141,59 +165,53 @@ function useEditState() {
   return { edit };
 }
 const tinaField = (object, property, index) => {
-  var _a, _b, _c;
-  if (!object) {
+  const contentSource = object == null ? void 0 : object._content_source;
+  if (!contentSource) {
     return "";
   }
-  if (object._content_source) {
-    if (!property) {
-      return [
-        (_a = object._content_source) == null ? void 0 : _a.queryId,
-        object._content_source.path.join(".")
-      ].join("---");
-    }
-    if (typeof index === "number") {
-      return [
-        (_b = object._content_source) == null ? void 0 : _b.queryId,
-        [...object._content_source.path, property, index].join(".")
-      ].join("---");
-    }
-    return [
-      (_c = object._content_source) == null ? void 0 : _c.queryId,
-      [...object._content_source.path, property].join(".")
-    ].join("---");
+  const { queryId, path } = contentSource;
+  if (!property) {
+    return `${queryId}---${path.join(".")}`;
   }
-  return "";
+  const fullPath = typeof index === "number" ? [...path, property, index] : [...path, property];
+  return `${queryId}---${fullPath.join(".")}`;
 };
-const addMetadata = (id, object, path) => {
-  Object.entries(object).forEach(([key, value]) => {
-    if (Array.isArray(value)) {
-      value.forEach((item, index) => {
-        if (isScalarOrUndefined(item)) {
-          return;
-        }
-        if (Array.isArray(item)) {
-          return;
-        }
-        const itemObject = item;
-        addMetadata(id, itemObject, [...path, key, index]);
-      });
+const addMetadata = (id, obj, path = []) => {
+  if (obj === null) {
+    return obj;
+  }
+  if (isScalarOrUndefined(obj)) {
+    return obj;
+  }
+  if (obj instanceof String) {
+    return obj.valueOf();
+  }
+  if (Array.isArray(obj)) {
+    return obj.map(
+      (item, index) => addMetadata(id, item, [...path, index])
+    );
+  }
+  const transformedObj = {};
+  for (const [key, value] of Object.entries(obj)) {
+    const currentPath = [...path, key];
+    if ([
+      "__typename",
+      "_sys",
+      "_internalSys",
+      "_values",
+      "_internalValues",
+      "_content_source",
+      "_tina_metadata"
+    ].includes(key)) {
+      transformedObj[key] = value;
     } else {
-      if (isScalarOrUndefined(value)) {
-        return;
-      }
-      const itemObject = value;
-      addMetadata(id, itemObject, [...path, key]);
+      transformedObj[key] = addMetadata(id, value, currentPath);
     }
-  });
-  if ((object == null ? void 0 : object.type) === "root") {
-    return;
   }
-  object._content_source = {
-    queryId: id,
-    path
-  };
-  return object;
+  if (transformedObj && typeof transformedObj === "object" && "type" in transformedObj && transformedObj.type === "root") {
+    return transformedObj;
+  }
+  return { ...transformedObj, _content_source: { queryId: id, path } };
 };
 function isScalarOrUndefined(value) {
   const type = typeof value;

package/dist/rich-text/index.d.ts

@@ -65,6 +65,9 @@ type BaseComponents = {
         lang?: string;
         value: string;
     };
+    mermaid?: {
+        value: string;
+    };
     img?: {
         url: string;
         caption?: string;

package/dist/rich-text/index.js

@@ -72,7 +72,7 @@
     return MNode;
   };
   const Node = ({ components, child }) => {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g;
     const { children, ...props } = child;
     switch (child.type) {
       case "h1":
@@ -117,7 +117,8 @@
           // @ts-ignore FIXME: TinaMarkdownContent needs to be a union of all possible node types
           /* @__PURE__ */ React.createElement("a", { href: child.url }, /* @__PURE__ */ React.createElement(TinaMarkdown, { components, content: children }))
         );
-      case "code_block":
+      case "mermaid":
+      case "code_block": {
         const value = child.value;
         if (components[child.type]) {
           const Component2 = components[child.type];
@@ -127,6 +128,7 @@
           );
         }
         return /* @__PURE__ */ React.createElement("pre", null, /* @__PURE__ */ React.createElement("code", null, value));
+      }
       case "hr":
         if (components[child.type]) {
           const Component2 = components[child.type];
@@ -150,33 +152,33 @@
         } else {
           if (child.name === "table") {
             const firstRowHeader = (_a = child.props) == null ? void 0 : _a.firstRowHeader;
-            const rows = (firstRowHeader ? (_b = child.props) == null ? void 0 : _b.tableRows.filter((_, i) => i !== 0) : (_c = child.props) == null ? void 0 : _c.tableRows) || [];
+            const rows2 = (firstRowHeader ? (_b = child.props) == null ? void 0 : _b.tableRows.filter((_, i) => i !== 0) : (_c = child.props) == null ? void 0 : _c.tableRows) || [];
             const header = (_e = (_d = child.props) == null ? void 0 : _d.tableRows) == null ? void 0 : _e.at(0);
-            const TableComponent = components["table"] || ((props2) => /* @__PURE__ */ React.createElement("table", { ...props2 }));
-            const TrComponent = components["tr"] || ((props2) => /* @__PURE__ */ React.createElement("tr", { ...props2 }));
+            const TableComponent2 = components["table"] || ((props2) => /* @__PURE__ */ React.createElement("table", { ...props2 }));
+            const TrComponent2 = components["tr"] || ((props2) => /* @__PURE__ */ React.createElement("tr", { ...props2 }));
             const ThComponent = components["th"] || ((props2) => /* @__PURE__ */ React.createElement("th", { style: { textAlign: (props2 == null ? void 0 : props2.align) || "auto" }, ...props2 }));
-            const TdComponent = components["td"] || ((props2) => /* @__PURE__ */ React.createElement("td", { style: { textAlign: (props2 == null ? void 0 : props2.align) || "auto" }, ...props2 }));
-            const align = ((_f = child.props) == null ? void 0 : _f.align) || [];
-            return /* @__PURE__ */ React.createElement(TableComponent, null, firstRowHeader && /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement(TrComponent, null, header.tableCells.map((c, i) => {
+            const TdComponent2 = components["td"] || ((props2) => /* @__PURE__ */ React.createElement("td", { style: { textAlign: (props2 == null ? void 0 : props2.align) || "auto" }, ...props2 }));
+            const align2 = ((_f = child.props) == null ? void 0 : _f.align) || [];
+            return /* @__PURE__ */ React.createElement(TableComponent2, null, firstRowHeader && /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement(TrComponent2, null, header.tableCells.map((c, i) => {
               return /* @__PURE__ */ React.createElement(
                 TinaMarkdown,
                 {
                   key: i,
                   components: {
-                    p: (props2) => /* @__PURE__ */ React.createElement(ThComponent, { align: align[i], ...props2 })
+                    p: (props2) => /* @__PURE__ */ React.createElement(ThComponent, { align: align2[i], ...props2 })
                   },
                   content: c.value
                 }
               );
-            }))), /* @__PURE__ */ React.createElement("tbody", null, rows.map((row, i) => {
+            }))), /* @__PURE__ */ React.createElement("tbody", null, rows2.map((row, i) => {
               var _a2;
-              return /* @__PURE__ */ React.createElement(TrComponent, { key: i }, (_a2 = row == null ? void 0 : row.tableCells) == null ? void 0 : _a2.map((c, i2) => {
+              return /* @__PURE__ */ React.createElement(TrComponent2, { key: i }, (_a2 = row == null ? void 0 : row.tableCells) == null ? void 0 : _a2.map((c, i2) => {
                 return /* @__PURE__ */ React.createElement(
                   TinaMarkdown,
                   {
                     key: i2,
                     components: {
-                      p: (props2) => /* @__PURE__ */ React.createElement(TdComponent, { align: align[i2], ...props2 })
+                      p: (props2) => /* @__PURE__ */ React.createElement(TdComponent2, { align: align2[i2], ...props2 })
                     },
                     content: c.value
                   }
@@ -191,6 +193,37 @@
             return /* @__PURE__ */ React.createElement("span", null, `No component provided for ${child.name}`);
           }
         }
+      case "table":
+        const rows = child.children || [];
+        const TableComponent = components["table"] || ((props2) => /* @__PURE__ */ React.createElement("table", { style: { border: "1px solid #EDECF3" }, ...props2 }));
+        const TrComponent = components["tr"] || ((props2) => /* @__PURE__ */ React.createElement("tr", { ...props2 }));
+        const TdComponent = components["td"] || ((props2) => /* @__PURE__ */ React.createElement(
+          "td",
+          {
+            style: {
+              textAlign: (props2 == null ? void 0 : props2.align) || "auto",
+              border: "1px solid #EDECF3",
+              padding: "0.25rem"
+            },
+            ...props2
+          }
+        ));
+        const align = ((_g = child.props) == null ? void 0 : _g.align) || [];
+        return /* @__PURE__ */ React.createElement(TableComponent, null, /* @__PURE__ */ React.createElement("tbody", null, rows.map((row, i) => {
+          var _a2;
+          return /* @__PURE__ */ React.createElement(TrComponent, { key: i }, (_a2 = row.children) == null ? void 0 : _a2.map((cell, i2) => {
+            return /* @__PURE__ */ React.createElement(
+              TinaMarkdown,
+              {
+                key: i2,
+                components: {
+                  p: (props2) => /* @__PURE__ */ React.createElement(TdComponent, { align: align[i2], ...props2 })
+                },
+                content: cell.children
+              }
+            );
+          }));
+        })));
       case "maybe_mdx":
         return null;
       case "html":