@uniformdev/mesh-sdk-react 20.73.0 → 20.74.1

package/dist/index.esm.js

@@ -2347,7 +2347,7 @@ import { AutoFocusPlugin } from "@lexical/react/LexicalAutoFocusPlugin";
 import { ClearEditorPlugin } from "@lexical/react/LexicalClearEditorPlugin";
 import { LexicalComposer } from "@lexical/react/LexicalComposer";
 import { OnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
-import { useMemo as useMemo9, useRef as useRef5, useState as useState6 } from "react";
+import { useEffect as useEffect10, useMemo as useMemo9, useRef as useRef5, useState as useState6 } from "react";
 
 // src/components/Variables/composer/DisablePlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext7 } from "@lexical/react/LexicalComposerContext";
@@ -2374,6 +2374,13 @@ function SingleLineTextPlugin() {
   return null;
 }
 
+// src/components/Variables/toolbox/useVariablesComposerFlushPending.ts
+import { createContext as createContext5, useContext as useContext5 } from "react";
+var VariablesComposerFlushPendingContext = createContext5(false);
+function useVariablesComposerFlushPending() {
+  return useContext5(VariablesComposerFlushPendingContext);
+}
+
 // src/components/Variables/toolbox/VariablesComposer.tsx
 import { Fragment as Fragment5, jsx as jsx26, jsxs as jsxs10 } from "@emotion/react/jsx-runtime";
 function VariablesComposer(props) {
@@ -2388,6 +2395,7 @@ function VariablesComposer(props) {
     ...variablesPluginProps
   } = props;
   const [lastEmittedValue, setLastEmittedValue] = useState6(value);
+  const [flushPending, setFlushPending] = useState6(false);
   const editorConfig = useMemo9(
     () => ({
       namespace: "uniform",
@@ -2402,6 +2410,24 @@ function VariablesComposer(props) {
   );
   const editorState = useRef5(void 0);
   const updateTimeout = useRef5(void 0);
+  const flushDepsRef = useRef5({ onChange, lastEmittedValue });
+  flushDepsRef.current = { onChange, lastEmittedValue };
+  useEffect10(
+    () => () => {
+      if (!updateTimeout.current) {
+        return;
+      }
+      clearTimeout(updateTimeout.current);
+      const { onChange: emit, lastEmittedValue: lastEmitted } = flushDepsRef.current;
+      const valueToEmit = editorState.current ? serializeVariablesEditorState(editorState.current) : void 0;
+      const shouldEmit = editorState.current != null && valueToEmit !== lastEmitted;
+      if (!shouldEmit) {
+        return;
+      }
+      queueMicrotask(() => emit(valueToEmit));
+    },
+    []
+  );
   if (typeof document === "undefined") return null;
   return /* @__PURE__ */ jsxs10(LexicalComposer, { initialConfig: editorConfig, children: [
     /* @__PURE__ */ jsx26(
@@ -2413,6 +2439,7 @@ function VariablesComposer(props) {
           if (updateTimeout.current) {
             clearTimeout(updateTimeout.current);
           }
+          setFlushPending(true);
           updateTimeout.current = window.setTimeout(() => {
             if (editorState.current) {
               const valueToEmit = serializeVariablesEditorState(editorState.current);
@@ -2421,6 +2448,8 @@ function VariablesComposer(props) {
                 onChange(valueToEmit);
               }
             }
+            setFlushPending(false);
+            updateTimeout.current = void 0;
           }, 400);
         }
       }
@@ -2430,7 +2459,7 @@ function VariablesComposer(props) {
     /* @__PURE__ */ jsx26(VariablesPlugin, { ...variablesPluginProps }),
     /* @__PURE__ */ jsx26(DisablePlugin, { disabled }),
     /* @__PURE__ */ jsx26(Fragment5, { children: autoFocus ? /* @__PURE__ */ jsx26(AutoFocusPlugin, {}) : null }),
-    /* @__PURE__ */ jsx26(Fragment5, { children })
+    /* @__PURE__ */ jsx26(VariablesComposerFlushPendingContext.Provider, { value: flushPending, children })
   ] });
 }
 
@@ -2455,18 +2484,27 @@ import {
   CUT_COMMAND,
   PASTE_COMMAND as PASTE_COMMAND2
 } from "lexical";
-import { useEffect as useEffect10 } from "react";
+import { useEffect as useEffect11 } from "react";
 import { Fragment as Fragment6, jsx as jsx27, jsxs as jsxs11 } from "@emotion/react/jsx-runtime";
 function VariablesComposerInput({
   css: css24,
   placeholder,
   ...contentEditableProps
 }) {
+  const flushPending = useVariablesComposerFlushPending();
   return /* @__PURE__ */ jsxs11("div", { children: [
     /* @__PURE__ */ jsx27(
       PlainTextPlugin,
       {
-        contentEditable: /* @__PURE__ */ jsx27(ContentEditable, { ...contentEditableProps, placeholder: null, "aria-placeholder": void 0 }),
+        contentEditable: /* @__PURE__ */ jsx27(
+          ContentEditable,
+          {
+            ...contentEditableProps,
+            "data-flush-pending": flushPending,
+            placeholder: null,
+            "aria-placeholder": void 0
+          }
+        ),
         placeholder: placeholder ? /* @__PURE__ */ jsx27(Fragment6, { children: placeholder }) : null,
         ErrorBoundary: LexicalErrorBoundary
       }
@@ -2477,7 +2515,7 @@ function VariablesComposerInput({
 }
 function RichishCopyAndPastePlugin() {
   const [editor] = useLexicalComposerContext9();
-  useEffect10(() => {
+  useEffect11(() => {
     return mergeRegister4(
       editor.registerCommand(
         COPY_COMMAND,
@@ -2794,7 +2832,7 @@ import { useCallback as useCallback4 } from "react";
 import { useLexicalComposerContext as useLexicalComposerContext10 } from "@lexical/react/LexicalComposerContext";
 import { mergeRegister as mergeRegister5 } from "@lexical/utils";
 import { $getNodeByKey as $getNodeByKey3, COMMAND_PRIORITY_HIGH as COMMAND_PRIORITY_HIGH3 } from "lexical";
-import { useEffect as useEffect11, useRef as useRef6 } from "react";
+import { useEffect as useEffect12, useRef as useRef6 } from "react";
 function OnDisconnectPlugin({
   onDisconnect
 }) {
@@ -2802,7 +2840,7 @@ function OnDisconnectPlugin({
   const { variables } = useVariables(true);
   const variablesRef = useRef6(variables);
   variablesRef.current = variables;
-  useEffect11(() => {
+  useEffect12(() => {
     return mergeRegister5(
       editor.registerCommand(
         DISCONNECT_VARIABLE_COMMAND,
@@ -3986,7 +4024,7 @@ function convertRequestDataToDataType(dataType, requestData) {
 
 // src/components/Delegation/DelegationGate.tsx
 import { Callout as Callout3, LoadingOverlay } from "@uniformdev/design-system";
-import { useEffect as useEffect12 } from "react";
+import { useEffect as useEffect13 } from "react";
 
 // src/components/Delegation/styles/DelegationGate.style.ts
 import { css as css14 } from "@emotion/react";
@@ -4004,7 +4042,7 @@ function DefaultDelegationDisabled() {
   return /* @__PURE__ */ jsx46(Callout3, { type: "caution", title: "Feature unavailable", children: "This app requires permissions that are not currently enabled. Please contact your Uniform administrator to enable identity delegation for this integration." });
 }
 function DefaultDelegationError({ error }) {
-  useEffect12(() => {
+  useEffect13(() => {
     console.error("Delegation connection failed", error);
   }, [error]);
   return /* @__PURE__ */ jsx46(Callout3, { type: "error", title: "Connection error", children: /* @__PURE__ */ jsx46("p", { children: "Failed to connect to Uniform. Try again, or contact your administrator if the problem persists." }) });
@@ -4039,7 +4077,7 @@ function DelegationGate({
 }
 
 // src/components/Delegation/DelegationProvider.tsx
-import { useCallback as useCallback5, useEffect as useEffect13, useMemo as useMemo13, useRef as useRef7, useState as useState11 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect14, useMemo as useMemo13, useRef as useRef7, useState as useState11 } from "react";
 import { jsx as jsx47 } from "@emotion/react/jsx-runtime";
 var DelegationDisabledError = class extends Error {
   constructor() {
@@ -4110,7 +4148,7 @@ function DelegationProvider({
     });
     return acquirePromiseRef.current;
   }, [sdk, onSessionToken, checkActive]);
-  useEffect13(() => {
+  useEffect14(() => {
     mountedRef.current = true;
     void acquire().catch(() => {
     });
@@ -4137,7 +4175,7 @@ function DelegationProvider({
     } catch (e) {
     }
   }, [checkActive, acquire]);
-  useEffect13(() => {
+  useEffect14(() => {
     if (!revalidateOnFocus) {
       return;
     }
@@ -4172,12 +4210,12 @@ import { IconsProvider, LoadingIndicator as LoadingIndicator2, Theme as Theme2 }
 
 // src/hooks/useInitializeUniformMeshSdk.ts
 import { initializeUniformMeshSDK } from "@uniformdev/mesh-sdk";
-import { useEffect as useEffect14, useRef as useRef8, useState as useState12 } from "react";
+import { useEffect as useEffect15, useRef as useRef8, useState as useState12 } from "react";
 var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
   const [error, setError] = useState12();
   const [sdk, setSdk] = useState12();
   const initializationInProgress = useRef8(false);
-  useEffect14(
+  useEffect15(
     () => {
       if (typeof window === "undefined" || sdk) {
         return;
@@ -4265,15 +4303,15 @@ import { Callout as Callout4, Container, ScrollableList, VerticalRhythm as Verti
 // src/components/ObjectSearch/hooks/ObjectSearchContext.tsx
 import { bindVariablesToObject as bindVariablesToObject2 } from "@uniformdev/canvas";
 import {
-  createContext as createContext6,
+  createContext as createContext7,
   useCallback as useCallback6,
-  useContext as useContext6,
+  useContext as useContext7,
   useDeferredValue,
   useMemo as useMemo14,
   useState as useState13
 } from "react";
 import { jsx as jsx50 } from "@emotion/react/jsx-runtime";
-var ObjectSearchContext = createContext6({
+var ObjectSearchContext = createContext7({
   onSetQuery: () => {
   },
   onSelectItem: () => {
@@ -4366,7 +4404,7 @@ var ObjectSearchProvider = ({
   return /* @__PURE__ */ jsx50(ObjectSearchContext.Provider, { value, children });
 };
 function useObjectSearchContext() {
-  return useContext6(ObjectSearchContext);
+  return useContext7(ObjectSearchContext);
 }
 function bindQuery(query, inputs) {
   const { result, errors } = bindVariablesToObject2({
@@ -5074,7 +5112,7 @@ function ObjectSearchResultList({
 
 // src/components/ObjectSearch/QueryFilter.tsx
 import { DebouncedInputKeywordSearch as DebouncedInputKeywordSearch2, Input as Input4, InputSelect as InputSelect4, VerticalRhythm as VerticalRhythm4 } from "@uniformdev/design-system";
-import { useEffect as useEffect15, useState as useState15 } from "react";
+import { useEffect as useEffect16, useState as useState15 } from "react";
 import { jsx as jsx59, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
 var QueryFilter = ({
   requireContentType,
@@ -5114,7 +5152,7 @@ var QueryFilter = ({
     setQueryState((prev) => ({ ...prev, ...value }));
     onSetQuery({ ...query, ...value });
   };
-  useEffect15(() => {
+  useEffect16(() => {
     onSetQuery(queryState);
   }, []);
   return /* @__PURE__ */ jsxs29("fieldset", { children: [
@@ -5240,7 +5278,7 @@ var QueryFilter = ({
 };
 
 // src/components/ParamTypeDynamicDataProvider.tsx
-import { useEffect as useEffect16, useMemo as useMemo16, useRef as useRef9 } from "react";
+import { useEffect as useEffect17, useMemo as useMemo16, useRef as useRef9 } from "react";
 import { jsx as jsx60 } from "@emotion/react/jsx-runtime";
 function ParamTypeDynamicDataProvider(props) {
   const { children } = props;
@@ -5264,7 +5302,7 @@ var JsonMeshVariableEditor = ({
 }) => {
   const sillyRef = useRef9(false);
   const { editConnectedData } = useMeshLocation("paramType");
-  useEffect16(() => {
+  useEffect17(() => {
     if (sillyRef.current) {
       return;
     }
@@ -5764,7 +5802,7 @@ var DateEditor = ({
 
 // src/components/SearchAndFilter/editors/DateRangeEditor.tsx
 import { Input as Input6 } from "@uniformdev/design-system";
-import { useEffect as useEffect17, useState as useState17 } from "react";
+import { useEffect as useEffect18, useState as useState17 } from "react";
 import { useDebounce as useDebounce3 } from "react-use";
 
 // src/components/SearchAndFilter/editors/shared/ErrorContainer.tsx
@@ -5814,7 +5852,7 @@ var DateRangeEditor = ({
     500,
     [minDateValue, maxDateValue]
   );
-  useEffect17(() => {
+  useEffect18(() => {
     if (!minDateValue || !maxDateValue) {
       return;
     }
@@ -6028,7 +6066,7 @@ var NumberEditor = ({
 
 // src/components/SearchAndFilter/editors/NumberRangeEditor.tsx
 import { Input as Input8 } from "@uniformdev/design-system";
-import { useEffect as useEffect18, useState as useState19 } from "react";
+import { useEffect as useEffect19, useState as useState19 } from "react";
 import { useDebounce as useDebounce5 } from "react-use";
 import { Fragment as Fragment13, jsx as jsx67, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
 var NumberRangeEditor = ({
@@ -6053,7 +6091,7 @@ var NumberRangeEditor = ({
     500,
     [minValue, maxValue]
   );
-  useEffect18(() => {
+  useEffect19(() => {
     if (!maxValue && !minValue) {
       return;
     }
@@ -6624,18 +6662,18 @@ import { CgClose } from "@react-icons/all-files/cg/CgClose";
 import { hasReferencedVariables as hasReferencedVariables2 } from "@uniformdev/canvas";
 import { Icon as Icon3, InputKeywordSearch } from "@uniformdev/design-system";
 import { CLEAR_EDITOR_COMMAND as CLEAR_EDITOR_COMMAND2 } from "lexical";
-import { useEffect as useEffect20, useRef as useRef10, useState as useState22 } from "react";
+import { useEffect as useEffect21, useRef as useRef10, useState as useState22 } from "react";
 import { useDebounce as useDebounce7 } from "react-use";
 import { v4 as v42 } from "uuid";
 
 // src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
 import { VerticalRhythm as VerticalRhythm5 } from "@uniformdev/design-system";
 import {
-  createContext as createContext7,
+  createContext as createContext8,
   useCallback as useCallback7,
-  useContext as useContext7,
+  useContext as useContext8,
   useDeferredValue as useDeferredValue2,
-  useEffect as useEffect19,
+  useEffect as useEffect20,
   useMemo as useMemo22,
   useState as useState21
 } from "react";
@@ -6714,7 +6752,7 @@ var bindableFiltersMapper = {
 
 // src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
 import { jsx as jsx75 } from "@emotion/react/jsx-runtime";
-var SearchAndFilterContext = createContext7({
+var SearchAndFilterContext = createContext8({
   searchTerm: "",
   setSearchTerm: () => {
   },
@@ -6796,7 +6834,7 @@ var SearchAndFilterProvider = ({
       return filters;
     }
   }, [filters]);
-  useEffect19(() => {
+  useEffect20(() => {
     if (filterVisibility) {
       const handleEscKeyFilterClose = (e) => {
         if (e.key === "Escape") {
@@ -6834,7 +6872,7 @@ var SearchAndFilterProvider = ({
   );
 };
 var useSearchAndFilter = () => {
-  const value = useContext7(SearchAndFilterContext);
+  const value = useContext8(SearchAndFilterContext);
   return { ...value };
 };
 
@@ -6865,7 +6903,7 @@ var FilterControls = ({
     300,
     [localSearchTerm]
   );
-  useEffect20(() => {
+  useEffect21(() => {
     if (searchTerm === "") {
       setLocalSearchTerm("");
       setIdToResetInputVariables(`data-resource-search-term-input-${v42()}`);
@@ -7142,7 +7180,7 @@ import { Icon as Icon5 } from "@uniformdev/design-system";
 
 // src/components/SearchAndFilter/FilterMenu.tsx
 import { HorizontalRhythm as HorizontalRhythm8, VerticalRhythm as VerticalRhythm6 } from "@uniformdev/design-system";
-import React8, { useEffect as useEffect21 } from "react";
+import React8, { useEffect as useEffect22 } from "react";
 import { jsx as jsx78, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterOptionsContainer2 = ({
   buttonRow,
@@ -7175,7 +7213,7 @@ var FilterMenu = ({
 }) => {
   const { filterVisibility, setFilterVisibility, handleResetFilters, filters } = useSearchAndFilter();
   const innerMenuRef = React8.useRef(null);
-  useEffect21(() => {
+  useEffect22(() => {
     var _a;
     if (filterVisibility) {
       (_a = innerMenuRef.current) == null ? void 0 : _a.focus();
@@ -7524,10 +7562,10 @@ var SearchAndFilter = ({
 
 // src/components/SearchAndFilter/SearchOnlyFilter.tsx
 import { InputKeywordSearch as InputKeywordSearch2 } from "@uniformdev/design-system";
-import { createContext as createContext8, useState as useState23 } from "react";
+import { createContext as createContext9, useState as useState23 } from "react";
 import { useDebounce as useDebounce8 } from "react-use";
 import { jsx as jsx82 } from "@emotion/react/jsx-runtime";
-var SearchOnlyContext = createContext8({
+var SearchOnlyContext = createContext9({
   searchTerm: "",
   setSearchTerm: () => {
   }
@@ -7935,7 +7973,7 @@ function createLocationValidator(setValue, validate) {
 
 // src/utils/useContentDataResourceLocaleInfo.ts
 import { bindVariables as bindVariables2, createVariableReference as createVariableReference4, LOCALE_DYNAMIC_INPUT_NAME as LOCALE_DYNAMIC_INPUT_NAME2 } from "@uniformdev/canvas";
-import { useEffect as useEffect22, useRef as useRef11 } from "react";
+import { useEffect as useEffect23, useRef as useRef11 } from "react";
 function useContentDataResourceLocaleInfo({
   locale,
   defaultLocale,
@@ -7948,7 +7986,7 @@ function useContentDataResourceLocaleInfo({
   const { flatVariables } = useVariables();
   const effectiveLocale = locale != null ? locale : dynamicInputs[LOCALE_DYNAMIC_INPUT_NAME2] ? createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2) : defaultLocale != null ? defaultLocale : "";
   const boundLocale = (_a = bindVariables2({ variables: flatVariables, value: effectiveLocale }).result) != null ? _a : effectiveLocale;
-  useEffect22(() => {
+  useEffect23(() => {
     if (locale === void 0 && effectiveLocale && setLocaleRef.current) {
       setLocaleRef.current(effectiveLocale);
     }