tinacms 0.0.0-c6a6335-20250416234606 → 0.0.0-c706b9f-20251222081038

package/dist/internalClient/index.d.ts

@@ -2,7 +2,12 @@ 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 { SearchClient, SearchOptions, SearchQueryResponse, IndexableDocument, FuzzySearchOptions } from '@tinacms/search/index-client';
+interface TinaSearchConfig {
+    stopwordLanguages?: string[];
+    fuzzyEnabled?: boolean;
+    fuzzyOptions?: FuzzySearchOptions;
+}
 import gql from 'graphql-tag';
 import { TinaCloudProject } from './types';
 export * from './authProvider';
@@ -141,6 +146,26 @@ export declare class Client {
     }[]>;
     usingProtectedBranch(): boolean;
     createBranch({ baseBranch, branchName }: BranchData): Promise<string>;
+    getLatestVersion(): Promise<LatestVersionResponse>;
+    /**
+     * Initiate and poll for the results of an editorial workflow operation
+     *
+     * @param options Editorial workflow options
+     * @returns Object with branch and PR info when complete
+     */
+    executeEditorialWorkflow(options: {
+        branchName: string;
+        baseBranch: string;
+        prTitle?: string;
+        graphQLContentOp?: {
+            query: string;
+            variables: Record<string, unknown>;
+        };
+        onStatusUpdate?: (status: {
+            status: string;
+            message?: string;
+        }) => void;
+    }): Promise<any>;
 }
 export declare const DEFAULT_LOCAL_TINA_GQL_SERVER_URL = "http://localhost:4001/graphql";
 export declare class LocalClient extends Client {
@@ -151,37 +176,30 @@ export declare class LocalClient extends Client {
     get isLocalMode(): boolean;
 }
 export declare class TinaCMSSearchClient implements SearchClient {
-    private client;
-    private tinaSearchConfig?;
-    constructor(client: Client, tinaSearchConfig?: {
-        stopwordLanguages?: string[];
-    });
-    query(query: string, options?: {
-        limit?: number;
-        cursor?: string;
-    }): Promise<{
-        results: any[];
-        nextCursor: string | null;
-        total: number;
-        prevCursor: string | null;
-    }>;
-    del(ids: string[]): Promise<any>;
-    put(docs: any[]): Promise<any>;
+    protected readonly client: Client;
+    protected readonly fuzzyEnabled: boolean;
+    protected readonly stopwordLanguages?: string[];
+    protected readonly defaultFuzzyOptions?: FuzzySearchOptions;
+    constructor(client: Client, tinaSearchConfig?: TinaSearchConfig);
+    protected buildSearchUrl(query: string, options?: SearchOptions, useFuzzy?: boolean): string;
+    query(query: string, options?: SearchOptions): Promise<SearchQueryResponse>;
+    del(ids: string[]): Promise<void>;
+    put(docs: IndexableDocument[]): Promise<void>;
     supportsClientSideIndexing(): boolean;
 }
 export declare class LocalSearchClient implements SearchClient {
-    private client;
-    constructor(client: Client);
-    query(query: string, options?: {
-        limit?: number;
-        cursor?: string;
-    }): Promise<{
-        results: any[];
-        nextCursor: string | null;
-        total: number;
-        prevCursor: string | null;
-    }>;
-    del(ids: string[]): Promise<any>;
-    put(docs: any[]): Promise<any>;
+    protected readonly client: Client;
+    protected readonly fuzzyEnabled: boolean;
+    protected readonly defaultFuzzyOptions?: FuzzySearchOptions;
+    constructor(client: Client, tinaSearchConfig?: Omit<TinaSearchConfig, 'stopwordLanguages'>);
+    protected buildSearchUrl(query: string, options?: SearchOptions, useFuzzy?: boolean): string;
+    query(query: string, options?: SearchOptions): Promise<SearchQueryResponse>;
+    del(_ids: string[]): Promise<void>;
+    put(_docs: IndexableDocument[]): Promise<void>;
     supportsClientSideIndexing(): boolean;
 }
+export type PackageVersionInfo = {
+    version: string;
+    publishedAt: string;
+};
+export type LatestVersionResponse = Record<string, PackageVersionInfo>;

package/dist/react.d.ts

@@ -15,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

@@ -1,67 +1,113 @@
-(function(global, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react")) : typeof define === "function" && define.amd ? define(["exports", "react"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.tinacms = {}, global.NOOP));
-})(this, function(exports2, React) {
-  "use strict";
-  function useTina(props) {
-    const stringifiedQuery = JSON.stringify({
-      query: props.query,
-      variables: props.variables
+import React from "react";
+function useTina(props) {
+  const stringifiedQuery = JSON.stringify({
+    query: props.query,
+    variables: props.variables
+  });
+  const id = React.useMemo(
+    () => hashFromQuery(stringifiedQuery),
+    [stringifiedQuery]
+  );
+  const processedData = React.useMemo(() => {
+    if (props.data) {
+      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(processedData);
+    parent.postMessage({
+      type: "url-changed"
     });
-    const id = React.useMemo(
-      () => hashFromQuery(stringifiedQuery),
-      [stringifiedQuery]
-    );
-    const [data, setData] = React.useState(props.data);
-    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);
-      parent.postMessage({
-        type: "url-changed"
-      });
-    }, [id]);
-    React.useEffect(() => {
-      if (quickEditEnabled) {
-        let mouseDownHandler = function(e) {
-          const attributeNames = e.target.getAttributeNames();
-          const tinaAttribute = attributeNames.find(
-            (name) => name.startsWith("data-tina-field")
+  }, [id, processedData]);
+  React.useEffect(() => {
+    if (quickEditEnabled) {
+      let mouseDownHandler = function(e) {
+        const attributeNames = e.target.getAttributeNames();
+        const tinaAttribute = attributeNames.find(
+          (name) => name.startsWith("data-tina-field")
+        );
+        let fieldName;
+        if (tinaAttribute) {
+          e.preventDefault();
+          e.stopPropagation();
+          fieldName = e.target.getAttribute(tinaAttribute);
+        } else {
+          const ancestor = e.target.closest(
+            "[data-tina-field], [data-tina-field-overlay]"
           );
-          let fieldName;
-          if (tinaAttribute) {
-            e.preventDefault();
-            e.stopPropagation();
-            fieldName = e.target.getAttribute(tinaAttribute);
-          } else {
-            const ancestor = e.target.closest(
-              "[data-tina-field], [data-tina-field-overlay]"
+          if (ancestor) {
+            const attributeNames2 = ancestor.getAttributeNames();
+            const tinaAttribute2 = attributeNames2.find(
+              (name) => name.startsWith("data-tina-field")
             );
-            if (ancestor) {
-              const attributeNames2 = ancestor.getAttributeNames();
-              const tinaAttribute2 = attributeNames2.find(
-                (name) => name.startsWith("data-tina-field")
-              );
-              if (tinaAttribute2) {
-                e.preventDefault();
-                e.stopPropagation();
-                fieldName = ancestor.getAttribute(tinaAttribute2);
-              }
+            if (tinaAttribute2) {
+              e.preventDefault();
+              e.stopPropagation();
+              fieldName = ancestor.getAttribute(tinaAttribute2);
             }
           }
-          if (fieldName) {
+        }
+        if (fieldName) {
+          if (lastHoveredField !== null) {
+            lastHoveredField = null;
             if (isInTinaIframe) {
               parent.postMessage(
-                { type: "field:selected", fieldName },
+                { type: "field:hovered", fieldName: null },
                 window.location.origin
               );
             }
           }
-        };
-        const style = document.createElement("style");
-        style.type = "text/css";
-        style.textContent = `
+          if (isInTinaIframe) {
+            parent.postMessage(
+              { type: "field:selected", fieldName },
+              window.location.origin
+            );
+          }
+        }
+      }, mouseEnterHandler = function(e) {
+        if (!(e.target instanceof Element)) {
+          return;
+        }
+        const attributeNames = e.target.getAttributeNames();
+        const tinaAttribute = attributeNames.find(
+          (name) => name.startsWith("data-tina-field")
+        );
+        let fieldName;
+        if (tinaAttribute) {
+          fieldName = e.target.getAttribute(tinaAttribute);
+        } else {
+          const ancestor = e.target.closest(
+            "[data-tina-field], [data-tina-field-overlay]"
+          );
+          if (ancestor) {
+            const attributeNames2 = ancestor.getAttributeNames();
+            const tinaAttribute2 = attributeNames2.find(
+              (name) => name.startsWith("data-tina-field")
+            );
+            if (tinaAttribute2) {
+              fieldName = ancestor.getAttribute(tinaAttribute2);
+            }
+          }
+        }
+        if (fieldName && fieldName !== lastHoveredField) {
+          lastHoveredField = fieldName;
+          if (isInTinaIframe) {
+            parent.postMessage(
+              { type: "field:hovered", fieldName },
+              window.location.origin
+            );
+          }
+        }
+      };
+      const style = document.createElement("style");
+      style.type = "text/css";
+      style.textContent = `
         [data-tina-field] {
           outline: 2px dashed rgba(34,150,254,0.5);
           transition: box-shadow ease-out 150ms;
@@ -71,6 +117,15 @@
           outline: 2px solid rgba(34,150,254,1);
           cursor: pointer;
         }
+        [data-tina-field-focused] {
+          outline: 2px dashed #C2410C !important;
+          box-shadow: none !important;
+        }
+        [data-tina-field-focused]:hover {
+          box-shadow: inset 100vi 100vh rgba(194, 65, 12, 0.3) !important;
+          outline: 2px solid #C2410C !important;
+          cursor: pointer;
+        }
         [data-tina-field-overlay] {
           outline: 2px dashed rgba(34,150,254,0.5);
           position: relative;
@@ -91,159 +146,203 @@
         [data-tina-field-overlay]:hover::after {
           opacity: 1;
         }
-      `;
-        document.head.appendChild(style);
-        document.body.classList.add("__tina-quick-editing-enabled");
-        document.addEventListener("click", mouseDownHandler, true);
-        return () => {
-          document.removeEventListener("click", mouseDownHandler, true);
-          document.body.classList.remove("__tina-quick-editing-enabled");
-          style.remove();
-        };
-      }
-    }, [quickEditEnabled, isInTinaIframe]);
-    React.useEffect(() => {
-      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);
-      window.addEventListener("message", (event) => {
-        if (event.data.type === "quickEditEnabled") {
-          setQuickEditEnabled(event.data.value);
-        }
-        if (event.data.id === id && event.data.type === "updateData") {
-          setData(event.data.data);
-          setIsInTinaIframe(true);
-          const anyTinaField = document.querySelector("[data-tina-field]");
-          if (anyTinaField) {
-            parent.postMessage(
-              { type: "quick-edit", value: true },
-              window.location.origin
-            );
-          } else {
-            parent.postMessage(
-              { type: "quick-edit", value: false },
-              window.location.origin
-            );
-          }
+        [data-tina-field-overlay][data-tina-field-focused]::after {
+          background-color: rgba(194, 65, 12, 0.3);
+          opacity: 1;
         }
-      });
+      `;
+      document.head.appendChild(style);
+      document.body.classList.add("__tina-quick-editing-enabled");
+      let lastHoveredField = null;
+      document.addEventListener("click", mouseDownHandler, true);
+      document.addEventListener("mouseenter", mouseEnterHandler, true);
       return () => {
-        parent.postMessage({ type: "close", id }, window.location.origin);
+        document.removeEventListener("click", mouseDownHandler, true);
+        document.removeEventListener("mouseenter", mouseEnterHandler, true);
+        document.body.classList.remove("__tina-quick-editing-enabled");
+        style.remove();
       };
-    }, [id, setQuickEditEnabled]);
-    return { data, isClient };
-  }
-  function useEditState() {
-    const [edit, setEdit] = React.useState(false);
-    React.useEffect(() => {
-      if (typeof window !== "undefined") {
-        parent.postMessage({ type: "isEditMode" }, window.location.origin);
-        window.addEventListener("message", (event) => {
-          var _a;
-          if (((_a = event.data) == null ? void 0 : _a.type) === "tina:editMode") {
-            setEdit(true);
-          }
-        });
-      }
-    }, []);
-    return { edit };
-  }
-  const tinaField = (object, property, index) => {
-    var _a, _b, _c;
-    if (!object) {
-      return "";
     }
-    if (object._content_source) {
-      if (!property) {
-        return [
-          (_a = object._content_source) == null ? void 0 : _a.queryId,
-          object._content_source.path.join(".")
-        ].join("---");
+  }, [quickEditEnabled, isInTinaIframe]);
+  React.useEffect(() => {
+    if (props == null ? void 0 : props.experimental___selectFormByFormId) {
+      parent.postMessage({
+        type: "user-select-form",
+        formId: props.experimental___selectFormByFormId()
+      });
+    }
+  }, [id]);
+  const lastFocusedFieldRef = React.useRef(null);
+  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 (typeof index === "number") {
-        return [
-          (_b = object._content_source) == null ? void 0 : _b.queryId,
-          [...object._content_source.path, property, index].join(".")
-        ].join("---");
+      if (event.data.id === id && event.data.type === "updateData") {
+        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) {
+          parent.postMessage(
+            { type: "quick-edit", value: true },
+            window.location.origin
+          );
+        } else {
+          parent.postMessage(
+            { type: "quick-edit", value: false },
+            window.location.origin
+          );
+        }
       }
-      return [
-        (_c = object._content_source) == null ? void 0 : _c.queryId,
-        [...object._content_source.path, property].join(".")
-      ].join("---");
-    }
-    return "";
-  };
-  const addMetadata = (id, object, path) => {
-    Object.entries(object).forEach(([key, value]) => {
-      if (Array.isArray(value)) {
-        value.forEach((item, index) => {
-          if (isScalarOrUndefined(item)) {
-            return;
+      if (event.data.type === "field:set-focused") {
+        const newFieldName = event.data.fieldName;
+        if (newFieldName === lastFocusedFieldRef.current) {
+          return;
+        }
+        lastFocusedFieldRef.current = newFieldName;
+        const allTinaFields = document.querySelectorAll("[data-tina-field]");
+        allTinaFields.forEach((el) => {
+          el.removeAttribute("data-tina-field-focused");
+        });
+        if (newFieldName) {
+          let targetElement = document.querySelector(
+            `[data-tina-field="${newFieldName}"]`
+          );
+          if (!targetElement) {
+            const allFields = Array.from(allTinaFields);
+            targetElement = allFields.find((el) => {
+              const fieldValue = el.getAttribute("data-tina-field");
+              return fieldValue && fieldValue.endsWith(newFieldName.split("---")[1]);
+            });
           }
-          if (Array.isArray(item)) {
-            return;
+          if (targetElement) {
+            targetElement.setAttribute("data-tina-field-focused", "true");
+            const rect = targetElement.getBoundingClientRect();
+            const isInViewport = rect.top >= 0 && rect.left >= 0 && rect.bottom <= window.innerHeight && rect.right <= window.innerWidth;
+            if (!isInViewport) {
+              targetElement.scrollIntoView({
+                behavior: "smooth",
+                block: "center"
+              });
+            }
           }
-          const itemObject = item;
-          addMetadata(id, itemObject, [...path, key, index]);
-        });
-      } else {
-        if (isScalarOrUndefined(value)) {
-          return;
         }
-        const itemObject = value;
-        addMetadata(id, itemObject, [...path, key]);
       }
-    });
-    if ((object == null ? void 0 : object.type) === "root") {
-      return;
-    }
-    object._content_source = {
-      queryId: id,
-      path
     };
-    return object;
-  };
-  function isScalarOrUndefined(value) {
-    const type = typeof value;
-    if (type === "string")
-      return true;
-    if (type === "number")
-      return true;
-    if (type === "boolean")
-      return true;
-    if (type === "undefined")
-      return true;
-    if (value == null)
-      return true;
-    if (value instanceof String)
-      return true;
-    if (value instanceof Number)
-      return true;
-    if (value instanceof Boolean)
-      return true;
-    return false;
+    window.addEventListener("message", handleMessage);
+    return () => {
+      window.removeEventListener("message", handleMessage);
+      parent.postMessage({ type: "close", id }, window.location.origin);
+    };
+  }, [id, setQuickEditEnabled]);
+  return { data, isClient };
+}
+function useEditState() {
+  const [edit, setEdit] = React.useState(false);
+  React.useEffect(() => {
+    if (typeof window !== "undefined") {
+      parent.postMessage({ type: "isEditMode" }, window.location.origin);
+      window.addEventListener("message", (event) => {
+        var _a;
+        if (((_a = event.data) == null ? void 0 : _a.type) === "tina:editMode") {
+          setEdit(true);
+        }
+      });
+    }
+  }, []);
+  return { edit };
+}
+const tinaField = (object, property, index) => {
+  const contentSource = object == null ? void 0 : object._content_source;
+  if (!contentSource) {
+    return "";
   }
-  const hashFromQuery = (input) => {
-    let hash = 0;
-    for (let i = 0; i < input.length; i++) {
-      const char = input.charCodeAt(i);
-      hash = (hash << 5) - hash + char & 4294967295;
+  const { queryId, path } = contentSource;
+  if (!property) {
+    return `${queryId}---${path.join(".")}`;
+  }
+  const fullPath = typeof index === "number" ? [...path, property, index] : [...path, property];
+  return `${queryId}---${fullPath.join(".")}`;
+};
+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 {
+      transformedObj[key] = addMetadata(id, value, currentPath);
     }
-    const nonNegativeHash = Math.abs(hash);
-    const alphanumericHash = nonNegativeHash.toString(36);
-    return alphanumericHash;
-  };
-  exports2.addMetadata = addMetadata;
-  exports2.hashFromQuery = hashFromQuery;
-  exports2.tinaField = tinaField;
-  exports2.useEditState = useEditState;
-  exports2.useTina = useTina;
-  Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
-});
+  }
+  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;
+  if (type === "string")
+    return true;
+  if (type === "number")
+    return true;
+  if (type === "boolean")
+    return true;
+  if (type === "undefined")
+    return true;
+  if (value == null)
+    return true;
+  if (value instanceof String)
+    return true;
+  if (value instanceof Number)
+    return true;
+  if (value instanceof Boolean)
+    return true;
+  return false;
+}
+const hashFromQuery = (input) => {
+  let hash = 0;
+  for (let i = 0; i < input.length; i++) {
+    const char = input.charCodeAt(i);
+    hash = (hash << 5) - hash + char & 4294967295;
+  }
+  const nonNegativeHash = Math.abs(hash);
+  const alphanumericHash = nonNegativeHash.toString(36);
+  return alphanumericHash;
+};
+export {
+  addMetadata,
+  hashFromQuery,
+  tinaField,
+  useEditState,
+  useTina
+};