tinacms 3.3.0 → 3.3.2

package/dist/react.js

@@ -54,15 +54,6 @@ function useTina(props) {
           }
         }
         if (fieldName) {
-          if (lastHoveredField !== null) {
-            lastHoveredField = null;
-            if (isInTinaIframe) {
-              parent.postMessage(
-                { type: "field:hovered", fieldName: null },
-                window.location.origin
-              );
-            }
-          }
           if (isInTinaIframe) {
             parent.postMessage(
               { type: "field:selected", fieldName },
@@ -70,40 +61,6 @@ function useTina(props) {
             );
           }
         }
-      }, 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";
@@ -117,15 +74,6 @@ function useTina(props) {
           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;
@@ -146,19 +94,12 @@ function useTina(props) {
         [data-tina-field-overlay]:hover::after {
           opacity: 1;
         }
-        [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 () => {
         document.removeEventListener("click", mouseDownHandler, true);
-        document.removeEventListener("mouseenter", mouseEnterHandler, true);
         document.body.classList.remove("__tina-quick-editing-enabled");
         style.remove();
       };
@@ -172,7 +113,6 @@ function useTina(props) {
       });
     }
   }, [id]);
-  const lastFocusedFieldRef = React.useRef(null);
   React.useEffect(() => {
     const { experimental___selectFormByFormId, ...rest } = props;
     parent.postMessage({ type: "open", ...rest, id }, window.location.origin);
@@ -202,40 +142,6 @@ function useTina(props) {
           );
         }
       }
-      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 (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"
-              });
-            }
-          }
-        }
-      }
     };
     window.addEventListener("message", handleMessage);
     return () => {

package/dist/toolkit/components/active-field-indicator.d.ts

@@ -1,3 +1,2 @@
 import * as React from 'react';
 export declare const ActiveFieldIndicator: () => React.JSX.Element;
-export declare const HoveredFieldIndicator: () => React.JSX.Element;

package/dist/toolkit/fields/components/password-field.d.ts

@@ -4,6 +4,6 @@ export interface PasswordFieldProps extends a {
     error?: boolean;
     ref?: any;
 }
-export declare const passwordFieldClasses = "shadow-inner focus:shadow-outline focus:border-tina-orange-dark focus:outline-none block text-base placeholder:text-gray-300 px-3 py-2 text-gray-600 w-full bg-white border border-gray-200 transition-all ease-out duration-150 focus:text-gray-900 rounded";
+export declare const passwordFieldClasses = "shadow-inner focus:shadow-outline focus:border-blue-500 focus:outline-none block text-base placeholder:text-gray-300 px-3 py-2 text-gray-600 w-full bg-white border border-gray-200 transition-all ease-out duration-150 focus:text-gray-900 rounded";
 export declare const BasePasswordField: React.ForwardRefExoticComponent<Omit<PasswordFieldProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
 export {};

package/dist/toolkit/fields/components/select.d.ts

@@ -18,6 +18,6 @@ export interface SelectProps {
     options?: (Option | string)[];
     className?: string;
 }
-export declare const selectFieldClasses = "shadow appearance-none h-full bg-white block pl-3 pr-8 py-2 truncate w-full text-base cursor-pointer border border-gray-200 focus:outline-none focus:shadow-outline focus:ring-tina-orange-dark focus:border-tina-orange-dark sm:text-sm rounded";
+export declare const selectFieldClasses = "shadow appearance-none h-full bg-white block pl-3 pr-8 py-2 truncate w-full text-base cursor-pointer border border-gray-200 focus:outline-none focus:shadow-outline focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded";
 export declare const Select: React.FC<SelectProps>;
 export {};

package/dist/toolkit/fields/components/text-field.d.ts

@@ -4,6 +4,6 @@ export interface TextFieldProps extends a {
     error?: boolean;
     ref?: any;
 }
-export declare const textFieldClasses = "shadow-inner focus:shadow-outline focus:border-tina-orange-dark focus-visible:ring-0 focus:outline-none focus:ring-2 block text-base placeholder:text-gray-300 px-3 py-2 text-gray-600 w-full bg-white border border-gray-200 transition-all ease-out duration-150 focus:text-gray-900 rounded";
+export declare const textFieldClasses = "shadow-inner focus:shadow-outline focus:border-blue-500 focus:outline-none block text-base placeholder:text-gray-300 px-3 py-2 text-gray-600 w-full bg-white border border-gray-200 transition-all ease-out duration-150 focus:text-gray-900 rounded";
 export declare const BaseTextField: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
 export {};

package/dist/toolkit/fields/plugins/wrap-field-with-meta.d.ts

@@ -22,16 +22,12 @@ interface FieldMetaProps extends React.HTMLAttributes<HTMLElement> {
     index?: number;
     tinaForm: Form;
     field?: Field;
-    focusIntent?: boolean;
-    hoverIntent?: boolean;
 }
-export declare const FieldMeta: ({ name, label, description, error, margin, children, index, tinaForm, field, focusIntent, hoverIntent, ...props }: FieldMetaProps) => React.JSX.Element;
-export declare const FieldWrapper: ({ margin, children, field, "data-tina-field-active": dataActive, "data-tina-field-hovering": dataHovering, ...props }: {
+export declare const FieldMeta: ({ name, label, description, error, margin, children, index, tinaForm, field, ...props }: FieldMetaProps) => React.JSX.Element;
+export declare const FieldWrapper: ({ margin, children, field, ...props }: {
     margin: boolean;
     children: React.ReactNode;
     field?: Field;
-    "data-tina-field-active"?: string;
-    "data-tina-field-hovering"?: string;
 } & Partial<React.ComponentPropsWithoutRef<"div">>) => React.JSX.Element;
 export interface FieldLabel extends React.HTMLAttributes<HTMLLabelElement> {
     children?: any | any[];

package/dist/toolkit/form-builder/fields-builder.d.ts

@@ -3,11 +3,10 @@ import * as React from 'react';
 export interface FieldsBuilderProps {
     form: Form;
     activeFieldName?: string;
-    hoveringFieldName?: string;
     fields: Field[];
     padding?: boolean;
 }
-export declare function FieldsBuilder({ form, fields, activeFieldName, hoveringFieldName, padding, }: FieldsBuilderProps): React.JSX.Element;
+export declare function FieldsBuilder({ form, fields, activeFieldName, padding, }: FieldsBuilderProps): React.JSX.Element;
 export declare const FieldsGroup: ({ children, }: {
     children?: any | any[];
 }) => React.JSX.Element;

package/dist/toolkit/form-builder/form-builder.d.ts

@@ -5,7 +5,6 @@ export interface FormBuilderProps {
     form: {
         tinaForm: Form;
         activeFieldName?: string;
-        hoveringFieldName?: string;
     };
     hideFooter?: boolean;
     label?: string;

package/dist/toolkit/forms/field.d.ts

@@ -21,10 +21,9 @@ export interface Field<F extends Field = AnyField> {
      * a guarantee that the given field will receive focus since that functionality
      * needs to be built on a per-component basis.
      *
-     * This is also a one-way street. The "active field" for a given form isn't
+     * This is also a one-way stree. The "active field" for a given form isn't
      * necessarily updated when a user clicks on a new field. So you can have a
      * field which is marked as the active field, and have focus on another field
      */
-    focusIntent?: boolean;
-    hoverIntent?: boolean;
+    experimental_focusIntent?: boolean;
 }

package/dist/toolkit/tina-state.d.ts

@@ -1,24 +1,5 @@
 import { Form } from './react-tinacms';
 import { TinaCMS } from './tina-cms';
-export declare const ACTION_TYPES: {
-    readonly FORMS_ADD: "forms:add";
-    readonly FORMS_REMOVE: "forms:remove";
-    readonly FORMS_CLEAR: "forms:clear";
-    readonly FORMS_SET_ACTIVE_FORM_ID: "forms:set-active-form-id";
-    readonly FORMS_SET_ACTIVE_FIELD_NAME: "forms:set-active-field-name";
-    readonly FORMS_SET_HOVERED_FIELD_NAME: "forms:set-hovered-field-name";
-    readonly FORM_LISTS_ADD: "form-lists:add";
-    readonly FORM_LISTS_REMOVE: "form-lists:remove";
-    readonly FORM_LISTS_CLEAR: "form-lists:clear";
-    readonly SET_EDIT_MODE: "set-edit-mode";
-    readonly INCREMENT_OPERATION_INDEX: "increment-operation-index";
-    readonly SET_QUICK_EDITING_SUPPORTED: "set-quick-editing-supported";
-    readonly SET_QUICK_EDITING_ENABLED: "set-quick-editing-enabled";
-    readonly TOGGLE_QUICK_EDITING_ENABLED: "toggle-quick-editing-enabled";
-    readonly TOGGLE_EDIT_STATE: "toggle-edit-state";
-    readonly SIDEBAR_SET_DISPLAY_STATE: "sidebar:set-display-state";
-    readonly SIDEBAR_SET_LOADING_STATE: "sidebar:set-loading-state";
-};
 type FormListItem = {
     type: 'document';
     path: string;
@@ -41,56 +22,50 @@ type Breadcrumb = {
     namespace: string[];
 };
 export type TinaAction = {
-    type: typeof ACTION_TYPES.FORMS_ADD;
+    type: 'forms:add';
     value: Form;
 } | {
-    type: typeof ACTION_TYPES.FORMS_REMOVE;
+    type: 'forms:remove';
     value: string;
 } | {
-    type: typeof ACTION_TYPES.FORMS_CLEAR;
+    type: 'forms:clear';
 } | {
-    type: typeof ACTION_TYPES.FORM_LISTS_ADD;
+    type: 'form-lists:add';
     value: FormList;
 } | {
-    type: typeof ACTION_TYPES.FORM_LISTS_REMOVE;
+    type: 'form-lists:remove';
     value: string;
 } | {
-    type: typeof ACTION_TYPES.FORMS_SET_ACTIVE_FORM_ID;
+    type: 'forms:set-active-form-id';
     value: string;
 } | {
-    type: typeof ACTION_TYPES.FORMS_SET_ACTIVE_FIELD_NAME;
+    type: 'forms:set-active-field-name';
     value: {
         formId: string;
         fieldName: string;
     };
 } | {
-    type: typeof ACTION_TYPES.FORMS_SET_HOVERED_FIELD_NAME;
-    value: {
-        formId: string;
-        fieldName: string | null;
-    };
-} | {
-    type: typeof ACTION_TYPES.FORM_LISTS_CLEAR;
+    type: 'form-lists:clear';
 } | {
-    type: typeof ACTION_TYPES.SET_EDIT_MODE;
+    type: 'set-edit-mode';
     value: 'visual' | 'basic';
 } | {
-    type: typeof ACTION_TYPES.INCREMENT_OPERATION_INDEX;
+    type: 'increment-operation-index';
 } | {
-    type: typeof ACTION_TYPES.SET_QUICK_EDITING_SUPPORTED;
+    type: 'set-quick-editing-supported';
     value: boolean;
 } | {
-    type: typeof ACTION_TYPES.SET_QUICK_EDITING_ENABLED;
+    type: 'set-quick-editing-enabled';
     value?: boolean;
 } | {
-    type: typeof ACTION_TYPES.TOGGLE_QUICK_EDITING_ENABLED;
+    type: 'toggle-quick-editing-enabled';
 } | {
-    type: typeof ACTION_TYPES.TOGGLE_EDIT_STATE;
+    type: 'toggle-edit-state';
 } | {
-    type: typeof ACTION_TYPES.SIDEBAR_SET_DISPLAY_STATE;
+    type: 'sidebar:set-display-state';
     value: TinaState['sidebarDisplayState'] | 'openOrFull';
 } | {
-    type: typeof ACTION_TYPES.SIDEBAR_SET_LOADING_STATE;
+    type: 'sidebar:set-loading-state';
     value: boolean;
 };
 export interface TinaState {
@@ -108,7 +83,6 @@ export interface TinaState {
     forms: {
         activeFieldName?: string | null;
         tinaForm: Form;
-        hoveringFieldName?: string | null;
     }[];
     formLists: FormList[];
     editingMode: 'visual' | 'basic';

package/package.json

@@ -2,7 +2,7 @@
   "name": "tinacms",
   "type": "module",
   "typings": "dist/index.d.ts",
-  "version": "3.3.0",
+  "version": "3.3.2",
   "main": "dist/index.js",
   "module": "./dist/index.js",
   "exports": {
@@ -110,9 +110,9 @@
     "webfontloader": "1.6.28",
     "yup": "^1.6.1",
     "zod": "^3.24.2",
-    "@tinacms/mdx": "2.0.3",
-    "@tinacms/schema-tools": "2.3.0",
-    "@tinacms/search": "1.2.0"
+    "@tinacms/mdx": "2.0.4",
+    "@tinacms/search": "1.2.1",
+    "@tinacms/schema-tools": "2.4.0"
   },
   "devDependencies": {
     "@graphql-tools/utils": "^10.8.1",