@uniformdev/mesh-sdk-react 20.72.3-alpha.2 → 20.72.3-alpha.23

package/dist/index.esm.js

@@ -249,6 +249,40 @@ var SvgPlus = (props) => /* @__PURE__ */ jsx14(
 );
 var Plus_default = SvgPlus;
 
+// src/hooks/createDelegationFetch.ts
+import { CSRF_HEADER_NAME, CSRF_HEADER_VALUE, DELEGATION_EXPIRED_CODE } from "@uniformdev/mesh-sdk";
+async function isDelegationExpiredResponse(response) {
+  if (response.status !== 401) {
+    return false;
+  }
+  try {
+    const body = await response.clone().json();
+    return typeof body.code === "string" && body.code === DELEGATION_EXPIRED_CODE;
+  } catch (e) {
+    return false;
+  }
+}
+function createDelegationFetch(options) {
+  var _a, _b;
+  const fetchFn = (_a = options.fetch) != null ? _a : fetch;
+  const isExpired = (_b = options.isDelegationExpired) != null ? _b : isDelegationExpiredResponse;
+  return async (input3, init) => {
+    const headers = new Headers(init == null ? void 0 : init.headers);
+    headers.set(CSRF_HEADER_NAME, CSRF_HEADER_VALUE);
+    const initWithCsrf = { ...init, headers };
+    const response = await fetchFn(input3, initWithCsrf);
+    if (!await isExpired(response)) {
+      return response;
+    }
+    try {
+      await options.reacquire();
+    } catch (e) {
+      return response;
+    }
+    return fetchFn(input3, initWithCsrf);
+  };
+}
+
 // src/hooks/useConnectedDataAsVariables.tsx
 import { useMemo } from "react";
 function useConnectedDataAsVariables(connectedData) {
@@ -267,12 +301,44 @@ function useConnectedDataAsVariables(connectedData) {
   );
 }
 
+// src/hooks/useDelegation.ts
+import { useContext } from "react";
+
+// src/components/Delegation/DelegationContext.ts
+import { createContext } from "react";
+var DelegationContext = createContext(null);
+
+// src/hooks/useDelegation.ts
+function useDelegation() {
+  const ctx = useContext(DelegationContext);
+  if (!ctx) {
+    throw new Error("useDelegation must be used within a <DelegationProvider>");
+  }
+  return ctx;
+}
+
+// src/hooks/useDelegationFetch.ts
+import { useMemo as useMemo2 } from "react";
+function useDelegationFetch(options) {
+  const { reacquire } = useDelegation();
+  const fetchImpl = options == null ? void 0 : options.fetch;
+  const isDelegationExpired = options == null ? void 0 : options.isDelegationExpired;
+  return useMemo2(
+    () => createDelegationFetch({
+      reacquire,
+      fetch: fetchImpl,
+      isDelegationExpired
+    }),
+    [reacquire, fetchImpl, isDelegationExpired]
+  );
+}
+
 // src/hooks/useDynamicInputsAsVariables.tsx
 import { LOCALE_DYNAMIC_INPUT_NAME } from "@uniformdev/canvas";
-import { useMemo as useMemo2 } from "react";
+import { useMemo as useMemo3 } from "react";
 import { Fragment, jsx as jsx15 } from "@emotion/react/jsx-runtime";
 function useDynamicInputsAsVariables(dynamicInputs) {
-  return useMemo2(() => {
+  return useMemo3(() => {
     const result = Object.entries(dynamicInputs).reduce(
       (acc, [name2, input3]) => {
         const source = `from ${name2 === LOCALE_DYNAMIC_INPUT_NAME ? "current locale" : input3.type === "path" ? "URL path" : "query string"}`;
@@ -307,18 +373,18 @@ Current preview value: ${input3.value || "not provided"}`
 }
 
 // src/hooks/useMeshLocation.ts
-import { useMemo as useMemo4, useRef } from "react";
+import { useMemo as useMemo5, useRef } from "react";
 
 // src/components/UniformMeshLocationContext.tsx
-import { createContext as createContext2, useContext as useContext2, useMemo as useMemo3, useState } from "react";
+import { createContext as createContext3, useContext as useContext3, useMemo as useMemo4, useState } from "react";
 
 // src/components/UniformMeshSdkContext.tsx
 import { Theme } from "@uniformdev/design-system";
-import { createContext, useContext } from "react";
+import { createContext as createContext2, useContext as useContext2 } from "react";
 import { jsx as jsx16, jsxs as jsxs4 } from "@emotion/react/jsx-runtime";
-var UniformMeshSdkContext = createContext(void 0);
+var UniformMeshSdkContext = createContext2(void 0);
 var useUniformMeshSdkContext = () => {
-  const context = useContext(UniformMeshSdkContext);
+  const context = useContext2(UniformMeshSdkContext);
   if (!context) {
     throw new Error("useUniformMeshSdkContext must be used within <MeshApp /> or <UniformMeshSdkContext />");
   }
@@ -333,13 +399,13 @@ function useUniformMeshSdk() {
 
 // src/components/UniformMeshLocationContext.tsx
 import { jsx as jsx17 } from "@emotion/react/jsx-runtime";
-var UniformMeshLocationContext = createContext2(void 0);
+var UniformMeshLocationContext = createContext3(void 0);
 var UniformMeshLocationContextProvider = ({
   children
 }) => {
   const sdk = useUniformMeshSdk();
   const [location, setLocation] = useState(sdk.getCurrentLocation());
-  useMemo3(() => {
+  useMemo4(() => {
     const valueChangeListener = (event) => {
       setLocation((old) => ({ ...old, value: event.newValue }));
     };
@@ -356,7 +422,7 @@ var UniformMeshLocationContextProvider = ({
   return /* @__PURE__ */ jsx17(UniformMeshLocationContext.Provider, { value: { location }, children });
 };
 var useUniformMeshLocationContext = () => {
-  const context = useContext2(UniformMeshLocationContext);
+  const context = useContext3(UniformMeshLocationContext);
   if (!context) {
     throw new Error("useUniformMeshLocationContext must be used within a UniformMeshLocationContextProvider");
   }
@@ -371,7 +437,7 @@ function useMeshLocation(expectedLocation) {
   }
   const backdoorLocation = useRef(location);
   backdoorLocation.current = location;
-  const stabilizedSetValueProxy = useMemo4(
+  const stabilizedSetValueProxy = useMemo5(
     () => (dispatch) => {
       const { newValue, options } = dispatch(backdoorLocation.current.value);
       backdoorLocation.current.setValue(newValue, options);
@@ -688,7 +754,7 @@ import {
   createCommand,
   SKIP_DOM_SELECTION_TAG
 } from "lexical";
-import { useCallback as useCallback2, useEffect as useEffect4, useMemo as useMemo6, useRef as useRef3, useState as useState4 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect4, useMemo as useMemo7, useRef as useRef3, useState as useState4 } from "react";
 import { createPortal } from "react-dom";
 
 // src/components/Variables/toolbox/SelectVariableMenu.styles.ts
@@ -722,7 +788,7 @@ var variablesTipText = css`
 
 // src/components/Variables/VariablesProvider.tsx
 import mitt from "mitt";
-import { createContext as createContext3, useContext as useContext3, useEffect as useEffect3, useMemo as useMemo5, useState as useState3 } from "react";
+import { createContext as createContext4, useContext as useContext4, useEffect as useEffect3, useMemo as useMemo6, useState as useState3 } from "react";
 
 // src/components/Variables/util/useVariableEditTransaction.ts
 import { useCallback, useEffect as useEffect2, useState as useState2 } from "react";
@@ -911,7 +977,7 @@ function VariableEditor({
 
 // src/components/Variables/VariablesProvider.tsx
 import { jsx as jsx20, jsxs as jsxs6 } from "@emotion/react/jsx-runtime";
-var VariablesContext = createContext3(null);
+var VariablesContext = createContext4(null);
 function VariablesProvider({
   value,
   onChange,
@@ -924,7 +990,7 @@ function VariablesProvider({
 }) {
   const [editing, setEditing] = useState3();
   const [editingContext, setEditingContext] = useState3();
-  const events = useMemo5(
+  const events = useMemo6(
     () => mitt(),
     []
   );
@@ -932,7 +998,7 @@ function VariablesProvider({
     throw new Error("onChange must be provided when readOnly is false");
   }
   const Editor = editVariableComponent != null ? editVariableComponent : VariableEditor;
-  const valueBasedContextValue = useMemo5(
+  const valueBasedContextValue = useMemo6(
     () => ({
       flatVariables: flattenVariables(value),
       dispatch: (event) => {
@@ -976,7 +1042,7 @@ function VariablesProvider({
     isEditing: typeof editing !== "undefined",
     variables: value
   });
-  const contextValue = useMemo5(() => {
+  const contextValue = useMemo6(() => {
     return {
       ...valueBasedContextValue,
       editVariableTxn,
@@ -1036,7 +1102,7 @@ function VariablesProvider({
   ] });
 }
 function useVariables(returnEmptyWithoutProvider = false) {
-  const context = useContext3(VariablesContext);
+  const context = useContext4(VariablesContext);
   if (!context) {
     if (returnEmptyWithoutProvider) {
       return {
@@ -1184,7 +1250,7 @@ function useVariablesMenu({
     [canDispatch, enableEditingVariables, readOnly]
   );
   const canAddVariable = canDispatch && showAddVariableMenuOption && !readOnly;
-  const { groupedVariables, menuOptions } = useMemo6(() => {
+  const { groupedVariables, menuOptions } = useMemo7(() => {
     const groupedVariables2 = variablesToGroupedList(variables, filterVariable, getEditorContext == null ? void 0 : getEditorContext());
     if (canAddVariable) {
       groupedVariables2.unshift({
@@ -1271,7 +1337,7 @@ function VariablesPlugin({
     filterVariable,
     getEditorContext
   });
-  const { filteredGroupedVariables, filteredMenuOptions } = useMemo6(() => {
+  const { filteredGroupedVariables, filteredMenuOptions } = useMemo7(() => {
     if (!queryString) {
       return {
         filteredGroupedVariables: groupedVariables,
@@ -2051,7 +2117,7 @@ var inputMultiLine = (lines) => css5`
 
 // src/components/Variables/toolbox/InputVariablesProvider.tsx
 import { hasReferencedVariables } from "@uniformdev/canvas";
-import { useEffect as useEffect7, useMemo as useMemo7, useState as useState5 } from "react";
+import { useEffect as useEffect7, useMemo as useMemo8, useState as useState5 } from "react";
 function useInputVariablesState({
   value,
   onChange,
@@ -2083,7 +2149,7 @@ function useInputVariablesState({
   const hadVariablesInValueForReals = inputWhenNoVariables ? hadVariablesInValue : variableReferenceCountInValue > 0;
   const disableVariablesForReals = disableVariables || Object.keys(variables).length === 0 && !showAddVariableMenuOption;
   const disableResetForReals = !inputWhenNoVariables || !hadVariablesInValueForReals;
-  const sharedMenuProps = useMemo7(
+  const sharedMenuProps = useMemo8(
     () => ({
       menuTooltip,
       showAddVariableMenuOption,
@@ -2281,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 useMemo8, 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";
@@ -2308,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) {
@@ -2322,7 +2395,8 @@ function VariablesComposer(props) {
     ...variablesPluginProps
   } = props;
   const [lastEmittedValue, setLastEmittedValue] = useState6(value);
-  const editorConfig = useMemo8(
+  const [flushPending, setFlushPending] = useState6(false);
+  const editorConfig = useMemo9(
     () => ({
       namespace: "uniform",
       onError(error) {
@@ -2336,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(
@@ -2347,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);
@@ -2355,6 +2448,8 @@ function VariablesComposer(props) {
                 onChange(valueToEmit);
               }
             }
+            setFlushPending(false);
+            updateTimeout.current = void 0;
           }, 400);
         }
       }
@@ -2364,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 })
   ] });
 }
 
@@ -2389,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: css23,
+  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
       }
@@ -2411,7 +2515,7 @@ function VariablesComposerInput({
 }
 function RichishCopyAndPastePlugin() {
   const [editor] = useLexicalComposerContext9();
-  useEffect10(() => {
+  useEffect11(() => {
     return mergeRegister4(
       editor.registerCommand(
         COPY_COMMAND,
@@ -2666,7 +2770,7 @@ function InputVariablesOverlayMenu({
 import { CgUsbC as CgUsbC2 } from "@react-icons/all-files/cg/CgUsbC";
 import { bindVariablesToObject } from "@uniformdev/canvas";
 import { HorizontalRhythm as HorizontalRhythm5, Menu as Menu2 } from "@uniformdev/design-system";
-import { useMemo as useMemo9 } from "react";
+import { useMemo as useMemo10 } from "react";
 import { jsx as jsx29, jsxs as jsxs13 } from "@emotion/react/jsx-runtime";
 function ParameterConnectionIndicator({
   children,
@@ -2677,7 +2781,7 @@ function ParameterConnectionIndicator({
   overrideMenuButtonParentMargin,
   renderMenuInPortal = false
 }) {
-  const hasVariablesInValue = useMemo9(() => {
+  const hasVariablesInValue = useMemo10(() => {
     let result = false;
     bindVariablesToObject({
       value,
@@ -2728,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
 }) {
@@ -2736,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,
@@ -3649,7 +3753,7 @@ function RequestParameters({
 
 // src/components/Request/RequestUrl.tsx
 import { css as css13 } from "@emotion/react";
-import { useMemo as useMemo11 } from "react";
+import { useMemo as useMemo12 } from "react";
 
 // src/components/Request/urlEncodeRequestParameter.ts
 function urlEncodeRequestUrl(url, varValues) {
@@ -3675,7 +3779,7 @@ function RequestUrl() {
   var _a, _b;
   const { variables } = useVariables();
   const { request } = useRequest();
-  const mergedParameters = useMemo11(() => {
+  const mergedParameters = useMemo12(() => {
     var _a2;
     if (!((_a2 = request.baseRequest) == null ? void 0 : _a2.parameters)) {
       return request.parameters;
@@ -3918,17 +4022,200 @@ function convertRequestDataToDataType(dataType, requestData) {
   };
 }
 
+// src/components/Delegation/DelegationGate.tsx
+import { Callout as Callout3, LoadingOverlay } from "@uniformdev/design-system";
+import { useEffect as useEffect13 } from "react";
+
+// src/components/Delegation/styles/DelegationGate.style.ts
+import { css as css14 } from "@emotion/react";
+var delegationGateStyle = css14`
+  min-height: 12rem;
+  width: 100%;
+`;
+
+// src/components/Delegation/DelegationGate.tsx
+import { Fragment as Fragment10, jsx as jsx46 } from "@emotion/react/jsx-runtime";
+function DefaultDelegationLoading() {
+  return /* @__PURE__ */ jsx46("div", { css: delegationGateStyle, children: /* @__PURE__ */ jsx46(LoadingOverlay, { isActive: true, statusMessage: "Connecting to Uniform..." }) });
+}
+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 }) {
+  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." }) });
+}
+function DelegationGate({
+  children,
+  loadingComponent,
+  disabledComponent,
+  errorComponent
+}) {
+  const { status, error } = useDelegation();
+  if (status === "active") {
+    return /* @__PURE__ */ jsx46(Fragment10, { children });
+  }
+  if (status === "idle" || status === "acquiring") {
+    return /* @__PURE__ */ jsx46(Fragment10, { children: loadingComponent !== void 0 ? loadingComponent : /* @__PURE__ */ jsx46(DefaultDelegationLoading, {}) });
+  }
+  if (status === "disabled") {
+    return /* @__PURE__ */ jsx46(Fragment10, { children: disabledComponent !== void 0 ? disabledComponent : /* @__PURE__ */ jsx46(DefaultDelegationDisabled, {}) });
+  }
+  if (status === "error") {
+    const resolvedError = error != null ? error : new Error("Unknown delegation error");
+    if (errorComponent !== void 0) {
+      if (typeof errorComponent === "function") {
+        return /* @__PURE__ */ jsx46(Fragment10, { children: errorComponent({ error: resolvedError }) });
+      }
+      return /* @__PURE__ */ jsx46(Fragment10, { children: errorComponent });
+    }
+    return /* @__PURE__ */ jsx46(DefaultDelegationError, { error: resolvedError });
+  }
+  return null;
+}
+
+// src/components/Delegation/DelegationProvider.tsx
+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() {
+    super("Identity delegation is not enabled for this integration.");
+    this.name = "DelegationDisabledError";
+  }
+};
+var DEFAULT_REVALIDATE_AFTER_MS = 30 * 1e3;
+function DelegationProvider({
+  sdk,
+  onSessionToken,
+  checkActive,
+  revalidateOnFocus = true,
+  revalidateAfterMs = DEFAULT_REVALIDATE_AFTER_MS,
+  children
+}) {
+  const [status, setStatus] = useState11("idle");
+  const [error, setError] = useState11(null);
+  const mountedRef = useRef7(true);
+  const statusRef = useRef7("idle");
+  statusRef.current = status;
+  const acquirePromiseRef = useRef7(null);
+  const acquire = useCallback5(() => {
+    if (acquirePromiseRef.current) {
+      return acquirePromiseRef.current;
+    }
+    const run = (async () => {
+      if (statusRef.current !== "active") {
+        setStatus("acquiring");
+      }
+      setError(null);
+      try {
+        const isActive = await checkActive();
+        if (isActive) {
+          if (mountedRef.current) {
+            setStatus("active");
+          }
+          return;
+        }
+        if (!mountedRef.current) {
+          return;
+        }
+        const sessionToken = await sdk.getSessionToken();
+        if (!mountedRef.current) {
+          return;
+        }
+        if (!sessionToken) {
+          if (mountedRef.current) {
+            setStatus("disabled");
+          }
+          throw new DelegationDisabledError();
+        }
+        await onSessionToken(sessionToken);
+        if (mountedRef.current) {
+          setStatus("active");
+        }
+      } catch (err) {
+        const error2 = err instanceof Error ? err : new Error(String(err));
+        if (mountedRef.current && !(err instanceof DelegationDisabledError)) {
+          setError(error2);
+          setStatus("error");
+        }
+        throw error2;
+      }
+    })();
+    acquirePromiseRef.current = run.finally(() => {
+      acquirePromiseRef.current = null;
+    });
+    return acquirePromiseRef.current;
+  }, [sdk, onSessionToken, checkActive]);
+  useEffect14(() => {
+    mountedRef.current = true;
+    void acquire().catch(() => {
+    });
+    return () => {
+      mountedRef.current = false;
+    };
+  }, [acquire]);
+  const revalidate = useCallback5(async () => {
+    if (acquirePromiseRef.current) {
+      return;
+    }
+    if (statusRef.current !== "active") {
+      return;
+    }
+    try {
+      const isActive = await checkActive();
+      if (!mountedRef.current) {
+        return;
+      }
+      if (!isActive) {
+        void acquire().catch(() => {
+        });
+      }
+    } catch (e) {
+    }
+  }, [checkActive, acquire]);
+  useEffect14(() => {
+    if (!revalidateOnFocus) {
+      return;
+    }
+    if (typeof document === "undefined") {
+      return;
+    }
+    let hiddenAt = document.visibilityState === "hidden" ? Date.now() : null;
+    const handleVisibilityChange = () => {
+      if (document.visibilityState === "hidden") {
+        hiddenAt = Date.now();
+        return;
+      }
+      if (document.visibilityState === "visible") {
+        const elapsed = hiddenAt === null ? 0 : Date.now() - hiddenAt;
+        hiddenAt = null;
+        if (elapsed >= revalidateAfterMs) {
+          void revalidate();
+        }
+      }
+    };
+    document.addEventListener("visibilitychange", handleVisibilityChange);
+    return () => {
+      document.removeEventListener("visibilitychange", handleVisibilityChange);
+    };
+  }, [revalidateOnFocus, revalidateAfterMs, revalidate]);
+  const value = useMemo13(() => ({ status, error, reacquire: acquire }), [status, error, acquire]);
+  return /* @__PURE__ */ jsx47(DelegationContext.Provider, { value, children });
+}
+
 // src/components/MeshApp.tsx
 import { IconsProvider, LoadingIndicator as LoadingIndicator2, Theme as Theme2 } from "@uniformdev/design-system";
 
 // src/hooks/useInitializeUniformMeshSdk.ts
 import { initializeUniformMeshSDK } from "@uniformdev/mesh-sdk";
-import { useEffect as useEffect12, useRef as useRef7, useState as useState11 } from "react";
+import { useEffect as useEffect15, useRef as useRef8, useState as useState12 } from "react";
 var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
-  const [error, setError] = useState11();
-  const [sdk, setSdk] = useState11();
-  const initializationInProgress = useRef7(false);
-  useEffect12(
+  const [error, setError] = useState12();
+  const [sdk, setSdk] = useState12();
+  const initializationInProgress = useRef8(false);
+  useEffect15(
     () => {
       if (typeof window === "undefined" || sdk) {
         return;
@@ -3961,7 +4248,7 @@ var useInitializeUniformMeshSdk = ({ autoResizingDisabled } = {}) => {
 };
 
 // src/components/MeshApp.tsx
-import { jsx as jsx46, jsxs as jsxs21 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs21 } from "@emotion/react/jsx-runtime";
 var MeshApp = ({
   children,
   loadingComponent,
@@ -3970,25 +4257,25 @@ var MeshApp = ({
   const { initializing, error, sdk } = useInitializeUniformMeshSdk();
   if (initializing || !sdk) {
     const LoadingComponent = loadingComponent;
-    return LoadingComponent ? /* @__PURE__ */ jsx46(LoadingComponent, {}) : /* @__PURE__ */ jsx46(LoadingIndicator2, {});
+    return LoadingComponent ? /* @__PURE__ */ jsx48(LoadingComponent, {}) : /* @__PURE__ */ jsx48(LoadingIndicator2, {});
   }
   if (error) {
     const ErrorComponent = errorComponent;
     if (ErrorComponent) {
-      return /* @__PURE__ */ jsx46(ErrorComponent, { error });
+      return /* @__PURE__ */ jsx48(ErrorComponent, { error });
     }
     throw error;
   }
   return /* @__PURE__ */ jsxs21(UniformMeshSdkContext.Provider, { value: { sdk }, children: [
-    /* @__PURE__ */ jsx46(Theme2, {}),
-    /* @__PURE__ */ jsx46(IconsProvider, { children: /* @__PURE__ */ jsx46(UniformMeshLocationContextProvider, { children }) })
+    /* @__PURE__ */ jsx48(Theme2, {}),
+    /* @__PURE__ */ jsx48(IconsProvider, { children: /* @__PURE__ */ jsx48(UniformMeshLocationContextProvider, { children }) })
   ] });
 };
 
 // src/components/ObjectSearch/DataRefreshButton.tsx
-import { css as css14 } from "@emotion/react";
+import { css as css15 } from "@emotion/react";
 import { Button as Button2, LoadingIndicator as LoadingIndicator3 } from "@uniformdev/design-system";
-import { jsx as jsx47, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
 var DataRefreshButton = ({
   buttonText,
   isLoading,
@@ -3996,10 +4283,10 @@ var DataRefreshButton = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsxs22(Button2, { buttonType: "ghost", onClick: onRefreshData, disabled: isLoading, ...props, children: [
-    !isLoading ? null : /* @__PURE__ */ jsx47(
+    !isLoading ? null : /* @__PURE__ */ jsx49(
       LoadingIndicator3,
       {
-        css: css14`
+        css: css15`
             ${isLoading ? "opacity: 0.2;" : void 0}
           `
       }
@@ -4009,22 +4296,22 @@ var DataRefreshButton = ({
 };
 
 // src/components/ObjectSearch/ObjectSearchContainer.tsx
-import { css as css16 } from "@emotion/react";
+import { css as css17 } from "@emotion/react";
 import { bindVariables } from "@uniformdev/canvas";
-import { Callout as Callout3, Container, ScrollableList, VerticalRhythm as VerticalRhythm3 } from "@uniformdev/design-system";
+import { Callout as Callout4, Container, ScrollableList, VerticalRhythm as VerticalRhythm3 } from "@uniformdev/design-system";
 
 // src/components/ObjectSearch/hooks/ObjectSearchContext.tsx
 import { bindVariablesToObject as bindVariablesToObject2 } from "@uniformdev/canvas";
 import {
-  createContext as createContext5,
-  useCallback as useCallback5,
-  useContext as useContext5,
+  createContext as createContext7,
+  useCallback as useCallback6,
+  useContext as useContext7,
   useDeferredValue,
-  useMemo as useMemo12,
-  useState as useState12
+  useMemo as useMemo14,
+  useState as useState13
 } from "react";
-import { jsx as jsx48 } from "@emotion/react/jsx-runtime";
-var ObjectSearchContext = createContext5({
+import { jsx as jsx50 } from "@emotion/react/jsx-runtime";
+var ObjectSearchContext = createContext7({
   onSetQuery: () => {
   },
   onSelectItem: () => {
@@ -4045,16 +4332,16 @@ var ObjectSearchProvider = ({
   children,
   defaultQuery
 }) => {
-  const [query, setQuery] = useState12({
+  const [query, setQuery] = useState13({
     contentType: "",
     keyword: "",
     ...defaultQuery
   });
   const { flatVariables } = useVariables(true);
   const querySearchDeferred = useDeferredValue(query);
-  const [selectedItems, setSelectedItems] = useState12(currentlySelectedItems != null ? currentlySelectedItems : []);
-  const [list, setList] = useState12({});
-  const onSetQuery = useCallback5(
+  const [selectedItems, setSelectedItems] = useState13(currentlySelectedItems != null ? currentlySelectedItems : []);
+  const [list, setList] = useState13({});
+  const onSetQuery = useCallback6(
     (value2) => {
       if (Array.isArray(value2.contentType) && value2.contentType.length > 0) {
         return setQuery({
@@ -4066,7 +4353,7 @@ var ObjectSearchProvider = ({
     },
     [setQuery]
   );
-  const onSelectItem = useCallback5(
+  const onSelectItem = useCallback6(
     (selectedResult) => {
       if (Array.isArray(selectedResult)) {
         setSelectedItems(selectedResult);
@@ -4080,17 +4367,17 @@ var ObjectSearchProvider = ({
     },
     [setSelectedItems, selectedItems]
   );
-  const onRemoveAllSelectedItems = useCallback5(() => {
+  const onRemoveAllSelectedItems = useCallback6(() => {
     setSelectedItems([]);
   }, [setSelectedItems]);
-  const onSetList = useCallback5(
+  const onSetList = useCallback6(
     (value2) => {
       setList(value2);
     },
     [setList]
   );
-  const boundQuery = useMemo12(() => bindQuery(query, flatVariables), [query, flatVariables]);
-  const value = useMemo12(
+  const boundQuery = useMemo14(() => bindQuery(query, flatVariables), [query, flatVariables]);
+  const value = useMemo14(
     () => ({
       boundQuery,
       onSetQuery,
@@ -4114,10 +4401,10 @@ var ObjectSearchProvider = ({
       onSetList
     ]
   );
-  return /* @__PURE__ */ jsx48(ObjectSearchContext.Provider, { value, children });
+  return /* @__PURE__ */ jsx50(ObjectSearchContext.Provider, { value, children });
 };
 function useObjectSearchContext() {
-  return useContext5(ObjectSearchContext);
+  return useContext7(ObjectSearchContext);
 }
 function bindQuery(query, inputs) {
   const { result, errors } = bindVariablesToObject2({
@@ -4135,9 +4422,9 @@ function bindQuery(query, inputs) {
 import { Chip, Popover } from "@uniformdev/design-system";
 
 // src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
-import { css as css15 } from "@emotion/react";
+import { css as css16 } from "@emotion/react";
 import { skeletonLoading } from "@uniformdev/design-system";
-var ObjectListItemContainer = css15`
+var ObjectListItemContainer = css16`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -4146,11 +4433,11 @@ var ObjectListItemContainer = css15`
   grid-template-columns: 1fr auto;
   padding: var(--spacing-sm);
 `;
-var ObjectListItemContainerDisabled = css15`
+var ObjectListItemContainerDisabled = css16`
   opacity: var(--opacity-50);
   pointer-events: none;
 `;
-var ObjectListItemLoading = css15`
+var ObjectListItemLoading = css16`
   animation: ${skeletonLoading} 1s linear infinite alternate;
   border-color: transparent;
   min-height: 42px;
@@ -4174,43 +4461,43 @@ var ObjectListItemLoading = css15`
     width: 1rem;
   }
 `;
-var ObjectListItemHeadingGroup = css15`
+var ObjectListItemHeadingGroup = css16`
   align-items: center;
   display: grid;
 `;
-var ObjectListItemThumbnail = css15`
+var ObjectListItemThumbnail = css16`
   width: 30px;
   height: 30px;
   object-fit: cover;
 `;
-var ObjectListItemTitle = css15`
+var ObjectListItemTitle = css16`
   color: var(--typography-base);
   display: block;
   font-size: var(--fs-sm);
 `;
-var ObjectListItemSubtitle = css15`
+var ObjectListItemSubtitle = css16`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectListItemInfoContainer = css15`
+var ObjectListItemInfoContainer = css16`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
   justify-content: center;
 `;
-var ObjectListItemControlledContent = css15`
+var ObjectListItemControlledContent = css16`
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectListItemUnControlledContent = css15`
+var ObjectListItemUnControlledContent = css16`
   margin-top: var(--spacing-sm);
   grid-column: 1 / -1;
 `;
 
 // src/components/ObjectSearch/ObjectSearchListItem.tsx
-import { jsx as jsx49, jsxs as jsxs23 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs23 } from "@emotion/react/jsx-runtime";
 var ObjectSearchListItem = ({
   id,
   title,
@@ -4251,7 +4538,7 @@ var ObjectSearchListItem = ({
             css: ObjectListItemControlledContent,
             "aria-disabled": disabled,
             children: [
-              imageUrl ? /* @__PURE__ */ jsx49(
+              imageUrl ? /* @__PURE__ */ jsx51(
                 "img",
                 {
                   src: imageUrl,
@@ -4261,27 +4548,27 @@ var ObjectSearchListItem = ({
                 }
               ) : null,
               /* @__PURE__ */ jsxs23("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
-                !contentType ? null : /* @__PURE__ */ jsx49("span", { css: ObjectListItemSubtitle, children: formatedContentType }),
-                /* @__PURE__ */ jsx49("span", { css: ObjectListItemTitle, "data-testid": "title", children: title })
+                !contentType ? null : /* @__PURE__ */ jsx51("span", { css: ObjectListItemSubtitle, children: formatedContentType }),
+                /* @__PURE__ */ jsx51("span", { css: ObjectListItemTitle, "data-testid": "title", children: title })
               ] })
             ]
           }
         ),
         /* @__PURE__ */ jsxs23("div", { css: ObjectListItemInfoContainer, children: [
-          selected ? /* @__PURE__ */ jsx49(Chip, { text: "selected", size: "xs" }) : null,
-          !popoverData ? null : /* @__PURE__ */ jsx49(Popover, { ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
+          selected ? /* @__PURE__ */ jsx51(Chip, { text: "selected", size: "xs" }) : null,
+          !popoverData ? null : /* @__PURE__ */ jsx51(Popover, { ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
         ] }),
-        !children ? null : /* @__PURE__ */ jsx49("div", { css: ObjectListItemUnControlledContent, children })
+        !children ? null : /* @__PURE__ */ jsx51("div", { css: ObjectListItemUnControlledContent, children })
       ]
     }
   );
 };
 var ObjectSearchListItemLoadingSkeleton = () => {
-  return /* @__PURE__ */ jsx49("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
+  return /* @__PURE__ */ jsx51("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
 };
 
 // src/components/ObjectSearch/ObjectSearchContainer.tsx
-import { jsx as jsx50, jsxs as jsxs24 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs24 } from "@emotion/react/jsx-runtime";
 var ObjectSearchContainer = ({
   label,
   enableDynamicInputToResultId,
@@ -4293,16 +4580,16 @@ var ObjectSearchContainer = ({
   const { onSelectItem, selectedListItems, list } = useObjectSearchContext();
   const { flatVariables } = useVariables(true);
   const inputValue = (_b = (_a = selectedListItems == null ? void 0 : selectedListItems[0]) == null ? void 0 : _a.id) != null ? _b : "";
-  const listItems = resultList != null ? resultList : /* @__PURE__ */ jsx50(
+  const listItems = resultList != null ? resultList : /* @__PURE__ */ jsx52(
     ScrollableList,
     {
       role: "list",
-      css: css16`
+      css: css17`
         > div {
           max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
         }
       `,
-      children: /* @__PURE__ */ jsx50(DefaultResultList, {})
+      children: /* @__PURE__ */ jsx52(DefaultResultList, {})
     }
   );
   const body = /* @__PURE__ */ jsxs24(VerticalRhythm3, { children: [
@@ -4337,7 +4624,7 @@ var ObjectSearchContainer = ({
     ]);
   };
   return /* @__PURE__ */ jsxs24(VerticalRhythm3, { children: [
-    /* @__PURE__ */ jsx50(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: label ? /* @__PURE__ */ jsx50(
+    /* @__PURE__ */ jsx52(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: label ? /* @__PURE__ */ jsx52(
       InputVariables,
       {
         label,
@@ -4359,21 +4646,21 @@ var DefaultResultList = () => {
   var _a;
   const { list } = useObjectSearchContext();
   if (!list.items) {
-    return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ jsx50(ObjectSearchListItemLoadingSkeleton, {}, i));
+    return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ jsx52(ObjectSearchListItemLoadingSkeleton, {}, i));
   }
   if (list.items.length === 0) {
-    return /* @__PURE__ */ jsx50(Callout3, { type: "info", children: "No results were found" });
+    return /* @__PURE__ */ jsx52(Callout4, { type: "info", children: "No results were found" });
   }
-  return (_a = list.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ jsx50(ObjectSearchListItem, { ...item }, item.id));
+  return (_a = list.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ jsx52(ObjectSearchListItem, { ...item }, item.id));
 };
 
 // src/components/ObjectSearch/ObjectSearchFilter.tsx
 import { DebouncedInputKeywordSearch, InputSelect as InputSelect3 } from "@uniformdev/design-system";
-import { useMemo as useMemo13, useState as useState13 } from "react";
+import { useMemo as useMemo15, useState as useState14 } from "react";
 
 // src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
-import { css as css17 } from "@emotion/react";
-var ObjectSearchFilterContainerLabel = css17`
+import { css as css18 } from "@emotion/react";
+var ObjectSearchFilterContainerLabel = css18`
   align-items: center;
   display: flex;
   font-size: var(--fs-sm);
@@ -4381,18 +4668,18 @@ var ObjectSearchFilterContainerLabel = css17`
   line-height: 1rem;
   margin-bottom: var(--spacing-sm);
 `;
-var ObjectSearchFilterContainer = css17`
+var ObjectSearchFilterContainer = css18`
   display: grid;
   gap: var(--spacing-base);
 `;
-var ObjectSearchFilterGrid = (gridColumns) => css17`
+var ObjectSearchFilterGrid = (gridColumns) => css18`
   display: grid;
   grid-template-columns: ${gridColumns};
   gap: var(--spacing-base);
 `;
 
 // src/components/ObjectSearch/ObjectSearchFilter.tsx
-import { jsx as jsx51, jsxs as jsxs25 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs25 } from "@emotion/react/jsx-runtime";
 var ObjectSearchFilter = ({
   requireContentType,
   typeSelectorAllTypesOptionText = "All content types",
@@ -4403,7 +4690,7 @@ var ObjectSearchFilter = ({
 }) => {
   var _a, _b;
   const { query, onSetQuery } = useObjectSearchContext();
-  const [searchState, setSearchState] = useState13({
+  const [searchState, setSearchState] = useState14({
     contentType: (_a = query.contentType) != null ? _a : "",
     keyword: (_b = query.keyword) != null ? _b : ""
   });
@@ -4413,7 +4700,7 @@ var ObjectSearchFilter = ({
     });
     onSetQuery({ ...query, ...value });
   };
-  const memoizedSelectOptions = useMemo13(() => {
+  const memoizedSelectOptions = useMemo15(() => {
     if (!requireContentType && !(selectOptions == null ? void 0 : selectOptions.length)) {
       return [];
     }
@@ -4431,7 +4718,7 @@ var ObjectSearchFilter = ({
         ObjectSearchFilterGrid(shouldRenderSelect ? "1fr 2fr" : "1fr")
       ],
       children: [
-        memoizedSelectOptions.length ? /* @__PURE__ */ jsx51(
+        memoizedSelectOptions.length ? /* @__PURE__ */ jsx53(
           InputSelect3,
           {
             label: selectLabel,
@@ -4441,7 +4728,7 @@ var ObjectSearchFilter = ({
             value: query.contentType
           }
         ) : null,
-        /* @__PURE__ */ jsx51(
+        /* @__PURE__ */ jsx53(
           DebouncedInputKeywordSearch,
           {
             inputFieldName: searchInputName,
@@ -4458,9 +4745,9 @@ var ObjectSearchFilter = ({
 };
 
 // src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
-import { jsx as jsx52 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx54 } from "@emotion/react/jsx-runtime";
 var ObjectSearchFilterContainer2 = ({ children }) => {
-  return /* @__PURE__ */ jsx52("div", { children: /* @__PURE__ */ jsx52("div", { css: ObjectSearchFilterContainer, children }) });
+  return /* @__PURE__ */ jsx54("div", { children: /* @__PURE__ */ jsx54("div", { css: ObjectSearchFilterContainer, children }) });
 };
 
 // src/components/ObjectSearch/ObjectSearchResultItem.tsx
@@ -4468,16 +4755,16 @@ import { Button as Button3, Chip as Chip2, Link, Popover as Popover2 } from "@un
 import { format as timeagoFormat } from "timeago.js";
 
 // src/components/Image/Image.tsx
-import { jsx as jsx53 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx55 } from "@emotion/react/jsx-runtime";
 function Image({ src, alt, className }) {
   const CompImage = src && typeof src !== "string" ? src : null;
-  return CompImage ? /* @__PURE__ */ jsx53(CompImage, { className }) : /* @__PURE__ */ jsx53("img", { src, alt, className });
+  return CompImage ? /* @__PURE__ */ jsx55(CompImage, { className }) : /* @__PURE__ */ jsx55("img", { src, alt, className });
 }
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
-import { css as css18 } from "@emotion/react";
+import { css as css19 } from "@emotion/react";
 import { button as button2 } from "@uniformdev/design-system";
-var ButtonStyles = css18`
+var ButtonStyles = css19`
   ${button2}
   background: transparent;
   border: 1px solid var(--typography-base);
@@ -4505,20 +4792,20 @@ var ButtonStyles = css18`
     text-decoration: none;
   }
 `;
-var ButtonIcon = css18`
+var ButtonIcon = css19`
   width: 1rem;
   height: 1rem;
 `;
 
 // src/components/ObjectSearch/ObjectSearchResultItemButton.tsx
-import { jsx as jsx54, jsxs as jsxs26 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx56, jsxs as jsxs26 } from "@emotion/react/jsx-runtime";
 var ObjectSearchResultItemButton = ({
   text,
   icon,
   ...props
 }) => {
   return /* @__PURE__ */ jsxs26("button", { type: "button", css: ButtonStyles, ...props, children: [
-    !icon ? null : /* @__PURE__ */ jsx54(Image, { src: icon, css: ButtonIcon }),
+    !icon ? null : /* @__PURE__ */ jsx56(Image, { src: icon, css: ButtonIcon }),
     text
   ] });
 };
@@ -4528,14 +4815,14 @@ var LinkButton = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsxs26("a", { ...props, css: ButtonStyles, target: "_blank", rel: "noopener noreferrer", children: [
-    !icon ? null : /* @__PURE__ */ jsx54(Image, { src: icon, css: ButtonIcon }),
+    !icon ? null : /* @__PURE__ */ jsx56(Image, { src: icon, css: ButtonIcon }),
     text
   ] });
 };
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
-import { css as css19 } from "@emotion/react";
-var ObjectSearchResultItemContainer = css19`
+import { css as css20 } from "@emotion/react";
+var ObjectSearchResultItemContainer = css20`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -4551,7 +4838,7 @@ var ObjectSearchResultItemContainer = css19`
     }
   }
 `;
-var ObjectSearchDragHandle = css19`
+var ObjectSearchDragHandle = css20`
   border-left: 2px dotted var(--gray-300);
   border-right: 2px dotted var(--gray-300);
   position: absolute;
@@ -4560,47 +4847,47 @@ var ObjectSearchDragHandle = css19`
   transition: opacity var(--duration-fast) var(--timing-ease-out);
   opacity: 0;
 `;
-var ObjectSearchResultItemSubtitle = css19`
+var ObjectSearchResultItemSubtitle = css20`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectSearchResultItemTitle = css19`
+var ObjectSearchResultItemTitle = css20`
   align-items: center;
   color: var(--typography-base);
   display: flex;
   gap: var(--spacing-xs);
 `;
-var ObjectSearchResultItemTimeStamp = css19`
+var ObjectSearchResultItemTimeStamp = css20`
   color: var(--gray-500);
   font-size: var(--fs-xs);
 `;
-var ObjectSearchResultItemTitleLink = css19`
+var ObjectSearchResultItemTitleLink = css20`
   text-decoration: none;
   color: var(--primary-action-default);
   font-size: var(--fs-sm);
 `;
-var ObjectSearchAuthorStateGroup = css19`
+var ObjectSearchAuthorStateGroup = css20`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchUpdateGroup = css19`
+var ObjectSearchUpdateGroup = css20`
   display: grid;
 `;
-var ObjectSearchContentContainer = css19`
+var ObjectSearchContentContainer = css20`
   display: flex;
   gap: var(--spacing-base);
 `;
-var ObjectSearchImage = css19`
+var ObjectSearchImage = css20`
   width: 56px;
   height: 56px;
   object-fit: cover;
 `;
 
 // src/components/ObjectSearch/ObjectSearchResultItem.tsx
-import { jsx as jsx55, jsxs as jsxs27 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx57, jsxs as jsxs27 } from "@emotion/react/jsx-runtime";
 var ObjectSearchResultItem = ({
   id,
   title,
@@ -4625,9 +4912,9 @@ var ObjectSearchResultItem = ({
     onRemove == null ? void 0 : onRemove();
   };
   return /* @__PURE__ */ jsxs27("div", { css: ObjectSearchResultItemContainer, "data-testid": "search-result-item", children: [
-    disableDnD ? null : /* @__PURE__ */ jsx55("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
-    /* @__PURE__ */ jsx55("div", { children: /* @__PURE__ */ jsxs27("div", { css: ObjectSearchContentContainer, children: [
-      !imageUrl ? null : /* @__PURE__ */ jsx55(
+    disableDnD ? null : /* @__PURE__ */ jsx57("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
+    /* @__PURE__ */ jsx57("div", { children: /* @__PURE__ */ jsxs27("div", { css: ObjectSearchContentContainer, children: [
+      !imageUrl ? null : /* @__PURE__ */ jsx57(
         "img",
         {
           src: imageUrl,
@@ -4637,9 +4924,9 @@ var ObjectSearchResultItem = ({
         }
       ),
       /* @__PURE__ */ jsxs27("div", { children: [
-        /* @__PURE__ */ jsx55("span", { css: ObjectSearchResultItemSubtitle, "data-testid": "sub-title", children: formatedContentType }),
+        /* @__PURE__ */ jsx57("span", { css: ObjectSearchResultItemSubtitle, "data-testid": "sub-title", children: formatedContentType }),
         /* @__PURE__ */ jsxs27("span", { role: "heading", css: ObjectSearchResultItemTitle, "data-testid": "title", children: [
-          onClick ? /* @__PURE__ */ jsx55(
+          onClick ? /* @__PURE__ */ jsx57(
             Link,
             {
               onClick: (e) => {
@@ -4651,28 +4938,28 @@ var ObjectSearchResultItem = ({
               text: title != null ? title : name,
               css: ObjectSearchResultItemTitleLink
             }
-          ) : /* @__PURE__ */ jsx55("span", { children: title != null ? title : name }),
-          !popoverData ? null : /* @__PURE__ */ jsx55(Popover2, { ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
+          ) : /* @__PURE__ */ jsx57("span", { children: title != null ? title : name }),
+          !popoverData ? null : /* @__PURE__ */ jsx57(Popover2, { ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
         ] }),
         !createdAt && !publishStatus ? null : /* @__PURE__ */ jsxs27("div", { css: ObjectSearchAuthorStateGroup, children: [
-          !(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ jsx55(Chip2, { theme: legacyThemeMapper(publishStatus.theme), text: publishStatus.text, size: "xs" }),
+          !(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ jsx57(Chip2, { theme: legacyThemeMapper(publishStatus.theme), text: publishStatus.text, size: "xs" }),
           !createdAt && !publishedAt ? null : /* @__PURE__ */ jsxs27("div", { css: ObjectSearchUpdateGroup, children: [
             !createdAt ? null : /* @__PURE__ */ jsxs27("small", { css: ObjectSearchResultItemTimeStamp, children: [
-              /* @__PURE__ */ jsx55("strong", { children: "Last updated: " }),
+              /* @__PURE__ */ jsx57("strong", { children: "Last updated: " }),
               timeagoFormat(createdAt)
             ] }),
             !publishedAt ? null : /* @__PURE__ */ jsxs27("small", { css: ObjectSearchResultItemTimeStamp, children: [
-              /* @__PURE__ */ jsx55("strong", { children: "Last published: " }),
+              /* @__PURE__ */ jsx57("strong", { children: "Last published: " }),
               timeagoFormat(publishedAt)
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ jsx55("div", { children })
+        /* @__PURE__ */ jsx57("div", { children })
       ] })
     ] }) }),
     !editLink && hideRemoveButton ? null : /* @__PURE__ */ jsxs27("div", { css: ObjectSearchAuthorStateGroup, children: [
-      !editLink ? null : /* @__PURE__ */ jsx55(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
-      hideRemoveButton ? null : /* @__PURE__ */ jsx55(Button3, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
+      !editLink ? null : /* @__PURE__ */ jsx57(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
+      hideRemoveButton ? null : /* @__PURE__ */ jsx57(Button3, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
     ] })
   ] });
 };
@@ -4699,32 +4986,32 @@ import {
 import { Button as Button4, Counter } from "@uniformdev/design-system";
 
 // src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
-import { css as css20 } from "@emotion/react";
-var ObjectSearchResultListContainer = css20`
+import { css as css21 } from "@emotion/react";
+var ObjectSearchResultListContainer = css21`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
   justify-content: space-between;
 `;
-var ObjectSearchDragContainer = css20`
+var ObjectSearchDragContainer = css21`
   margin: 0 0 var(--spacing-sm);
 `;
-var ObjectSearchContainerDragging = css20`
+var ObjectSearchContainerDragging = css21`
   box-shadow: var(--shadow-base);
   opacity: var(--opacity-50);
 `;
-var ObjectSearchResultListCounterContainer = css20`
+var ObjectSearchResultListCounterContainer = css21`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchResultListTitle = css20`
+var ObjectSearchResultListTitle = css21`
   font-weight: var(--fw-bold);
   line-height: 1;
 `;
 
 // src/components/ObjectSearch/ObjectSearchResultList.tsx
-import { Fragment as Fragment10, jsx as jsx56, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx58, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
 var DroppableHack2 = Droppable2;
 var DraggableHack2 = Draggable2;
 function ObjectSearchResultList({
@@ -4734,7 +5021,7 @@ function ObjectSearchResultList({
   hideRemoveButton = false,
   resultLabelOverride,
   additionalButtons,
-  renderResultComponent = (value) => /* @__PURE__ */ jsx56(ObjectSearchResultItem, { ...value }),
+  renderResultComponent = (value) => /* @__PURE__ */ jsx58(ObjectSearchResultItem, { ...value }),
   multiSelectId,
   disableDnD = false,
   getContainerForDnDReparenting,
@@ -4761,7 +5048,7 @@ function ObjectSearchResultList({
       ...item,
       disableDnD: selectedListItems.length === 1 || disableDnD
     });
-    return /* @__PURE__ */ jsx56(
+    return /* @__PURE__ */ jsx58(
       "div",
       {
         css: [
@@ -4776,16 +5063,16 @@ function ObjectSearchResultList({
       }
     );
   };
-  return /* @__PURE__ */ jsxs28(Fragment10, { children: [
+  return /* @__PURE__ */ jsxs28(Fragment11, { children: [
     /* @__PURE__ */ jsxs28("div", { role: "group", css: ObjectSearchResultListContainer, children: [
       !resultLabelOverride ? /* @__PURE__ */ jsxs28("div", { role: "note", css: ObjectSearchResultListCounterContainer, children: [
-        /* @__PURE__ */ jsx56("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
+        /* @__PURE__ */ jsx58("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
         " ",
-        !selectedListItems.length ? null : /* @__PURE__ */ jsx56(Counter, { count: selectedListItems.length })
+        !selectedListItems.length ? null : /* @__PURE__ */ jsx58(Counter, { count: selectedListItems.length })
       ] }) : resultLabelOverride,
       /* @__PURE__ */ jsxs28("div", { css: ObjectSearchResultListCounterContainer, children: [
         additionalButtons,
-        hideRemoveButton ? null : /* @__PURE__ */ jsx56(
+        hideRemoveButton ? null : /* @__PURE__ */ jsx58(
           Button4,
           {
             buttonType: "ghostDestructive",
@@ -4797,7 +5084,7 @@ function ObjectSearchResultList({
         )
       ] })
     ] }),
-    !selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx56(DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx56(
+    !selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx58(DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx58(
       DroppableHack2,
       {
         droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select",
@@ -4805,7 +5092,7 @@ function ObjectSearchResultList({
         getContainerForClone: getContainerForDnDReparenting,
         children: (provided) => /* @__PURE__ */ jsxs28("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
           selectedListItems.map((item, i) => {
-            return /* @__PURE__ */ jsx56(
+            return /* @__PURE__ */ jsx58(
               DraggableHack2,
               {
                 draggableId: item.id,
@@ -4825,8 +5112,8 @@ 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 useEffect13, useState as useState14 } from "react";
-import { jsx as jsx57, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
+import { useEffect as useEffect16, useState as useState15 } from "react";
+import { jsx as jsx59, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
 var QueryFilter = ({
   requireContentType,
   queryFilterTitle = "Configure Query",
@@ -4854,7 +5141,7 @@ var QueryFilter = ({
 }) => {
   var _a, _b, _c, _d, _e, _f, _g;
   const { query, onSetQuery } = useObjectSearchContext();
-  const [queryState, setQueryState] = useState14({
+  const [queryState, setQueryState] = useState15({
     contentType: (_a = query.contentType) != null ? _a : "",
     keyword: (_b = query.keyword) != null ? _b : "",
     count: (_c = query.count) != null ? _c : 5,
@@ -4865,13 +5152,13 @@ var QueryFilter = ({
     setQueryState((prev) => ({ ...prev, ...value }));
     onSetQuery({ ...query, ...value });
   };
-  useEffect13(() => {
+  useEffect16(() => {
     onSetQuery(queryState);
   }, []);
   return /* @__PURE__ */ jsxs29("fieldset", { children: [
-    /* @__PURE__ */ jsx57("span", { css: ObjectSearchFilterContainerLabel, children: queryFilterTitle }),
-    /* @__PURE__ */ jsx57("div", { css: ObjectSearchFilterContainer, children: /* @__PURE__ */ jsxs29(VerticalRhythm4, { children: [
-      /* @__PURE__ */ jsx57(
+    /* @__PURE__ */ jsx59("span", { css: ObjectSearchFilterContainerLabel, children: queryFilterTitle }),
+    /* @__PURE__ */ jsx59("div", { css: ObjectSearchFilterContainer, children: /* @__PURE__ */ jsxs29(VerticalRhythm4, { children: [
+      /* @__PURE__ */ jsx59(
         InputVariables,
         {
           label: searchInputLabel,
@@ -4879,7 +5166,7 @@ var QueryFilter = ({
           onChange: (newQuery) => handleFilterChange({ keyword: newQuery }),
           disableInlineMenu: true,
           id: "qf_searchText",
-          inputWhenNoVariables: /* @__PURE__ */ jsx57(
+          inputWhenNoVariables: /* @__PURE__ */ jsx59(
             DebouncedInputKeywordSearch2,
             {
               id: "qf_searchText",
@@ -4894,7 +5181,7 @@ var QueryFilter = ({
         }
       ),
       /* @__PURE__ */ jsxs29("div", { css: ObjectSearchFilterGrid("1fr 100px"), children: [
-        /* @__PURE__ */ jsx57(
+        /* @__PURE__ */ jsx59(
           InputVariables,
           {
             label: contentTypeLabel,
@@ -4902,7 +5189,7 @@ var QueryFilter = ({
             value: (_g = queryState.contentType) != null ? _g : "",
             onChange: (newType) => handleFilterChange({ contentType: newType }),
             disableInlineMenu: true,
-            inputWhenNoVariables: /* @__PURE__ */ jsx57(
+            inputWhenNoVariables: /* @__PURE__ */ jsx59(
               InputSelect4,
               {
                 id: "qf_contentType",
@@ -4916,7 +5203,7 @@ var QueryFilter = ({
             )
           }
         ),
-        /* @__PURE__ */ jsx57(
+        /* @__PURE__ */ jsx59(
           InputVariables,
           {
             label: countLabel,
@@ -4925,7 +5212,7 @@ var QueryFilter = ({
             onChange: (newCount) => handleFilterChange({ count: newCount }),
             disableInlineMenu: true,
             valueToResetTo: "5",
-            inputWhenNoVariables: /* @__PURE__ */ jsx57(
+            inputWhenNoVariables: /* @__PURE__ */ jsx59(
               Input4,
               {
                 id: "qf_count",
@@ -4941,7 +5228,7 @@ var QueryFilter = ({
         )
       ] }),
       /* @__PURE__ */ jsxs29("div", { css: ObjectSearchFilterGrid("2fr 1fr"), children: [
-        /* @__PURE__ */ jsx57(
+        /* @__PURE__ */ jsx59(
           InputVariables,
           {
             id: "qf_sortBy",
@@ -4949,7 +5236,7 @@ var QueryFilter = ({
             value: queryState.sortBy,
             onChange: (newSortBy) => handleFilterChange({ sortBy: newSortBy }),
             disableInlineMenu: true,
-            inputWhenNoVariables: /* @__PURE__ */ jsx57(
+            inputWhenNoVariables: /* @__PURE__ */ jsx59(
               InputSelect4,
               {
                 label: sortLabel,
@@ -4963,7 +5250,7 @@ var QueryFilter = ({
             )
           }
         ),
-        /* @__PURE__ */ jsx57(
+        /* @__PURE__ */ jsx59(
           InputVariables,
           {
             label: sortOrderLabel,
@@ -4971,7 +5258,7 @@ var QueryFilter = ({
             value: queryState.sortOrder,
             onChange: (newSort) => handleFilterChange({ sortOrder: newSort }),
             disableInlineMenu: true,
-            inputWhenNoVariables: /* @__PURE__ */ jsx57(
+            inputWhenNoVariables: /* @__PURE__ */ jsx59(
               InputSelect4,
               {
                 label: sortOrderLabel,
@@ -4991,8 +5278,8 @@ var QueryFilter = ({
 };
 
 // src/components/ParamTypeDynamicDataProvider.tsx
-import { useEffect as useEffect14, useMemo as useMemo14, useRef as useRef8 } from "react";
-import { jsx as jsx58 } from "@emotion/react/jsx-runtime";
+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;
   const {
@@ -5000,11 +5287,11 @@ function ParamTypeDynamicDataProvider(props) {
   } = useMeshLocation("paramType");
   const dynamicInputsAsVariables = useDynamicInputsAsVariables(dynamicInputs);
   const connectedDataAsVariables = useConnectedDataAsVariables(connectedData);
-  const variables = useMemo14(
+  const variables = useMemo16(
     () => ({ ...connectedDataAsVariables, ...dynamicInputsAsVariables }),
     [dynamicInputsAsVariables, connectedDataAsVariables]
   );
-  return /* @__PURE__ */ jsx58(VariablesProvider, { value: variables, onChange: () => {
+  return /* @__PURE__ */ jsx60(VariablesProvider, { value: variables, onChange: () => {
   }, editVariableComponent: JsonMeshVariableEditor, children });
 }
 var JsonMeshVariableEditor = ({
@@ -5013,9 +5300,9 @@ var JsonMeshVariableEditor = ({
   variable,
   context
 }) => {
-  const sillyRef = useRef8(false);
+  const sillyRef = useRef9(false);
   const { editConnectedData } = useMeshLocation("paramType");
-  useEffect14(() => {
+  useEffect17(() => {
     if (sillyRef.current) {
       return;
     }
@@ -5485,9 +5772,9 @@ var MULTI_SELECT_OPERATORS = [
 
 // src/components/SearchAndFilter/editors/DateEditor.tsx
 import { Input as Input5 } from "@uniformdev/design-system";
-import { useState as useState15 } from "react";
+import { useState as useState16 } from "react";
 import { useDebounce as useDebounce2 } from "react-use";
-import { jsx as jsx59 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx61 } from "@emotion/react/jsx-runtime";
 var DateEditor = ({
   onChange,
   ariaLabel,
@@ -5496,9 +5783,9 @@ var DateEditor = ({
   readOnly,
   valueTestId
 }) => {
-  const [innerValue, setInnerValue] = useState15(value != null ? value : "");
+  const [innerValue, setInnerValue] = useState16(value != null ? value : "");
   useDebounce2(() => onChange(innerValue), 500, [innerValue]);
-  return /* @__PURE__ */ jsx59(
+  return /* @__PURE__ */ jsx61(
     Input5,
     {
       type: "date",
@@ -5515,21 +5802,21 @@ var DateEditor = ({
 
 // src/components/SearchAndFilter/editors/DateRangeEditor.tsx
 import { Input as Input6 } from "@uniformdev/design-system";
-import { useEffect as useEffect15, useState as useState16 } 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
 import { FieldMessage } from "@uniformdev/design-system";
-import { jsx as jsx60 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx62 } from "@emotion/react/jsx-runtime";
 var ErrorContainer = ({ errorMessage }) => {
-  return /* @__PURE__ */ jsx60(
+  return /* @__PURE__ */ jsx62(
     "div",
     {
       css: {
         gridColumn: "span 6",
         order: 6
       },
-      children: /* @__PURE__ */ jsx60(FieldMessage, { errorMessage })
+      children: /* @__PURE__ */ jsx62(FieldMessage, { errorMessage })
     }
   );
 };
@@ -5542,7 +5829,7 @@ var twoColumnGrid = {
 };
 
 // src/components/SearchAndFilter/editors/DateRangeEditor.tsx
-import { Fragment as Fragment11, jsx as jsx61, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx63, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
 var DateRangeEditor = ({
   ariaLabel,
   onChange,
@@ -5551,9 +5838,9 @@ var DateRangeEditor = ({
   readOnly,
   valueTestId
 }) => {
-  const [minDateValue, setMinDateValue] = useState16(value ? value[0] : "");
-  const [maxDateValue, setMaxDateValue] = useState16(value ? value[1] : "");
-  const [error, setError] = useState16("");
+  const [minDateValue, setMinDateValue] = useState17(value ? value[0] : "");
+  const [maxDateValue, setMaxDateValue] = useState17(value ? value[1] : "");
+  const [error, setError] = useState17("");
   useDebounce3(
     () => {
       if (minDateValue && maxDateValue && !error) {
@@ -5565,7 +5852,7 @@ var DateRangeEditor = ({
     500,
     [minDateValue, maxDateValue]
   );
-  useEffect15(() => {
+  useEffect18(() => {
     if (!minDateValue || !maxDateValue) {
       return;
     }
@@ -5600,9 +5887,9 @@ var DateRangeEditor = ({
       setMaxDateValue("");
     }
   }, [minDateValue, maxDateValue, setError]);
-  return /* @__PURE__ */ jsxs30(Fragment11, { children: [
+  return /* @__PURE__ */ jsxs30(Fragment12, { children: [
     /* @__PURE__ */ jsxs30("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
-      /* @__PURE__ */ jsx61(
+      /* @__PURE__ */ jsx63(
         Input6,
         {
           label: `${ariaLabel}-min-date`,
@@ -5616,7 +5903,7 @@ var DateRangeEditor = ({
           "data-testid": "value-low"
         }
       ),
-      /* @__PURE__ */ jsx61(
+      /* @__PURE__ */ jsx63(
         Input6,
         {
           label: `${ariaLabel}-max-date`,
@@ -5631,7 +5918,7 @@ var DateRangeEditor = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx61(ErrorContainer, { errorMessage: error })
+    /* @__PURE__ */ jsx63(ErrorContainer, { errorMessage: error })
   ] });
 };
 
@@ -5641,7 +5928,7 @@ import {
   getComboBoxSelectedSelectableGroups,
   InputComboBox
 } from "@uniformdev/design-system";
-import { useMemo as useMemo15 } from "react";
+import { useMemo as useMemo17 } from "react";
 
 // src/components/SearchAndFilter/editors/shared/readOnlyAttributes.tsx
 var readOnlyAttributes = {
@@ -5651,7 +5938,7 @@ var readOnlyAttributes = {
 };
 
 // src/components/SearchAndFilter/editors/FilterMultiChoiceEditor.tsx
-import { jsx as jsx62 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx64 } from "@emotion/react/jsx-runtime";
 var FilterMultiChoiceEditor = ({
   value,
   options,
@@ -5662,11 +5949,11 @@ var FilterMultiChoiceEditor = ({
 }) => {
   const readOnlyProps = readOnly ? readOnlyAttributes : {};
   const isClearable = !readOnly || !disabled;
-  const { groupedOptions, selectedOptions } = useMemo15(
+  const { groupedOptions, selectedOptions } = useMemo17(
     () => convertComboBoxGroupsToSelectableGroups({ options: options != null ? options : [], selectedItems: new Set(value) }),
     [options, value]
   );
-  return /* @__PURE__ */ jsx62("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx62(
+  return /* @__PURE__ */ jsx64("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx64(
     InputComboBox,
     {
       ...props,
@@ -5699,8 +5986,8 @@ import {
   convertComboBoxGroupsToSelectableGroups as convertComboBoxGroupsToSelectableGroups2,
   InputComboBox as InputComboBox2
 } from "@uniformdev/design-system";
-import { useMemo as useMemo16 } from "react";
-import { jsx as jsx63 } from "@emotion/react/jsx-runtime";
+import { useMemo as useMemo18 } from "react";
+import { jsx as jsx65 } from "@emotion/react/jsx-runtime";
 var FilterSingleChoiceEditor = ({
   options,
   value,
@@ -5710,7 +5997,7 @@ var FilterSingleChoiceEditor = ({
   valueTestId
 }) => {
   const readOnlyProps = readOnly ? readOnlyAttributes : {};
-  const { groupedOptions, selectedOptions } = useMemo16(
+  const { groupedOptions, selectedOptions } = useMemo18(
     () => convertComboBoxGroupsToSelectableGroups2({
       options: options != null ? options : [],
       selectedItems: new Set(value ? [String(value)] : void 0),
@@ -5718,7 +6005,7 @@ var FilterSingleChoiceEditor = ({
     }),
     [options, value]
   );
-  return /* @__PURE__ */ jsx63("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx63(
+  return /* @__PURE__ */ jsx65("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx65(
     InputComboBox2,
     {
       placeholder: "Type to search...",
@@ -5748,9 +6035,9 @@ var FilterSingleChoiceEditor = ({
 
 // src/components/SearchAndFilter/editors/NumberEditor.tsx
 import { Input as Input7 } from "@uniformdev/design-system";
-import { useState as useState17 } from "react";
+import { useState as useState18 } from "react";
 import { useDebounce as useDebounce4 } from "react-use";
-import { jsx as jsx64 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx66 } from "@emotion/react/jsx-runtime";
 var NumberEditor = ({
   ariaLabel,
   onChange,
@@ -5759,9 +6046,9 @@ var NumberEditor = ({
   readOnly,
   valueTestId
 }) => {
-  const [innerValue, setInnerValue] = useState17(value != null ? value : "");
+  const [innerValue, setInnerValue] = useState18(value != null ? value : "");
   useDebounce4(() => onChange(innerValue), 500, [innerValue]);
-  return /* @__PURE__ */ jsx64(
+  return /* @__PURE__ */ jsx66(
     Input7,
     {
       label: ariaLabel,
@@ -5779,9 +6066,9 @@ var NumberEditor = ({
 
 // src/components/SearchAndFilter/editors/NumberRangeEditor.tsx
 import { Input as Input8 } from "@uniformdev/design-system";
-import { useEffect as useEffect16, useState as useState18 } from "react";
+import { useEffect as useEffect19, useState as useState19 } from "react";
 import { useDebounce as useDebounce5 } from "react-use";
-import { Fragment as Fragment12, jsx as jsx65, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx67, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
 var NumberRangeEditor = ({
   onChange,
   disabled,
@@ -5790,9 +6077,9 @@ var NumberRangeEditor = ({
   readOnly,
   valueTestId
 }) => {
-  const [minValue, setMinValue] = useState18("");
-  const [maxValue, setMaxValue] = useState18("");
-  const [error, setError] = useState18("");
+  const [minValue, setMinValue] = useState19("");
+  const [maxValue, setMaxValue] = useState19("");
+  const [error, setError] = useState19("");
   useDebounce5(
     () => {
       if (minValue && maxValue && !error) {
@@ -5804,7 +6091,7 @@ var NumberRangeEditor = ({
     500,
     [minValue, maxValue]
   );
-  useEffect16(() => {
+  useEffect19(() => {
     if (!maxValue && !minValue) {
       return;
     }
@@ -5826,9 +6113,9 @@ var NumberRangeEditor = ({
       setMaxValue(maxValue);
     }
   }, [maxValue, minValue, setError]);
-  return /* @__PURE__ */ jsxs31(Fragment12, { children: [
+  return /* @__PURE__ */ jsxs31(Fragment13, { children: [
     /* @__PURE__ */ jsxs31("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
-      /* @__PURE__ */ jsx65(
+      /* @__PURE__ */ jsx67(
         Input8,
         {
           label: `${ariaLabel}-min`,
@@ -5844,7 +6131,7 @@ var NumberRangeEditor = ({
           "data-testid": "value-low"
         }
       ),
-      /* @__PURE__ */ jsx65(
+      /* @__PURE__ */ jsx67(
         Input8,
         {
           type: "number",
@@ -5861,7 +6148,7 @@ var NumberRangeEditor = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx65(ErrorContainer, { errorMessage: error })
+    /* @__PURE__ */ jsx67(ErrorContainer, { errorMessage: error })
   ] });
 };
 
@@ -5871,13 +6158,13 @@ import {
   getComboBoxSelectedSelectableGroups as getComboBoxSelectedSelectableGroups2,
   InputComboBox as InputComboBox3
 } from "@uniformdev/design-system";
-import { useMemo as useMemo17 } from "react";
+import { useMemo as useMemo19 } from "react";
 
 // src/components/SearchAndFilter/editors/shared/CustomOptions.tsx
 import { StatusBullet } from "@uniformdev/design-system";
-import { jsx as jsx66 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx68 } from "@emotion/react/jsx-runtime";
 var CustomOptions = ({ label, value }) => {
-  return /* @__PURE__ */ jsx66(
+  return /* @__PURE__ */ jsx68(
     StatusBullet,
     {
       status: label,
@@ -5887,7 +6174,7 @@ var CustomOptions = ({ label, value }) => {
 };
 
 // src/components/SearchAndFilter/editors/StatusMultiEditor.tsx
-import { jsx as jsx67 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx69 } from "@emotion/react/jsx-runtime";
 var StatusMultiEditor = ({
   options,
   value,
@@ -5897,11 +6184,11 @@ var StatusMultiEditor = ({
   valueTestId
 }) => {
   const readOnlyProps = readOnly ? readOnlyAttributes : {};
-  const { groupedOptions, selectedOptions } = useMemo17(
+  const { groupedOptions, selectedOptions } = useMemo19(
     () => convertComboBoxGroupsToSelectableGroups3({ options: options != null ? options : [], selectedItems: new Set(value) }),
     [options, value]
   );
-  return /* @__PURE__ */ jsx67("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx67(
+  return /* @__PURE__ */ jsx69("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx69(
     InputComboBox3,
     {
       options: groupedOptions != null ? groupedOptions : [],
@@ -5932,8 +6219,8 @@ import {
   convertComboBoxGroupsToSelectableGroups as convertComboBoxGroupsToSelectableGroups4,
   InputComboBox as InputComboBox4
 } from "@uniformdev/design-system";
-import { useMemo as useMemo18 } from "react";
-import { jsx as jsx68 } from "@emotion/react/jsx-runtime";
+import { useMemo as useMemo20 } from "react";
+import { jsx as jsx70 } from "@emotion/react/jsx-runtime";
 var StatusSingleEditor = ({
   options,
   value,
@@ -5943,7 +6230,7 @@ var StatusSingleEditor = ({
   valueTestId
 }) => {
   const readOnlyProps = readOnly ? readOnlyAttributes : {};
-  const { groupedOptions, selectedOptions } = useMemo18(
+  const { groupedOptions, selectedOptions } = useMemo20(
     () => convertComboBoxGroupsToSelectableGroups4({
       options: options != null ? options : [],
       selectedItems: new Set(value ? [value] : void 0),
@@ -5951,7 +6238,7 @@ var StatusSingleEditor = ({
     }),
     [options, value]
   );
-  return /* @__PURE__ */ jsx68("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx68(
+  return /* @__PURE__ */ jsx70("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx70(
     InputComboBox4,
     {
       options: groupedOptions,
@@ -5980,9 +6267,9 @@ var StatusSingleEditor = ({
 
 // src/components/SearchAndFilter/editors/TextEditor.tsx
 import { Input as Input9 } from "@uniformdev/design-system";
-import { useState as useState19 } from "react";
+import { useState as useState20 } from "react";
 import { useDebounce as useDebounce6 } from "react-use";
-import { jsx as jsx69 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx71 } from "@emotion/react/jsx-runtime";
 var TextEditor = ({
   onChange,
   ariaLabel,
@@ -5990,9 +6277,9 @@ var TextEditor = ({
   readOnly,
   valueTestId
 }) => {
-  const [innerValue, setInnerValue] = useState19(value != null ? value : "");
+  const [innerValue, setInnerValue] = useState20(value != null ? value : "");
   useDebounce6(() => onChange(innerValue), 500, [innerValue]);
-  return /* @__PURE__ */ jsx69(
+  return /* @__PURE__ */ jsx71(
     Input9,
     {
       showLabel: false,
@@ -6012,8 +6299,8 @@ import {
   getComboBoxSelectedSelectableGroups as getComboBoxSelectedSelectableGroups3,
   InputCreatableComboBox
 } from "@uniformdev/design-system";
-import { useMemo as useMemo19 } from "react";
-import { jsx as jsx70 } from "@emotion/react/jsx-runtime";
+import { useMemo as useMemo21 } from "react";
+import { jsx as jsx72 } from "@emotion/react/jsx-runtime";
 var TextMultiChoiceEditor = ({
   value,
   disabled,
@@ -6023,13 +6310,13 @@ var TextMultiChoiceEditor = ({
 }) => {
   const readOnlyProps = readOnly ? readOnlyAttributes : {};
   const isClearable = !readOnly || !disabled;
-  const { groupedOptions, selectedOptions } = useMemo19(() => {
+  const { groupedOptions, selectedOptions } = useMemo21(() => {
     var _a;
     const coercedValue = typeof value === "string" ? [value] : value != null ? value : [];
     const options = (_a = coercedValue.map((v) => ({ label: v, value: v }))) != null ? _a : [];
     return convertComboBoxGroupsToSelectableGroups5({ options, selectedItems: new Set(value) });
   }, [value]);
-  return /* @__PURE__ */ jsx70("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx72("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx72(
     InputCreatableComboBox,
     {
       ...props,
@@ -6062,21 +6349,21 @@ var TextMultiChoiceEditor = ({
 import { Counter as Counter2, customIcons, Icon as Icon2 } from "@uniformdev/design-system";
 
 // src/components/SearchAndFilter/styles/SearchAndFilter.styles.ts
-import { css as css21 } from "@emotion/react";
+import { css as css22 } from "@emotion/react";
 import { cq, fadeInLtr } from "@uniformdev/design-system";
-var SearchAndFilterControlsWrapper = (gridColumns) => css21`
+var SearchAndFilterControlsWrapper = (gridColumns) => css22`
   align-items: stretch;
   display: grid;
   grid-template-columns: ${gridColumns};
   gap: var(--spacing-sm);
 `;
-var SearchAndFilterOutterControlWrapper = (gridColumns) => css21`
+var SearchAndFilterOutterControlWrapper = (gridColumns) => css22`
   align-items: stretch;
   display: grid;
   grid-template-columns: ${gridColumns};
   gap: var(--spacing-sm);
 `;
-var ConditionalFilterRow = css21`
+var ConditionalFilterRow = css22`
   align-items: baseline;
   display: grid;
   grid-template-columns: 35px 1fr;
@@ -6112,7 +6399,7 @@ var ConditionalFilterRow = css21`
     animation: ${fadeInLtr} var(--duration-fast) var(--timing-ease-out);
   }
 `;
-var ConditionalInputRow = css21`
+var ConditionalInputRow = css22`
   display: flex;
   gap: var(--spacing-sm);
   flex-wrap: wrap;
@@ -6136,16 +6423,16 @@ var ConditionalInputRow = css21`
     }
   }
 `;
-var ConditionalInputRowEmpty = css21`
+var ConditionalInputRowEmpty = css22`
   flex-wrap: nowrap;
 `;
-var SearchInput = css21`
+var SearchInput = css22`
   && {
     max-height: 40px;
     min-height: unset;
   }
 `;
-var BindableKeywordSearchInputStyles = css21`
+var BindableKeywordSearchInputStyles = css22`
   position: relative;
   width: 100%;
 
@@ -6160,19 +6447,19 @@ var BindableKeywordSearchInputStyles = css21`
     white-space: nowrap;
   }
 `;
-var ClearSearchButtonContainer = css21`
+var ClearSearchButtonContainer = css22`
   align-items: center;
   display: flex;
   position: absolute;
   inset: 0 var(--spacing-lg) 0 auto;
 `;
-var ClearSearchButtonStyles = css21`
+var ClearSearchButtonStyles = css22`
   background: none;
   border: none;
   padding: 0;
   pointer-events: all;
 `;
-var FilterButton = css21`
+var FilterButton = css22`
   align-items: center;
   background: var(--white);
   border: 1px solid var(--gray-300);
@@ -6209,13 +6496,13 @@ var FilterButton = css21`
     opacity: var(--opacity-50);
   }
 `;
-var FilterButtonText = css21`
+var FilterButtonText = css22`
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: 14ch;
 `;
-var FilterButtonSelected = css21`
+var FilterButtonSelected = css22`
   background: var(--gray-100);
   border-color: var(--gray-300);
 
@@ -6223,7 +6510,7 @@ var FilterButtonSelected = css21`
     color: var(--accent-dark);
   }
 `;
-var FilterButtonWithOptions = css21`
+var FilterButtonWithOptions = css22`
   :where([aria-expanded='true']) {
     background: var(--purple-rain-100);
     border-color: var(--accent-light);
@@ -6235,14 +6522,14 @@ var FilterButtonWithOptions = css21`
     }
   }
 `;
-var SearchIcon = css21`
+var SearchIcon = css22`
   color: var(--icon-color);
   position: absolute;
   inset: 0 var(--spacing-base) 0 auto;
   margin: auto;
   transition: color var(--duration-fast) var(--timing-ease-out);
 `;
-var AddConditionalBtn = css21`
+var AddConditionalBtn = css22`
   align-items: center;
   background: transparent;
   border: none;
@@ -6261,14 +6548,14 @@ var AddConditionalBtn = css21`
     color: var(--gray-400);
   }
 `;
-var Title = css21`
+var Title = css22`
   color: var(--typography-light);
 
   &:focus {
     outline: none;
   }
 `;
-var ResetConditionsBtn = css21`
+var ResetConditionsBtn = css22`
   background: transparent;
   border: none;
   color: var(--action-destructive-default);
@@ -6283,7 +6570,7 @@ var ResetConditionsBtn = css21`
     color: var(--gray-400);
   }
 `;
-var CriteriaGroupOperatorTrigger = css21`
+var CriteriaGroupOperatorTrigger = css22`
   && {
     padding: 0;
     border-radius: var(--rounded-sm);
@@ -6302,13 +6589,13 @@ var CriteriaGroupOperatorTrigger = css21`
     }
   }
 `;
-var IconBtn = css21`
+var IconBtn = css22`
   align-self: center;
   background: transparent;
   border: none;
   padding: var(--spacing-sm);
 `;
-var SearchAndFilterOptionsContainer = css21`
+var SearchAndFilterOptionsContainer = css22`
   background: var(--gray-50);
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -6319,17 +6606,17 @@ var SearchAndFilterOptionsContainer = css21`
   padding: var(--spacing-md) 0 var(--spacing-base);
   will-change: height;
 `;
-var SearchAndFilterOptionsInnerContainer = css21`
+var SearchAndFilterOptionsInnerContainer = css22`
   display: flex;
   flex-direction: column;
   gap: var(--spacing-sm);
   padding-inline: var(--spacing-md);
 `;
-var SearchAndFilterButtonGroup = css21`
+var SearchAndFilterButtonGroup = css22`
   margin-top: var(--spacing-xs);
   margin-left: calc(56px + var(--spacing-md));
 `;
-var SearchAndFilterAdditionalContainer = css21`
+var SearchAndFilterAdditionalContainer = css22`
   align-items: center;
   border-top: 1px solid var(--gray-300);
   display: flex;
@@ -6339,7 +6626,7 @@ var SearchAndFilterAdditionalContainer = css21`
 `;
 
 // src/components/SearchAndFilter/FilterButton.tsx
-import { jsx as jsx71, jsxs as jsxs32 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx73, jsxs as jsxs32 } from "@emotion/react/jsx-runtime";
 var FilterButton2 = ({
   text = "Filters",
   icon = customIcons["filter-add"],
@@ -6361,10 +6648,10 @@ var FilterButton2 = ({
       ...props,
       "data-testid": dataTestId,
       children: [
-        /* @__PURE__ */ jsx71(Icon2, { icon, iconColor: "currentColor", size: "1rem" }),
-        /* @__PURE__ */ jsx71("span", { css: FilterButtonText, children: text }),
-        filterCount ? /* @__PURE__ */ jsx71(Counter2, { count: filterCount, bgColor: "var(--white)" }) : null,
-        showDropdownIcon ? /* @__PURE__ */ jsx71(Icon2, { icon: "chevron-down", iconColor: "currentColor", size: "1rem" }) : null
+        /* @__PURE__ */ jsx73(Icon2, { icon, iconColor: "currentColor", size: "1rem" }),
+        /* @__PURE__ */ jsx73("span", { css: FilterButtonText, children: text }),
+        filterCount ? /* @__PURE__ */ jsx73(Counter2, { count: filterCount, bgColor: "var(--white)" }) : null,
+        showDropdownIcon ? /* @__PURE__ */ jsx73(Icon2, { icon: "chevron-down", iconColor: "currentColor", size: "1rem" }) : null
       ]
     }
   );
@@ -6375,31 +6662,31 @@ 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 useEffect18, useRef as useRef9, useState as useState21 } 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 createContext6,
-  useCallback as useCallback6,
-  useContext as useContext6,
+  createContext as createContext8,
+  useCallback as useCallback7,
+  useContext as useContext8,
   useDeferredValue as useDeferredValue2,
-  useEffect as useEffect17,
-  useMemo as useMemo20,
-  useState as useState20
+  useEffect as useEffect20,
+  useMemo as useMemo22,
+  useState as useState21
 } from "react";
 
 // src/components/SearchAndFilter/FilterEditor.tsx
-import { jsx as jsx72 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx74 } from "@emotion/react/jsx-runtime";
 var FilterEditorRenderer = ({ editorType, ...props }) => {
   const { filterMapper: contextFilterMapper } = useSearchAndFilter();
   const Editor = contextFilterMapper == null ? void 0 : contextFilterMapper[editorType];
   if (!Editor || editorType === "empty") {
-    return /* @__PURE__ */ jsx72("span", {});
+    return /* @__PURE__ */ jsx74("span", {});
   }
-  return /* @__PURE__ */ jsx72(Editor, { ...props });
+  return /* @__PURE__ */ jsx74(Editor, { ...props });
 };
 var filterMapper = {
   multiChoice: FilterMultiChoiceEditor,
@@ -6417,9 +6704,9 @@ var filterMapper = {
 function withInputVariables(WrappedComponent, noSwapping = false) {
   const WithInputVariables = (props) => {
     if (Array.isArray(props.value) || !props.bindable || props.disabled || props.readOnly) {
-      return /* @__PURE__ */ jsx72(WrappedComponent, { ...props });
+      return /* @__PURE__ */ jsx74(WrappedComponent, { ...props });
     }
-    return /* @__PURE__ */ jsx72(
+    return /* @__PURE__ */ jsx74(
       InputVariables,
       {
         "data-testid": "filter-value",
@@ -6428,7 +6715,7 @@ function withInputVariables(WrappedComponent, noSwapping = false) {
         onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
         value: props.value,
         disabled: props.disabled,
-        inputWhenNoVariables: noSwapping ? void 0 : /* @__PURE__ */ jsx72(WrappedComponent, { ...props })
+        inputWhenNoVariables: noSwapping ? void 0 : /* @__PURE__ */ jsx74(WrappedComponent, { ...props })
       }
     );
   };
@@ -6438,9 +6725,9 @@ function withInputVariablesForMultiValue(WrappedComponent) {
   const WithInputVariables = (props) => {
     var _a;
     if (!props.bindable || props.disabled || props.readOnly) {
-      return /* @__PURE__ */ jsx72(WrappedComponent, { ...props });
+      return /* @__PURE__ */ jsx74(WrappedComponent, { ...props });
     }
-    return /* @__PURE__ */ jsx72(
+    return /* @__PURE__ */ jsx74(
       InputVariables,
       {
         "data-testid": "filter-value",
@@ -6448,7 +6735,7 @@ function withInputVariablesForMultiValue(WrappedComponent) {
         showMenuPosition: "inline-right",
         onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
         value: (_a = props.value) == null ? void 0 : _a[0],
-        inputWhenNoVariables: /* @__PURE__ */ jsx72(WrappedComponent, { ...props })
+        inputWhenNoVariables: /* @__PURE__ */ jsx74(WrappedComponent, { ...props })
       }
     );
   };
@@ -6464,8 +6751,8 @@ var bindableFiltersMapper = {
 };
 
 // src/components/SearchAndFilter/hooks/useSearchAndFilter.tsx
-import { jsx as jsx73 } from "@emotion/react/jsx-runtime";
-var SearchAndFilterContext = createContext6({
+import { jsx as jsx75 } from "@emotion/react/jsx-runtime";
+var SearchAndFilterContext = createContext8({
   searchTerm: "",
   setSearchTerm: () => {
   },
@@ -6504,17 +6791,17 @@ var SearchAndFilterProvider = ({
   children,
   allowBindingSearchTerm
 }) => {
-  const [searchTerm, setSearchTerm] = useState20(defaultSearchTerm);
+  const [searchTerm, setSearchTerm] = useState21(defaultSearchTerm);
   const deferredSearchTerm = useDeferredValue2(searchTerm);
-  const [filterVisibility, setFilterVisibility] = useState20(alwaysVisible || filterVisible);
-  const handleSearchTerm = useCallback6(
+  const [filterVisibility, setFilterVisibility] = useState21(alwaysVisible || filterVisible);
+  const handleSearchTerm = useCallback7(
     (term) => {
       setSearchTerm(term);
       onSearchChange == null ? void 0 : onSearchChange(term);
     },
     [setSearchTerm, onSearchChange]
   );
-  const handleToggleFilterVisibility = useCallback6(
+  const handleToggleFilterVisibility = useCallback7(
     (visible) => {
       if (alwaysVisible) {
         return;
@@ -6523,10 +6810,10 @@ var SearchAndFilterProvider = ({
     },
     [alwaysVisible]
   );
-  const handleAddFilter = useCallback6(() => {
+  const handleAddFilter = useCallback7(() => {
     onChange([...filters, { field: "", operator: "", value: "" }]);
   }, [filters, onChange]);
-  const handleResetFilters = useCallback6(() => {
+  const handleResetFilters = useCallback7(() => {
     setSearchTerm("");
     if (onResetFilterValues) {
       return onResetFilterValues();
@@ -6534,20 +6821,20 @@ var SearchAndFilterProvider = ({
     onSearchChange == null ? void 0 : onSearchChange("");
     onChange(resetFilterValues);
   }, [onChange, resetFilterValues, onSearchChange, onResetFilterValues]);
-  const handleDeleteFilter = useCallback6(
+  const handleDeleteFilter = useCallback7(
     (index) => {
       const remainingFilters = filters.filter((_, i) => i !== index);
       onChange(remainingFilters);
     },
     [filters, onChange]
   );
-  const validFilterQuery = useMemo20(() => {
+  const validFilterQuery = useMemo22(() => {
     const hasValidFilters = filters.every((f) => f.field && f.operator && f.value);
     if (hasValidFilters) {
       return filters;
     }
   }, [filters]);
-  useEffect17(() => {
+  useEffect20(() => {
     if (filterVisibility) {
       const handleEscKeyFilterClose = (e) => {
         if (e.key === "Escape") {
@@ -6560,7 +6847,7 @@ var SearchAndFilterProvider = ({
       };
     }
   }, [filterVisibility, handleToggleFilterVisibility]);
-  return /* @__PURE__ */ jsx73(
+  return /* @__PURE__ */ jsx75(
     SearchAndFilterContext.Provider,
     {
       value: {
@@ -6580,17 +6867,17 @@ var SearchAndFilterProvider = ({
         filterMapper: filterMapper2,
         allowBindingSearchTerm
       },
-      children: /* @__PURE__ */ jsx73(VerticalRhythm5, { children })
+      children: /* @__PURE__ */ jsx75(VerticalRhythm5, { children })
     }
   );
 };
 var useSearchAndFilter = () => {
-  const value = useContext6(SearchAndFilterContext);
+  const value = useContext8(SearchAndFilterContext);
   return { ...value };
 };
 
 // src/components/SearchAndFilter/FilterControls.tsx
-import { Fragment as Fragment13, jsx as jsx74, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment14, jsx as jsx76, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
 var FilterControls = ({
   children,
   hideSearchInput
@@ -6603,10 +6890,10 @@ var FilterControls = ({
     searchTerm,
     allowBindingSearchTerm
   } = useSearchAndFilter();
-  const editorRef = useRef9(null);
+  const editorRef = useRef10(null);
   const variableRefernceCountInSearchTerm = hasReferencedVariables2(searchTerm);
-  const [idToResetInputVariables, setIdToResetInputVariables] = useState21("data-resource-search-term-input");
-  const [localSearchTerm, setLocalSearchTerm] = useState21(searchTerm);
+  const [idToResetInputVariables, setIdToResetInputVariables] = useState22("data-resource-search-term-input");
+  const [localSearchTerm, setLocalSearchTerm] = useState22(searchTerm);
   useDebounce7(
     () => {
       if (localSearchTerm !== searchTerm) {
@@ -6616,14 +6903,14 @@ var FilterControls = ({
     300,
     [localSearchTerm]
   );
-  useEffect18(() => {
+  useEffect21(() => {
     if (searchTerm === "") {
       setLocalSearchTerm("");
       setIdToResetInputVariables(`data-resource-search-term-input-${v42()}`);
     }
   }, [searchTerm]);
-  return /* @__PURE__ */ jsxs33(Fragment13, { children: [
-    /* @__PURE__ */ jsx74(
+  return /* @__PURE__ */ jsxs33(Fragment14, { children: [
+    /* @__PURE__ */ jsx76(
       FilterButton2,
       {
         "aria-controls": "search-and-filter-options",
@@ -6637,7 +6924,7 @@ var FilterControls = ({
       }
     ),
     hideSearchInput ? null : /* @__PURE__ */ jsxs33("div", { css: BindableKeywordSearchInputStyles, "data-testid": "search-container", children: [
-      /* @__PURE__ */ jsx74(
+      /* @__PURE__ */ jsx76(
         InputVariables,
         {
           label: "",
@@ -6647,7 +6934,7 @@ var FilterControls = ({
           value: localSearchTerm,
           onChange: (value) => setLocalSearchTerm(value != null ? value : ""),
           disableVariables: !allowBindingSearchTerm,
-          inputWhenNoVariables: /* @__PURE__ */ jsx74(
+          inputWhenNoVariables: /* @__PURE__ */ jsx76(
             InputKeywordSearch,
             {
               placeholder: "Search...",
@@ -6666,7 +6953,7 @@ var FilterControls = ({
           )
         }
       ),
-      variableRefernceCountInSearchTerm ? /* @__PURE__ */ jsx74("div", { css: ClearSearchButtonContainer, children: /* @__PURE__ */ jsx74(
+      variableRefernceCountInSearchTerm ? /* @__PURE__ */ jsx76("div", { css: ClearSearchButtonContainer, children: /* @__PURE__ */ jsx76(
         "button",
         {
           css: ClearSearchButtonStyles,
@@ -6680,7 +6967,7 @@ var FilterControls = ({
           },
           type: "button",
           "data-testid": "keyword-search-clear-button",
-          children: /* @__PURE__ */ jsx74(Icon3, { icon: CgClose, iconColor: "red", size: "1rem" })
+          children: /* @__PURE__ */ jsx76(Icon3, { icon: CgClose, iconColor: "red", size: "1rem" })
         }
       ) }) : null
     ] }),
@@ -6697,7 +6984,7 @@ import {
   Menu as Menu3,
   SelectableMenuItem
 } from "@uniformdev/design-system";
-import { useMemo as useMemo21 } from "react";
+import { useMemo as useMemo23 } from "react";
 
 // src/components/SearchAndFilter/util/isFilterBindable.ts
 function isFilterBindable(filter, operator) {
@@ -6706,7 +6993,7 @@ function isFilterBindable(filter, operator) {
 }
 
 // src/components/SearchAndFilter/FilterItem.tsx
-import { jsx as jsx75, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx77, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
 var FilterItem = ({
   index,
   operatorOptions,
@@ -6725,7 +7012,7 @@ var FilterItem = ({
   const operatorLabel = filters[index].operator !== "" ? `operator ${filters[index].operator}` : "unknown operator";
   const metaDataLabel = filters[index].value !== "" ? `value ${filters[index].value}` : "unknown value";
   const metaDataPossibleOptions = (_b = (_a = operatorOptions.find((op) => filters[index].operator === op.value)) == null ? void 0 : _a.editorType) != null ? _b : "singleChoice";
-  const { selectedFieldValue, selectedOperatorValue, selectedMetaValue, readOnly, bindable } = useMemo21(() => {
+  const { selectedFieldValue, selectedOperatorValue, selectedMetaValue, readOnly, bindable } = useMemo23(() => {
     var _a2;
     const currentSelectedFilterGroup = filterOptions.find((item) => {
       var _a3;
@@ -6758,7 +7045,7 @@ var FilterItem = ({
   const joinLabel = index === 0 ? initialCriteriaTitle : index === 1 && onCriteriaGroupOperatorChange ? /* @__PURE__ */ jsxs34(
     Menu3,
     {
-      menuTrigger: /* @__PURE__ */ jsx75(
+      menuTrigger: /* @__PURE__ */ jsx77(
         DropdownStyleMenuTrigger,
         {
           bgColor: "transparent",
@@ -6771,7 +7058,7 @@ var FilterItem = ({
       size: "small",
       placement: "bottom-start",
       children: [
-        /* @__PURE__ */ jsx75(
+        /* @__PURE__ */ jsx77(
           SelectableMenuItem,
           {
             selected: criteriaGroupOperator === "and",
@@ -6780,7 +7067,7 @@ var FilterItem = ({
             children: "and"
           }
         ),
-        /* @__PURE__ */ jsx75(
+        /* @__PURE__ */ jsx77(
           SelectableMenuItem,
           {
             selected: criteriaGroupOperator === "or",
@@ -6793,9 +7080,9 @@ var FilterItem = ({
     }
   ) : criteriaGroupOperator;
   return /* @__PURE__ */ jsxs34("div", { css: ConditionalFilterRow, "data-testid": "filter-item", children: [
-    /* @__PURE__ */ jsx75("span", { children: joinLabel }),
+    /* @__PURE__ */ jsx77("span", { children: joinLabel }),
     /* @__PURE__ */ jsxs34("div", { css: [ConditionalInputRow, isEmptyOperator ? ConditionalInputRowEmpty : null], children: [
-      CustomLeftHandComponent ? /* @__PURE__ */ jsx75(
+      CustomLeftHandComponent ? /* @__PURE__ */ jsx77(
         CustomLeftHandComponent,
         {
           filterOption: selectedFieldValue,
@@ -6805,7 +7092,7 @@ var FilterItem = ({
             onFilterOptionChange("");
           }
         }
-      ) : /* @__PURE__ */ jsx75(
+      ) : /* @__PURE__ */ jsx77(
         InputComboBox5,
         {
           "aria-label": label,
@@ -6832,7 +7119,7 @@ var FilterItem = ({
           name: `filter-field-${index}`
         }
       ),
-      /* @__PURE__ */ jsx75(
+      /* @__PURE__ */ jsx77(
         InputComboBox5,
         {
           "aria-label": operatorLabel,
@@ -6856,7 +7143,7 @@ var FilterItem = ({
           name: `filter-operator-${index}`
         }
       ),
-      /* @__PURE__ */ jsx75(
+      /* @__PURE__ */ jsx77(
         FilterEditorRenderer,
         {
           "aria-label": metaDataLabel,
@@ -6871,7 +7158,7 @@ var FilterItem = ({
           filterFieldName: filters[index].field
         }
       ),
-      readOnly ? null : /* @__PURE__ */ jsx75(
+      readOnly ? null : /* @__PURE__ */ jsx77(
         "button",
         {
           type: "button",
@@ -6880,7 +7167,7 @@ var FilterItem = ({
           css: IconBtn,
           "data-testid": "delete-filter",
           disabled: filters.length === 1,
-          children: /* @__PURE__ */ jsx75(Icon4, { icon: CgTrash2, iconColor: filters.length === 1 ? "gray" : "red", size: "1rem" })
+          children: /* @__PURE__ */ jsx77(Icon4, { icon: CgTrash2, iconColor: filters.length === 1 ? "gray" : "red", size: "1rem" })
         }
       )
     ] })
@@ -6893,16 +7180,16 @@ 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 React6, { useEffect as useEffect19 } from "react";
-import { jsx as jsx76, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
+import React8, { useEffect as useEffect22 } from "react";
+import { jsx as jsx78, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterOptionsContainer2 = ({
   buttonRow,
   additionalFiltersContainer,
   children
 }) => {
   return /* @__PURE__ */ jsxs35("div", { css: SearchAndFilterOptionsContainer, children: [
-    /* @__PURE__ */ jsx76("div", { css: SearchAndFilterOptionsInnerContainer, children }),
-    buttonRow ? /* @__PURE__ */ jsx76(
+    /* @__PURE__ */ jsx78("div", { css: SearchAndFilterOptionsInnerContainer, children }),
+    buttonRow ? /* @__PURE__ */ jsx78(
       HorizontalRhythm8,
       {
         css: SearchAndFilterButtonGroup,
@@ -6912,7 +7199,7 @@ var SearchAndFilterOptionsContainer2 = ({
         children: buttonRow
       }
     ) : null,
-    additionalFiltersContainer ? /* @__PURE__ */ jsx76("div", { css: SearchAndFilterAdditionalContainer, children: additionalFiltersContainer }) : null
+    additionalFiltersContainer ? /* @__PURE__ */ jsx78("div", { css: SearchAndFilterAdditionalContainer, children: additionalFiltersContainer }) : null
   ] });
 };
 var FilterMenu = ({
@@ -6925,22 +7212,22 @@ var FilterMenu = ({
   resetButtonText = "reset"
 }) => {
   const { filterVisibility, setFilterVisibility, handleResetFilters, filters } = useSearchAndFilter();
-  const innerMenuRef = React6.useRef(null);
-  useEffect19(() => {
+  const innerMenuRef = React8.useRef(null);
+  useEffect22(() => {
     var _a;
     if (filterVisibility) {
       (_a = innerMenuRef.current) == null ? void 0 : _a.focus();
     }
   }, [filterVisibility]);
-  return /* @__PURE__ */ jsx76(VerticalRhythm6, { gap: "sm", "aria-haspopup": "true", id, "data-testid": dataTestId, children: filterVisibility ? /* @__PURE__ */ jsxs35(
+  return /* @__PURE__ */ jsx78(VerticalRhythm6, { gap: "sm", "aria-haspopup": "true", id, "data-testid": dataTestId, children: filterVisibility ? /* @__PURE__ */ jsxs35(
     SearchAndFilterOptionsContainer2,
     {
       buttonRow: menuControls,
       additionalFiltersContainer,
       children: [
         /* @__PURE__ */ jsxs35(HorizontalRhythm8, { gap: "sm", align: "center", justify: "space-between", children: [
-          filterTitle ? /* @__PURE__ */ jsx76("span", { css: Title, ref: innerMenuRef, tabIndex: 0, children: filterTitle }) : null,
-          (filters == null ? void 0 : filters.length) && resetButtonText ? /* @__PURE__ */ jsx76(
+          filterTitle ? /* @__PURE__ */ jsx78("span", { css: Title, ref: innerMenuRef, tabIndex: 0, children: filterTitle }) : null,
+          (filters == null ? void 0 : filters.length) && resetButtonText ? /* @__PURE__ */ jsx78(
             "button",
             {
               type: "button",
@@ -7051,7 +7338,7 @@ function hasBindings(currentValue) {
 }
 
 // src/components/SearchAndFilter/FilterItems.tsx
-import { jsx as jsx77, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx79, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
 var FilterItems = ({
   addButtonText = "add condition",
   additionalFiltersContainer,
@@ -7089,7 +7376,7 @@ var FilterItems = ({
     }
     setFilters(next);
   };
-  return /* @__PURE__ */ jsx77(
+  return /* @__PURE__ */ jsx79(
     FilterMenu,
     {
       id: "search-and-filter-options",
@@ -7102,7 +7389,7 @@ var FilterItems = ({
           onClick: handleAddFilter,
           "data-testid": "add-filter",
           children: [
-            /* @__PURE__ */ jsx77(Icon5, { icon: CgMathPlus, iconColor: "currentColor", size: "1rem" }),
+            /* @__PURE__ */ jsx79(Icon5, { icon: CgMathPlus, iconColor: "currentColor", size: "1rem" }),
             addButtonText
           ]
         }
@@ -7118,7 +7405,7 @@ var FilterItems = ({
         })) == null ? void 0 : _a.options) != null ? _b : [];
         const possibleValueOptions = (_d = (_c = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _c.valueOptions) != null ? _d : [];
         const possibleOperators = (_f = (_e = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _e.operatorOptions) != null ? _f : [];
-        return /* @__PURE__ */ jsx77(
+        return /* @__PURE__ */ jsx79(
           FilterItem,
           {
             index: i,
@@ -7143,8 +7430,8 @@ var FilterItems = ({
 import { VerticalRhythm as VerticalRhythm7 } from "@uniformdev/design-system";
 
 // src/components/SearchAndFilter/SearchAndFilterResultContainer.tsx
-import { Button as Button5, Callout as Callout4, HorizontalRhythm as HorizontalRhythm9, Paragraph } from "@uniformdev/design-system";
-import { Fragment as Fragment14, jsx as jsx78, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
+import { Button as Button5, Callout as Callout5, HorizontalRhythm as HorizontalRhythm9, Paragraph } from "@uniformdev/design-system";
+import { Fragment as Fragment15, jsx as jsx80, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterResultContainer = ({
   buttonText,
   clearButtonLabel = "clear",
@@ -7195,18 +7482,18 @@ var SearchAndFilterResultContainer = ({
       handleResetFilters();
     }
   };
-  return /* @__PURE__ */ jsxs37(Fragment14, { children: [
+  return /* @__PURE__ */ jsxs37(Fragment15, { children: [
     /* @__PURE__ */ jsxs37(HorizontalRhythm9, { children: [
       /* @__PURE__ */ jsxs37("span", { children: [
         totalResults,
         " results ",
         searchTerm ? `for "${searchTerm}"` : null
       ] }),
-      !searchTerm || hideClearButton ? null : /* @__PURE__ */ jsx78(Button5, { buttonType: "ghostDestructive", size: "zero", onClick: handleClearSearch, children: clearButtonLabel })
+      !searchTerm || hideClearButton ? null : /* @__PURE__ */ jsx80(Button5, { buttonType: "ghostDestructive", size: "zero", onClick: handleClearSearch, children: clearButtonLabel })
     ] }),
-    totalResults === 0 ? /* @__PURE__ */ jsxs37(Callout4, { title: automateCalloutTitle, type: "note", children: [
-      calloutText ? /* @__PURE__ */ jsx78(Paragraph, { children: calloutText }) : null,
-      hideClearButton ? null : /* @__PURE__ */ jsx78(
+    totalResults === 0 ? /* @__PURE__ */ jsxs37(Callout5, { title: automateCalloutTitle, type: "note", children: [
+      calloutText ? /* @__PURE__ */ jsx80(Paragraph, { children: calloutText }) : null,
+      hideClearButton ? null : /* @__PURE__ */ jsx80(
         Button5,
         {
           buttonType: "tertiaryOutline",
@@ -7221,14 +7508,14 @@ var SearchAndFilterResultContainer = ({
 };
 
 // src/components/SearchAndFilter/SearchAndFilter.tsx
-import { jsx as jsx79, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx81, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
 var SearchAndFilter = ({
   filters,
   filterOptions,
   filterVisible,
   filterControls,
   viewSwitchControls,
-  resultsContainerView = /* @__PURE__ */ jsx79(SearchAndFilterResultContainer, {}),
+  resultsContainerView = /* @__PURE__ */ jsx81(SearchAndFilterResultContainer, {}),
   filterMapper: filterMapper2 = filterMapper,
   additionalFiltersContainer,
   onChange,
@@ -7240,7 +7527,7 @@ var SearchAndFilter = ({
   resetFilterValues = [],
   onResetFilterValues
 }) => {
-  return /* @__PURE__ */ jsx79(
+  return /* @__PURE__ */ jsx81(
     SearchAndFilterProvider,
     {
       filters,
@@ -7257,16 +7544,16 @@ var SearchAndFilter = ({
       onResetFilterValues,
       children: /* @__PURE__ */ jsxs38(VerticalRhythm7, { "data-testid": "search-and-filter", children: [
         /* @__PURE__ */ jsxs38("div", { css: SearchAndFilterOutterControlWrapper(viewSwitchControls ? "1fr auto" : "1fr"), children: [
-          /* @__PURE__ */ jsx79(
+          /* @__PURE__ */ jsx81(
             "div",
             {
               css: SearchAndFilterControlsWrapper(viewSwitchControls ? "auto 1fr 0.05fr" : "auto 1fr"),
-              children: !filterControls ? /* @__PURE__ */ jsx79(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
+              children: !filterControls ? /* @__PURE__ */ jsx81(FilterControls, { hideSearchInput: !onSearchChange }) : filterControls
             }
           ),
           viewSwitchControls
         ] }),
-        /* @__PURE__ */ jsx79(FilterItems, { additionalFiltersContainer }),
+        /* @__PURE__ */ jsx81(FilterItems, { additionalFiltersContainer }),
         resultsContainerView
       ] })
     }
@@ -7275,17 +7562,17 @@ var SearchAndFilter = ({
 
 // src/components/SearchAndFilter/SearchOnlyFilter.tsx
 import { InputKeywordSearch as InputKeywordSearch2 } from "@uniformdev/design-system";
-import { createContext as createContext7, useState as useState22 } from "react";
+import { createContext as createContext9, useState as useState23 } from "react";
 import { useDebounce as useDebounce8 } from "react-use";
-import { jsx as jsx80 } from "@emotion/react/jsx-runtime";
-var SearchOnlyContext = createContext7({
+import { jsx as jsx82 } from "@emotion/react/jsx-runtime";
+var SearchOnlyContext = createContext9({
   searchTerm: "",
   setSearchTerm: () => {
   }
 });
 var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
   const { searchTerm, setSearchTerm } = useSearchAndFilter();
-  const [localeSearchTerm, setLocaleSearchTerm] = useState22("");
+  const [localeSearchTerm, setLocaleSearchTerm] = useState23("");
   useDebounce8(
     () => {
       setSearchTerm(localeSearchTerm);
@@ -7294,14 +7581,14 @@ var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
     300,
     [localeSearchTerm]
   );
-  return /* @__PURE__ */ jsx80(
+  return /* @__PURE__ */ jsx82(
     SearchOnlyContext.Provider,
     {
       value: {
         searchTerm,
         setSearchTerm: setLocaleSearchTerm
       },
-      children: /* @__PURE__ */ jsx80("div", { css: { maxWidth: maxWidth != null ? maxWidth : "712px" }, children: /* @__PURE__ */ jsx80(
+      children: /* @__PURE__ */ jsx82("div", { css: { maxWidth: maxWidth != null ? maxWidth : "712px" }, children: /* @__PURE__ */ jsx82(
         InputKeywordSearch2,
         {
           placeholder: "Search...",
@@ -7319,9 +7606,9 @@ var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
 import { InputComboBox as InputComboBox6, InputSelect as InputSelect5, SegmentedControl, VerticalRhythm as VerticalRhythm8 } from "@uniformdev/design-system";
 
 // src/components/SearchAndFilter/styles/SortItems.styles.ts
-import { css as css22 } from "@emotion/react";
+import { css as css23 } from "@emotion/react";
 import { cq as cq2, fadeInLtr as fadeInLtr2 } from "@uniformdev/design-system";
-var ConditionalFilterRow2 = css22`
+var ConditionalFilterRow2 = css23`
   display: grid;
   grid-template-columns: 35px 1fr;
   gap: var(--spacing-sm);
@@ -7358,7 +7645,7 @@ var ConditionalFilterRow2 = css22`
     animation: ${fadeInLtr2} var(--duration-fast) var(--timing-ease-out);
   }
 `;
-var ConditionalInputRow2 = css22`
+var ConditionalInputRow2 = css23`
   display: flex;
   gap: var(--spacing-sm);
   flex-wrap: wrap;
@@ -7381,13 +7668,13 @@ var ConditionalInputRow2 = css22`
     }
   }
 `;
-var SearchInput2 = css22`
+var SearchInput2 = css23`
   && {
     max-height: 40px;
     min-height: unset;
   }
 `;
-var FilterButton3 = css22`
+var FilterButton3 = css23`
   align-items: center;
   background: var(--white);
   border: 1px solid var(--gray-300);
@@ -7424,13 +7711,13 @@ var FilterButton3 = css22`
     opacity: var(--opacity-50);
   }
 `;
-var FilterButtonText2 = css22`
+var FilterButtonText2 = css23`
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: 14ch;
 `;
-var FilterButtonSelected2 = css22`
+var FilterButtonSelected2 = css23`
   background: var(--gray-100);
   border-color: var(--gray-300);
 
@@ -7438,7 +7725,7 @@ var FilterButtonSelected2 = css22`
     color: var(--accent-dark);
   }
 `;
-var FilterButtonWithOptions2 = css22`
+var FilterButtonWithOptions2 = css23`
   :where([aria-expanded='true']) {
     background: var(--purple-rain-100);
     border-color: var(--accent-light);
@@ -7450,14 +7737,14 @@ var FilterButtonWithOptions2 = css22`
     }
   }
 `;
-var SearchIcon2 = css22`
+var SearchIcon2 = css23`
   color: var(--icon-color);
   position: absolute;
   inset: 0 var(--spacing-base) 0 auto;
   margin: auto;
   transition: color var(--duration-fast) var(--timing-ease-out);
 `;
-var AddConditionalBtn2 = css22`
+var AddConditionalBtn2 = css23`
   align-items: center;
   background: transparent;
   border: none;
@@ -7476,14 +7763,14 @@ var AddConditionalBtn2 = css22`
     color: var(--gray-400);
   }
 `;
-var Title2 = css22`
+var Title2 = css23`
   color: var(--typography-light);
 
   &:focus {
     outline: none;
   }
 `;
-var ResetConditionsBtn2 = css22`
+var ResetConditionsBtn2 = css23`
   background: transparent;
   border: none;
   color: var(--action-destructive-default);
@@ -7495,12 +7782,12 @@ var ResetConditionsBtn2 = css22`
     color: var(--action-destructive-hover);
   }
 `;
-var IconBtn2 = css22`
+var IconBtn2 = css23`
   background: transparent;
   border: none;
   padding: var(--spacing-sm);
 `;
-var SearchAndFilterOptionsContainer3 = css22`
+var SearchAndFilterOptionsContainer3 = css23`
   background: var(--gray-50);
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -7513,17 +7800,17 @@ var SearchAndFilterOptionsContainer3 = css22`
   position: relative;
   z-index: 1;
 `;
-var SearchAndFilterOptionsInnerContainer2 = css22`
+var SearchAndFilterOptionsInnerContainer2 = css23`
   display: flex;
   flex-direction: column;
   gap: var(--spacing-sm);
   padding-inline: var(--spacing-md);
 `;
-var SearchAndFilterButtonGroup2 = css22`
+var SearchAndFilterButtonGroup2 = css23`
   margin-top: var(--spacing-xs);
   margin-left: calc(56px + var(--spacing-md));
 `;
-var SortFilterWrapper = (hiddenLocaleInput) => css22`
+var SortFilterWrapper = (hiddenLocaleInput) => css23`
   align-items: center;
   display: flex;
   gap: var(--spacing-base);
@@ -7534,13 +7821,13 @@ var SortFilterWrapper = (hiddenLocaleInput) => css22`
     grid-template-columns: ${hiddenLocaleInput ? "1fr" : "1fr minmax(140px, 0.25fr)"};
   }
 `;
-var SortFilterInputRow = css22`
+var SortFilterInputRow = css23`
   align-items: center;
   display: grid;
   grid-template-columns: 1fr auto;
   gap: var(--spacing-base);
 `;
-var InputVariableWrapper = css22`
+var InputVariableWrapper = css23`
   flex-grow: 1;
 
   // we need to override label styles nested within the input variable
@@ -7551,7 +7838,7 @@ var InputVariableWrapper = css22`
 `;
 
 // src/components/SearchAndFilter/SortItems.tsx
-import { jsx as jsx81, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx83, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
 var SortItems = ({
   sortByLabel = "Sort by",
   localeLabel = "Show locale",
@@ -7575,9 +7862,9 @@ var SortItems = ({
   const localeLabelValue = sortOptions.length > 1 ? localeLabel : `${localeLabel}s`;
   return /* @__PURE__ */ jsxs39("div", { css: [SortFilterWrapper(hideLocaleOptions)], "data-testid": "sorting-options", children: [
     /* @__PURE__ */ jsxs39(VerticalRhythm8, { gap: "xs", children: [
-      /* @__PURE__ */ jsx81("span", { css: Title2, children: sortByLabel }),
+      /* @__PURE__ */ jsx83("span", { css: Title2, children: sortByLabel }),
       /* @__PURE__ */ jsxs39("div", { css: SortFilterInputRow, children: [
-        /* @__PURE__ */ jsx81(
+        /* @__PURE__ */ jsx83(
           InputVariables,
           {
             disableInlineMenu: disableSortBinding,
@@ -7585,7 +7872,7 @@ var SortItems = ({
             value: sortField,
             valueToResetTo: "created_at",
             onChange: (e) => onSortChange(`${e}_${sortDirection}`),
-            inputWhenNoVariables: /* @__PURE__ */ jsx81(
+            inputWhenNoVariables: /* @__PURE__ */ jsx83(
               InputComboBox6,
               {
                 id: "sort-by-field",
@@ -7608,7 +7895,7 @@ var SortItems = ({
             )
           }
         ),
-        /* @__PURE__ */ jsx81(
+        /* @__PURE__ */ jsx83(
           InputVariables,
           {
             disableInlineMenu: disableSortBinding,
@@ -7616,7 +7903,7 @@ var SortItems = ({
             valueToResetTo: "DESC",
             showMenuPosition: disableSortBinding ? void 0 : "inline-right",
             onChange: (e) => onSortChange(`${sortField}_${e}`),
-            inputWhenNoVariables: /* @__PURE__ */ jsx81(
+            inputWhenNoVariables: /* @__PURE__ */ jsx83(
               SegmentedControl,
               {
                 noCheckmark: true,
@@ -7648,14 +7935,14 @@ var SortItems = ({
         )
       ] })
     ] }),
-    hideLocaleOptions ? null : /* @__PURE__ */ jsx81(VerticalRhythm8, { gap: "xs", css: InputVariableWrapper, children: /* @__PURE__ */ jsx81(
+    hideLocaleOptions ? null : /* @__PURE__ */ jsx83(VerticalRhythm8, { gap: "xs", css: InputVariableWrapper, children: /* @__PURE__ */ jsx83(
       InputVariables,
       {
         label: localeLabelValue,
         value: localeValue,
         showMenuPosition: "inline-right",
         onChange: (e) => onLocaleChange(e != null ? e : ""),
-        inputWhenNoVariables: /* @__PURE__ */ jsx81(
+        inputWhenNoVariables: /* @__PURE__ */ jsx83(
           InputSelect5,
           {
             name: "localeReturned",
@@ -7686,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 useEffect20, useRef as useRef10 } from "react";
+import { useEffect as useEffect23, useRef as useRef11 } from "react";
 function useContentDataResourceLocaleInfo({
   locale,
   defaultLocale,
@@ -7694,12 +7981,12 @@ function useContentDataResourceLocaleInfo({
   dynamicInputs
 }) {
   var _a;
-  const setLocaleRef = useRef10(setLocale);
+  const setLocaleRef = useRef11(setLocale);
   setLocaleRef.current = setLocale;
   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;
-  useEffect20(() => {
+  useEffect23(() => {
     if (locale === void 0 && effectiveLocale && setLocaleRef.current) {
       setLocaleRef.current(effectiveLocale);
     }
@@ -7711,7 +7998,7 @@ function useContentDataResourceLocaleInfo({
 import {
   AddListButton as AddListButton2,
   Button as Button6,
-  Callout as Callout5,
+  Callout as Callout6,
   DrawerContent,
   Heading,
   Input as Input10,
@@ -7721,7 +8008,7 @@ import {
   InputToggle as InputToggle3,
   Label,
   LoadingIndicator as LoadingIndicator4,
-  LoadingOverlay,
+  LoadingOverlay as LoadingOverlay2,
   Menu as Menu4,
   MenuItem as MenuItem2,
   ParameterGroup,
@@ -7752,7 +8039,7 @@ export {
   AddListButton2 as AddListButton,
   Button6 as Button,
   CHECKBOX_OPERATORS,
-  Callout5 as Callout,
+  Callout6 as Callout,
   ControlledValuePlugin,
   DATE_OPERATORS,
   DATE_TIME_OPERATORS,
@@ -7765,6 +8052,10 @@ export {
   DataTypeEditor,
   DateEditor,
   DateRangeEditor,
+  DelegationContext,
+  DelegationDisabledError,
+  DelegationGate,
+  DelegationProvider,
   DrawerContent,
   EDIT_VARIABLE_COMMAND,
   FilterButton2 as FilterButton,
@@ -7787,7 +8078,7 @@ export {
   Label,
   LinkButton,
   LoadingIndicator4 as LoadingIndicator,
-  LoadingOverlay,
+  LoadingOverlay2 as LoadingOverlay,
   MULTI_SELECT_OPERATORS,
   Menu4 as Menu,
   MenuItem2 as MenuItem,
@@ -7866,8 +8157,10 @@ export {
   VariablesProvider,
   bindableFiltersMapper,
   convertConnectedDataToVariable,
+  createDelegationFetch,
   createLocationValidator,
   filterMapper,
+  isDelegationExpiredResponse,
   prettifyBindExpression,
   readOnlyAttributes,
   serializeVariablesEditorSerializedState,
@@ -7877,6 +8170,8 @@ export {
   urlEncodeRequestUrl,
   useConnectedDataAsVariables,
   useContentDataResourceLocaleInfo,
+  useDelegation,
+  useDelegationFetch,
   useDynamicInputsAsVariables,
   useMeshLocation,
   useObjectSearchContext,